后台权限管理怎么写

235 阅读1分钟

首先在router文件写上

  router.beforeEach(async (to, from, next) => {
      if (Setting.showProgressBar) iView.LoadingBar.start();
      console.log(to)
      if(to.name ==='dashboard-console'){
          next();
      }

      // 判断是否需要登录才可以进入
      if (to.matched.some(_ => _.meta.auth)) {
          // 这里依据 token 判断是否登录,可视情况修改
          const token = util.cookies.get('access_token');
          // const verifyOpt = util.cookies.get('verifyOpt');
          // const loginWay = util.cookies.get('loginWay');
          // const isVerify = verifyOpt || loginWay === 'jumpCloud';

          if (!isNil(token)) {
              console.log(566)

              const userInfo = await store.dispatch('admin/db/get', {
                  dbName: 'sys',
                  path: 'user.info',
                  defaultValue: {},
                  user: true
              }, { root: true }).catch(()=>{})

              const access = userInfo.access;
              console.log(access)
              const isPermission = includeArray(to.meta.auth, access);
              console.log(isPermission)
              if (isPermission) {
                  next();
              } else {
                  next({
                      name: '403'
                  });
              }
              next()
          } else {
              // 没有登录的时候跳转到登录界面
              // 携带上登陆成功之后需要跳转的页面完整路径
              next({
                  name: '/',
                  query: {
                      redirect: to.fullPath
                  }
              });
          }
      } else {
          // 不需要身份校验 直接通过
          next();
      }
  });  

然后在路由子文件写上

	export default {
    path: '/application',
    name: 'application',
    meta: {
        auth: ['ROLE_APP','ROLE_APP_READ']
    },
    component: BasicLayout,
    children: [
        {
            path: 'applicationList',
            name: `${pre}List`,
            meta: {
                title: '$t:page.menu.application.al',
                auth: ['ROLE_APP','ROLE_APP_READ'],
            },
            component: () => import('@/pages/application/applicationList')
        },

如果想菜单隐藏,就在菜单写上

	 path: '/application',
    title: '$t:page.menu.application.title',
    header: 'home',
    icon: 'ios-apps',
    auth: ['ROLE_APP','ROLE_APP_READ'],