From c46a5920e51c24419e96036a6f5bc04fde0e9124 Mon Sep 17 00:00:00 2001
From: Soybean <soybeanjs@outlook.com>
Date: Wed, 5 Jul 2023 01:41:57 +0800
Subject: [PATCH] =?UTF-8?q?refactor(projects):=20=E7=94=9F=E4=BA=A7?=
 =?UTF-8?q?=E7=8E=AF=E5=A2=83=E7=BC=93=E5=AD=98=E4=B8=BB=E9=A2=98=E5=8F=98?=
 =?UTF-8?q?=E6=9B=B4=E4=B8=BAsessionStorage?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/common/app-loading.vue | 4 ++--
 src/store/modules/theme/helpers.ts    | 6 +++---
 src/store/modules/theme/index.ts      | 6 +++---
 src/store/subscribe/theme.ts          | 4 ++--
 src/typings/storage.d.ts              | 9 ++++-----
 5 files changed, 14 insertions(+), 15 deletions(-)

diff --git a/src/components/common/app-loading.vue b/src/components/common/app-loading.vue
index 167547a1..7fe6fa49 100644
--- a/src/components/common/app-loading.vue
+++ b/src/components/common/app-loading.vue
@@ -17,7 +17,7 @@
 
 <script setup lang="ts">
 import { useAppInfo } from '@/composables';
-import { localStg, getRgbOfColor } from '@/utils';
+import { sessionStg, getRgbOfColor } from '@/utils';
 import themeSettings from '@/settings/theme.json';
 
 const { title } = useAppInfo();
@@ -31,7 +31,7 @@ const lodingClasses = [
 
 function addThemeColorCssVars() {
   const defaultColor = themeSettings.themeColor;
-  const themeColor = localStg.get('themeColor') || defaultColor;
+  const themeColor = sessionStg.get('themeColor') || defaultColor;
 
   const { r, g, b } = getRgbOfColor(themeColor);
 
diff --git a/src/store/modules/theme/helpers.ts b/src/store/modules/theme/helpers.ts
index 35c355a3..cc477d38 100644
--- a/src/store/modules/theme/helpers.ts
+++ b/src/store/modules/theme/helpers.ts
@@ -1,19 +1,19 @@
 import type { GlobalThemeOverrides } from 'naive-ui';
 import { cloneDeep } from 'lodash-es';
 import { themeSetting } from '@/settings';
-import { localStg, addColorAlpha, getColorPalette } from '@/utils';
+import { sessionStg, addColorAlpha, getColorPalette } from '@/utils';
 
 /** 初始化主题配置 */
 export function initThemeSettings() {
   const isProd = import.meta.env.PROD;
   // 生产环境才缓存主题配置，本地开发实时调整配置更改配置的json
-  const storageSettings = localStg.get('themeSettings');
+  const storageSettings = sessionStg.get('themeSettings');
 
   if (isProd && storageSettings) {
     return storageSettings;
   }
 
-  const themeColor = localStg.get('themeColor') || themeSetting.themeColor;
+  const themeColor = sessionStg.get('themeColor') || themeSetting.themeColor;
   const info = themeSetting.isCustomizeInfoColor ? themeSetting.otherColor.info : getColorPalette(themeColor, 7);
   const otherColor = { ...themeSetting.otherColor, info };
   const setting = cloneDeep({ ...themeSetting, themeColor, otherColor });
diff --git a/src/store/modules/theme/index.ts b/src/store/modules/theme/index.ts
index 5b4bd65c..b81a4d55 100644
--- a/src/store/modules/theme/index.ts
+++ b/src/store/modules/theme/index.ts
@@ -1,6 +1,6 @@
 import { defineStore } from 'pinia';
 import { darkTheme } from 'naive-ui';
-import { localStg } from '@/utils';
+import { sessionStg } from '@/utils';
 import { getNaiveThemeOverrides, initThemeSettings } from './helpers';
 
 type ThemeState = Theme.Setting;
@@ -25,14 +25,14 @@ export const useThemeStore = defineStore('theme-store', {
   actions: {
     /** 重置theme状态 */
     resetThemeStore() {
-      localStg.remove('themeSettings');
+      sessionStg.remove('themeSettings');
       this.$reset();
     },
     /** 缓存主题配置 */
     cacheThemeSettings() {
       const isProd = import.meta.env.PROD;
       if (isProd) {
-        localStg.set('themeSettings', this.$state);
+        sessionStg.set('themeSettings', this.$state);
       }
     },
     /** 设置暗黑模式 */
diff --git a/src/store/subscribe/theme.ts b/src/store/subscribe/theme.ts
index 065c1e1f..a3ee8e36 100644
--- a/src/store/subscribe/theme.ts
+++ b/src/store/subscribe/theme.ts
@@ -3,7 +3,7 @@ import { useOsTheme } from 'naive-ui';
 import type { GlobalThemeOverrides } from 'naive-ui';
 import { useElementSize } from '@vueuse/core';
 import { kebabCase } from 'lodash-es';
-import { localStg, getColorPalettes, getRgbOfColor } from '@/utils';
+import { sessionStg, getColorPalettes, getRgbOfColor } from '@/utils';
 import { useThemeStore } from '../modules';
 
 /** 订阅theme store */
@@ -19,7 +19,7 @@ export default function subscribeThemeStore() {
     watch(
       () => theme.themeColor,
       newValue => {
-        localStg.set('themeColor', newValue);
+        sessionStg.set('themeColor', newValue);
       },
       { immediate: true }
     );
diff --git a/src/typings/storage.d.ts b/src/typings/storage.d.ts
index 7d343a52..dfb1affe 100644
--- a/src/typings/storage.d.ts
+++ b/src/typings/storage.d.ts
@@ -1,21 +1,20 @@
 declare namespace StorageInterface {
   /** localStorage的存储数据的类型 */
   interface Session {
-    demoKey: string;
+    /** 主题颜色 */
+    themeColor: string;
+    /** 主题配置 */
+    themeSettings: Theme.Setting;
   }
 
   /** localStorage的存储数据的类型 */
   interface Local {
-    /** 主题颜色 */
-    themeColor: string;
     /** 用户token */
     token: string;
     /** 用户刷新token */
     refreshToken: string;
     /** 用户信息 */
     userInfo: Auth.UserInfo;
-    /** 主题配置 */
-    themeSettings: Theme.Setting;
     /** 多页签路由信息 */
     multiTabRoutes: App.GlobalTabRoute[];
     /** 本地语言缓存 */