处理权限功能

src/api/index.js

@@ -2,8 +2,9 @@ import Setting from "@/setting";
 // let host = Setting.apiBaseURL
 // let host = "http://192.168.31.151:9000/"; // 榕
 // let host = 'http://192.168.31.125:9000/'; // 坤
+let host = 'http://192.168.31.137:9000/'; // 赓
+// let host = "http://39.108.250.202:9000/"; // 测试服
 
-let host = "http://39.108.250.202:9000/"; // 测试服
 
 
 let uploadURL = Setting.upload.apiURL;
@@ -18,6 +19,8 @@ export default {
     // bindPhoneOrEmail:`${host}users/users/userAccount/bindPhoneOrEmail`,// 绑定手机
     // sendPhoneOrEmailCode:`${host}users/users/userAccount/sendPhoneOrEmailCode`,// 手机验证码
 
+    // 权限管理
+    getUserRolesPermissionMenu: `${host}users/user-role/getUserRolesPermissionMenu`, 
 
     //学生管理
     resetPassword: `${host}users/users/userAccount/resetPwd`, // 密码重置

src/libs/util.db.js

@@ -22,6 +22,7 @@ var _local = {
             localStorage.setItem(key, value);
         }
     },
+
     //取出
     get(key) {
         let item = localStorage.getItem(key);
@@ -35,7 +36,6 @@ var _local = {
         // 如果有startTime的值，说明设置了失效时间
         if (item && item.startTime) {
             let date = new Date().getTime();
-
             // 如果大于就是过期了，如果小于或等于就还没过期
             if (date - item.startTime > item.expires) {
                 localStorage.removeItem(key);

src/main.js

@@ -36,6 +36,11 @@ const i18n = new VueI18n({
     messages
 });
 
+function auth(values){
+    // 直接拿值进行匹配,取得当前router的mate信息,传入，返回一个boolean，以此进行vif判断
+        
+}
+Vue.use(auth)// 鉴权函数
 new Vue({
     mixins: [mixinApp],
     router,

src/plugins/auth/index.js

@@ -23,5 +23,6 @@ export default {
                 el.parentNode && el.parentNode.removeChild(el);
             }
         }
-    }
+    },
+    
 };

src/router/index.js

@@ -2,6 +2,10 @@ import Vue from "vue";
 import Router from "vue-router";
 import routes from "./routes";
 import Setting from "@/setting";
+import {get} from "@/plugins/requests/index.js";
+import api from "@/api";
+import util from "@/libs/util";
+import { permission } from '@/router/permission';
 
 Vue.use(Router);
 
@@ -12,11 +16,61 @@ const createRouter = () => new Router({
     routes
 });
 
+
 export function resetRouter() {
     const newRouter = createRouter();
-    router.matcher = newRouter.matcher;
+    router.matcher = newRouter.matcher
 }
 
 let router = createRouter();
 
-export default router;
+
+export default router;
+
+function getPermission(){
+    get(api.getUserRolesPermissionMenu).then(res => {
+        console.log(res,'权限的值')
+        // 取得路由的值，使用addRouter添加进路由里
+        let permissionRouters = []
+        let data = res.permissionMenu[0].children 
+        if(data.length>0){
+            data.forEach(e=>{
+                // 循环，取得主路由以及路由信息，重复循环，取得
+                let obj = {
+                    path:e.path,
+                    name:e.name,
+                    component:`../pages${e.path}`,
+                    meta:[],
+                }
+                // 取得页面内的次级路由以及页面按钮
+                if(e.children&&e.children.length>0){
+                    // 先判断是否有path，有就是页面
+                    e
+                    // 其他的是按钮
+
+                }
+            })
+        }
+
+    })
+}
+// 权限
+router.beforeEach((to,from,next)=>{
+    if(to.path == '/login'){
+        localStorage.removeItem(Setting.tokenKey)
+    }
+    if(util.local.get(Setting.tokenKey)){
+        if(!sessionStorage.getItem('handelPermission')){
+            getPermission()
+            
+        }
+    }else{
+        if (to.path !== '/login') {
+            next({ path: '/login',
+                query:{redirect:to.path}
+            })
+        }
+    }
+    next()
+
+})

src/router/permission.js

@@ -4,7 +4,7 @@ import util from "@/libs/util";
 
 router.beforeEach((to, from, next) => {
     document.title = Setting.titleSuffix;
-    const role = util.local.get(Setting.tokenKey);
+    const role = util.local.get(Setting.tokenKey); 
     if (!role && to.path !== "/login") {
         next("/login");
     } else if (role && to.path == "/login") {

src/router/routes.js

@@ -1,3 +1,4 @@
+// 引入模块化的路由
 import assessment from "./modules/assessment";
 import achievement from "./modules/achievement";
 import evaluation from "./modules/evaluation";
@@ -12,6 +13,7 @@ import information from "./modules/information";
 import BasicLayout from "@/layouts/home";
 
 const frameIn = [
+    // 默认路由配置
     {
         path: "/",
         redirect: "/login"
@@ -26,6 +28,7 @@ const frameIn = [
         meta: { title: "首页" },
         children: []
     },
+    // 以下为引入的路由,权限写好直接删掉
     assessment,
     achievement,
     evaluation,

src/store/modules/user.js

@@ -43,7 +43,8 @@ export default {
                         // 生成路由权限
                         // 每个系统都是用这套角色权限代码的,后端也是基本一样,除了个别字段可能会不一样
                         // 总体来说就两个步骤: 1是生成能够访问的路由的数组集合,2是生成能看到的按钮的数组集合
-                        //res.message.listValue && Setting.dynamicRoute && addRoutes(res.message.listValue)
+                        // res.message.listValue && Setting.dynamicRoute && addRoutes(res.message.listValue)
+                        // 2021-10-13重做权限，因权限系统封装
                         util.local.set(Setting.tokenKey, data.token, Setting.tokenExpires);
                         util.successMsg("登录成功");
                         console.log(data, "登录保存的数据");