feat(menu): 为页面添加标题和布局配置支持

patches/vite-plugin-vue-meta-layouts.patch

@@ -1,20 +0,0 @@
-diff --git a/client.d.ts b/client.d.ts
-index 05b92f32d1ba3df543d46fb1e93d53c6a5834583..81952e9cf3d4ebe5ca7c354e977354a120707fa8 100644
---- a/client.d.ts
-+++ b/client.d.ts
-@@ -2,12 +2,12 @@ declare module "virtual:meta-layouts" {
-   import type {
-     Router,
-     RouteRecordNormalized,
--    RouteRecordRaw,
-+    RouterOptions,
-   } from "vue-router";
- 
-   export const setupLayouts: (
--    routes: RouteRecordRaw[],
--  ) => RouteRecordRaw[];
-+    routes: RouterOptions['routes'],
-+  ) => RouterOptions['routes'];
- 
-   export const createGetRoutes: (
-     router: Router,

src/pages/demos/api-demo.page.vue

@@ -1,6 +1,12 @@
 <script setup lang="ts">
 import { ref } from 'vue';
 
+definePage({
+  meta: {
+    title: 'API 调用示例',
+  },
+});
+
 // ========== API 模块 ==========
 const apiResult = ref<string>('');
 const loading = ref(false);

src/pages/demos/counter-demo.page.vue

@@ -2,6 +2,12 @@
 import { ref } from 'vue';
 import { NButton } from 'naive-ui';
 
+definePage({
+  meta: {
+    title: '点击计数器',
+  },
+});
+
 // ========== 计数器模块 ==========
 const clickCount = ref(0);
 

src/pages/demos/index.page.vue

@@ -0,0 +1,4 @@
+<script setup lang="ts">
+definePage({ meta: { title: '示例演示' } });
+</script>
+<template>这个文件只是为了给菜单渲染标题</template>

src/pages/demos/websocket-demo.page.vue

@@ -1,6 +1,12 @@
 <script setup lang="ts">
 import { ref, onUnmounted, computed, nextTick } from 'vue';
 
+definePage({
+  meta: {
+    title: 'WebSocket 示例',
+  },
+});
+
 // ========== WebSocket 模块 ==========
 const ws = ref<WebSocket | null>(null);
 const wsConnected = ref(false);

src/pages/page/deep/deep.page.vue

@@ -1,5 +0,0 @@
-<script setup lang="ts"></script>
-
-<template>
-  <div>deep</div>
-</template>

src/pages/page/deep/deep2.page.vue

@@ -1,5 +0,0 @@
-<script setup lang="ts"></script>
-
-<template>
-  <div>deep2</div>
-</template>

src/pages/page/demo-api.page.vue

@@ -1,5 +0,0 @@
-<script setup lang="ts"></script>
-
-<template>
-  <div>Demo-API-Page</div>
-</template>

src/pages/page/demo-icons.page.vue

@@ -1,5 +0,0 @@
-<script setup lang="ts"></script>
-
-<template>
-  <div>Demo-Icons-Page</div>
-</template>

src/plugins/router-plugin.ts

@@ -52,6 +52,11 @@ declare module 'vue-router' {
      * @description 菜单标题
      */
     title?: string;
+
+    /**
+     * @description 使用的布局，设置为 false 则表示不使用布局
+     */
+    layout?: string | false;
   }
 }
 

typed-router.d.ts

@@ -37,6 +37,13 @@ declare module 'vue-router/auto-routes' {
       { path: ParamValue<false> },
       | never
     >,
+    'Demos': RouteRecordInfo<
+      'Demos',
+      '/demos',
+      Record<never, never>,
+      Record<never, never>,
+      | never
+    >,
     'DemosApiDemo': RouteRecordInfo<
       'DemosApiDemo',
       '/demos/api-demo',
@@ -65,34 +72,6 @@ declare module 'vue-router/auto-routes' {
       Record<never, never>,
       | never
     >,
-    'PageDeepDeep': RouteRecordInfo<
-      'PageDeepDeep',
-      '/page/deep/deep',
-      Record<never, never>,
-      Record<never, never>,
-      | never
-    >,
-    'PageDeepDeep2': RouteRecordInfo<
-      'PageDeepDeep2',
-      '/page/deep/deep2',
-      Record<never, never>,
-      Record<never, never>,
-      | never
-    >,
-    'PageDemoApi': RouteRecordInfo<
-      'PageDemoApi',
-      '/page/demo-api',
-      Record<never, never>,
-      Record<never, never>,
-      | never
-    >,
-    'PageDemoIcons': RouteRecordInfo<
-      'PageDemoIcons',
-      '/page/demo-icons',
-      Record<never, never>,
-      Record<never, never>,
-      | never
-    >,
   }
 
   /**
@@ -118,6 +97,12 @@ declare module 'vue-router/auto-routes' {
       views:
         | never
     }
+    'src/pages/demos/index.page.vue': {
+      routes:
+        | 'Demos'
+      views:
+        | never
+    }
     'src/pages/demos/api-demo.page.vue': {
       routes:
         | 'DemosApiDemo'
@@ -142,30 +127,6 @@ declare module 'vue-router/auto-routes' {
       views:
         | never
     }
-    'src/pages/page/deep/deep.page.vue': {
-      routes:
-        | 'PageDeepDeep'
-      views:
-        | never
-    }
-    'src/pages/page/deep/deep2.page.vue': {
-      routes:
-        | 'PageDeepDeep2'
-      views:
-        | never
-    }
-    'src/pages/page/demo-api.page.vue': {
-      routes:
-        | 'PageDemoApi'
-      views:
-        | never
-    }
-    'src/pages/page/demo-icons.page.vue': {
-      routes:
-        | 'PageDemoIcons'
-      views:
-        | never
-    }
   }
 
   /**