z 动态路由权限管理
// 用户登录板块的仓库
import { reqLogin, reqLogout, reqUserList, reqRoleList, reqRuleList, reqUserInfo } from "@/api/user";
import router from "@/router";
import { setToken, getToken, setTokenTime, removeToken, removeTokenTime } from "@/util/token";
import { constantRoutes, asyncRoutes } from '@/router/routes'
const state = {
token: getToken(), // token
userInfo: {}, // 用户信息
userList: [],
total: 0,
roleList: [],
roleListTotal: 0,
ruleList: [],
resultAllRoutes: [],
btns: [],
}
const mutations = {
// 用户登录信息
LOGIN(state, userInfo) {
// state.userInfo = userInfo;
state.token = userInfo.token_info.token;
setToken(userInfo.token_info.token);
setTokenTime(userInfo.token_info.exp)
},
// 清除登录信息
LOGOUT(state) {
state.userInfo = {};
removeToken();
removeTokenTime()
},
// 存储用户列表
GETUSERLIST(state, data) {
state.userList = data.list;
state.total = data.total;
},
// 存储角色列表
GETROLELIST(state, data) {
state.roleList = data.list;
state.roleListTotal = data.total;
},
// 存储菜单列表
GETRULELIST(state, data) {
state.ruleList = data.list;
},
// 存储用户信息
GETUSERINFO(state, userinfo) {
state.userInfo = userinfo
state.btns = userinfo.btns
},
// 动态生成路由
SET_RESULT_ASYNCROUTES(state, routes) {
state.resultAllRoutes = constantRoutes.concat(routes)
// console.log(routes);
// 给路由器添加新的路由
// router.matcher = new router().matche
let hasRoutes = router.getRoutes();
// router.addRoutes(state.resultAllRoutes)
state.resultAllRoutes.forEach(item => {
if (hasRoutes.findIndex(item1 => item1.name == item.name) == -1) {
router.addRoute(item)
}
});
}
}
// 递归生成路由
function getAynscRouter(asyncRoutes, routes) {
let routeArr = [];
asyncRoutes.forEach(item => {
if (routes.indexOf(item.name) != -1) {
// console.log(item);
let route = {
path: item.path,
name: item.name,
component: item.component,
meta: item.meta,
}
// 判断路由是否隐藏
if (item.hasOwnProperty('hidden')) {
route.hidden = true;
}
// 判断路由是否有子路由
if (item.children && item.children.length) {
// console.log(route)
route.children = getAynscRouter(item.children, routes);
}
routeArr.push(route);
}
})
return routeArr;
// return asyncRoutes.filter(item => {
// if (routes.indexOf(item.name) != -1) {
// if (item.children && item.children.length) {
// getAynscRouter(item.children, routes);
// }
// return true;
// }
// })
}
const actions = {
// 用户登录
async login({ commit }, userInfo) {
const { username, password } = userInfo;
let result = await reqLogin(username, password);
// console.log(result)
if (result.code == 200) {
commit('LOGIN', result.data);
return Promise.resolve(result);
} else {
return Promise.reject('fail')
}
},
// 退出登录
async logout({ commit }) {
let result = await reqLogout();
if (result.code == 200) {
commit('LOGOUT', result.data);
return Promise.resolve(result);
} else {
return Promise.reject('fail')
}
},
// 用户列表
async getUserList({ commit }, obj) {
const { page, limit, keyword } = obj;
let result = await reqUserList(page, limit, keyword);
if (result.code == 200) {
commit('GETUSERLIST', result)
}
// console.log(result);
},
// 角色列表
async getRoleList({ commit }, data = {}) {
let result = await reqRoleList(data);
// console.log(result);
if (result.code == 200) {
commit('GETROLELIST', result);
}
},
// 菜单规则列表
async getRuleList({ commit }) {
let result = await reqRuleList();
// console.log(result);
if (result.code == 200) {
commit('GETRULELIST', result);
}
},
// 用户信息
async getUserInfo({ commit }) {
let result = await reqUserInfo();
// console.log(result);
if (result.code == 200) {
commit('GETUSERINFO', result.data)
commit('SET_RESULT_ASYNCROUTES', getAynscRouter(asyncRoutes, result.data.routes))
}
}
}
const getters = {
}
export default {
state,
mutations,
actions,
getters
}
免责申明：
1. 本站所有教程、文章或资源分享目的仅供大家学习和交流！
2. 如有无法查看或链接失效，麻烦请报告联系管理员处理！
3. 本站无法保证资源或其时效性，恕不接受任何提问。
4. 在本站下载的源码严禁杜绝任何形式的正式商业用途，请去程序官方购买。 所有资料均来自于网络，版权归原创者所有！本站不提供任何保证，并不承担任何法律责任，如果对您的版权或者利益造成损害，请提供相应的资质证明，我们将于3个工作日内予以删除。
