朱兆平 / vue_cli · 提交

转到一个项目

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

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

内嵌 并排对比
正在显示 6 个修改的文件 包含 100 行增加 和 31 行删除
@@ -17,7 +17,6 @@ export const requestLogin = params => { @@ -17,7 +17,6 @@ export const requestLogin = params => {
17 for (let it in data) { 17 for (let it in data) {
18 ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&' 18 ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&'
19 } 19 }
20 - console.log(ret)  
21 return ret 20 return ret
22 }], 21 }],
23 headers: { 22 headers: {
@@ -28,15 +28,15 @@ Vue.use(VueRouter) @@ -28,15 +28,15 @@ Vue.use(VueRouter)
28 Vue.use(Vuex) 28 Vue.use(Vuex)
29 29
30 //NProgress.configure({ showSpinner: false }); 30 //NProgress.configure({ showSpinner: false });
31 - 31 +console.log("mainjs:");
  32 +console.log(rout.routes);
32 const router = new VueRouter({ 33 const router = new VueRouter({
33 routes:rout.routes 34 routes:rout.routes
34 -})  
35 -//判断本地存储的用户栏目列表是否存在，如果存在则加载路由  
36 -if(sessionStorage.getItem('menu')){  
37 - rout.setUserMenus(JSON.parse(sessionStorage.getItem('menu')));  
38 - router.options.routes = rout.routes  
39 -} 35 +});
  36 +
  37 +//本地存储系统初始化的router路由,用来处理用户退出后,把路由数据初始化
  38 +sessionStorage.setItem('sysMenu', JSON.stringify(rout.routes));
  39 +
40 router.beforeEach((to, from, next) => { 40 router.beforeEach((to, from, next) => {
41 //NProgress.start(); 41 //NProgress.start();
42 if (to.path == '/login') { 42 if (to.path == '/login') {
@@ -84,11 +84,37 @@ let routes = [ @@ -84,11 +84,37 @@ let routes = [
84 redirect: { path: '/404' } 84 redirect: { path: '/404' }
85 } 85 }
86 ]; 86 ];
87 - 87 +let initRouters = routes.concat();
88 let setUserMenus = function (list) { 88 let setUserMenus = function (list) {
89 routes = list; 89 routes = list;
90 - let s= 1; 90 +}
  91 +/**
  92 + * 处理登陆后的账号对应的菜单
  93 + * @param menuList
  94 + */
  95 +let handleMenuList = function (router,menu) {
  96 + var _self = this;
  97 + var routerName = "";
  98 + router.forEach(function (v_router) {
  99 + routerName = v_router.name;
  100 + menu.forEach(function (v_menu) {
  101 + //查找返回的目录列表是否包含路由名称,有就返回匹配到的元素,没有就移除
  102 + let result = menu.find(item => {
  103 + return item.name === routerName;
  104 + });
  105 +
  106 + //匹配到继续判断是否子元素,有子元素继续递归
  107 + if (result) {
  108 + if(v_router.children) {
  109 + _self.handleMenuList(v_router.children,result.children);
  110 + }
  111 + //没有则可以移除
  112 + }else {
  113 + router.splice(router.findIndex(itm => itm.name === routerName ),1);
  114 + }
  115 + })
  116 + });
91 } 117 }
92 export default { 118 export default {
93 - routes,setUserMenus 119 + routes,setUserMenus,handleMenuList,initRouters
94 }; 120 };
@@ -71,7 +71,8 @@ @@ -71,7 +71,8 @@
71 </template> 71 </template>
72 72
73 <script> 73 <script>
74 - export default { 74 + import rt from '../routes'
  75 + export default {
75 data() { 76 data() {
76 return { 77 return {
77 sysName:'流浪地球管理系统', 78 sysName:'流浪地球管理系统',
@@ -109,6 +110,13 @@ @@ -109,6 +110,13 @@
109 //type: 'warning' 110 //type: 'warning'
110 }).then(() => { 111 }).then(() => {
111 sessionStorage.removeItem('user'); 112 sessionStorage.removeItem('user');
  113 + sessionStorage.removeItem('menu');
  114 +
  115 + //退出后初始化原来的路由
  116 + let sysRoutes = JSON.parse(sessionStorage.getItem('sysMenu'));
  117 + console.log(sysRoutes);
  118 + _this.$router.options.routes = sysRoutes;
  119 +
112 _this.$router.push('/login'); 120 _this.$router.push('/login');
113 }).catch(() => { 121 }).catch(() => {
114 122
@@ -125,13 +133,22 @@ @@ -125,13 +133,22 @@
125 } 133 }
126 }, 134 },
127 mounted() { 135 mounted() {
  136 + var _this = this;
128 var user = sessionStorage.getItem('user'); 137 var user = sessionStorage.getItem('user');
129 if (user) { 138 if (user) {
130 user = JSON.parse(user); 139 user = JSON.parse(user);
131 this.sysUserName = user.username || ''; 140 this.sysUserName = user.username || '';
132 this.sysUserAvatar = user.userface || '/static/images/faceDefault.jpg'; 141 this.sysUserAvatar = user.userface || '/static/images/faceDefault.jpg';
133 } 142 }
134 - 143 + //操作路由,判断本地存储的用户栏目列表是否存在，如果存在则加载路由
  144 + var userRouters = sessionStorage.getItem('menu');
  145 + if (userRouters) {
  146 + userRouters = JSON.parse(userRouters);
  147 + let sysMenus = _this.$router.options.routes;
  148 + rt.handleMenuList(sysMenus,userRouters);
  149 + console.log("home:");
  150 + console.log(_this.$router.options.routes);
  151 + }
135 } 152 }
136 } 153 }
137 154
@@ -33,7 +33,7 @@ @@ -33,7 +33,7 @@
33 33
34 <script> 34 <script>
35 import { requestLogin,getuserMenus } from '../api/api'; 35 import { requestLogin,getuserMenus } from '../api/api';
36 - import routes from '../routes' 36 + import rt from '../routes'
37 //import NProgress from 'nprogress' 37 //import NProgress from 'nprogress'
38 export default { 38 export default {
39 data() { 39 data() {
@@ -66,11 +66,7 @@ @@ -66,11 +66,7 @@
66 handleReset2() { 66 handleReset2() {
67 this.$refs.ruleForm2.resetFields(); 67 this.$refs.ruleForm2.resetFields();
68 }, 68 },
69 - /**  
70 - * 处理登陆后的账号对应的菜单  
71 - * @param menuList  
72 - */  
73 - handleMenuList: function (router,menu) { 69 + handleMenuList : function (router,menu) {
74 var _self = this; 70 var _self = this;
75 var routerName = ""; 71 var routerName = "";
76 router.forEach(function (v_router) { 72 router.forEach(function (v_router) {
@@ -84,14 +80,18 @@ @@ -84,14 +80,18 @@
84 //匹配到继续判断是否子元素,有子元素继续递归 80 //匹配到继续判断是否子元素,有子元素继续递归
85 if (result) { 81 if (result) {
86 if(v_router.children) { 82 if(v_router.children) {
87 - _self.handleMenuList(v_router.children,v_menu.children); 83 + _self.handleMenuList(v_router.children,result.children);
88 } 84 }
89 //没有则可以移除 85 //没有则可以移除
90 }else { 86 }else {
91 router.splice(router.findIndex(itm => itm.name === routerName ),1); 87 router.splice(router.findIndex(itm => itm.name === routerName ),1);
92 } 88 }
93 }) 89 })
94 - }) 90 + });
  91 + console.log("longined router:");
  92 + console.log(_self.$router.options.routes);
  93 + //本地存储用户目录 ，防刷新目录丢失用
  94 + sessionStorage.setItem('menu', JSON.stringify(_self.$router.options.routes));
95 }, 95 },
96 handleSubmit2: function (ev) { 96 handleSubmit2: function (ev) {
97 var _this = this; 97 var _this = this;
@@ -105,8 +105,10 @@ @@ -105,8 +105,10 @@
105 this.logining = false; 105 this.logining = false;
106 //NProgress.done(); 106 //NProgress.done();
107 let status = res.status; 107 let status = res.status;
108 - let user = res.data.principal;  
109 - let loginSuccess = res.data.authenticated; 108 + let authentication = res.data.authentication;
  109 + let user = authentication.principal;
  110 + let loginSuccess = authentication.authenticated;
  111 + let loginUserMenus = res.data.loginUserMenus;
110 if (status !== 200) { 112 if (status !== 200) {
111 let msg = "登录错误"; 113 let msg = "登录错误";
112 this.$message({ 114 this.$message({
@@ -115,14 +117,20 @@ @@ -115,14 +117,20 @@
115 }); 117 });
116 } else if (loginSuccess) { 118 } else if (loginSuccess) {
117 sessionStorage.setItem('user', JSON.stringify(user)); 119 sessionStorage.setItem('user', JSON.stringify(user));
118 - getuserMenus('').then(res => {  
119 - if(res && res.status===200){  
120 - _this.userMenus = res.data.list;  
121 - this.handleMenuList(routes.routes,_this.userMenus);  
122 - //本地存储用户目录 ，防刷新目录丢失用  
123 - sessionStorage.setItem('menu', JSON.stringify(routes.routes));  
124 - }  
125 - }); 120 + //处理用户menu
  121 + _this.userMenus = loginUserMenus.list;
  122 + console.log("userMenus:");
  123 + console.log(_this.userMenus);
  124 + console.log(loginUserMenus.list);
  125 + let sysMenus = _this.$router.options.routes;
  126 +
  127 + console.log("sysMenus:");
  128 + console.log(sysMenus);
  129 +
  130 + _this.handleMenuList(sysMenus,_this.userMenus);
  131 +
  132 + console.log("user:");
  133 + console.log(_this.$router.options.routes);
126 this.$router.push({path: '/main'}); 134 this.$router.push({path: '/main'});
127 } 135 }
128 }).catch(error => { 136 }).catch(error => {
@@ -5,7 +5,26 @@ @@ -5,7 +5,26 @@
5 </template> 5 </template>
6 6
7 <script> 7 <script>
  8 + import rt from '../routes'
8 export default { 9 export default {
  10 + mounted() {
  11 + var _this = this;
  12 + var user = sessionStorage.getItem('user');
  13 + if (user) {
  14 + user = JSON.parse(user);
  15 + this.sysUserName = user.username || '';
  16 + this.sysUserAvatar = user.userface || '/static/images/faceDefault.jpg';
  17 + }
  18 + //操作路由,判断本地存储的用户栏目列表是否存在，如果存在则加载路由
  19 + var userRouters = sessionStorage.getItem('menu');
  20 + if (userRouters) {
  21 + userRouters = JSON.parse(userRouters);
  22 + let sysMenus = _this.$router.options.routes;
  23 + rt.handleMenuList(sysMenus,userRouters);
  24 + console.log("main:");
  25 + console.log(_this.$router.options.routes);
  26 + }
  27 + }
9 } 28 }
10 29
11 </script> 30 </script>