diff --git a/src/components/Application/src/AppDarkModeToggle.vue b/src/components/Application/src/AppDarkModeToggle.vue
index 5c8c5d8a..2e650f03 100644
--- a/src/components/Application/src/AppDarkModeToggle.vue
+++ b/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)
diff --git a/src/layouts/default/setting/SettingDrawer.tsx b/src/layouts/default/setting/SettingDrawer.tsx
index 5b6f7365..64e2067a 100644
--- a/src/layouts/default/setting/SettingDrawer.tsx
+++ b/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) && <AppDarkModeToggle class="mx-auto" />} */}
-        <Divider>{() => t('layout.setting.sysTheme')}</Divider>
-        {/* {renderMainTheme()}
-        <Divider>{() => t('layout.setting.headerTheme')}</Divider>
+        {unref(getShowDarkModeToggle) && <Divider>{() => t('layout.setting.sysTheme')}</Divider>}
+        {/* {unref(getShowDarkModeToggle) && <AppDarkModeToggle class="mx-auto" />} */}
+        {/* <Divider>{() => t('layout.setting.sysTheme')}</Divider> */}
+        {renderMainTheme()}
+        {/* <Divider>{() => t('layout.setting.headerTheme')}</Divider>
         {renderHeaderTheme()}
         <Divider>{() => t('layout.setting.sidebarTheme')}</Divider>
         {renderSiderTheme()}