feat: 新增工具栏全局开关设置

Author: hooray

src/layouts/components/AppSetting/index.vue

@@ -193,11 +193,17 @@ function handleCopy() {
     </div>
     <div>
       <FaDivider>工具栏</FaDivider>
+      <div class="setting-item">
+        <div class="label">
+          是否启用
+        </div>
+        <FaSwitch v-model="settingsStore.settings.toolbar.enable" />
+      </div>
       <div v-if="settingsStore.mode === 'pc'" class="setting-item">
         <div class="label">
           面包屑导航
         </div>
-        <FaSwitch v-model="settingsStore.settings.toolbar.breadcrumb" />
+        <FaSwitch v-model="settingsStore.settings.toolbar.breadcrumb" :disabled="!settingsStore.settings.toolbar.enable" />
       </div>
       <div class="setting-item">
         <div class="label">
@@ -206,13 +212,13 @@ function handleCopy() {
             <FaIcon name="i-ri:question-line" />
           </FaTooltip>
         </div>
-        <FaSwitch v-model="settingsStore.settings.toolbar.navSearch" />
+        <FaSwitch v-model="settingsStore.settings.toolbar.navSearch" :disabled="!settingsStore.settings.toolbar.enable" />
       </div>
       <div v-if="settingsStore.mode === 'pc'" class="setting-item">
         <div class="label">
           全屏
         </div>
-        <FaSwitch v-model="settingsStore.settings.toolbar.fullscreen" />
+        <FaSwitch v-model="settingsStore.settings.toolbar.fullscreen" :disabled="!settingsStore.settings.toolbar.enable" />
       </div>
       <div class="setting-item">
         <div class="label">
@@ -221,7 +227,7 @@ function handleCopy() {
             <FaIcon name="i-ri:question-line" />
           </FaTooltip>
         </div>
-        <FaSwitch v-model="settingsStore.settings.toolbar.pageReload" />
+        <FaSwitch v-model="settingsStore.settings.toolbar.pageReload" :disabled="!settingsStore.settings.toolbar.enable" />
       </div>
       <div class="setting-item">
         <div class="label">
@@ -230,7 +236,7 @@ function handleCopy() {
             <FaIcon name="i-ri:question-line" />
           </FaTooltip>
         </div>
-        <FaSwitch v-model="settingsStore.settings.toolbar.colorScheme" />
+        <FaSwitch v-model="settingsStore.settings.toolbar.colorScheme" :disabled="!settingsStore.settings.toolbar.enable" />
       </div>
     </div>
     <div>
@@ -239,7 +245,7 @@ function handleCopy() {
         <div class="label">
           是否启用快捷键
         </div>
-        <FaSwitch v-model="settingsStore.settings.mainPage.enableHotkeys" />
+        <FaSwitch v-model="settingsStore.settings.mainPage.enableHotkeys" :disabled="!settingsStore.settings.toolbar.enable" />
       </div>
     </div>
     <div>

src/layouts/components/Topbar/index.vue

@@ -10,7 +10,7 @@ defineOptions({
 const settingsStore = useSettingsStore()
 
 const enableToolbar = computed(() => {
-  return Object.keys(settingsStore.settings.toolbar).some((key) => {
+  return settingsStore.settings.toolbar.enable && Object.keys(settingsStore.settings.toolbar).some((key) => {
     if (settingsStore.settings.app.routeBaseOn === 'filesystem' && key === 'breadcrumb') {
       return false
     }

src/layouts/index.vue

@@ -58,7 +58,7 @@ const topbarActualHeight = computed(() => {
   if (settingsStore.settings.tabbar.enable) {
     actualHeight += Number.parseInt(getComputedStyle(document.documentElement).getPropertyValue('--g-tabbar-height'))
   }
-  if (Object.keys(settingsStore.settings.toolbar).some((key) => {
+  if (settingsStore.settings.toolbar.enable && Object.keys(settingsStore.settings.toolbar).some((key) => {
     if (settingsStore.settings.app.routeBaseOn === 'filesystem' && key === 'breadcrumb') {
       return false
     }

src/settings.default.ts

@@ -39,6 +39,7 @@ const globalSettingsDefault: RecursiveRequired<Settings.all> = {
     enableHotkeys: false,
   },
   toolbar: {
+    enable: true,
     breadcrumb: true,
     navSearch: true,
     fullscreen: false,

src/types/global.d.ts

@@ -148,6 +148,11 @@ declare namespace Settings {
     enableHotkeys?: boolean
   }
   interface toolbar {
+    /**
+     * 是否开启工具栏
+     * @默认值 `true`
+     */
+    enable?: boolean
     /**
      * 是否开启面包屑导航
      * @默认值 `true`