import Vue from "vue"; import Router from "vue-router"; import routes from "./routes"; import Setting from "@/setting"; import { get } from "@/plugins/requests/index.js"; import api from "@/api"; import util from "@/libs/util"; import BasicLayout from "@/layouts/home"; Vue.use(Router); const createRouter = () => new Router({ mode: Setting.routerMode, base: process.env.BASE_URL, scrollBehavior: () => ({ y: 0 }), routes }); export function resetRouter() { const newRouter = createRouter(); router.matcher = newRouter.matcher; } let router = createRouter(); export default router; /** * 错误页面 */ const errorPage = [ { path: "/403", name: "403", meta: { title: "403" }, component: () => import("@/pages/exception/error/403") }, { path: "*", name: "404", meta: { title: "404" }, component: () => import("@/pages/exception/error/404") } ]; // 处理路由权限的方法 function getPermission() { sessionStorage.setItem("handelPermission", true);// 记录已处理权限 get(`${api.getUserRolesPermissionMenu}?platformId=${Setting.platformId}`).then(res => { // 取得路由的值，使用addRouter添加进路由里 // 该项目的路由实际上做了两层处理，一层指向了默认的路由，对应模块，用于基础布局的nav，下面一层才是实际上的路由跳转, // 所以需要默认进行赋值，实际操作时根据path去禁用掉对应的nav即可。 const arr = ['achievement','assessment','course',"evaluation",'information','match','project','setting','student', 'station','system']; let permissionRouters = []; // 最后处理好的路由数组 let data = res.permissionMenu[0].children; if (data.length > 0) { data.forEach(e => { // 第一级路由,需要根据匹配到的path，塞进对应的路由children里 let str = e.path.split("/")[1]; let index = arr.indexOf(str); if (index !== -1) { let obj = { path: e.path, name: arr[index] + "-list", component: () => import(`@/pages${e.path}`), meta: { title: e.name, btn: [] }, children: [] }; let meta = []; let children = []; // 第二级是按钮级数据，一级归属当前页的同级页面，实际上一共就一级路由 if (e.children && e.children.length > 0) { e.children.forEach(i => { // 避免重复生成路由 if (i.path && permissionRouters[index] && !permissionRouters[index].children.some(e => i.path === e.path)) { let obj = { path: i.path, name: arr[index] + "-" + i.path.split("/").pop(), component: () => import(`@/pages${i.path}`), meta: { title: i.name, btn: [] }, children: [] }; // 没找到第一级就生成一个 if (!permissionRouters.some(e => e.path === `/${str}`)) { let one = { path: "/" + arr[index], name: arr[index], redirect: { name: `${arr[index]}-list` }, component: BasicLayout, children: []// 传来的路由实际上传入对应的children中 }; one.children.push(obj); permissionRouters.push(one); } else { // 找到第一级,判断没有重复地址直接塞进去 let nowIndex = permissionRouters.findIndex(e => { return e.path === `/${str}`; }); if (nowIndex != -1 && permissionRouters[nowIndex] && !permissionRouters[nowIndex].children.some(e => e.path === obj.path)) { permissionRouters[nowIndex].children.push(obj); } } // permissionRouters.push(obj) // path是页面,要塞入上一级同级里，需要单独push进去生成路由 meta.push(i.name); } else { meta.push(i.name); } if (i.children && i.children.length) { i.children.forEach(j => { if (j.path && permissionRouters[index] && !permissionRouters[index].children.some(e => j.path === e.path)) { // console.log(j.path,'当前三级路由的路径') let obj = { path: j.path, name: arr[index] + "-" + j.path.split("/").pop(), component: () => import(`@/pages${j.path}`), meta: { title: j.name, btn: [] }, children: [] }; // 没找到第一级就生成一个 if (!permissionRouters.some(e => e.path === `/${str}`)) { let one = { path: "/" + arr[index], name: arr[index], redirect: { name: `${arr[index]}-list` }, component: BasicLayout, children: []// 传来的路由实际上传入对应的children中 }; one.children.push(obj); permissionRouters.push(one); } else { // 找到第一级,判断没有重复地址直接塞进去 let nowIndex = permissionRouters.findIndex(e => { return e.path === `/${str}`; }); if (nowIndex != -1 && permissionRouters[nowIndex] && !permissionRouters[nowIndex].children.some(e => e.path === obj.path)) { permissionRouters[nowIndex].children.push(obj); } } // permissionRouters.push(obj) // path是页面,要塞入上一级同级里，需要单独push进去生成路由 meta.push(i.name+"-"+j.name); } else { meta.push(i.name+"-"+j.name); } if (j.children && j.children.length) { j.children.forEach(k => { if (k.path && permissionRouters[index] && !permissionRouters[index].children.some(e => k.path === e.path)) { // console.log(j.path,'当前四级路由的路径') let obj = { path: k.path, name: arr[index] + "-" + k.path.split("/").pop(), component: () => import(`@/pages${k.path}`), meta: { title: k.name, btn: [] }, children: [] }; // 没找到第一级就生成一个 if (!permissionRouters.some(e => e.path === `/${str}`)) { let one = { path: "/" + arr[index], name: arr[index], redirect: { name: `${arr[index]}-list` }, component: BasicLayout, children: []// 传来的路由实际上传入对应的children中 }; one.children.push(obj); permissionRouters.push(one); } else { // 找到第一级,判断没有重复地址直接塞进去 let nowIndex = permissionRouters.findIndex(e => { return e.path === `/${str}`; }); if (nowIndex != -1 && permissionRouters[nowIndex] && !permissionRouters[nowIndex].children.some(e => e.path === obj.path)) { permissionRouters[nowIndex].children.push(obj); } } // permissionRouters.push(obj) // path是页面,要塞入上一级同级里，需要单独push进去生成路由 meta.push(j.name+"-"+k.name); } else { meta.push(j.name+"-"+k.name); } }) } }) } }); } obj.meta.btn = meta; obj.children = children; // 处理好的路由，需要进行一次匹配,arr中必然存在对应的路由，所以在此处才生成第一级路由，免得额外判断是否有children if (permissionRouters.length === 0 || !permissionRouters.some(e => e.path === `/${str}`)) { // 生成第一级 let one = { path: "/" + arr[index], name: arr[index], redirect: { name: `${arr[index]}-list` }, component: BasicLayout, children: []// 传来的路由实际上传入对应的children中 }; one.children.push(obj); permissionRouters.push(one); // console.log(one,'当前的第一级别',obj,'第二级别') } else { // 找到第一级直接塞进去 let nowIndex = permissionRouters.findIndex(e => { return e.path === `/${str}`; }); if (nowIndex != -1) { permissionRouters[nowIndex].children.push(obj); } } } }); console.log(permissionRouters, "处理好的"); const station = permissionRouters.findIndex(e => e.name === 'station') if (station !== -1) { permissionRouters[station].children.push({ name: `stationPreview`, path: `/station/preview`, component: () => import("@/pages/station/preview"), meta: { title: "实验台" } }) } const assessment = permissionRouters.findIndex(e => e.name === 'assessment') if (assessment !== -1) { permissionRouters[assessment].children.push({ name: `assessment-add`, path: `/assessment/add`, component: () => import("@/pages/assessment/add"), meta: { title: "创建考核" } }) } const notice = permissionRouters.findIndex(e => e.name === 'match') if (notice !== -1) { const match = [ { name: `noticeDetail`, path: `/match/noticeDetail`, component: () => import("@/pages/match/manage/noticeDetail"), meta: { title: "通知公告" } } ] permissionRouters[notice].children.push(...match) } // 把处理完成的路由，add到router里 // 记录一下路由的名称，用于nav let nav = data.map(e => e.path); router.app.$options.store.commit("routers", nav); let redirect = [{ path: "/index", redirect: station !== -1 ? '/station' : permissionRouters[0].path }]; router.addRoutes(redirect); router.addRoutes(permissionRouters); router.addRoutes(errorPage); } }); } // 权限 router.beforeEach(function(to, from, next) { // console.log(router.app.$options.store.commit('routers'),'router.app.$options.store') document.title = Setting.titleSuffix; if (to.path == "/login") { localStorage.removeItem(Setting.tokenKey); sessionStorage.removeItem("handelPermission"); } // console.log(util.local.get(Setting.tokenKey),'token') // console.log(sessionStorage.getItem('handelPermission'),'保存的是否处理') if (util.local.get(Setting.tokenKey)) { if (!sessionStorage.getItem("handelPermission")) {// 是否已处理权限 getPermission(); } } else { if (to.path !== "/login" && to.path !== '/redirect') { next({ path: "/login", query: { redirect: to.path } }) } } // 根据路由元信息设置文档标题 // window.document.title = to.meta.title ? to.meta.title : ""; window.document.title = "教师管理端" next(); });