feat(projects): 添加生产的主题配置缓存

src/store/modules/theme/helpers.ts

@@ -1,10 +1,18 @@
 import type { GlobalThemeOverrides } from 'naive-ui';
 import { cloneDeep } from 'lodash-es';
 import { themeSetting } from '@/settings';
-import { getThemeColor, getColorPalette, addColorAlpha } from '@/utils';
+import { EnumStorageKey } from '@/enum';
+import { getThemeColor, getColorPalette, addColorAlpha, setLocal, getLocal, removeLocal } from '@/utils';
+
+/** 初始化主题配置 */
+export function initThemeSettings() {
+  const isProd = import.meta.env.PROD;
+  // 生产环境才缓存主题配置，本地开发实时调整配置更改配置的json
+  const storageSettings = getThemeSettings();
+  if (isProd && storageSettings) {
+    return storageSettings;
+  }
 
-/** 获取主题配置 */
-export function getThemeSettings() {
   const themeColor = getThemeColor() || themeSetting.themeColor;
   const info = themeSetting.isCustomizeInfoColor ? themeSetting.otherColor.info : getColorPalette(themeColor, 7);
   const otherColor = { ...themeSetting.otherColor, info };
@@ -70,3 +78,18 @@ export function getNaiveThemeOverrides(colors: Record<ColorType, string>): Globa
     }
   };
 }
+
+/** 获取缓存中的主题配置 */
+function getThemeSettings() {
+  return getLocal<Theme.Setting>(EnumStorageKey['theme-settings']);
+}
+
+/** 获取缓存中的主题配置 */
+export function setThemeSettings(settings: Theme.Setting) {
+  return setLocal(EnumStorageKey['theme-settings'], settings);
+}
+
+/** 清除缓存配置 */
+export function clearThemeSettings() {
+  removeLocal(EnumStorageKey['theme-settings']);
+}

src/store/modules/theme/index.ts

@@ -1,11 +1,11 @@
 import { defineStore } from 'pinia';
 import { darkTheme } from 'naive-ui';
-import { getThemeSettings, getNaiveThemeOverrides } from './helpers';
+import { initThemeSettings, getNaiveThemeOverrides, setThemeSettings, clearThemeSettings } from './helpers';
 
 type ThemeState = Theme.Setting;
 
 export const useThemeStore = defineStore('theme-store', {
-  state: (): ThemeState => getThemeSettings(),
+  state: (): ThemeState => initThemeSettings(),
   getters: {
     /** naiveUI的主题配置 */
     naiveThemeOverrides(state) {
@@ -24,8 +24,16 @@ export const useThemeStore = defineStore('theme-store', {
   actions: {
     /** 重置theme状态 */
     resetThemeStore() {
+      clearThemeSettings();
       this.$reset();
     },
+    /** 缓存主题配置 */
+    cacheThemeSettings() {
+      const isProd = import.meta.env.PROD;
+      if (isProd) {
+        setThemeSettings(this.$state);
+      }
+    },
     /** 设置暗黑模式 */
     setDarkMode(darkMode: boolean) {
       this.darkMode = darkMode;