index.ts 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100
  1. import type { App } from 'vue'
  2. import type { RouteRecordRaw } from 'vue-router'
  3. import { createRouter, createWebHashHistory } from 'vue-router'
  4. import remainingRouter from './modules/remaining'
  5. import { isRelogin } from '@/config/axios/service'
  6. import { getAccessToken } from '@/utils/auth'
  7. import { useTitle } from '@/hooks/web/useTitle'
  8. import { useNProgress } from '@/hooks/web/useNProgress'
  9. import { usePageLoading } from '@/hooks/web/usePageLoading'
  10. import { useDictStoreWithOut } from '@/store/modules/dict'
  11. import { useUserStoreWithOut } from '@/store/modules/user'
  12. import { usePermissionStoreWithOut } from '@/store/modules/permission'
  13. import { getInfoApi } from '@/api/login'
  14. const { start, done } = useNProgress()
  15. const { loadStart, loadDone } = usePageLoading()
  16. // 创建路由实例
  17. const router = createRouter({
  18. history: createWebHashHistory(), // createWebHashHistory URL带#,createWebHistory URL不带#
  19. strict: true,
  20. routes: remainingRouter as RouteRecordRaw[],
  21. scrollBehavior: () => ({ left: 0, top: 0 })
  22. })
  23. // 路由不重定向白名单
  24. const whiteList = [
  25. '/login',
  26. '/social-login',
  27. '/auth-redirect',
  28. '/bind',
  29. '/register',
  30. '/oauthLogin/gitee'
  31. ]
  32. // 路由加载前
  33. router.beforeEach(async (to, from, next) => {
  34. start()
  35. loadStart()
  36. if (getAccessToken()) {
  37. if (to.path === '/login') {
  38. next({ path: '/' })
  39. } else {
  40. // 获取所有字典
  41. const dictStore = useDictStoreWithOut()
  42. const userStore = useUserStoreWithOut()
  43. const permissionStore = usePermissionStoreWithOut()
  44. if (!dictStore.getIsSetDict) {
  45. dictStore.setDictMap()
  46. }
  47. if (!userStore.getIsSetUser) {
  48. console.info(1)
  49. isRelogin.show = true
  50. const res = await getInfoApi()
  51. await userStore.setUserInfoAction(res)
  52. isRelogin.show = false
  53. // 后端过滤菜单
  54. await permissionStore.generateRoutes()
  55. permissionStore.getAddRouters.forEach((route) => {
  56. router.addRoute(route as unknown as RouteRecordRaw) // 动态添加可访问路由表
  57. })
  58. const redirectPath = from.query.redirect || to.path
  59. const redirect = decodeURIComponent(redirectPath as string)
  60. const nextData = to.path === redirect ? { ...to, replace: true } : { path: redirect }
  61. next(nextData)
  62. } else {
  63. next()
  64. }
  65. }
  66. } else {
  67. if (whiteList.indexOf(to.path) !== -1) {
  68. next()
  69. } else {
  70. next(`/login?redirect=${to.fullPath}`) // 否则全部重定向到登录页
  71. }
  72. }
  73. })
  74. router.afterEach((to) => {
  75. useTitle(to?.meta?.title as string)
  76. done() // 结束Progress
  77. loadDone()
  78. })
  79. export const resetRouter = (): void => {
  80. const resetWhiteNameList = ['Redirect', 'Login', 'NoFind', 'Root']
  81. router.getRoutes().forEach((route) => {
  82. const { name } = route
  83. if (name && !resetWhiteNameList.includes(name as string)) {
  84. router.hasRoute(name) && router.removeRoute(name)
  85. }
  86. })
  87. }
  88. export const setupRouter = (app: App<Element>) => {
  89. app.use(router)
  90. }
  91. export default router