框架重构

src/components/Application/src/AppDarkModeToggle.vue

@@ -1,3 +1,8 @@
+<!--
+ * @Desc: 
+ * @Author: lijj
+ * @Date: 2024-05-13 09:06:51
+-->
 <template>
   <div v-if="getShowDarkModeToggle" :class="getClass" @click="toggleDarkMode">
     <div :class="`${prefixCls}-inner`"></div>
@@ -27,6 +32,7 @@
   ])
 
   function toggleDarkMode() {
+    console.log(getDarkMode)
     const darkMode = getDarkMode.value === ThemeEnum.DARK ? ThemeEnum.LIGHT : ThemeEnum.DARK
     setDarkMode(darkMode)
     updateDarkTheme(darkMode)

src/layouts/default/setting/SettingDrawer.tsx

@@ -378,11 +378,11 @@ export default defineComponent({
         width={330}
         class="setting-drawer"
       >
-        {/* {unref(getShowDarkModeToggle) && <Divider>{() => t('layout.setting.darkMode')}</Divider>}
+        {unref(getShowDarkModeToggle) && <Divider>{() => t('layout.setting.sysTheme')}</Divider>}
-        {unref(getShowDarkModeToggle) && <AppDarkModeToggle class="mx-auto" />} */}
+        {/* {unref(getShowDarkModeToggle) && <AppDarkModeToggle class="mx-auto" />} */}
-        <Divider>{() => t('layout.setting.sysTheme')}</Divider>
+        {/* <Divider>{() => t('layout.setting.sysTheme')}</Divider> */}
-        {/* {renderMainTheme()}
+        {renderMainTheme()}
-        <Divider>{() => t('layout.setting.headerTheme')}</Divider>
+        {/* <Divider>{() => t('layout.setting.headerTheme')}</Divider>
         {renderHeaderTheme()}
         <Divider>{() => t('layout.setting.sidebarTheme')}</Divider>
         {renderSiderTheme()}