代码拉取完成,页面将自动刷新
import {createRouter, createWebHashHistory} from 'vue-router';
import { ElNotification } from 'element-plus';
import config from "@/config"
import NProgress from 'nprogress'
import 'nprogress/nprogress.css'
import tool from '@/utils/tool';
import systemRouter from './systemRouter';
import userRoutes from '@/config/route';
import {beforeEach, afterEach} from './scrollBehavior';
//系统路由
const routes = systemRouter
//系统特殊路由
const routes_404 = {
path: "/:pathMatch(.*)*",
hidden: true,
component: () => import(/* webpackChunkName: "404" */ '@/layout/other/404'),
}
let routes_404_r = ()=>{}
const router = createRouter({
history: createWebHashHistory(),
routes: routes
})
//设置标题
document.title = config.APP_NAME
//判断是否已加载过动态/静态路由
var isGetRouter = false;
router.beforeEach(async (to, from, next) => {
NProgress.start()
//动态标题
document.title = to.meta.title ? `${to.meta.title} - ${config.APP_NAME}` : `${config.APP_NAME}`
let token = tool.cookie.get("TOKEN");
if(to.path === "/login"){
//删除路由(替换当前layout路由)
router.addRoute(routes[0])
//删除路由(404)
routes_404_r()
isGetRouter = false;
next();
return false;
}
if(routes.findIndex(r => r.path === to.path) >= 0){
next();
return false;
}
if(!token){
next({
path: '/login'
});
return false;
}
//整页路由处理
if(to.meta.fullpage){
to.matched = [to.matched[to.matched.length-1]]
}
//加载动态/静态路由
if(!isGetRouter){
let apiMenu = tool.data.get("MENU") || []
let userInfo = tool.data.get("USER_INFO")
let userMenu = treeFilter(userRoutes, node => {
return node.meta.role ? node.meta.role.filter(item=>userInfo.role.indexOf(item)>-1).length > 0 : true
})
let menu = [...userMenu, ...apiMenu]
var menuRouter = filterAsyncRouter(menu)
menuRouter = flatAsyncRoutes(menuRouter)
menuRouter.forEach(item => {
router.addRoute("layout", item)
})
routes_404_r = router.addRoute(routes_404)
if (to.matched.length == 0) {
router.push(to.fullPath);
}
isGetRouter = true;
}
beforeEach(to, from)
next();
});
router.afterEach((to, from) => {
afterEach(to, from)
NProgress.done()
});
router.onError((error) => {
NProgress.done();
ElNotification.error({
title: '路由错误',
message: error.message
});
});
//入侵追加自定义方法、对象
router.sc_getMenu = () => {
var apiMenu = tool.data.get("MENU") || []
let userInfo = tool.data.get("USER_INFO")
let userMenu = treeFilter(userRoutes, node => {
return node.meta.role ? node.meta.role.filter(item=>userInfo.role.indexOf(item)>-1).length > 0 : true
})
var menu = [...userMenu, ...apiMenu]
return menu
}
//转换
function filterAsyncRouter(routerMap) {
const accessedRouters = []
routerMap.forEach(item => {
item.meta = item.meta?item.meta:{};
//处理外部链接特殊路由
if(item.meta.type=='iframe'){
item.meta.url = item.path;
item.path = `/i/${item.name}`;
}
//MAP转路由对象
var route = {
path: item.path,
name: item.name,
meta: item.meta,
redirect: item.redirect,
children: item.children ? filterAsyncRouter(item.children) : null,
component: loadComponent(item.component)
}
accessedRouters.push(route)
})
return accessedRouters
}
function loadComponent(component){
if(component){
return () => import(/* webpackChunkName: "[request]" */ `@/views/${component}`)
}else{
return () => import(`@/layout/other/empty`)
}
}
//路由扁平化
function flatAsyncRoutes(routes, breadcrumb=[]) {
let res = []
routes.forEach(route => {
const tmp = {...route}
if (tmp.children) {
let childrenBreadcrumb = [...breadcrumb]
childrenBreadcrumb.push(route)
let tmpRoute = { ...route }
tmpRoute.meta.breadcrumb = childrenBreadcrumb
delete tmpRoute.children
res.push(tmpRoute)
let childrenRoutes = flatAsyncRoutes(tmp.children, childrenBreadcrumb)
childrenRoutes.map(item => {
res.push(item)
})
} else {
let tmpBreadcrumb = [...breadcrumb]
tmpBreadcrumb.push(tmp)
tmp.meta.breadcrumb = tmpBreadcrumb
res.push(tmp)
}
})
return res
}
//过滤树
function treeFilter(tree, func) {
return tree.map(node => ({ ...node })).filter(node => {
node.children = node.children && treeFilter(node.children, func)
return func(node) || (node.children && node.children.length)
})
}
export default router
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。