full-routes.ts 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121
  1. /**
  2. * 1. 前端维护的完整路由表, 用于创建"菜单"
  3. * 2. component 是 string,并不是 组件对象。
  4. * 3. 生成菜单,关注的 path,name,component,icon。
  5. * 4. 部分路由组件是菜单不可见的,当访问该路由时,左侧菜单的menu item会失去active状态。需要设置 meta.activeMenu 保持选中状态。
  6. */
  7. import { AppRouteRecordRaw } from './types';
  8. import { getTreeItem } from '@/utils';
  9. import { cloneDeep } from 'lodash-es';
  10. import { PageEnum } from '@/enums/pageEnum';
  11. import {
  12. disasterPreventionRoute,
  13. emergencyManagementRoute,
  14. platformRoutes,
  15. largeScreenRoutes,
  16. trafficRoutes,
  17. securityConfidentialityRoutes,
  18. campusRoutes,
  19. } from './routers';
  20. export type RouteRecordString = Omit<AppRouteRecordRaw, 'component'> & { component?: string };
  21. export const RootRoute: RouteRecordString = {
  22. path: '/',
  23. name: 'Root',
  24. redirect: PageEnum.BASE_HOME,
  25. meta: {
  26. title: 'Root',
  27. },
  28. };
  29. export const HOME_PAGE: RouteRecordString = {
  30. // 模板管理
  31. path: '/home',
  32. name: 'HomePage',
  33. component: '/home/PageHome',
  34. meta: {
  35. icon: '',
  36. title: '首页',
  37. },
  38. };
  39. export const fullRoutes: AppRouteRecordRaw[] = [
  40. disasterPreventionRoute,
  41. emergencyManagementRoute,
  42. platformRoutes,
  43. largeScreenRoutes,
  44. trafficRoutes,
  45. securityConfidentialityRoutes,
  46. campusRoutes,
  47. ] as const;
  48. /**
  49. * 类型定义。避免与已有的定义冲突,避免与 vue-router的类型定义冲突,前面加 _ 前缀
  50. */
  51. export interface _RouteViewItem {
  52. label: string;
  53. value: string;
  54. }
  55. export type _RouteView = _RouteViewItem & { children?: _RouteViewItem[] | null };
  56. export type _RouteViewTree = _RouteView[];
  57. /**
  58. * 获取指定 父路由 下的子路由。
  59. * 若 父级路由 未指定,则返回一级路由
  60. */
  61. export function getChildRoutesView(parentRouteName?: string | null): _RouteViewItem[] {
  62. // 未指定 parentRouteName, 则返回 level1 的路由
  63. if (parentRouteName == null) {
  64. return fullRoutes.map((route) => ({
  65. label: route.meta?.title as string,
  66. value: route.name,
  67. }));
  68. }
  69. // 获取指定父路由的子路由
  70. const parentRoute: AppRouteRecordRaw = cloneDeep(getTreeItem(fullRoutes, parentRouteName, 'name'));
  71. if (parentRoute.children && parentRoute.children.length > 0) {
  72. return parentRoute.children.map((route) => ({
  73. label: route.meta?.title as string,
  74. value: route.name,
  75. }));
  76. } else {
  77. return [];
  78. }
  79. }
  80. /**
  81. * 获取指定的 路由信息
  82. */
  83. export function getRouteByName(routeName: string) {
  84. return cloneDeep(getTreeItem(fullRoutes, routeName, 'name')) as AppRouteRecordRaw;
  85. }
  86. /**
  87. * 转换成 el-tree-select 的数据结构形式
  88. */
  89. export function transformToRouteViewTree(routes?: AppRouteRecordRaw[] | null) {
  90. const tree: _RouteViewTree = [];
  91. if (routes == null) return tree;
  92. for (const route of routes) {
  93. const treeItem: _RouteView = {
  94. value: route.name,
  95. label: route.meta.title as string,
  96. children: null,
  97. };
  98. if (route.children && route.children.length > 0) {
  99. treeItem.children = transformToRouteViewTree(route.children);
  100. tree.push(treeItem);
  101. } else {
  102. tree.push(treeItem);
  103. }
  104. }
  105. return tree;
  106. }
  107. export const routeViewTree = transformToRouteViewTree(fullRoutes);