fix Bug or add docs

src/layout/components/Footer/index.vue

@@ -23,7 +23,7 @@
 
 <style lang="less" scoped>
   .page-footer {
-    margin: 48px 0 24px 0;
+    //margin: 28px 0 24px 0;
     padding: 0 16px;
     text-align: center;
 

src/layout/components/Header/ProjectSetting.vue

@@ -7,7 +7,18 @@
         <div class="drawer-setting-item justify-center dark-switch">
           <n-tooltip placement="bottom">
             <template #trigger>
-              <n-switch v-model:value="designStore.darkTheme" />
+              <n-switch v-model:value="designStore.darkTheme" class="dark-theme-switch">
+                <template #checked>
+                  <n-icon size="14" color="#ffd93b">
+                    <SunnySharp />
+                  </n-icon>
+                </template>
+                <template #unchecked>
+                  <n-icon size="14" color="#ffd93b">
+                    <Moon />
+                  </n-icon>
+                </template>
+              </n-switch>
             </template>
             <span>深色主题</span>
           </n-tooltip>
@@ -146,13 +157,13 @@
             <n-switch v-model:value="settingStore.multiTabsSetting.show" />
           </div>
         </div>
-
-        <div class="drawer-setting-item">
-          <div class="drawer-setting-item-title"> 显示页脚 </div>
-          <div class="drawer-setting-item-action">
-            <n-switch v-model:value="settingStore.showFooter" />
-          </div>
-        </div>
+        <!--1.15废弃，没啥用，占用操作空间-->
+        <!--        <div class="drawer-setting-item">-->
+        <!--          <div class="drawer-setting-item-title"> 显示页脚 </div>-->
+        <!--          <div class="drawer-setting-item-action">-->
+        <!--            <n-switch v-model:value="settingStore.showFooter" />-->
+        <!--          </div>-->
+        <!--        </div>-->
 
         <div class="drawer-setting-item">
           <n-alert type="warning" :showIcon="false">
@@ -169,11 +180,12 @@
   import { useProjectSettingStore } from '@/store/modules/projectSetting';
   import { useDesignSettingStore } from '@/store/modules/designSetting';
   import { CheckOutlined } from '@vicons/antd';
+  import { Moon, SunnySharp } from '@vicons/ionicons5';
   import { darkTheme } from 'naive-ui';
 
   export default defineComponent({
     name: 'ProjectSetting',
-    components: { CheckOutlined },
+    components: { CheckOutlined, Moon, SunnySharp },
     props: {
       title: {
         type: String,
@@ -300,8 +312,7 @@
     .justify-center {
       justify-content: center;
     }
-
-    .dark-switch .n-switch--active {
+    .dark-switch .n-switch {
       ::v-deep(.n-switch__rail) {
         background-color: #000e1c;
       }

src/layout/components/Header/index.vue

@@ -86,7 +86,7 @@
       <div class="layout-header-trigger layout-header-trigger-min">
         <n-dropdown trigger="hover" @select="avatarSelect" :options="avatarOptions">
           <div class="avatar">
-            <n-avatar>
+            <n-avatar round>
               {{ username }}
               <template #icon>
                 <UserOutlined />

src/layout/components/Menu/index.vue

@@ -6,6 +6,7 @@
     :collapsed="collapsed"
     :collapsed-width="64"
     :collapsed-icon-size="20"
+    :indent="28"
     :expanded-keys="openKeys"
     v-model:value="selectedKeys"
     @update:value="clickMenuItem"
@@ -14,7 +15,7 @@
 </template>
 
 <script lang="ts">
-  import { defineComponent, reactive, computed, watch, toRefs } from 'vue';
+  import { defineComponent, reactive, computed, watch, toRefs, unref } from 'vue';
   import { useRoute, useRouter } from 'vue-router';
   import { useAsyncRouteStore } from '@/store/modules/asyncRoute';
   import { generatorMenu } from '@/utils/index';
@@ -44,7 +45,7 @@
       // 获取当前打开的子菜单
       const matched = currentRoute.matched;
 
-      const getOpenKeys = matched && matched.length ? [matched[0]?.name] : [];
+      const getOpenKeys = matched && matched.length ? matched.map((item) => item.name) : [];
 
       const state = reactive({
         openKeys: getOpenKeys,
@@ -73,8 +74,7 @@
         () => currentRoute.fullPath,
         () => {
           const matched = currentRoute.matched;
-          const getOpenKeys = matched && matched.length ? [matched[0]?.name] : [];
-          state.openKeys = getOpenKeys;
+          state.openKeys = matched.map((item) => item.name);
           state.selectedKeys = currentRoute.name;
         }
       );
@@ -90,10 +90,22 @@
 
       //展开菜单
       function menuExpanded(openKeys: string[]) {
-        console.log(openKeys);
         if (!openKeys) return;
-        const latestOpenKey = openKeys.pop();
-        state.openKeys = latestOpenKey ? [latestOpenKey] : [];
+        const latestOpenKey = openKeys.find((key) => state.openKeys.indexOf(key) === -1);
+        const isExistChildren = findChildrenLen(latestOpenKey as string);
+        state.openKeys = isExistChildren ? (latestOpenKey ? [latestOpenKey] : []) : openKeys;
+      }
+
+      //查找是否存在子路由
+      function findChildrenLen(key: string) {
+        if (!key) return false;
+        const subRouteChildren: string[] = [];
+        for (const { children, key } of unref(menus)) {
+          if (children && children.length > 0) {
+            subRouteChildren.push(key as string);
+          }
+        }
+        return subRouteChildren.includes(key);
       }
 
       return {