refactor: 命名优化统一

src/store/modules/settings.store.ts

@@ -2,34 +2,67 @@ import defaultSettings from "@/settings";
 import { SidebarColor, ThemeMode } from "@/enums/settings/theme.enum";
 import type { LayoutMode } from "@/enums/settings/layout.enum";
 import { applyTheme, generateThemeColors, toggleDarkMode, toggleSidebarColor } from "@/utils/theme";
+import { SETTINGS_KEYS } from "@/constants";
 
-type SettingsValue = boolean | string;
+// 🎯 设置项类型定义
+interface SettingsState {
+  // 界面显示设置
+  settingsVisible: boolean;
+  showTagsView: boolean;
+  showAppLogo: boolean;
+  showWatermark: boolean;
+
+  // 布局设置
+  layout: LayoutMode;
+  sidebarColorScheme: string;
+
+  // 主题设置
+  theme: ThemeMode;
+  themeColor: string;
+}
+
+// 🎯 可变更的设置项类型
+type MutableSetting = Exclude<keyof SettingsState, "settingsVisible">;
+type SettingValue<K extends MutableSetting> = SettingsState[K];
 
 export const useSettingsStore = defineStore("setting", () => {
-  // 基本设置
-  const settingsVisible = ref(false);
-  // 标签视图
-  const tagsView = useStorage<boolean>("tagsView", defaultSettings.tagsView);
-  // 侧边栏 Logo
-  const sidebarLogo = useStorage<boolean>("sidebarLogo", defaultSettings.sidebarLogo);
-  // 侧边栏配色方案 (经典蓝/极简白)
+  // 🎯 基础设置 - 非持久化
+  const settingsVisible = ref<boolean>(false);
+
+  // 🎯 持久化设置 - 使用分组常量
+  const showTagsView = useStorage<boolean>(
+    SETTINGS_KEYS.SHOW_TAGS_VIEW,
+    defaultSettings.showTagsView
+  );
+
+  const showAppLogo = useStorage<boolean>(SETTINGS_KEYS.SHOW_APP_LOGO, defaultSettings.showAppLogo);
+
+  const showWatermark = useStorage<boolean>(
+    SETTINGS_KEYS.SHOW_WATERMARK,
+    defaultSettings.showWatermark
+  );
+
   const sidebarColorScheme = useStorage<string>(
-    "sidebarColorScheme",
+    SETTINGS_KEYS.SIDEBAR_COLOR_SCHEME,
     defaultSettings.sidebarColorScheme
   );
-  // 布局
-  const layout = useStorage<LayoutMode>("layout", defaultSettings.layout as LayoutMode);
-  // 水印
-  const watermarkEnabled = useStorage<boolean>(
-    "watermarkEnabled",
-    defaultSettings.watermarkEnabled
-  );
 
-  // 主题
-  const themeColor = useStorage<string>("themeColor", defaultSettings.themeColor);
-  const theme = useStorage<ThemeMode>("theme", defaultSettings.theme);
+  const layout = useStorage<LayoutMode>(SETTINGS_KEYS.LAYOUT, defaultSettings.layout as LayoutMode);
 
-  //  监听主题变化
+  const themeColor = useStorage<string>(SETTINGS_KEYS.THEME_COLOR, defaultSettings.themeColor);
+
+  const theme = useStorage<ThemeMode>(SETTINGS_KEYS.THEME, defaultSettings.theme);
+
+  // 🎯 设置项映射
+  const settingsMap = {
+    showTagsView,
+    showAppLogo,
+    showWatermark,
+    sidebarColorScheme,
+    layout,
+  } as const;
+
+  // 🎯 监听器 - 主题变化
   watch(
     [theme, themeColor],
     ([newTheme, newThemeColor]) => {
@@ -40,7 +73,7 @@ export const useSettingsStore = defineStore("setting", () => {
     { immediate: true }
   );
 
-  //  监听浅色侧边栏配色方案变化
+  // 🎯 监听器 - 侧边栏配色方案变化
   watch(
     [sidebarColorScheme],
     ([newSidebarColorScheme]) => {
@@ -49,49 +82,79 @@ export const useSettingsStore = defineStore("setting", () => {
     { immediate: true }
   );
 
-  // 设置映射
-  const settingsMap: Record<string, Ref<SettingsValue>> = {
-    tagsView,
-    sidebarLogo,
-    sidebarColorScheme,
-    layout,
-    watermarkEnabled,
-  };
-
-  function changeSetting({ key, value }: { key: string; value: SettingsValue }) {
+  // 🎯 统一的设置更新方法 - 类型安全
+  function updateSetting<K extends keyof typeof settingsMap>(key: K, value: SettingValue<K>): void {
     const setting = settingsMap[key];
-    if (setting) setting.value = value;
+    if (setting) {
+      (setting as Ref<any>).value = value;
+    }
   }
 
-  function changeTheme(val: ThemeMode) {
-    theme.value = val;
+  // 🎯 主题相关的专用更新方法
+  function updateTheme(newTheme: ThemeMode): void {
+    theme.value = newTheme;
   }
 
-  function changeSidebarColor(val: string) {
-    sidebarColorScheme.value = val;
+  function updateThemeColor(newColor: string): void {
+    themeColor.value = newColor;
   }
 
-  function changeThemeColor(color: string) {
-    themeColor.value = color;
+  function updateSidebarColorScheme(newScheme: string): void {
+    sidebarColorScheme.value = newScheme;
   }
 
-  function changeLayout(val: LayoutMode) {
-    layout.value = val;
+  function updateLayout(newLayout: LayoutMode): void {
+    layout.value = newLayout;
+  }
+
+  // 🎯 设置面板显示控制
+  function toggleSettingsPanel(): void {
+    settingsVisible.value = !settingsVisible.value;
+  }
+
+  function showSettingsPanel(): void {
+    settingsVisible.value = true;
+  }
+
+  function hideSettingsPanel(): void {
+    settingsVisible.value = false;
+  }
+
+  // 🎯 批量重置设置
+  function resetSettings(): void {
+    showTagsView.value = defaultSettings.showTagsView;
+    showAppLogo.value = defaultSettings.showAppLogo;
+    showWatermark.value = defaultSettings.showWatermark;
+    sidebarColorScheme.value = defaultSettings.sidebarColorScheme;
+    layout.value = defaultSettings.layout as LayoutMode;
+    themeColor.value = defaultSettings.themeColor;
+    theme.value = defaultSettings.theme;
   }
 
   return {
+    // 状态
     settingsVisible,
-    tagsView,
-    sidebarLogo,
+    showTagsView,
+    showAppLogo,
+    showWatermark,
     sidebarColorScheme,
     layout,
     themeColor,
     theme,
-    watermarkEnabled,
-    changeSetting,
-    changeTheme,
-    changeThemeColor,
-    changeLayout,
-    changeSidebarColor,
+
+    // 更新方法
+    updateSetting,
+    updateTheme,
+    updateThemeColor,
+    updateSidebarColorScheme,
+    updateLayout,
+
+    // 面板控制
+    toggleSettingsPanel,
+    showSettingsPanel,
+    hideSettingsPanel,
+
+    // 重置功能
+    resetSettings,
   };
 });