fix(projects): 修复没有子页面的路由写法问题

src/interface/common.ts

@@ -15,6 +15,8 @@ interface RouteMeta {
   isNotMenu?: boolean;
   /** 菜单和面包屑对应的图标 */
   icon?: Component;
+  /** 路由作为菜单时的排序 */
+  order?: number;
 }
 
 export type CustomRoute = RouteRecordRaw & { meta: RouteMeta };

src/router/helpers/index.ts

@@ -1,5 +1,7 @@
 import type { Component } from 'vue';
 import { getRouteNameMap } from '@/utils';
+import { BasicLayout, BlankLayout } from '@/layouts';
+import type { CustomRoute } from '@/interface';
 import getCacheRoutes from './cache';
 import transformRouteToMenu from './menus';
 
@@ -13,4 +15,26 @@ export function setCacheName(component: Component, name?: string) {
 /** 路由name map */
 export const RouteNameMap = getRouteNameMap();
 
+function getSingleRoute(route: CustomRoute, container: Component) {
+  const routeItem: CustomRoute = {
+    name: `${route.name as string}_`,
+    path: `${route.path}_`,
+    component: container,
+    redirect: { name: route.name },
+    meta: {
+      isNotMenu: true
+    },
+    children: [route]
+  };
+
+  return routeItem;
+}
+
+export function getSingleBasicLayoutRoute(route: CustomRoute) {
+  return getSingleRoute(route, BasicLayout);
+}
+export function getSingleBlankLayoutRoute(route: CustomRoute) {
+  return getSingleRoute(route, BlankLayout);
+}
+
 export { getCacheRoutes, transformRouteToMenu };

src/router/helpers/menus.ts

@@ -22,24 +22,26 @@ function addPartialProps(menuItem: GlobalMenuOption, icon?: Component, children?
 export default function transformRouteToMenu(routes: CustomRoute[]) {
   const globalMenu: GlobalMenuOption[] = [];
   routes.forEach(route => {
+    const { name, path, meta } = route;
+    const routeName = name as string;
+    let menuChildren: GlobalMenuOption[] | undefined;
+    if (route.children) {
+      menuChildren = transformRouteToMenu(route.children as CustomRoute[]);
+    }
+    const menuItem: GlobalMenuOption = addPartialProps(
+      {
+        key: routeName,
+        label: meta?.title ?? routeName,
+        routeName,
+        routePath: path
+      },
+      meta?.icon,
+      menuChildren
+    );
     if (asMenu(route)) {
-      const { name, path, meta } = route;
-      const routeName = name as string;
-      let menuChildren: GlobalMenuOption[] | undefined;
-      if (route.children) {
-        menuChildren = transformRouteToMenu(route.children as CustomRoute[]);
-      }
-      const menuItem: GlobalMenuOption = addPartialProps(
-        {
-          key: routeName,
-          label: meta?.title ?? routeName,
-          routeName,
-          routePath: path
-        },
-        meta?.icon,
-        menuChildren
-      );
       globalMenu.push(menuItem);
+    } else if (menuChildren) {
+      globalMenu.push(...menuChildren);
     }
   });
   return globalMenu;

src/router/modules/_single.ts

@@ -1,19 +0,0 @@
-import type { CustomRoute } from '@/interface';
-import { EnumRoutePath } from '@/enum';
-import { BasicLayout } from '@/layouts';
-import { RouteNameMap } from '../helpers';
-import { ROUTE_HOME } from '../routes';
-import ABOUT from './about';
-
-const SINGLE: CustomRoute = {
-  name: RouteNameMap.get('root'),
-  path: EnumRoutePath.root,
-  component: BasicLayout,
-  redirect: { name: ROUTE_HOME.name },
-  meta: {
-    isNotMenu: true
-  },
-  children: [ABOUT]
-};
-
-export default SINGLE;

src/router/modules/about.ts

@@ -1,10 +1,10 @@
 import { BookInformation24Regular } from '@vicons/fluent';
 import type { CustomRoute } from '@/interface';
 import { EnumRoutePath, EnumRouteTitle } from '@/enum';
-import { RouteNameMap } from '../helpers';
+import { RouteNameMap, getSingleBasicLayoutRoute } from '../helpers';
 import { About } from '../components';
 
-const ABOUT: CustomRoute = {
+const ABOUT: CustomRoute = getSingleBasicLayoutRoute({
   name: RouteNameMap.get('about'),
   path: EnumRoutePath.about,
   component: About,
@@ -13,6 +13,5 @@ const ABOUT: CustomRoute = {
     title: EnumRouteTitle.about,
     icon: BookInformation24Regular
   }
-};
-
+});
 export default ABOUT;

src/router/modules/index.ts

@@ -1,4 +1,4 @@
-import SIGNLE from './_single'; // 没有子菜单的单独页面
+import ROOT from './root'; // 没有子菜单的单独页面
 import DASHBOARD from './dashboard';
 import DOCUMENT from './document';
 import COMPONENT from './component';
@@ -6,4 +6,4 @@ import EXCEPTION from './exception';
 import MULTI_MENU from './multiMenu';
 import ABOUT from './about';
 
-export default [SIGNLE, DASHBOARD, DOCUMENT, COMPONENT, EXCEPTION, MULTI_MENU, ABOUT];
+export default [ROOT, DASHBOARD, DOCUMENT, COMPONENT, EXCEPTION, MULTI_MENU, ABOUT];

src/router/modules/root.ts

@@ -1,13 +1,11 @@
 import type { CustomRoute } from '@/interface';
 import { EnumRoutePath } from '@/enum';
-import { BasicLayout } from '@/layouts';
 import { RouteNameMap } from '../helpers';
 import { ROUTE_HOME } from '../routes';
 
 const ROOT: CustomRoute = {
   name: RouteNameMap.get('root'),
   path: EnumRoutePath.root,
-  component: BasicLayout,
   redirect: { name: ROUTE_HOME.name },
   meta: {
     isNotMenu: true

src/utils/router/index.ts

@@ -15,6 +15,7 @@ export function setRouterCacheName(component: Component, name?: string) {
   }
 }
 
+// 获取登录后的重定向地址
 export function getLoginRedirectUrl() {
   const path = router.currentRoute.value.fullPath as EnumRoutePath;
   const redirectUrl = path === EnumRoutePath.root ? undefined : path;