feat: 完成主题切换，语言切换的本地存储

src/store/modules/designStore/designStore.d.ts

@@ -1,6 +1,10 @@
+import { ThemeEnum } from '@/enums/styleEnum'
+
 export interface DesignStateType {
-  //深色主题
+  // 是否是深色主题
   darkTheme: boolean;
+  // 主题名称
+  themeName: ThemeEnum;
   //系统风格
   appTheme: string;
   //系统内置风格

src/store/modules/designStore/designStore.ts

@@ -1,34 +1,47 @@
-import { defineStore } from 'pinia';
-import { store } from '@/store';
-import { theme } from '@/settings/designSetting';
-const { darkTheme, appTheme, appThemeList } = theme;
+import { defineStore } from 'pinia'
+import { store } from '@/store'
+import { theme } from '@/settings/designSetting'
 import { DesignStateType } from './designStore.d'
+import { setLocalStorage, getLocalStorage } from '@/utils/index'
+import { GO_Theme_SELECT } from '@/settings/storageConst'
+import { ThemeEnum } from '@/enums/styleEnum'
+
+const { darkTheme, appTheme, appThemeList } = theme
+const storageThemeName = getLocalStorage(GO_Theme_SELECT)
 
 export const useDesignStore = defineStore({
   id: 'useDesignStore',
   state: (): DesignStateType => ({
-    darkTheme,
+    // 是否暗黑
+    darkTheme: storageThemeName === ThemeEnum.dark,
+    // 主题名称
+    themeName:
+      storageThemeName || (darkTheme && ThemeEnum.dark) || ThemeEnum.light,
+    // 颜色色号
     appTheme,
-    appThemeList,
+    // 颜色列表
+    appThemeList
   }),
   getters: {
-    getDarkTheme(): boolean {
-      return this.darkTheme;
+    getDarkTheme(e): boolean {
+      return this.darkTheme
     },
     getAppTheme(): string {
-      return this.appTheme;
+      return this.appTheme
     },
     getAppThemeList(): string[] {
-      return this.appThemeList;
-    },
+      return this.appThemeList
+    }
   },
   actions: {
-    changeTheme():void {
+    changeTheme(): void {
       this.darkTheme = !this.darkTheme
+      this.themeName = this.darkTheme ? ThemeEnum.dark : ThemeEnum.light
+      setLocalStorage(GO_Theme_SELECT, this.themeName)
     }
   }
-});
+})
 
 export function useDesignSettingWithOut() {
-  return useDesignStore(store);
+  return useDesignStore(store)
 }

src/store/modules/langStore/langStore.d.ts

@@ -0,0 +1,5 @@
+import { LangEnum } from '@/enums/styleEnum'
+export interface LangStateType {
+  // 当前语言
+  lang: LangEnum
+}

src/store/modules/langStore/langStore.ts

@@ -0,0 +1,26 @@
+import { defineStore } from 'pinia'
+import { lang } from '@/settings/designSetting'
+import { LangStateType } from './langStore.d'
+import { LangEnum } from '@/enums/styleEnum'
+import i18n from '@/i18n/index'
+import { setLocalStorage } from '@/utils/index'
+import { GO_LANG_SELECT } from '@/settings/storageConst'
+
+export const useLangStore = defineStore({
+  id: 'useLangStore',
+  state: (): LangStateType => ({
+    lang
+  }),
+  getters: {
+    getLang(): LangEnum {
+      return this.lang
+    }
+  },
+  actions: {
+    changeLang(lang: LangEnum): void {
+      this.lang = lang
+      i18n.global.locale = lang
+      setLocalStorage(GO_LANG_SELECT, lang)
+    }
+  }
+})

src/store/mutation-types.ts

@@ -1,2 +0,0 @@
-export const ACCESS_TOKEN = 'ACCESS-TOKEN'; // 用户token
-export const CURRENT_USER = 'CURRENT-USER'; // 当前用户信息

src/store/types.ts

@@ -1,5 +1,7 @@
 import { DesignStateType } from '@/store/modules/designStore/designStore.d';
+import { LangStateType } from '@/store/modules/langStore/langStore.d';
 
 export interface allStore {
   useDesignStore: DesignStateType;
+  useLangStore: LangStateType;
 }