fixbug: html添加Theme

index.html

@@ -150,7 +150,15 @@
         <div></div>
       </div>
     </div>
-    <script></script>
+    <script>
+      window.onload = function () {
+        const stora = localStorage.getItem('appConfigMode');
+        if (stora) {
+          const appConfigMode = JSON.parse(stora);
+          document.body.style.background = appConfigMode.themeMode === 'dark' ? '#000' : '';
+        }
+      };
+    </script>
     <script type="module" src="/src/main.ts"></script>
   </body>
 </html>

src/components/Application/AppTheme.vue

@@ -7,20 +7,16 @@
 </template>
 
 <script setup lang="ts">
-  import { ref } from 'vue';
   import SvgIcon from '../SvgIcon/index.vue';
-
-  import { getAppCollapseMenu } from '@/hooks/userAppWindow';
   import { useColorMode } from '@vueuse/core';
+  import { useAppStoreHook } from '@/store/modules/app';
 
-  const { appConfigMode } = getAppCollapseMenu();
-  const isDark = ref<string>(appConfigMode.value.themeMode);
-  isDark.value = appConfigMode.value.themeMode;
-
+  const appStore = useAppStoreHook();
   const color = useColorMode();
   const toggleDarkMode = () => {
-    isDark.value = isDark.value === 'day' ? 'dark' : 'day';
     color.value = color.value === 'dark' ? 'light' : 'dark';
+    appStore.appConfigMode.themeMode = color.value;
+    appStore.setAppConfigMode(appStore.appConfigMode);
   };
 </script>
 

src/hooks/userAppWindow.ts

@@ -7,5 +7,5 @@ export const getAppCollapseMenu = () => {
   // const store = useStore()
   const appStore = useAppStoreHook();
   const appConfigMode = computed<appConfig>(() => appStore.getAppConfigMode);
-  return { appConfigMode };
+  return { appConfigMode, appStore };
 };

src/store/modules/app.ts

@@ -21,6 +21,7 @@ const useAppStore = defineStore({
   },
   actions: {
     setAppConfigMode(appConfigMode: appConfig): void {
+      console.log(appConfigMode);
       localStorage.setItem('appConfigMode', JSON.stringify(appConfigMode));
       this.appConfigMode = appConfigMode;
     },