feat: add vue3(element-plus)

yudao-ui-admin-vue3/src/router/index.ts

@@ -0,0 +1,107 @@
+import type { App } from 'vue'
+import { getAccessToken } from '@/utils/auth'
+import type { RouteRecordRaw } from 'vue-router'
+import remainingRouter from './modules/remaining'
+import { useCache } from '@/hooks/web/useCache'
+import { useTitle } from '@/hooks/web/useTitle'
+import { useNProgress } from '@/hooks/web/useNProgress'
+import { usePageLoading } from '@/hooks/web/usePageLoading'
+import { createRouter, createWebHashHistory } from 'vue-router'
+import { usePermissionStoreWithOut } from '@/store/modules/permission'
+import { useDictStoreWithOut } from '@/store/modules/dict'
+import { listSimpleDictDataApi } from '@/api/system/dict/dict.data'
+
+const permissionStore = usePermissionStoreWithOut()
+
+const dictStore = useDictStoreWithOut()
+
+const { wsCache } = useCache()
+
+const { start, done } = useNProgress()
+
+const { loadStart, loadDone } = usePageLoading()
+
+// 创建路由实例
+const router = createRouter({
+  history: createWebHashHistory(),
+  strict: true,
+  routes: remainingRouter as RouteRecordRaw[],
+  // routes: constantRoutes.concat(...remainingRouter),
+  scrollBehavior: () => ({ left: 0, top: 0 })
+})
+
+// 路由白名单
+const whiteList = [
+  '/login',
+  '/social-login',
+  '/auth-redirect',
+  '/bind',
+  '/register',
+  '/oauthLogin/gitee'
+]
+
+// 路由加载前
+router.beforeEach(async (to, from, next) => {
+  start()
+  loadStart()
+  if (getAccessToken()) {
+    if (to.path === '/login') {
+      next({ path: '/' })
+    } else {
+      if (!dictStore.getIsSetDict) {
+        // 获取所有字典
+        const res = await listSimpleDictDataApi()
+        if (res) {
+          dictStore.setDictMap(res)
+          dictStore.setIsSetDict(true)
+        }
+      }
+      if (permissionStore.getIsAddRouters) {
+        next()
+        return
+      }
+      // 开发者可根据实际情况进行修改
+      const roleRouters = wsCache.get('roleRouters') || []
+
+      await permissionStore.generateRoutes(roleRouters as AppCustomRouteRecordRaw[])
+
+      permissionStore.getAddRouters.forEach((route) => {
+        router.addRoute(route as unknown as RouteRecordRaw) // 动态添加可访问路由表
+      })
+      const redirectPath = from.query.redirect || to.path
+      const redirect = decodeURIComponent(redirectPath as string)
+      const nextData = to.path === redirect ? { ...to, replace: true } : { path: redirect }
+      permissionStore.setIsAddRouters(true)
+      next(nextData)
+    }
+  } else {
+    if (whiteList.indexOf(to.path) !== -1) {
+      next()
+    } else {
+      next(`/login?redirect=${to.path}`) // 否则全部重定向到登录页
+    }
+  }
+})
+
+router.afterEach((to) => {
+  useTitle(to?.meta?.title as string)
+  done() // 结束Progress
+  loadDone()
+})
+
+export const resetRouter = (): void => {
+  const resetWhiteNameList = ['Redirect', 'Login', 'NoFind', 'Root']
+  router.getRoutes().forEach((route) => {
+    const { name } = route
+    if (name && !resetWhiteNameList.includes(name as string)) {
+      router.hasRoute(name) && router.removeRoute(name)
+    }
+  })
+  routes: remainingRouter as RouteRecordRaw[]
+}
+
+export const setupRouter = (app: App<Element>) => {
+  app.use(router)
+}
+
+export default router

yudao-ui-admin-vue3/src/router/modules/error.ts

