提交

web-admin/src/components/core/layouts/art-settings-panel/composables/useSettingsPanel.ts

@@ -3,9 +3,8 @@ import { useSettingStore } from '@/store/modules/setting'
 import { storeToRefs } from 'pinia'
 import { useBreakpoints } from '@vueuse/core'
 import AppConfig from '@/config'
-import { SystemThemeEnum, MenuTypeEnum } from '@/enums/appEnum'
+import { SystemThemeEnum } from '@/enums/appEnum'
 import { mittBus } from '@/utils/sys'
-import { StorageConfig } from '@/utils'
 import { useTheme } from '@/hooks/core/useTheme'
 import { useCeremony } from '@/hooks/core/useCeremony'
 import { useSettingsState } from './useSettingsState'
@@ -16,7 +15,7 @@ import { useSettingsHandlers } from './useSettingsHandlers'
  */
 export function useSettingsPanel() {
   const settingStore = useSettingStore()
-  const { systemThemeType, systemThemeMode, menuType } = storeToRefs(settingStore)
+  const { systemThemeType, systemThemeMode } = storeToRefs(settingStore)
 
   // Composables
   const { openFestival, cleanup } = useCeremony()
@@ -27,30 +26,10 @@ export function useSettingsPanel() {
   // 响应式状态
   const showDrawer = ref(false)
 
-  // 使用 VueUse breakpoints 优化性能
+  // 窄屏仅折叠侧栏，不再切换为「左侧菜单」布局（Web 端固定混合菜单）
   const breakpoints = useBreakpoints({ tablet: 1000 })
   const isMobile = breakpoints.smaller('tablet')
 
-  // 记录窗口宽度变化前的菜单类型
-  const getStoredDesktopMenuType = (): MenuTypeEnum | undefined => {
-    const storedMenuType = localStorage.getItem(StorageConfig.RESPONSIVE_MENU_TYPE_KEY)
-    return Object.values(MenuTypeEnum).includes(storedMenuType as MenuTypeEnum)
-      ? (storedMenuType as MenuTypeEnum)
-      : undefined
-  }
-
-  const setStoredDesktopMenuType = (type: MenuTypeEnum) => {
-    localStorage.setItem(StorageConfig.RESPONSIVE_MENU_TYPE_KEY, type)
-  }
-
-  const clearStoredDesktopMenuType = () => {
-    localStorage.removeItem(StorageConfig.RESPONSIVE_MENU_TYPE_KEY)
-  }
-
-  const storedDesktopMenuType = getStoredDesktopMenuType()
-  const beforeMenuType = ref<MenuTypeEnum | undefined>(storedDesktopMenuType)
-  const hasChangedMenu = ref(Boolean(storedDesktopMenuType))
-
   // 计算属性
   const systemThemeColor = computed(() => settingStore.systemThemeColor as string)
 
@@ -89,37 +68,12 @@ export function useSettingsPanel() {
     }
   }
 
-  // 响应式布局处理
+  // 响应式布局：窄屏折叠侧栏，菜单类型保持混合（top-left）
   const useResponsiveLayout = () => {
-    // 使用 watch 监听断点变化，性能更优
     const stopWatch = watch(
       isMobile,
       (mobile: boolean) => {
-        if (mobile) {
-          // 切换到移动端布局
-          if (!hasChangedMenu.value) {
-            beforeMenuType.value = menuType.value
-            if (menuType.value !== MenuTypeEnum.LEFT) {
-              setStoredDesktopMenuType(menuType.value)
-              useSettingsState().switchMenuLayouts(MenuTypeEnum.LEFT)
-              hasChangedMenu.value = true
-            }
-          }
-
-          settingStore.setMenuOpen(false)
-        } else {
-          // 恢复桌面端布局
-          if (hasChangedMenu.value && beforeMenuType.value) {
-            if (menuType.value === MenuTypeEnum.LEFT) {
-              useSettingsState().switchMenuLayouts(beforeMenuType.value)
-            }
-
-            clearStoredDesktopMenuType()
-            hasChangedMenu.value = false
-          }
-
-          settingStore.setMenuOpen(true)
-        }
+        settingStore.setMenuOpen(!mobile)
       },
       { immediate: true }
     )
@@ -194,6 +148,7 @@ export function useSettingsPanel() {
     let themeCleanup: (() => void) | null = null
 
     const initializeSettings = () => {
+      settingStore.enforceWebMenuLayout()
       mittBus.on('openSetting', openSetting)
       themeHandlers.initSystemColor()
       themeCleanup = themeHandlers.listenerSystemTheme()

web-admin/src/graphify-out/cache/ast/3bd57e5b2d0f1ce51ab2d32470fc6a0059a498f26de6e71de93075ad854ac0a9.json

@@ -0,0 +1 @@
+{"nodes": [{"id": "users_wuzilong_work_00code_zkxw_web_admin_src_types_import_components_d_ts", "label": "components.d.ts", "file_type": "code", "source_file": "/Users/wuzilong/work/00code/zkxw/web-admin/src/types/import/components.d.ts", "source_location": "L1"}], "edges": [], "raw_calls": []}

web-admin/src/graphify-out/cache/ast/4017bbc308825d10b19d802f10b4e7d9c525c33a1d702bf8ac85daf5fc81750e.json

@@ -0,0 +1 @@
+{"nodes": [{"id": "users_wuzilong_work_00code_zkxw_web_admin_src_store_modules_setting_ts", "label": "setting.ts", "file_type": "code", "source_file": "/Users/wuzilong/work/00code/zkxw/web-admin/src/store/modules/setting.ts", "source_location": "L1"}], "edges": [{"source": "users_wuzilong_work_00code_zkxw_web_admin_src_store_modules_setting_ts", "target": "pinia", "relation": "imports_from", "confidence": "EXTRACTED", "source_file": "/Users/wuzilong/work/00code/zkxw/web-admin/src/store/modules/setting.ts", "source_location": "L33", "weight": 1.0}, {"source": "users_wuzilong_work_00code_zkxw_web_admin_src_store_modules_setting_ts", "target": "vue", "relation": "imports_from", "confidence": "EXTRACTED", "source_file": "/Users/wuzilong/work/00code/zkxw/web-admin/src/store/modules/setting.ts", "source_location": "L34", "weight": 1.0}, {"source": "users_wuzilong_work_00code_zkxw_web_admin_src_store_modules_setting_ts", "target": "users_wuzilong_work_00code_zkxw_web_admin_src_types_store", "relation": "imports_from", "confidence": "EXTRACTED", "source_file": "/Users/wuzilong/work/00code/zkxw/web-admin/src/store/modules/setting.ts", "source_location": "L35", "weight": 1.0}, {"source": "users_wuzilong_work_00code_zkxw_web_admin_src_store_modules_setting_ts", "target": "users_wuzilong_work_00code_zkxw_web_admin_src_config", "relation": "imports_from", "confidence": "EXTRACTED", "source_file": "/Users/wuzilong/work/00code/zkxw/web-admin/src/store/modules/setting.ts", "source_location": "L36", "weight": 1.0}, {"source": "users_wuzilong_work_00code_zkxw_web_admin_src_store_modules_setting_ts", "target": "users_wuzilong_work_00code_zkxw_web_admin_src_enums_appenum", "relation": "imports_from", "confidence": "EXTRACTED", "source_file": "/Users/wuzilong/work/00code/zkxw/web-admin/src/store/modules/setting.ts", "source_location": "L37", "weight": 1.0}, {"source": "users_wuzilong_work_00code_zkxw_web_admin_src_store_modules_setting_ts", "target": "users_wuzilong_work_00code_zkxw_web_admin_src_utils_ui", "relation": "imports_from", "confidence": "EXTRACTED", "source_file": "/Users/wuzilong/work/00code/zkxw/web-admin/src/store/modules/setting.ts", "source_location": "L38", "weight": 1.0}, {"source": "users_wuzilong_work_00code_zkxw_web_admin_src_store_modules_setting_ts", "target": "users_wuzilong_work_00code_zkxw_web_admin_src_hooks_core_useceremony", "relation": "imports_from", "confidence": "EXTRACTED", "source_file": "/Users/wuzilong/work/00code/zkxw/web-admin/src/store/modules/setting.ts", "source_location": "L39", "weight": 1.0}, {"source": "users_wuzilong_work_00code_zkxw_web_admin_src_store_modules_setting_ts", "target": "users_wuzilong_work_00code_zkxw_web_admin_src_utils", "relation": "imports_from", "confidence": "EXTRACTED", "source_file": "/Users/wuzilong/work/00code/zkxw/web-admin/src/store/modules/setting.ts", "source_location": "L40", "weight": 1.0}, {"source": "users_wuzilong_work_00code_zkxw_web_admin_src_store_modules_setting_ts", "target": "users_wuzilong_work_00code_zkxw_web_admin_src_config_setting", "relation": "imports_from", "confidence": "EXTRACTED", "source_file": "/Users/wuzilong/work/00code/zkxw/web-admin/src/store/modules/setting.ts", "source_location": "L41", "weight": 1.0}], "raw_calls": []}

web-admin/src/graphify-out/cache/ast/75a18a2dc29cc08155711aafb0f234ec3ed0e06d7dfcdec1653ae601ee6e06e3.json

@@ -0,0 +1 @@
+{"nodes": [{"id": "users_wuzilong_work_00code_zkxw_web_admin_src_components_core_layouts_art_settings_panel_composables_usesettingspanel_ts", "label": "useSettingsPanel.ts", "file_type": "code", "source_file": "/Users/wuzilong/work/00code/zkxw/web-admin/src/components/core/layouts/art-settings-panel/composables/useSettingsPanel.ts", "source_location": "L1"}, {"id": "composables_usesettingspanel_usesettingspanel", "label": "useSettingsPanel()", "file_type": "code", "source_file": "/Users/wuzilong/work/00code/zkxw/web-admin/src/components/core/layouts/art-settings-panel/composables/useSettingsPanel.ts", "source_location": "L16"}], "edges": [{"source": "users_wuzilong_work_00code_zkxw_web_admin_src_components_core_layouts_art_settings_panel_composables_usesettingspanel_ts", "target": "vue", "relation": "imports_from", "confidence": "EXTRACTED", "source_file": "/Users/wuzilong/work/00code/zkxw/web-admin/src/components/core/layouts/art-settings-panel/composables/useSettingsPanel.ts", "source_location": "L1", "weight": 1.0}, {"source": "users_wuzilong_work_00code_zkxw_web_admin_src_components_core_layouts_art_settings_panel_composables_usesettingspanel_ts", "target": "users_wuzilong_work_00code_zkxw_web_admin_src_store_modules_setting", "relation": "imports_from", "confidence": "EXTRACTED", "source_file": "/Users/wuzilong/work/00code/zkxw/web-admin/src/components/core/layouts/art-settings-panel/composables/useSettingsPanel.ts", "source_location": "L2", "weight": 1.0}, {"source": "users_wuzilong_work_00code_zkxw_web_admin_src_components_core_layouts_art_settings_panel_composables_usesettingspanel_ts", "target": "pinia", "relation": "imports_from", "confidence": "EXTRACTED", "source_file": "/Users/wuzilong/work/00code/zkxw/web-admin/src/components/core/layouts/art-settings-panel/composables/useSettingsPanel.ts", "source_location": "L3", "weight": 1.0}, {"source": "users_wuzilong_work_00code_zkxw_web_admin_src_components_core_layouts_art_settings_panel_composables_usesettingspanel_ts", "target": "core", "relation": "imports_from", "confidence": "EXTRACTED", "source_file": "/Users/wuzilong/work/00code/zkxw/web-admin/src/components/core/layouts/art-settings-panel/composables/useSettingsPanel.ts", "source_location": "L4", "weight": 1.0}, {"source": "users_wuzilong_work_00code_zkxw_web_admin_src_components_core_layouts_art_settings_panel_composables_usesettingspanel_ts", "target": "users_wuzilong_work_00code_zkxw_web_admin_src_config", "relation": "imports_from", "confidence": "EXTRACTED", "source_file": "/Users/wuzilong/work/00code/zkxw/web-admin/src/components/core/layouts/art-settings-panel/composables/useSettingsPanel.ts", "source_location": "L5", "weight": 1.0}, {"source": "users_wuzilong_work_00code_zkxw_web_admin_src_components_core_layouts_art_settings_panel_composables_usesettingspanel_ts", "target": "users_wuzilong_work_00code_zkxw_web_admin_src_enums_appenum", "relation": "imports_from", "confidence": "EXTRACTED", "source_file": "/Users/wuzilong/work/00code/zkxw/web-admin/src/components/core/layouts/art-settings-panel/composables/useSettingsPanel.ts", "source_location": "L6", "weight": 1.0}, {"source": "users_wuzilong_work_00code_zkxw_web_admin_src_components_core_layouts_art_settings_panel_composables_usesettingspanel_ts", "target": "users_wuzilong_work_00code_zkxw_web_admin_src_utils_sys", "relation": "imports_from", "confidence": "EXTRACTED", "source_file": "/Users/wuzilong/work/00code/zkxw/web-admin/src/components/core/layouts/art-settings-panel/composables/useSettingsPanel.ts", "source_location": "L7", "weight": 1.0}, {"source": "users_wuzilong_work_00code_zkxw_web_admin_src_components_core_layouts_art_settings_panel_composables_usesettingspanel_ts", "target": "users_wuzilong_work_00code_zkxw_web_admin_src_hooks_core_usetheme", "relation": "imports_from", "confidence": "EXTRACTED", "source_file": "/Users/wuzilong/work/00code/zkxw/web-admin/src/components/core/layouts/art-settings-panel/composables/useSettingsPanel.ts", "source_location": "L8", "weight": 1.0}, {"source": "users_wuzilong_work_00code_zkxw_web_admin_src_components_core_layouts_art_settings_panel_composables_usesettingspanel_ts", "target": "users_wuzilong_work_00code_zkxw_web_admin_src_hooks_core_useceremony", "relation": "imports_from", "confidence": "EXTRACTED", "source_file": "/Users/wuzilong/work/00code/zkxw/web-admin/src/components/core/layouts/art-settings-panel/composables/useSettingsPanel.ts", "source_location": "L9", "weight": 1.0}, {"source": "users_wuzilong_work_00code_zkxw_web_admin_src_components_core_layouts_art_settings_panel_composables_usesettingspanel_ts", "target": "users_wuzilong_work_00code_zkxw_web_admin_src_components_core_layouts_art_settings_panel_composables_usesettingsstate", "relation": "imports_from", "confidence": "EXTRACTED", "source_file": "/Users/wuzilong/work/00code/zkxw/web-admin/src/components/core/layouts/art-settings-panel/composables/useSettingsPanel.ts", "source_location": "L10", "weight": 1.0}, {"sourLine truncated

web-admin/src/graphify-out/cache/ast/d48a90e7bc229c6f600abdf986c2ae281496e3080b5884bc96c44760043a7a7c.json

@@ -0,0 +1 @@
+{"nodes": [{"id": "users_wuzilong_work_00code_zkxw_web_admin_src_types_import_components_d_ts", "label": "components.d.ts", "file_type": "code", "source_file": "/Users/wuzilong/work/00code/zkxw/web-admin/src/types/import/components.d.ts", "source_location": "L1"}], "edges": [], "raw_calls": []}

web-admin/src/store/modules/setting.ts

@@ -160,11 +160,21 @@ export const useSettingStore = defineStore(
     })
 
     /**
-     * 切换菜单布局
-     * @param type 菜单类型
+     * 切换菜单布局（Web 管理端固定混合菜单：一级顶栏 + 二级侧栏）
      */
     const switchMenuLayouts = (type: MenuTypeEnum) => {
-      menuType.value = type
+      void type
+      menuType.value = MenuTypeEnum.TOP_LEFT
+    }
+
+    /** 持久化恢复后强制混合菜单，避免历史 localStorage 覆盖布局 */
+    const enforceWebMenuLayout = () => {
+      menuType.value = MenuTypeEnum.TOP_LEFT
+      try {
+        localStorage.removeItem(StorageConfig.RESPONSIVE_MENU_TYPE_KEY)
+      } catch {
+        // ignore
+      }
     }
 
     /**
@@ -411,6 +421,7 @@ export const useSettingStore = defineStore(
       getCustomRadius,
       isShowFireworks,
       switchMenuLayouts,
+      enforceWebMenuLayout,
       setMenuOpenWidth,
       setGlopTheme,
       switchMenuStyles,
@@ -444,7 +455,12 @@ export const useSettingStore = defineStore(
   {
     persist: {
       key: 'setting',
-      storage: localStorage
+      storage: localStorage,
+      // 菜单布局由产品固定，不持久化用户切换记录
+      omit: ['menuType'],
+      afterRestore: (ctx) => {
+        ;(ctx.store as ReturnType<typeof useSettingStore>).enforceWebMenuLayout()
+      }
     }
   }
 )