From 6026e9cac0d8d80a808d62f3a61adafc5990cee1 Mon Sep 17 00:00:00 2001
From: zimo493 <2081182432@qq.com>
Date: Thu, 3 Apr 2025 15:00:16 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=20:recycle:=20=E4=BD=BF=E7=94=A8?=
 =?UTF-8?q?=E6=9E=9A=E4=B8=BE=E7=B1=BB=E5=9E=8B=E6=9B=BF=E4=BB=A3=E5=AD=97?=
 =?UTF-8?q?=E7=AC=A6=E4=B8=B2=E7=B1=BB=E5=9E=8B=EF=BC=8C=E5=A2=9E=E5=BC=BA?=
 =?UTF-8?q?=E7=B1=BB=E5=9E=8B=E5=AE=89=E5=85=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

更新相关函数和变量的类型定义
---
 src/store/modules/settings.store.ts |  6 +++---
 src/types/global.d.ts               |  2 +-
 src/utils/theme.ts                  | 17 ++++++++++-------
 3 files changed, 14 insertions(+), 11 deletions(-)

diff --git a/src/store/modules/settings.store.ts b/src/store/modules/settings.store.ts
index 2cea2b59..f4b0afff 100644
--- a/src/store/modules/settings.store.ts
+++ b/src/store/modules/settings.store.ts
@@ -1,7 +1,7 @@
 import defaultSettings from "@/settings";
 import { SidebarColor, ThemeMode } from "@/enums/settings/theme.enum";
 import { LayoutMode } from "@/enums/settings/layout.enum";
-import { generateThemeColors, applyTheme, toggleDarkMode, toggleSidebarColor } from "@/utils/theme";
+import { applyTheme, generateThemeColors, toggleDarkMode, toggleSidebarColor } from "@/utils/theme";
 
 type SettingsValue = boolean | string;
 
@@ -27,7 +27,7 @@ export const useSettingsStore = defineStore("setting", () => {
 
   // 主题
   const themeColor = useStorage<string>("themeColor", defaultSettings.themeColor);
-  const theme = useStorage<string>("theme", defaultSettings.theme);
+  const theme = useStorage<ThemeMode>("theme", defaultSettings.theme);
 
   //  监听主题变化
   watch(
@@ -63,7 +63,7 @@ export const useSettingsStore = defineStore("setting", () => {
     if (setting) setting.value = value;
   }
 
-  function changeTheme(val: string) {
+  function changeTheme(val: ThemeMode) {
     theme.value = val;
   }
 
diff --git a/src/types/global.d.ts b/src/types/global.d.ts
index cf16798f..54d2a356 100644
--- a/src/types/global.d.ts
+++ b/src/types/global.d.ts
@@ -67,7 +67,7 @@ declare global {
     /** 主题颜色 */
     themeColor: string;
     /** 主题模式(dark|light) */
-    theme: string;
+    theme: import("@/enums/settings/theme.enum").ThemeMode;
     /** 布局大小(default |large |small) */
     size: string;
     /** 语言( zh-cn| en) */
diff --git a/src/utils/theme.ts b/src/utils/theme.ts
index fbf41f00..558503ee 100644
--- a/src/utils/theme.ts
+++ b/src/utils/theme.ts
@@ -1,3 +1,5 @@
+import { ThemeMode } from "@/enums";
+
 // 辅助函数：将十六进制颜色转换为 RGB
 function hexToRgb(hex: string): [number, number, number] {
   const bigint = parseInt(hex.slice(1), 16);
@@ -49,21 +51,22 @@ export const getLightColor = (color: string, level: number): string => {
  * @param primary 主题色
  * @param theme 主题类型
  */
-export function generateThemeColors(primary: string, theme: string) {
+export function generateThemeColors(primary: string, theme: ThemeMode) {
   const colors: Record<string, string> = {
     primary,
   };
 
   // 生成浅色变体
   for (let i = 1; i <= 9; i++) {
-    const primaryColor =
-      theme === "light" ? `${getLightColor(primary, i / 10)}` : `${getDarkColor(primary, i / 10)}`;
-    colors[`primary-light-${i}`] = primaryColor;
+    colors[`primary-light-${i}`] =
+      theme === ThemeMode.LIGHT
+        ? `${getLightColor(primary, i / 10)}`
+        : `${getDarkColor(primary, i / 10)}`;
   }
 
   // 生成深色变体
   colors["primary-dark-2"] =
-    theme === "light" ? `${getLightColor(primary, 0.2)}` : `${getDarkColor(primary, 0.3)}`;
+    theme === ThemeMode.LIGHT ? `${getLightColor(primary, 0.2)}` : `${getDarkColor(primary, 0.3)}`;
 
   return colors;
 }
@@ -83,9 +86,9 @@ export function applyTheme(colors: Record<string, string>) {
  */
 export function toggleDarkMode(isDark: boolean) {
   if (isDark) {
-    document.documentElement.classList.add("dark");
+    document.documentElement.classList.add(ThemeMode.DARK);
   } else {
-    document.documentElement.classList.remove("dark");
+    document.documentElement.classList.remove(ThemeMode.DARK);
   }
 }