From 5c4fd951bc40fdfb7fa6268bdc9c81581dafa0a3 Mon Sep 17 00:00:00 2001
From: xiaoxian521 <1923740402@qq.com>
Date: Wed, 6 Mar 2024 00:46:07 +0800
Subject: [PATCH] =?UTF-8?q?chore:=20=E4=BF=AE=E5=A4=8D=E9=A1=B9=E7=9B=AE?=
 =?UTF-8?q?=E9=85=8D=E7=BD=AE=E4=B8=AD=E5=BC=80=E5=90=AF=E7=81=B0=E8=89=B2?=
 =?UTF-8?q?=E6=A8=A1=E5=BC=8F=E5=92=8C=E6=B7=B1=E8=89=B2=E6=95=B4=E4=BD=93?=
 =?UTF-8?q?=E9=A3=8E=E6=A0=BC=EF=BC=8C=E5=88=B7=E6=96=B0=E9=A1=B5=E9=9D=A2?=
 =?UTF-8?q?=E6=95=B4=E4=BD=93=E9=A3=8E=E6=A0=BC=E5=BC=82=E5=B8=B8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/layout/components/setting/index.vue | 16 +++++++---------
 src/layout/hooks/useDataThemeChange.ts  |  2 +-
 2 files changed, 8 insertions(+), 10 deletions(-)

diff --git a/src/layout/components/setting/index.vue b/src/layout/components/setting/index.vue
index 5eebc1915..8725c143a 100644
--- a/src/layout/components/setting/index.vue
+++ b/src/layout/components/setting/index.vue
@@ -13,7 +13,7 @@ import panel from "../panel/index.vue";
 import { emitter } from "@/utils/mitt";
 import { useNav } from "@/layout/hooks/useNav";
 import { useAppStoreHook } from "@/store/modules/app";
-import { useDark, debounce, useGlobal } from "@pureadmin/utils";
+import { useDark, useGlobal, debounce } from "@pureadmin/utils";
 import { toggleTheme } from "@pureadmin/theme/dist/browser-utils";
 import { useMultiTagsStoreHook } from "@/store/modules/multiTags";
 import Segmented, { type OptionsType } from "@/components/ReSegmented";
@@ -88,17 +88,15 @@ function storageConfigureChange<T>(key: string, val: T): void {
 
 /** 灰色模式设置 */
 const greyChange = (value): void => {
-  toggleClass(settings.greyVal, "html-grey", document.querySelector("html"));
+  const htmlEl = document.querySelector("html");
+  toggleClass(settings.greyVal, "html-grey", htmlEl);
   storageConfigureChange("grey", value);
 };
 
 /** 色弱模式设置 */
 const weekChange = (value): void => {
-  toggleClass(
-    settings.weakVal,
-    "html-weakness",
-    document.querySelector("html")
-  );
+  const htmlEl = document.querySelector("html");
+  toggleClass(settings.weakVal, "html-weakness", htmlEl);
   storageConfigureChange("weak", value);
 };
 
@@ -266,9 +264,9 @@ onBeforeMount(() => {
   nextTick(() => {
     watchSystemThemeChange();
     settings.greyVal &&
-      document.querySelector("html")?.setAttribute("class", "html-grey");
+      document.querySelector("html")?.classList.add("html-grey");
     settings.weakVal &&
-      document.querySelector("html")?.setAttribute("class", "html-weakness");
+      document.querySelector("html")?.classList.add("html-weakness");
     settings.tabsVal && tagsChange();
     settings.hideFooter && hideFooterChange();
   });
diff --git a/src/layout/hooks/useDataThemeChange.ts b/src/layout/hooks/useDataThemeChange.ts
index 8463aac85..80db6dd1a 100644
--- a/src/layout/hooks/useDataThemeChange.ts
+++ b/src/layout/hooks/useDataThemeChange.ts
@@ -45,7 +45,7 @@ export function useDataThemeChange() {
     const targetEl = target || document.body;
     let { className } = targetEl;
     className = className.replace(clsName, "").trim();
-    targetEl.className = flag ? `${className} ${clsName} ` : className;
+    targetEl.className = flag ? `${className} ${clsName}` : className;
   }
 
   /** 设置导航主题色 */