index.ts 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111
  1. import { createRouter, createWebHashHistory, RouterView, type RouteRecordRaw } from 'vue-router'
  2. import { MenuEnum } from '@/enums/appEnums'
  3. import { isExternal } from '@/utils/validate'
  4. import { constantRoutes, INDEX_ROUTE_NAME, LAYOUT } from './routes'
  5. import useUserStore from '@/stores/modules/user'
  6. // 匹配views里面所有的.vue文件,动态引入
  7. const modules = import.meta.glob('/src/views/**/*.vue')
  8. //
  9. export function getModulesKey() {
  10. return Object.keys(modules).map((item) => item.replace('/src/views/', '').replace('.vue', ''))
  11. }
  12. // 过滤路由所需要的数据
  13. export function filterAsyncRoutes(routes: any[], firstRoute = true) {
  14. return routes.map((route) => {
  15. const routeRecord = createRouteRecord(route, firstRoute)
  16. if (route.children != null && route.children && route.children.length) {
  17. routeRecord.children = filterAsyncRoutes(route.children, false)
  18. }
  19. return routeRecord
  20. })
  21. }
  22. // 创建一条路由记录
  23. export function createRouteRecord(route: any, firstRoute: boolean): RouteRecordRaw {
  24. //@ts-ignore
  25. const routeRecord: RouteRecordRaw = {
  26. path: isExternal(route.paths) ? route.paths : firstRoute ? `/${route.paths}` : route.paths,
  27. name: Symbol(route.paths),
  28. meta: {
  29. hidden: !route.isShow,
  30. keepAlive: !!route.isCache,
  31. title: route.menuName,
  32. perms: route.perms,
  33. query: route.params,
  34. icon: route.menuIcon,
  35. type: route.menuType,
  36. activeMenu: route.selected
  37. }
  38. }
  39. switch (route.menuType) {
  40. case MenuEnum.CATALOGUE:
  41. routeRecord.component = firstRoute ? LAYOUT : RouterView
  42. if (!route.children) {
  43. routeRecord.component = RouterView
  44. }
  45. break
  46. case MenuEnum.MENU:
  47. routeRecord.component = loadRouteView(route.component)
  48. break
  49. }
  50. return routeRecord
  51. }
  52. // 动态加载组件
  53. export function loadRouteView(component: string) {
  54. try {
  55. const key = Object.keys(modules).find((key) => {
  56. return key.includes(`${component}.vue`)
  57. })
  58. if (key) {
  59. return modules[key]
  60. }
  61. throw Error(`找不到组件${component},请确保组件路径正确`)
  62. } catch (error) {
  63. console.error(error)
  64. return RouterView
  65. }
  66. }
  67. // 找到第一个有效的路由
  68. export function findFirstValidRoute(routes: RouteRecordRaw[]): string | undefined {
  69. for (const route of routes) {
  70. if (route.meta?.type == MenuEnum.MENU && !route.meta?.hidden && !isExternal(route.path)) {
  71. return route.name as string
  72. }
  73. if (route.children) {
  74. const name = findFirstValidRoute(route.children)
  75. if (name) {
  76. return name
  77. }
  78. }
  79. }
  80. }
  81. //通过权限字符查询路由路径
  82. export function getRoutePath(perms: string) {
  83. const routerObj = useRouter() || router
  84. return routerObj.getRoutes().find((item) => item.meta?.perms == perms)?.path || ''
  85. }
  86. // 重置路由
  87. export function resetRouter() {
  88. router.removeRoute(INDEX_ROUTE_NAME)
  89. const { routes } = useUserStore()
  90. routes.forEach((route) => {
  91. const name = route.name
  92. if (name && router.hasRoute(name)) {
  93. router.removeRoute(name)
  94. }
  95. })
  96. }
  97. const router = createRouter({
  98. // history: createWebHistory(import.meta.env.BASE_URL),
  99. history: createWebHashHistory(),
  100. routes: constantRoutes
  101. })
  102. export default router