安虹睿
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