朱兆平 / vue_cli · 提交

转到一个项目

作者 朱兆平
提交 8db661365e5ac4dff6614529263270d00bde22b2 1 个父辈 73376768

用户登录适配权限目录问题，登陆后已适配，一刷新 vue router就初始化为以前的了 已解决

内嵌 并排对比
正在显示 6 个修改的文件 包含 99 行增加 和 30 行删除
... ... @@ -17,7 +17,6 @@ export const requestLogin = params => {
for (let it in data) {
ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&'
}
console.log(ret)
return ret
}],
headers: {
... ...
... ... @@ -28,15 +28,15 @@ Vue.use(VueRouter)
Vue.use(Vuex)
//NProgress.configure({ showSpinner: false });
console.log("mainjs:");
console.log(rout.routes);
const router = new VueRouter({
routes:rout.routes
})
//判断本地存储的用户栏目列表是否存在，如果存在则加载路由
if(sessionStorage.getItem('menu')){
rout.setUserMenus(JSON.parse(sessionStorage.getItem('menu')));
router.options.routes = rout.routes
}
});
//本地存储系统初始化的router路由,用来处理用户退出后,把路由数据初始化
sessionStorage.setItem('sysMenu', JSON.stringify(rout.routes));
router.beforeEach((to, from, next) => {
//NProgress.start();
if (to.path == '/login') {
... ...
... ... @@ -84,11 +84,37 @@ let routes = [
redirect: { path: '/404' }
}
];
let initRouters = routes.concat();
let setUserMenus = function (list) {
routes = list;
let s= 1;
}
/**
* 处理登陆后的账号对应的菜单
* @param menuList
*/
let handleMenuList = function (router,menu) {
var _self = this;
var routerName = "";
router.forEach(function (v_router) {
routerName = v_router.name;
menu.forEach(function (v_menu) {
//查找返回的目录列表是否包含路由名称,有就返回匹配到的元素,没有就移除
let result = menu.find(item => {
return item.name === routerName;
});
//匹配到继续判断是否子元素,有子元素继续递归
if (result) {
if(v_router.children) {
_self.handleMenuList(v_router.children,result.children);
}
//没有则可以移除
}else {
router.splice(router.findIndex(itm => itm.name === routerName ),1);
}
})
});
}
export default {
routes,setUserMenus
routes,setUserMenus,handleMenuList,initRouters
};
\ No newline at end of file
... ...
... ... @@ -71,6 +71,7 @@
</template>
<script>
import rt from '../routes'
export default {
data() {
return {
... ... @@ -109,6 +110,13 @@
//type: 'warning'
}).then(() => {
sessionStorage.removeItem('user');
sessionStorage.removeItem('menu');
//退出后初始化原来的路由
let sysRoutes = JSON.parse(sessionStorage.getItem('sysMenu'));
console.log(sysRoutes);
_this.$router.options.routes = sysRoutes;
_this.$router.push('/login');
}).catch(() => {
... ... @@ -125,13 +133,22 @@
}
},
mounted() {
var _this = this;
var user = sessionStorage.getItem('user');
if (user) {
user = JSON.parse(user);
this.sysUserName = user.username || '';
this.sysUserAvatar = user.userface || '/static/images/faceDefault.jpg';
}
//操作路由,判断本地存储的用户栏目列表是否存在，如果存在则加载路由
var userRouters = sessionStorage.getItem('menu');
if (userRouters) {
userRouters = JSON.parse(userRouters);
let sysMenus = _this.$router.options.routes;
rt.handleMenuList(sysMenus,userRouters);
console.log("home:");
console.log(_this.$router.options.routes);
}
}
}
... ...
... ... @@ -33,7 +33,7 @@
<script>
import { requestLogin,getuserMenus } from '../api/api';
import routes from '../routes'
import rt from '../routes'
//import NProgress from 'nprogress'
export default {
data() {
... ... @@ -66,11 +66,7 @@
handleReset2() {
this.$refs.ruleForm2.resetFields();
},
/**
* 处理登陆后的账号对应的菜单
* @param menuList
*/
handleMenuList: function (router,menu) {
handleMenuList : function (router,menu) {
var _self = this;
var routerName = "";
router.forEach(function (v_router) {
... ... @@ -84,14 +80,18 @@
//匹配到继续判断是否子元素,有子元素继续递归
if (result) {
if(v_router.children) {
_self.handleMenuList(v_router.children,v_menu.children);
_self.handleMenuList(v_router.children,result.children);
}
//没有则可以移除
}else {
router.splice(router.findIndex(itm => itm.name === routerName ),1);
}
})
})
});
console.log("longined router:");
console.log(_self.$router.options.routes);
//本地存储用户目录 ，防刷新目录丢失用
sessionStorage.setItem('menu', JSON.stringify(_self.$router.options.routes));
},
handleSubmit2: function (ev) {
var _this = this;
... ... @@ -105,8 +105,10 @@
this.logining = false;
//NProgress.done();
let status = res.status;
let user = res.data.principal;
let loginSuccess = res.data.authenticated;
let authentication = res.data.authentication;
let user = authentication.principal;
let loginSuccess = authentication.authenticated;
let loginUserMenus = res.data.loginUserMenus;
if (status !== 200) {
let msg = "登录错误";
this.$message({
... ... @@ -115,14 +117,20 @@
});
} else if (loginSuccess) {
sessionStorage.setItem('user', JSON.stringify(user));
getuserMenus('').then(res => {
if(res && res.status===200){
_this.userMenus = res.data.list;
this.handleMenuList(routes.routes,_this.userMenus);
//本地存储用户目录 ，防刷新目录丢失用
sessionStorage.setItem('menu', JSON.stringify(routes.routes));
}
});
//处理用户menu
_this.userMenus = loginUserMenus.list;
console.log("userMenus:");
console.log(_this.userMenus);
console.log(loginUserMenus.list);
let sysMenus = _this.$router.options.routes;
console.log("sysMenus:");
console.log(sysMenus);
_this.handleMenuList(sysMenus,_this.userMenus);
console.log("user:");
console.log(_this.$router.options.routes);
this.$router.push({path: '/main'});
}
}).catch(error => {
... ...
... ... @@ -5,7 +5,26 @@
</template>
<script>
import rt from '../routes'
export default {
mounted() {
var _this = this;
var user = sessionStorage.getItem('user');
if (user) {
user = JSON.parse(user);
this.sysUserName = user.username || '';
this.sysUserAvatar = user.userface || '/static/images/faceDefault.jpg';
}
//操作路由,判断本地存储的用户栏目列表是否存在，如果存在则加载路由
var userRouters = sessionStorage.getItem('menu');
if (userRouters) {
userRouters = JSON.parse(userRouters);
let sysMenus = _this.$router.options.routes;
rt.handleMenuList(sysMenus,userRouters);
console.log("main:");
console.log(_this.$router.options.routes);
}
}
}
</script>
... ...