安虹睿
1 year ago
10 changed files with 851 additions and 181 deletions
@ -0,0 +1,185 @@ |
|||
import router from './router' |
|||
import store from './store' |
|||
import { |
|||
Message |
|||
} from 'element-ui' |
|||
import NProgress from 'nprogress' // progress bar
|
|||
import 'nprogress/nprogress.css' // progress bar style
|
|||
import { |
|||
getToken |
|||
} from '@/utils/auth' // get token from cookie
|
|||
import getPageTitle from '@/utils/get-page-title' |
|||
import { |
|||
asyncRoutes |
|||
} from '@/router' |
|||
import { getInterfaceBoard } from "@/api/wms-interface" |
|||
import { login,getUsersByUserName } from "@/api/wms-auth" |
|||
|
|||
NProgress.configure({ |
|||
showSpinner: false |
|||
}) // NProgress Configuration
|
|||
|
|||
const whiteList = ['/login', '/auth-redirect', '/testForm'] // no redirect whitelist
|
|||
|
|||
|
|||
router.beforeEach(async (to, from, next) => { |
|||
// 添加路由信息,方便代码修改定位
|
|||
// console.log('----------------' + to.meta.title + '-----------------------'+ to.fullPath.substring(to.fullPath.lastIndexOf('-')+1,to.fullPath.length) + '.vue' );
|
|||
// start progress bar
|
|||
NProgress.start() |
|||
|
|||
// set page title
|
|||
document.title = getPageTitle() |
|||
|
|||
// 判断是否自动登录
|
|||
let isAutoLogin = JSON.parse(localStorage.getItem('isAutoLogin')) |
|||
// 如果路径中有isAutoLogin参数则优先,否则读取配置文件中的isAutoLogin参数
|
|||
let _url_isAutoLogin = to.query.isAutoLogin |
|||
if( _url_isAutoLogin== 'false' || _url_isAutoLogin == 'true'){ |
|||
isAutoLogin = JSON.parse(_url_isAutoLogin) |
|||
} |
|||
let userInfo = localStorage.getItem('currentUserInfo') |
|||
let _zh = localStorage.getItem('columnsApiNamesZh') |
|||
// 是否有用户信息:
|
|||
// 1、如果没有判断是否为自动登录(是自动登录则自动执行登录,账号密码为配置信息中的值,不是自动登录则跳到登录页)
|
|||
// 2、如果有用户信息:则检查是否有api接口的表头数据,没有的话重新获取
|
|||
if(!userInfo){ |
|||
if(isAutoLogin || to.query.loginName){ |
|||
// let loginForm= {
|
|||
// userNameOrEmailAddress:localStorage.getItem("userNameOrEmailAddress"),
|
|||
// password:localStorage.getItem("client_secret"),
|
|||
// // rememberMe:true,
|
|||
// // grant_type: 'password',
|
|||
// // client_id: 'Auth_App',
|
|||
// }
|
|||
// store.dispatch('user/login', loginForm).then(() => {
|
|||
// login(loginForm).then(()=>{
|
|||
getUsersByUserName(localStorage.getItem("userNameOrEmailAddress")).then(res=>{ |
|||
// todo:currentUserInfo全程需要优化
|
|||
localStorage.setItem("currentUserInfo", JSON.stringify(res)); |
|||
}) |
|||
.catch(err => { |
|||
console.log('获取用户信息失败,请重试') |
|||
}) |
|||
// 提前获取接口监控看板表头数据并存储
|
|||
getInterfaceBoard().then(result => { |
|||
localStorage.setItem("interfaceBoardColumnsNames", JSON.stringify(result.resources[_zh].texts)); |
|||
next('/') |
|||
}) |
|||
.catch(err => { |
|||
console.log('获取表头失败,请重试') |
|||
}) |
|||
// })
|
|||
// .catch((error) => {
|
|||
// console.log('登录失败')
|
|||
// })
|
|||
}else{ |
|||
if (to.path != '/login') { |
|||
next('/login') |
|||
}else{ |
|||
next() |
|||
} |
|||
NProgress.done() |
|||
} |
|||
}else{ |
|||
// 重新获取api接口表头
|
|||
const _interfaceBoardColumnsNames = localStorage.getItem("interfaceBoardColumnsNames") |
|||
if( !_interfaceBoardColumnsNames || _interfaceBoardColumnsNames == 'undefined' || _interfaceBoardColumnsNames == 'null'){ |
|||
getInterfaceBoard().then(result => { |
|||
// todo-new:columnsApiNamesZh配置的地址补全(evel)
|
|||
localStorage.setItem("interfaceBoardColumnsNames", JSON.stringify(result.resources[_zh].texts)); |
|||
setTimeout(()=>{ |
|||
next() |
|||
},0) |
|||
}) |
|||
}else{ |
|||
next() |
|||
} |
|||
} |
|||
|
|||
|
|||
// determine whether the user has logged in
|
|||
|
|||
// todo-new:如果token接口恢复做处理
|
|||
const hasToken = getToken() |
|||
// else if (hasToken) {
|
|||
// // if(from.path != '/login'){
|
|||
// // let _interfaceBoardColumnsNames = localStorage.getItem("interfaceBoardColumnsNames")
|
|||
// // if(!_interfaceBoardColumnsNames){
|
|||
// // // next({
|
|||
// // // path: '/'
|
|||
// // // })
|
|||
// // // NProgress.done()
|
|||
// // }
|
|||
// // }
|
|||
// if (to.path === '/login') {
|
|||
// // if is logged in, redirect to the home page
|
|||
// next({
|
|||
// path: '/'
|
|||
// })
|
|||
// NProgress.done() // hack: https://github.com/PanJiaChen/vue-element-admin/pull/2939
|
|||
// } else {
|
|||
// // determine whether the user has obtained his permission roles through getInfo
|
|||
// const hasRoles =await store.getters.roles && await store.getters.roles.length > 0
|
|||
// if (hasRoles) {
|
|||
// next()
|
|||
// } else {
|
|||
// try {
|
|||
// // get user info
|
|||
// // note: roles must be a object array! such as: ['admin'] or ,['developer','editor']
|
|||
|
|||
// const {
|
|||
// roles
|
|||
// } = await store.dispatch('user/getInfo')
|
|||
// // generate accessible routes map based on roles
|
|||
|
|||
// // const accessRoutes = await store.dispatch('permission/generateRoutes', localStorage.getItem('userId'))
|
|||
// // router.addRoutes(accessRoutes)
|
|||
|
|||
// // 原码 防止刷新出现空白页(系统暂无出现所以注释)
|
|||
// // const accessRoutes = await store.dispatch('permission/generateRoutes', roles)
|
|||
// // router.addRoutes(accessRoutes)
|
|||
|
|||
// // hack method to ensure that addRoutes is complete
|
|||
// // set the replace: true, so the navigation will not leave a history record
|
|||
// next({
|
|||
// ...to,
|
|||
// replace: true
|
|||
// })
|
|||
// } catch (error) {
|
|||
// // remove token and go to login page to re-login
|
|||
// await store.dispatch('user/resetToken')
|
|||
// Message.error(error || 'Has Error')
|
|||
// next(`/login?redirect=${to.path}`)
|
|||
// NProgress.done()
|
|||
// }
|
|||
// }
|
|||
// }
|
|||
// } else {
|
|||
// /* has no token*/
|
|||
|
|||
// if (whiteList.indexOf(to.path) !== -1) {
|
|||
// // in the free login whitelist, go directly
|
|||
// next()
|
|||
// } else {
|
|||
// // other pages that do not have permission to access are redirected to the login page.
|
|||
// next(`/login?redirect=${to.path}`)
|
|||
// NProgress.done()
|
|||
// }
|
|||
// }
|
|||
}) |
|||
|
|||
router.afterEach(() => { |
|||
// element-ui 使用 Tooltip 提示时候,更换页面,提示依旧存在偶现bug处理。
|
|||
const mytooltipList = document.querySelectorAll('.el-tooltip__popper') // 获取页面所有tooltip的dom集合
|
|||
setTimeout(() => { |
|||
mytooltipList.forEach((value) => { |
|||
value.style.display = 'none' |
|||
if(value.parentElement){ |
|||
value.parentElement.removeChild(value) |
|||
} |
|||
}) |
|||
}, 1000) |
|||
// finish progress bar
|
|||
NProgress.done() |
|||
}) |
@ -0,0 +1,193 @@ |
|||
import Vue from 'vue' |
|||
import Router from 'vue-router' |
|||
|
|||
|
|||
Vue.use(Router) |
|||
|
|||
/* Layout */ |
|||
import Layout from '@/layout' |
|||
|
|||
/* Router Modules */ |
|||
import baseConfig from './modules/baseConfig' |
|||
import interfaceBoardRouter from './modules/interfaceBoard' |
|||
import systemManage from './modules/systemManage' |
|||
|
|||
/** |
|||
* 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 <keep-alive> (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 |
|||
noCache: true if set true, the page will no be cached(default is false) |
|||
affix: true if set true, the tag will affix in the tags-view |
|||
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 |
|||
} |
|||
*/ |
|||
|
|||
/** |
|||
* constantRoutes |
|||
* a base page that does not have permission requirements |
|||
* all roles can be accessed |
|||
*/ |
|||
export let constantRoutes = [ |
|||
{ |
|||
path: '/redirect', |
|||
component: Layout, |
|||
hidden: true, |
|||
children: [{ |
|||
path: '/redirect/:path(.*)', |
|||
component: () => import('@/views/redirect/index') |
|||
}] |
|||
}, |
|||
{ |
|||
path: '/login', |
|||
component: () => import('@/views/login/index'), |
|||
hidden: true |
|||
}, |
|||
{ |
|||
path: '/404', |
|||
component: () => import('@/views/error-page/404'), |
|||
hidden: true |
|||
}, |
|||
{ |
|||
path: '/401', |
|||
component: () => import('@/views/error-page/401'), |
|||
hidden: true |
|||
}, |
|||
{ |
|||
path: '/profileuser', |
|||
component: Layout, |
|||
redirect: '/profileuser/index', |
|||
hidden: true, |
|||
children: [{ |
|||
path: 'index', |
|||
component: () => import('@/views/profileuser/index'), |
|||
name: 'Profileuser', |
|||
meta: { |
|||
title: '个人中心', |
|||
icon: 'user', |
|||
noCache: true |
|||
} |
|||
}] |
|||
}, |
|||
{ |
|||
path: '/', |
|||
component: Layout, |
|||
redirect: '/dashboard', |
|||
// hidden: true,
|
|||
children: [{ |
|||
path: 'dashboard', |
|||
component: () => import('@/views/dashboard/index'), |
|||
name: 'Dashboard', |
|||
meta: { |
|||
keepAlive : true, |
|||
title: '系统首页', |
|||
icon: '系统首页', |
|||
outerFirst:true |
|||
// affix: true
|
|||
} |
|||
}] |
|||
}, |
|||
// 系统
|
|||
// {
|
|||
// path: '/systemManage',
|
|||
// component: Layout,
|
|||
// redirect: 'noRedirect',
|
|||
// meta: {
|
|||
// title: '系统权限管理11111',
|
|||
// icon: '系统权限控制',
|
|||
// roles:'skip'
|
|||
// },
|
|||
// children: [{
|
|||
// path: 'UserManage',
|
|||
// name: 'userManage',
|
|||
// component: () => import('@/views/systemManage/userManage'),
|
|||
// meta: {
|
|||
// title: '用户信息维护',
|
|||
// icon: '用户',
|
|||
// roles: 'AbpIdentity.Users'
|
|||
// }
|
|||
// },
|
|||
// {
|
|||
// path: 'RoleManage',
|
|||
// name: 'roleManage',
|
|||
// component: () => import('@/views/systemManage/roleManage'),
|
|||
// meta: {
|
|||
// title: 'PC权限信息维护',
|
|||
// icon: '权限控制',
|
|||
// roles: 'AbpIdentity.Roles'
|
|||
// }
|
|||
// },
|
|||
// {
|
|||
// path: 'pcMenu',
|
|||
// name: 'pcMenu',
|
|||
// // hidden: true,
|
|||
// component: () => import('@/views/systemManage/pcMenu'),
|
|||
// meta: {
|
|||
// title: 'PC权限菜单',
|
|||
// icon: 'PDA权限菜单',
|
|||
// roles: 'Auth.Menu'
|
|||
// }
|
|||
// },
|
|||
// {
|
|||
// path: 'UserWorkGroup',
|
|||
// name: 'UserWorkGroup',
|
|||
// // hidden: true,
|
|||
// component: () => import('@/views/systemManage/userWorkGroup'),
|
|||
// meta: {
|
|||
// title: '用户工作组对应关系',
|
|||
// icon: '用户工作组对应关系',
|
|||
// roles: 'Auth.UserWorkGroup'
|
|||
// }
|
|||
// },
|
|||
// ]
|
|||
// }
|
|||
] |
|||
|
|||
/** |
|||
* asyncRoutes |
|||
* the routes that need to be dynamically loaded based on user roles |
|||
*/ |
|||
// 动态获取菜单信息
|
|||
export let asyncRoutes = [ |
|||
/** when your routing map is too long, you can split it into small modules **/ |
|||
// 404 page must be placed at the end !!!
|
|||
baseConfig, |
|||
interfaceBoardRouter, |
|||
systemManage, |
|||
{ |
|||
path: '*', |
|||
redirect: '/404', |
|||
hidden: true |
|||
} |
|||
] |
|||
|
|||
const createRouter = () => new Router({ |
|||
// mode: 'history', // require service support
|
|||
scrollBehavior: () => ({ |
|||
y: 0 |
|||
}), |
|||
// todo-new:有token后使用去掉下一行代码
|
|||
routes: constantRoutes.concat(asyncRoutes) |
|||
// todo-new:有token后使打开下方代码,并检查是否有效
|
|||
// routes: constantRoutes
|
|||
}) |
|||
|
|||
const router = createRouter() |
|||
|
|||
// Detail see: https://github.com/vuejs/vue-router/issues/1234#issuecomment-357941465
|
|||
export function resetRouter() { |
|||
const newRouter = createRouter() |
|||
router.matcher = newRouter.matcher // reset router
|
|||
} |
|||
|
|||
export default router |
@ -0,0 +1,163 @@ |
|||
import { |
|||
asyncRoutes, |
|||
constantRoutes |
|||
} from '@/router' |
|||
import Layout from '@/layout' |
|||
import { getWebMenu } from '@/api/wms-auth' |
|||
/** |
|||
* 静态路由懒加载 |
|||
* @param view 格式必须为 xxx/xxx 开头不要加斜杠 |
|||
* @returns |
|||
*/ |
|||
export const loadView = (view) => { |
|||
return (resolve) => require([`@/views/${view}`], resolve) |
|||
} |
|||
/** |
|||
* 把从后端查询的菜单数据拼装成路由格式的数据 |
|||
* @param routes |
|||
* @param data 后端返回的菜单数据 |
|||
*/ |
|||
export function generaMenu(routes, data) { |
|||
data.forEach(item => { |
|||
const menu = { |
|||
path: item.code, |
|||
component: item.component === '@/layout' ? Layout : loadView(item.component), |
|||
// hidden: item.status === 0, // 状态为0的隐藏
|
|||
children: [], |
|||
name: item.code, |
|||
// meta: item.meta
|
|||
meta: { |
|||
title: item.name, |
|||
icon: item.icon || '', |
|||
roles: item.permission |
|||
}, |
|||
|
|||
} |
|||
// 一级菜单 二级菜单 特定属性
|
|||
if (item.component == '@/layout' || item.component == 'index') { |
|||
menu.alwaysShow = true |
|||
menu.redirect = 'noRedirect' |
|||
} |
|||
if (item.sort < 99) { |
|||
menu.level = 1 |
|||
} else if (item.sort > 99 && item.sort < 9999) { |
|||
menu.level = 2 |
|||
} else { |
|||
menu.level = 3 |
|||
} |
|||
// iframe页面处理
|
|||
// if (item.permission.indexOf('Report') > -1) {
|
|||
// // delete menu.component
|
|||
// menu.iframeComponent = item.component === '@/layout' ? Layout : loadView(item.component)
|
|||
// menu.hasOpen = false // 是否打开过,默认false
|
|||
// }
|
|||
if (item.children && item.children.length > 0) { |
|||
generaMenu(menu.children, item.children) |
|||
} |
|||
// if (item.permission == 'skip' && item.children.length == 0) {
|
|||
// }
|
|||
routes.push(menu) |
|||
}) |
|||
return routes |
|||
} |
|||
|
|||
/** |
|||
* Use meta.role to determine if the current user has permission |
|||
* @param roles |
|||
* @param route |
|||
*/ |
|||
function hasPermission(roles, route) { |
|||
if (route.meta && route.meta.roles) { |
|||
if (route.meta.roles == "skip") { |
|||
return true |
|||
} else { |
|||
return roles.some(role => route.meta.roles.includes(role)) |
|||
} |
|||
} else { |
|||
return false |
|||
} |
|||
} |
|||
const filterAccessedRoutes = (items,indexVal,childrenIndex) => { |
|||
const route = JSON.parse(JSON.stringify(items)) |
|||
route.forEach((val, index) => { |
|||
// debugger;
|
|||
if(val.meta && val.meta.roles == "skip"){ |
|||
if (val.children && val.children.length != 0) { |
|||
filterAccessedRoutes(items[index-indexVal].children,childrenIndex) |
|||
} |
|||
if(items[index-indexVal].children && items[index-indexVal].children.length == 0){ |
|||
items.splice(index-indexVal, 1) |
|||
indexVal++ |
|||
} |
|||
} |
|||
}) |
|||
indexVal = 0 |
|||
} |
|||
/** |
|||
* Filter asynchronous routing tables by recursion |
|||
* @param routes asyncRoutes |
|||
* @param roles |
|||
*/ |
|||
export function filterAsyncRoutes(routes, roles) { |
|||
const res = [] |
|||
routes.forEach(route => { |
|||
const tmp = { |
|||
...route |
|||
} |
|||
if (hasPermission(roles, tmp)) { |
|||
if (tmp.children) { |
|||
tmp.children = filterAsyncRoutes(tmp.children, roles) |
|||
} |
|||
res.push(tmp) |
|||
} |
|||
}) |
|||
return res |
|||
} |
|||
|
|||
const state = { |
|||
routes: [], |
|||
addRoutes: [] |
|||
} |
|||
|
|||
const mutations = { |
|||
SET_ROUTES: (state, routes) => { |
|||
state.addRoutes = routes |
|||
state.routes = constantRoutes.concat(routes) |
|||
} |
|||
} |
|||
// todo-new:有token后使用generateRoutes,去掉下方一行代码
|
|||
state.routes = constantRoutes.concat(asyncRoutes) |
|||
|
|||
const actions = { |
|||
generateRoutes({ |
|||
commit |
|||
}, userId) { |
|||
return new Promise(resolve => { |
|||
// let accessedRoutes = asyncRoutes
|
|||
// // accessedRoutes = filterAsyncRoutes(asyncRoutes, roles)
|
|||
// let indexVal = 0
|
|||
// let childrenIndex = 0
|
|||
// filterAccessedRoutes(accessedRoutes,indexVal,childrenIndex)
|
|||
// commit('SET_ROUTES', accessedRoutes)
|
|||
// resolve(accessedRoutes)
|
|||
// todo-new:动态路由(等token接口恢复后处理)
|
|||
getWebMenu({userId: userId}).then(res => { |
|||
let accessedRoutes = generaMenu(asyncRoutes, res) |
|||
let indexVal = 0 |
|||
let childrenIndex = 0 |
|||
filterAccessedRoutes(accessedRoutes,indexVal,childrenIndex) |
|||
commit('SET_ROUTES', accessedRoutes) |
|||
resolve(accessedRoutes) |
|||
}).catch(err => { |
|||
console.log(err) |
|||
}) |
|||
}) |
|||
} |
|||
} |
|||
|
|||
export default { |
|||
namespaced: true, |
|||
state, |
|||
mutations, |
|||
actions |
|||
} |
Loading…
Reference in new issue