feat: refactor sidebar management and routing metadata

src/layouts/base-layout/base-layout-header.vue

@@ -1,12 +1,12 @@
 <script setup lang="ts">
-const collapsed = defineModel<boolean>('collapsed');
 const buttonRef = useTemplateRef('buttonRef');
 const appStore = useAppStore();
+
 function toggleCollapsed() {
   // https://github.com/tusen-ai/naive-ui/issues/3688
   // hover style 鼠标移出就会消失 如果是点击 button 会聚焦需要失去焦点才会恢复
   buttonRef.value?.$el.blur();
-  collapsed.value = !collapsed.value;
+  appStore.toggleSidebar();
 }
 
 const themeLabels: Record<AppThemeMode, string> = {
@@ -19,10 +19,10 @@ const themeLabels: Record<AppThemeMode, string> = {
 <template>
   <div class="h-full flex items-center justify-between px-12px shadow-header dark:shadow-gray-700">
     <NTooltip :disabled="appStore.isMobile" placement="bottom-start">
-      {{ collapsed ? '展开菜单' : '收起菜单' }}
+      {{ appStore.sidebarCollapsed ? '展开菜单' : '收起菜单' }}
       <template #trigger>
         <NButton ref="buttonRef" quaternary @click="toggleCollapsed">
-          <icon-line-md:menu-fold-right v-if="collapsed" w-4.5 h-4.5 />
+          <icon-line-md:menu-fold-right v-if="appStore.sidebarCollapsed" w-4.5 h-4.5 />
           <icon-line-md:menu-fold-left v-else w-4.5 h-4.5 />
         </NButton>
       </template>