import { createRouter, createWebHistory } from 'vue-router' /* Layout */ import Layout from '@/layout/index.vue' /** * Note: sub-menu only appear when route children.length >= 1 * Detail see: https://panjiachen.github.io/vue-element-admin-site/guide/essentials/router-and-nav.html * * hidden: true if set true, item will not show in the sidebar(default is false) * alwaysShow: true if set true, will always show the root menu * if not set alwaysShow, when item has more than one children route, * it will becomes nested mode, otherwise not show the root menu * redirect: noRedirect if set noRedirect will no redirect in the breadcrumb * name:'router-name' the name is used by (must set!!!) * meta : { roles: ['admin','editor'] control the page roles (you can set multiple roles) title: 'title' the name show in sidebar and breadcrumb (recommend set) icon: 'svg-name'/'el-icon-x' the icon show in the sidebar breadcrumb: false if set false, the item will hidden in breadcrumb(default is true) activeMenu: '/example/list' if set path, the sidebar will highlight the path you set } */ const modules = import.meta.glob('../views/**/*.vue') /** * 返回指定路径的模块 * @param {string} path 组件路径/views/xx/xx.vue * @param {string} rename 组件重命名的名字 默认 null * @returns */ function findModules(path,rename=null) { let findPath = '../views' + path if(rename){ return () => modules[findPath]().then((result) => { result.default.__name = rename return result }) }else{ return modules[findPath] } } /** * constantRoutes * a base page that does not have permission requirements * all roles can be accessed */ export const constantRoutes = [ { path: '/redirect', component: Layout, hidden: true, name: 'Redirect', children: [ { path: '/redirect/:path(.*)', component: () => import('@/views/system/redirect/index.vue') } ] }, { path: '/login', component: () => import('@/views/system/login/index.vue'), name: 'login', hidden: true }, { path: '/404', component: () => import('@/views/404.vue'), name: '404', hidden: true }, { path: '/500', component: () => import('@/views/500.vue'), name: '500', hidden: true }, { path: '/:catchAll(.*)',component: () => import('@/views/404.vue'),name: 'allto404', hidden: true } ] /** * asyncRoutes * the routes that need to be dynamically loaded based on user roles */ export const asyncRoutes = [] // Detail see: https://github.com/vuejs/vue-router/issues/1234#issuecomment-357941465 export function resetRouter() { for (let i in asyncRoutes) { let rname = asyncRoutes[i].name if (rname != 'allto404') { router.removeRoute(rname) } } asyncRoutes.length = 0 } export function addDynamicRoutes(routes) { //0 代表为根目录 、菜单 let roots= routes.filter(it=>it.parentId==0) asyncRoutes.length = 0 for (let i in roots) { asyncRoutes.push(_addRoutes(roots[i],routes)) } // 404 page must be placed at the end !!! //asyncRoutes.push({ path: '/:catchAll(.*)', redirect: '/404', name: 'allto404', hidden: true }) for (let i in asyncRoutes) { router.addRoute(asyncRoutes[i]) } } function _addRoutes(routeInfo,routes) { let route = { name: routeInfo.routeName?routeInfo.routeName:routeInfo.id, path: routeInfo.routePath, meta: { title: routeInfo.menuName } } if (routeInfo.componentPath) { if (routeInfo.componentPath == 'Layout') { route.component = Layout } else { // 动态加载组件,组件名称与路由名称保持一致,方便tagsView 的缓存和销毁 // keepalive 根据 tagsViewStore.cachedViews 缓存组件 // vue3.3 以后使用 defineOptions({name: 'xxx'}) route.component = findModules(routeInfo.componentPath) } } if (routeInfo.redirectPath) { route.redirect = routeInfo.redirectPath } if (routeInfo.menuIcon) { route.meta.icon = routeInfo.menuIcon } if (routeInfo.isAffix) { route.meta.affix = routeInfo.isAffix } if(routeInfo.isCache){ route.meta.isCache = routeInfo.isCache } if(routeInfo.outLink){ route.meta.outLink = routeInfo.outLink } //目录 if(routeInfo.menuType===1){ let children= routes.filter(it=>it.parentId===routeInfo.id) if (children.length > 0) { route.children = [] for (let i in children) { route.children.push(_addRoutes(children[i],routes)) } } } //菜单 return route } export const router = createRouter({ history: createWebHistory(), routes: constantRoutes })