feat: 重构 AppMenu 组件以动态生成菜单项，更新路由和样式，添加返回按钮

src/layouts/sakai-vue/AppMenu.vue

@@ -1,7 +1,33 @@
-<script setup lang="ts"></script>
+<script setup lang="ts">
+import type { MenuProps } from 'primevue/menu';
+import type { MenuItem } from 'primevue/menuitem';
+import type { RouteRecordRaw } from 'vue-router/auto';
+import { routes } from 'vue-router/auto-routes';
+
+// 递归处理路由生成菜单项
+const generateMenuItems = (routes: RouteRecordRaw[]): MenuProps['model'] => {
+  return routes.map((route, index) => {
+    const menuItem: MenuItem = {
+      label: `${index + 1}. ${(route.name as string) || route.path}`,
+      icon: (route.meta?.icon as string) || 'pi pi-fw pi-home',
+      url: route.path,
+      _route: route,
+    };
+
+    if (route.children && route.children.length > 0) {
+      menuItem.items = generateMenuItems(route.children);
+    }
+    return menuItem;
+  });
+};
+
+const cmptItems = computed<MenuProps['model']>(() => {
+  return generateMenuItems(routes);
+});
+</script>
 
 <template>
-  <div class="border border-gray-300 rounded-lg min-h-full" flex items-center justify-center>AppMenu.vue</div>
+  <Menu :model="cmptItems" />
 </template>
 
 <style lang="scss" scoped></style>

src/pages/[...path].page.vue

@@ -1,7 +1,8 @@
 <template>
-  <main flex-1 class="flex flex-col items-center justify-center h-full">
+  <main flex-1 class="flex flex-col items-center justify-center h-full space-y-4">
     <h1>Not Found</h1>
     <p>{{ path }} does not exist.</p>
+    <Button @click="$router.back()">Back</Button>
   </main>
 </template>
 <script lang="ts" setup>

src/pages/index.page.vue

@@ -1,10 +1,12 @@
 <script setup lang="ts">
 const VITE_BUILD_COMMIT = import.meta.env.VITE_BUILD_COMMIT;
+import { routes } from 'vue-router/auto-routes';
 </script>
 
 <template>
   <div>
     <div>index.page.vue</div>
     <div rounded-4 px-4 py-2 bg-black text-white>commit: {{ VITE_BUILD_COMMIT }}</div>
+    <pre>{{ routes }}</pre>
   </div>
 </template>

src/plugins/router.ts

@@ -1,13 +1,19 @@
 import { DataLoaderPlugin } from 'unplugin-vue-router/data-loaders';
-import { setupLayouts } from 'virtual:generated-layouts';
+import { setupLayouts, createGetRoutes } from 'virtual:generated-layouts';
 import { createRouter, createWebHistory } from 'vue-router/auto';
 import { handleHotUpdate, routes } from 'vue-router/auto-routes';
 
 const router = createRouter({
   history: createWebHistory(import.meta.env.BASE_URL),
-  routes: setupLayouts(routes),
+  routes: /* routes ?? */ setupLayouts(routes),
   strict: true,
-  scrollBehavior: () => ({ left: 0, top: 0 }),
+  scrollBehavior: (_to, _from, savedPosition) => {
+    if (savedPosition) {
+      return savedPosition;
+    } else {
+      return { left: 0, top: 0 };
+    }
+  },
 });
 if (import.meta.hot) handleHotUpdate(router);
 if ($__DEV__) Object.assign(window, { router });
@@ -22,6 +28,14 @@ export function install({ app }: { app: import('vue').App<Element> }) {
     .use(DataLoaderPlugin, { router })
     // adding the router will trigger the initial navigation
     .use(router);
+  if ('2' === ('1' as never)) {
+    const getRoutes = createGetRoutes(router);
+    const setupLayoutsResult = setupLayouts(routes);
+
+    console.debug(`routes :>> `, routes);
+    console.debug(`getRoutes() :>> `, getRoutes()); // 获取路由表但是不包含布局路由
+    console.debug(`setupLayoutsResult :>> `, setupLayoutsResult);
+  }
 }
 // ========================================================================
 // =========================== Router Guards ==============================

typed-router.d.ts

@@ -21,6 +21,8 @@ declare module 'vue-router/auto-routes' {
     'Root': RouteRecordInfo<'Root', '/', Record<never, never>, Record<never, never>>,
     '$Path': RouteRecordInfo<'$Path', '/:path(.*)', { path: ParamValue<true> }, { path: ParamValue<false> }>,
     '中文页面': RouteRecordInfo<'中文页面', '/中文-页面', Record<never, never>, Record<never, never>>,
+    'A': RouteRecordInfo<'A', '/a', Record<never, never>, Record<never, never>>,
+    'AA': RouteRecordInfo<'AA', '/a/a', Record<never, never>, Record<never, never>>,
     'Api': RouteRecordInfo<'Api', '/api', Record<never, never>, Record<never, never>>,
     'DataLoadersId': RouteRecordInfo<'DataLoadersId', '/data-loaders/:id', { id: ParamValue<true> }, { id: ParamValue<false> }>,
     'DataLoadersIdSub1UserId': RouteRecordInfo<'DataLoadersIdSub1UserId', '/data-loaders/:id/sub-1/:userId', { id: ParamValue<true>, userId: ParamValue<true> }, { id: ParamValue<false>, userId: ParamValue<false> }>,