role-control

这是一个角色权限控制的js库,只提供基本的三个方法,就可以轻松的完全权限控制管理功能

Usage no npm install needed!

<script type="module">
  import roleControl from 'https://cdn.skypack.dev/role-control';
</script>

README

role-control

这是一个角色权限控制的js库,只提供基本的三个方法,就可以轻松的完全权限控制管理功能

如何创建角色成员

首先你先要确定好你的角色关系,可以有多层嵌套关系,但是尽量不要有互相嵌套

首先需要创建这样一个角色关系对象,某个角色如果不拥有其他角色的权限,只需设置为true即可

如果像Leader这种角色,需要获取下级角色权限,则需要设置为对象

let roles = {
  super: true,

  sales: true,
  salesLeader: {
    includes: ['sales'],
  },

  produce: true,
  produceLeader: {
    includes: ['produce', 'finance']
  },

  skill: true,
  skillLeader: {
    includes: ['skill', 'produceLeader']
  },

  finance: true,

  vicChairman: {
    includes: ['skillLeader'],
    excludes: ['produceLeader'],
    extras: ['finance']
  }
}

对象内成员

includes

​填写需要下级成员名单,类型为数组,如上salesLeader可以获取sales权限

​同样如上,skillLeader也可以获取produceLeader的权限,即他可以访问的权限如下

  • skillLeader
  • skill
  • produceLeader
  • produce
excludes

​如果你想让当前角色获取下级的权限,但是又不想得到更下级的某个权限,那你可以放入excludes名单中,他同样是一个数组

​如上vicChairman希望拿到skillLeader的权限,但是又不需要skillLeaderproduceLeader,那你可以放入excludes中,

​不过需要注意此时produceLeader下的所有权限都将无法获得

extras

extras是额外的意思,他仅仅是作为includes中拥有,但又被excludes下级中排除,但是又想获取更下级的某个权限,那你就可以使用他

但是希望尽可能的不要使用他!!!

​如上vicChairman希望拿到skillLeader的权限,但是又不需要skillLeaderproduceLeader,可是又需要produceLeaderfinance权限,

​此时如果你将finance放入includes中是无效的,他的上级已经在excludes中,所以如果你想单独获取他的权限,那你只能放入extras

如何使用

createRolesMap

本库只暴露该方法,将上面创建好的对象传递给该函数,他会递归创建角色关系图,并返回一个对象,对象内包含两个方法

let roleManage = createRolesMap(roles)
console.log(roleManage)//{filterMenus,isConfirm}
返回的对象包含的两个方法
filterMenus
  • 将你的routes或其他嵌套的对象中设置key:__role,如下

    let routes = {
      route1: {
        children: [
          {
            name: 'produceLeader--sales',
            __role: ['produceLeader', 'sales']
          },
          {
            name: 'finance',
            __role: 'finance'
          }
        ]
    
      },
      route2: {
        name: 'produceLeader',
        __role: ['produceLeader']
      },
      route3: {
        name: 'finance',
        __role: ['finance'],
        children: [
          {
            name: 'skillLeader',
            __role: 'skillLeader'
          },
          {
            name: 'skill',
            __role: 'skill'
          }
        ]
      },
    }
    
  • 此时调用filterMenus,传入routes,以及当前角色,将会返回根据当前角色过滤的一个新的routes

     const filterRoutes = roleManage.filterMenus(routes, 'super')
    
isConfirm

​此时如果你有个需求,一个按钮,需要判断当前角色是否应该展示,你就可以通过isConfirm方法来进行判断

  • 参数1:当前按钮只在哪些角色中展示,可以是角色名,也可以是一个数组
  • 参数2:传入当前的角色,可以是数组或角色名
 let sales = roleManage.isConfirm('sales', ['sales', 'salesLeader'])
 let produce = roleManage.isConfirm('produce', ['produce', 'produceLeader'])
 let skill = roleManage.isConfirm('skill', ['skill', 'skillLeader'])
 let vicChairmanAndFinance = roleManage.isConfirm(['produceLeader', 'finance'], 'vicChairman')

将参数1和参数2进行逐一比对,只要有一个角色可以通行,那么isConfirm返回true

比对结束后如果还没有返回true,那么就会返回false