Browse Source

动态配置路由暂存

noToken
安虹睿 1 year ago
parent
commit
7311c00d74
  1. 9
      PC/InterFace.Dash/src/api/wms-interface.js
  2. 7
      PC/InterFace.Dash/src/layout/components/Navbar.vue
  3. 3
      PC/InterFace.Dash/src/layout/components/Sidebar/index.vue
  4. 137
      PC/InterFace.Dash/src/permission.js
  5. 15
      PC/InterFace.Dash/src/router/index.js
  6. 254
      PC/InterFace.Dash/src/store/modules/permission.js
  7. 2
      PC/InterFace.Dash/src/views/dashboard/index.vue
  8. 10
      PC/InterFace.Dash/src/views/login/index.vue

9
PC/InterFace.Dash/src/api/wms-interface.js

@ -21,6 +21,15 @@ export function getInterfaceBoard() {
}) })
} }
// 获取菜单数据
export function getDefinitionMenu(IncludeTypes) {
return request({
method:'get',
url: base_api + '/api/abp/application-configuration',
params:{IncludeLocalizationResources:true}
})
}
// 获取导出配置信息接口 // 获取导出配置信息接口
// export function getExportConfigList(name) { // export function getExportConfigList(name) {
// return request({ // return request({

7
PC/InterFace.Dash/src/layout/components/Navbar.vue

@ -78,8 +78,11 @@ export default {
this.$store.dispatch("app/toggleSideBar"); this.$store.dispatch("app/toggleSideBar");
}, },
async logout() { async logout() {
await this.$store.dispatch("user/logout"); // await this.$store.dispatch("user/logout");
this.$router.push(`/login?redirect=${this.$route.fullPath}`); // this.$router.push(`/login?redirect=${this.$route.fullPath}`);
localStorage.removeItem("interfaceBoardColumnsNames")
localStorage.removeItem("currentUserInfo")
this.$router.push('/login?isAutoLogin=false')
}, },
handleClick() { handleClick() {

3
PC/InterFace.Dash/src/layout/components/Sidebar/index.vue

@ -50,6 +50,9 @@ export default {
return !this.sidebar.opened return !this.sidebar.opened
} }
}, },
mounted(){
console.log(54,this.permission_routes)
}
} }
</script> </script>
<style> <style>

137
PC/InterFace.Dash/src/permission.js