@@ -0,0 +1,45 @@
+import { Layout } from '@/utils/routerHelper'
+import { useI18n } from '@/hooks/web/useI18n'
+const { t } = useI18n()
+
+const errorRouter = [
+  {
+    path: '/error',
+    component: Layout,
+    redirect: '/error/404',
+    name: 'Error',
+    meta: {
+      title: t('router.errorPage'),
+      icon: 'ci:error',
+      alwaysShow: true
+    },
+    children: [
+      {
+        path: '404-demo',
+        component: () => import('@/views/Error/404.vue'),
+        name: '404Demo',
+        meta: {
+          title: '404'
+        }
+      },
+      {
+        path: '403-demo',
+        component: () => import('@/views/Error/403.vue'),
+        name: '403Demo',
+        meta: {
+          title: '403'
+        }
+      },
+      {
+        path: '500-demo',
+        component: () => import('@/views/Error/500.vue'),
+        name: '500Demo',
+        meta: {
+          title: '500'
+        }
+      }
+    ]
+  }
+]
+
+export default errorRouter

yudao-ui-admin-vue3/src/router/modules/remaining.ts

@@ -0,0 +1,154 @@
+import { Layout } from '@/utils/routerHelper'
+import { useI18n } from '@/hooks/web/useI18n'
+const { t } = useI18n()
+
+const remainingRouter: AppRouteRecordRaw[] = [
+  {
+    path: '/redirect',
+    component: Layout,
+    name: 'Redirect',
+    children: [
+      {
+        path: '/redirect/:path(.*)',
+        name: 'Redirect',
+        component: () => import('@/views/Redirect/Redirect.vue'),
+        meta: {}
+      }
+    ],
+    meta: {
+      hidden: true,
+      noTagsView: true
+    }
+  },
+  {
+    path: '/',
+    component: Layout,
+    redirect: '/index',
+    name: 'Home',
+    meta: {},
+    children: [
+      {
+        path: 'index',
+        component: () => import('@/views/Home/Index.vue'),
+        name: 'Index',
+        meta: {
+          title: t('router.home'),
+          icon: 'ep:home-filled',
+          noCache: true,
+          affix: true
+        }
+      }
+    ]
+  },
+  {
+    path: '/user',
+    component: Layout,
+    name: 'User',
+    meta: {
+      hidden: true
+    },
+    children: [
+      {
+        path: 'profile',
+        component: () => import('@/views/Profile/Index.vue'),
+        name: 'Profile',
+        meta: {
+          hidden: true,
+          icon: 'ep:user',
+          canTo: true,
+          title: t('common.profile')
+        }
+      }
+    ]
+  },
+  {
+    path: '/codegen',
+    component: Layout,
+    name: 'Codegen',
+    meta: {
+      hidden: true
+    },
+    children: [
+      {
+        path: 'edit',
+        component: () => import('@/views/infra/codegen/EditTable.vue'),
+        name: 'EditTable',
+        meta: {
+          noTagsView: true,
+          noCache: true,
+          hidden: true,
+          canTo: true,
+          icon: 'ep:edit',
+          title: '修改生成配置',
+          activeMenu: 'infra/codegen/index'
+        }
+      }
+    ]
+  },
+  {
+    path: '/job',
+    component: Layout,
+    name: 'Job',
+    meta: {
+      hidden: true
+    },
+    children: [
+      {
+        path: 'job-log',
+        component: () => import('@/views/infra/job/JobLog.vue'),
+        name: 'JobLog',
+        meta: {
+          noTagsView: true,
+          noCache: true,
+          hidden: true,
+          canTo: true,
+          icon: 'ep:edit',
+          title: '调度日志',
+          activeMenu: 'infra/job/index'
+        }
+      }
+    ]
+  },
+  {
+    path: '/login',
+    component: () => import('@/views/Login/Login.vue'),
+    name: 'Login',
+    meta: {
+      hidden: true,
+      title: t('router.login'),
+      noTagsView: true
+    }
+  },
+  {
+    path: '/403',
+    component: () => import('@/views/Error/403.vue'),
+    name: 'NoAccess',
+    meta: {
+      hidden: true,
+      title: '403',
+      noTagsView: true
+    }
+  },
+  {
+    path: '/404',
+    component: () => import('@/views/Error/404.vue'),
+    name: 'NoFound',
+    meta: {
+      hidden: true,
+      title: '404',
+      noTagsView: true
+    }
+  },
+  {
+    path: '/500',
+    component: () => import('@/views/Error/500.vue'),
+    name: 'Error',
+    meta: {
+      hidden: true,
+      title: '500',
+      noTagsView: true
+    }
+  }
+]
+
+export default remainingRouter