fix(projects): 完善侧边菜单展开逻辑

src/layouts/BasicLayout/components/GlobalSider/components/DefaultSider/index.vue

@@ -18,7 +18,9 @@
           :collapsed-width="theme.menuStyle.collapsedWidth"
           :collapsed-icon-size="22"
           :options="menus"
+          :expanded-keys="expandedKeys"
           @update:value="handleUpdateMenu"
+          @update:expanded-keys="handleUpdateExpandedKeys"
         />
       </n-scrollbar>
     </div>
@@ -26,7 +28,7 @@
 </template>
 
 <script lang="ts" setup>
-import { computed } from 'vue';
+import { computed, ref, watch } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
 import { NLayoutSider, NScrollbar, NMenu } from 'naive-ui';
 import type { MenuOption } from 'naive-ui';
@@ -60,15 +62,33 @@ const menuWidth = computed(() => {
   return collapsed ? collapsedWidth : modeWidth;
 });
 
-const activeKey = computed(() => getActiveKey());
+const activeKey = computed(() => route.name as string);
+const expandedKeys = ref<string[]>(getExpendedKeys());
 
-function getActiveKey() {
-  return route.name as string;
+function getExpendedKeys() {
+  const keys: string[] = [];
+  route.matched.forEach(item => {
+    if (item.children && item.children.length) {
+      keys.push(item.name as string);
+    }
+  });
+  return keys;
 }
 
 function handleUpdateMenu(key: string, item: MenuOption) {
   const menuItem = item as GlobalMenuOption;
   router.push(menuItem.routePath);
 }
+
+function handleUpdateExpandedKeys(keys: string[]) {
+  expandedKeys.value = keys;
+}
+
+watch(
+  () => route.name,
+  () => {
+    expandedKeys.value = getExpendedKeys();
+  }
+);
 </script>
 <style scoped></style>

src/layouts/BasicLayout/components/SettingDrawer/components/ThemeConfig/index.vue

@@ -0,0 +1,27 @@
+<template>
+  <n-divider title-placement="center">主题配置</n-divider>
+  <n-space vertical>
+    <n-button ref="copyRef" type="primary" :block="true">拷贝当前配置</n-button>
+    <n-button ref="resetRef" type="warning" :block="true">重置当前配置</n-button>
+  </n-space>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+import { NDivider, NSpace, NButton } from 'naive-ui';
+// import Clipboard from 'clipboard';
+// import { useThemeStore } from '@/store';
+
+// const theme = useThemeStore();
+const copyRef = ref<HTMLElement | null>(null);
+const resetRef = ref<HTMLElement | null>(null);
+
+// function handleSuccess() {
+//   window.$dialog?.success({
+//     title: '操作成功',
+//     content: '复制成功,请替换 src/settings/theme.json的内容！',
+//     positiveText: '确定'
+//   });
+// }
+</script>
+<style scoped></style>

src/layouts/BasicLayout/components/SettingDrawer/components/index.ts

@@ -3,5 +3,6 @@ import NavMode from './NavMode/index.vue';
 import SystemTheme from './SystemTheme/index.vue';
 import PageFunc from './PageFunc/index.vue';
 import PageView from './PageView/index.vue';
+import ThemeConfig from './ThemeConfig/index.vue';
 
-export { DarkMode, NavMode, SystemTheme, PageFunc, PageView };
+export { DarkMode, NavMode, SystemTheme, PageFunc, PageView, ThemeConfig };