@ -43,59 +43,100 @@ router.beforeEach(async (to, from, next) => {
// 是否有用户信息: // 是否有用户信息:
// 1、如果没有判断是否为自动登录(是自动登录则自动执行登录,账号密码为配置信息中的值,不是自动登录则跳到登录页) // 1、如果没有判断是否为自动登录(是自动登录则自动执行登录,账号密码为配置信息中的值,不是自动登录则跳到登录页)
// 2、如果有用户信息:则检查是否有api接口的表头数据,没有的话重新获取 // 2、如果有用户信息:则检查是否有api接口的表头数据,没有的话重新获取
if(!userInfo){ if(userInfo){
if(isAutoLogin || to.query.loginName){ if(store.getters.permission_routes && store.getters.permission_routes.length > 0){
// let loginForm= { next()
// 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(()=>{
let _username = to.query.loginName ? to.query.loginName : localStorage.getItem("userNameOrEmailAddress")
getUsersByUserName(_username).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{ }else{
if (to.path != '/login') { const accessRoutes = await store.dispatch('permission/getApiColumnsNames')
next('/login') console.log(accessRoutes)
}else{ router.addRoutes(accessRoutes)
next() next({
} ...to,
NProgress.done() replace: true
})
} }
// next({
// ...to,
// replace: true
// })
// if(menuList){
// next()
// }else{
// const accessRoutes = await store.dispatch('permission/getApiColumnsNames')
// router.addRoutes(accessRoutes)
// next()
// }
// if(store.getters.permission_routes && store.getters.permission_routes.length > 0){
// next()
// }else{
// // const accessRoutes = await store.dispatch('permission/getApiColumnsNames')
// // router.addRoutes(accessRoutes)
// next()
// }
// 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(()=>{
// let _username = to.query.loginName ? to.query.loginName : localStorage.getItem("userNameOrEmailAddress")
// getUsersByUserName(_username).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{ }else{
// 重新获取api接口表头 if(to.path == '/login'){
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() next()
}else{
next('/login')
} }
// if (to.path != '/login') {
// next('/login')
// }else{
// next()
// }
NProgress.done()
// 重新获取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()
// }
} }

15
PC/InterFace.Dash/src/router/index.js

@ -98,6 +98,7 @@ export let constantRoutes = [
}] }]
}, },
] ]
console.log(11111)
/** /**
* asyncRoutes * asyncRoutes
@ -107,14 +108,14 @@ export let constantRoutes = [
export let asyncRoutes = [ export let asyncRoutes = [
/** when your routing map is too long, you can split it into small modules **/ /** when your routing map is too long, you can split it into small modules **/
// 404 page must be placed at the end !!! // 404 page must be placed at the end !!!
baseConfig, // baseConfig,
interfaceBoardRouter, // interfaceBoardRouter,
// systemManage, // systemManage,
{ // {
path: '*', // path: '*',
redirect: '/404', // redirect: '/404',
hidden: true // hidden: true
} // }
] ]
const createRouter = () => new Router({ const createRouter = () => new Router({

254
PC/InterFace.Dash/src/store/modules/permission.js

@ -4,62 +4,7 @@ import {
} from '@/router' } from '@/router'
import Layout from '@/layout' import Layout from '@/layout'
import { getWebMenu } from '@/api/wms-auth' import { getWebMenu } from '@/api/wms-auth'
/** import { getDefinitionMenu } from '@/api/wms-interface'
* 静态路由懒加载
* @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 * Use meta.role to determine if the current user has permission
@ -126,33 +71,208 @@ const mutations = {
} }
} }
// todo-new:有token后使用generateRoutes,去掉下方一行代码 // todo-new:有token后使用generateRoutes,去掉下方一行代码
state.routes = constantRoutes.concat(asyncRoutes) // state.routes = constantRoutes.concat(asyncRoutes)
/**
* 静态路由懒加载
* @param view 格式必须为 xxx/xxx 开头不要加斜杠
* @returns
*/
export const loadView = (view) => {
return (resolve) => require([`@/views/menuList/${view}`], resolve)
}
/**
* 把从后端查询的菜单数据拼装成路由格式的数据
* @param routes
* @param data 后端返回的菜单数据
*/
export function generaMenu(routes, data, first) {
data.forEach(item => {
let _item = {
path: '/'+item.name,
component: loadView(item.name),
// hidden: item.status === 0, // 状态为0的隐藏
name: item.name,
// meta: item.meta
meta: {
title: item.title,
icon: item.icon || '',
roles: item.permission,
outerFirst:first
},
}
let menu = _item
if(first && item.component == '@/layout'){
menu = {
path: '/',
component: Layout,
redirect: '/' + item.name,
children: [],
}
menu.children = []
menu.children.push(_item)
}
// 一级菜单 二级菜单 特定属性
// 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
}
// todo:接口返回的层级菜单,与查重后最终显示的菜单数组做查重及组合处理
export function initTreeMenusHandle(tree, list,zh,first) {
let _res = []
tree.forEach(item=>{
if(list.indexOf(item.name) >= 0){
item.title = zh[item.name] || item.name
if(first)item.component = '@/layout'
if (item.children && item.children.length > 0) {
item.children = initTreeMenusHandle(item.children,list,zh)
}
_res.push(item)
}
})
return _res
}
const actions = { const actions = {
generateRoutes({ getApiColumnsNames({
commit commit
}, userId) { }, userId) {
return new Promise(resolve => { return new Promise(resolve => {
// let accessedRoutes = asyncRoutes let accessedRoutes = asyncRoutes
// // accessedRoutes = filterAsyncRoutes(asyncRoutes, roles) // accessedRoutes = filterAsyncRoutes(asyncRoutes, roles)
// let indexVal = 0 // let indexVal = 0
// let childrenIndex = 0 // let childrenIndex = 0
// filterAccessedRoutes(accessedRoutes,indexVal,childrenIndex) // filterAccessedRoutes(accessedRoutes,indexVal,childrenIndex)
// commit('SET_ROUTES', accessedRoutes) // commit('SET_ROUTES', accessedRoutes)
// resolve(accessedRoutes) // resolve(accessedRoutes)
// todo-new:动态路由(等token接口恢复后处理) getDefinitionMenu(true).then(res => {
getWebMenu({userId: userId}).then(res => { let _allConfig = res.auth.grantedPolicies;//所有配置
let accessedRoutes = generaMenu(asyncRoutes, res) let _zh = res.localization.values[localStorage.getItem('columnsApiNamesZh')];
let indexVal = 0 localStorage.setItem("interfaceBoardColumnsNames", JSON.stringify(_zh));
let childrenIndex = 0 let _menuList = []//接口获取所有的菜单
filterAccessedRoutes(accessedRoutes,indexVal,childrenIndex) for(let item in _allConfig){
let point_number = item.split('.').length - 1
// 只选择配置项中的数据
if(point_number == 1 && item.substring(0,item.indexOf('.')) == localStorage.getItem('columnsApiNamesZh')){
_menuList.push(item.substring(item.indexOf('.') + 1,item.length))
}
}
let _noShowMenus = ['Z.AsnDet']//不显示的菜单
// 去掉不显示的菜单后全部显示的菜单
let _showMenus = _menuList.filter(item1 => !_noShowMenus.some(item2 => item2 === item1))
// 数据模拟,todo:接口获取
let _treeMenusAll = [
{name:"aaaaaaa"},
{name:"ExportCustomUserSetting"
// ,children:[
// {name:'OutgoingDataHistory',children:[
// {name:'IncomingData',children:[
// {name:'OutgoingDataHistory'},
// {name:'IncomingData'},
// {name:'333333'},
// ]},
// {name:'eee1111-bbb',children:[
// {name:'ExportCustomUserSetting'},
// {name:'MessageReceive'},
// ]},
// ]},
// {name:'eee222'},
// {name:'eee333'},
// {name:'eee444'},
// {name:'eee555'},
// ]
},
{name:"OutgoingDataHistory"},
{name:"IncomingData"},
{name:"IncomingDataHistory"},
{name:"MesProductL7PartsNote"},
{name:"MessageReceive"},
{name:"OutgoingData"},
{name:"AsnDet"},
{name:"AsnMstr"},
{name:"Bom"},
{name:"CustPart"},
{name:"Cust"},
{name:"Inventory"},
{name:"Loc"},
{name:"Part"},
{name:"PoDet"},
{name:"PoMstr"},
{name:"PrhHist"},
{name:"ProdLine"},
{name:"ReceiptDet"},
{name:"ReceiptMstr"},
{name:"ReturnDet"},
{name:"ReturnMstr"},
{name:"SodDet"},
{name:"VendPart"},
{name:"Vend"},
]
let _initTreeMenus = []
if(_treeMenusAll && _treeMenusAll.length > 0){
_initTreeMenus = initTreeMenusHandle(_treeMenusAll,_showMenus,_zh,true)
}else{
_initTreeMenus = _showMenus
}
// 最后查重+层级查重后的菜单
let _initEndMenus = generaMenu(asyncRoutes, _initTreeMenus,true)
let accessedRoutes = _initEndMenus
// let indexVal = 0
// let childrenIndex = 0
// filterAccessedRoutes(accessedRoutes,indexVal,childrenIndex)
commit('SET_ROUTES', accessedRoutes) commit('SET_ROUTES', accessedRoutes)
resolve(accessedRoutes) resolve(accessedRoutes)
}).catch(err => { }).catch(err => {
console.log(err) console.log(err)
}) })
}) })
} },
// 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 { export default {

2
PC/InterFace.Dash/src/views/dashboard/index.vue

@ -7,7 +7,7 @@
v-for="(item,index) in navList" v-for="(item,index) in navList"
:key="index" :key="index"
> >
<div class="firstTitle"> <div class="firstTitle" v-if="item.meta">
<div class="icon"><svg-icon :icon-class="item.meta.icon" style="fill:currentColor; color:#fff;"/></div> <div class="icon"><svg-icon :icon-class="item.meta.icon" style="fill:currentColor; color:#fff;"/></div>
<div>{{item.meta.title}}</div> <div>{{item.meta.title}}</div>
</div> </div>

10
PC/InterFace.Dash/src/views/login/index.vue

@ -165,9 +165,17 @@ export default {
handleLogin () { handleLogin () {
this.$refs.loginForm.validate(valid => { this.$refs.loginForm.validate(valid => {
if (valid) { if (valid) {
// todo-new:localStorage.getItem("userNameOrEmailAddress")
getUsersByUserName(this.loginForm.username).then(res=>{
// store.dispatch('user/setName',res)
localStorage.setItem("currentUserInfo", JSON.stringify(res));
this.$router.push({ path: '/'})
})
return
this.loading = true this.loading = true
this.loginForm.userNameOrEmailAddress = this.loginForm.username this.loginForm.userNameOrEmailAddress = this.loginForm.username
// todo-new:permission // todo-new:permission
let _zh = localStorage.getItem('columnsApiNamesZh')
login(this.loginForm).then(()=>{ login(this.loginForm).then(()=>{
// this.$store.dispatch('user/login', this.loginForm).then(() => { // this.$store.dispatch('user/login', this.loginForm).then(() => {
// //
@ -176,7 +184,7 @@ export default {
localStorage.setItem("currentUserInfo", JSON.stringify(res)); localStorage.setItem("currentUserInfo", JSON.stringify(res));
}) })
getInterfaceBoard().then(result => { getInterfaceBoard().then(result => {
localStorage.setItem("interfaceBoardColumnsNames", JSON.stringify(result.localization.values.Winin)); localStorage.setItem("interfaceBoardColumnsNames", JSON.stringify(result.resources[_zh].texts));
this.$router.push({ path: '/'}) this.$router.push({ path: '/'})
this.loading = false this.loading = false
}) })

Loading…
Cancel
Save