feat(projects): 增加静态路由

src/router/modules/dashboard.ts

@@ -1,12 +1,9 @@
-import { RouteRecordRaw } from 'vue-router';
+export const dashboard = {
-import { BasicLayout } from '@/layouts/index';
-export const dashboard: RouteRecordRaw = {
-  path: '/dashboard',
   name: 'dashboard',
+  path: '/dashboard',
   redirect: '/dashboard/workbench',
-  component: BasicLayout,
   meta: {
-    title: '分析页',
+    title: '分析页-static',
     requiresAuth: true,
     icon: 'icon-park-outline:analysis',
   },
@@ -14,7 +11,6 @@ export const dashboard: RouteRecordRaw = {
     {
       name: 'dashboard_workbench',
       path: '/dashboard/workbench',
-      component: () => import('@/views/dashboard/workbench/index.vue'),
       meta: {
         title: '工作台',
         requiresAuth: true,
@@ -24,7 +20,6 @@ export const dashboard: RouteRecordRaw = {
     {
       name: 'dashboard_monitor',
       path: '/dashboard/monitor',
-      component: () => import('@/views/dashboard/monitor/index.vue'),
       meta: {
         title: '监控页',
         requiresAuth: true,

src/router/modules/index.ts

@@ -1,3 +1,4 @@
 import { dashboard } from './dashboard';
+import { test } from './test';
 
-export const staticRoutes = [dashboard];
+export const staticRoutes = [dashboard, test];

src/router/modules/test.ts

@@ -0,0 +1,63 @@
+export const test = {
+  name: 'test',
+  path: '/test',
+  redirect: '/test/test1',
+  meta: {
+    title: '测试专题',
+    requiresAuth: true,
+    icon: 'icon-park-outline:ambulance',
+  },
+  children: [
+    {
+      name: 'test1',
+      path: '/test/test1',
+      meta: {
+        title: '测试专题1',
+        requiresAuth: true,
+        icon: 'icon-park-outline:alarm',
+      },
+    },
+    {
+      name: 'test2',
+      path: '/test/test2',
+      meta: {
+        title: '测试专题2',
+        requiresAuth: true,
+        icon: 'icon-park-outline:pic',
+      },
+      children: [
+        {
+          name: 'test2_detail',
+          path: '/test/test2/detail',
+          meta: {
+            title: '测试专题2的详情页',
+            requiresAuth: true,
+            icon: 'icon-park-outline:tool',
+            hide: true,
+            activeMenu: '/test/test2',
+          },
+        },
+      ],
+    },
+    {
+      name: 'test3',
+      path: '/test/test3',
+      meta: {
+        title: '测试专题3',
+        requiresAuth: true,
+        icon: 'icon-park-outline:tool',
+      },
+      children: [
+        {
+          name: 'test4',
+          path: '/test/test3/test4',
+          meta: {
+            title: '测试专题4',
+            requiresAuth: true,
+            icon: 'icon-park-outline:tool',
+          },
+        },
+      ],
+    },
+  ],
+};

src/store/modules/route.ts

@@ -88,11 +88,12 @@ export const useRouteStore = defineStore('route-store', {
     },
     /* 初始化静态路由 */
     async initStaticRoute() {
-      /* 将静态路由转换为侧边菜单 */
+      // 根据静态路由表来生成真实路由
-      staticRoutes.forEach((route) => {
+      const appRoutes = await createDynamicRoutes(staticRoutes);
-        // 插入路由表
+      // 更具返回的生成侧边菜单
-        router.addRoute(route);
+      await this.createMenus(staticRoutes);
-      });
+      // 插入路由表
+      router.addRoute(appRoutes);
     },
     //* 将返回的路由表渲染成侧边栏 */
     transformAuthRoutesToMenus(userRoutes: AppRoute.Route[]): MenuOption[] {