基于RBAC的权限管理VbenAdmin前端实现

svbadmin学习日志

本学习日志是使用Springboot和Vue来搭建的后台管理系统：
演示地址：http://118.31.68.110:8081/index.html
账号：root
密码：123
所有代码可以在gitbub上找到，切换到相应分支即可。【代码传送门】

正篇

第一节 spring boot 模块化构建项目
第二节 整合mybatisplus完成用户增删改查
第三节 整合springsecurity实现基于RBAC的用户登录
第四节 springsecurity结合jwt实现前后端分离开发
第五节 使用ResponseBodyAdvice格式化接口输出
第六节 springboot结合redis实现缓存策略
第七节 springboot结合rabbitmq实现队列消息
第八节 springboot结合rabbitmq实现异步邮件发送
第九节 利用springboot的aop实现行为日志管理
第十节 利用Quartz实现数据库定时备份
第十一节 springboot配置log输出到本地文件
第十二节 使用flyway对数据库进行版本管理
第十三节 springboot配合VbenAdmin实现前端登录
第十四节 springboot配合VbenAdmin实现用户CURD
第十五节 基于RBAC的权限管理VbenAdmin前端实现
第十六节 springboot 打包vue代码实现前后端统一部署

番外

2.1 数据库设计原则
3.1 配置apifox自动获取登录的token
13.1 springboot 全局捕捉filter中的异常
14.1 springsecurity整合mybatisplus出现isEnable的问题和解决方案

前言

第三节中我们实现利用spring security实现了基于RBAC的权限管理，并且通过Method的设计实现了Restful风格的接口设计。
接下来基于之前设计，我们在VbenAdmin上进行实现。此次对前后端的修改都比较多，所以花了不少时间，以下就几个关键点进行说明，其他的代码可以直接到github上下载。

---

一、递归生成菜单结构

由于菜单一般都是层级结构的，所以实现菜单显示，需要在后端生成树形结构的菜单，核心代码如下：

/**
* Notes:  递归查找叶子节点，构建菜单
* @param: [id, permissionList]
* @return: java.util.List
* Author: 涛声依旧 [email protected]
* Time: 2022/9/8 09:23
**/
public static List<Map<String, Object>> findChildren(Long id, List<Permission> permissionList){
   List<Map<String, Object>> children = new ArrayList<Map<String, Object>>();
   for (Permission permission : permissionList) {
       if(permission.getPid().equals(id)){
           Map<String, Object> menuChildMap = new HashMap<>();
           menuChildMap.put("id",permission.getId());
           menuChildMap.put("pid",permission.getPid());
           menuChildMap.put("path",permission.getPath());
           menuChildMap.put("name",permission.getName());
           menuChildMap.put("component",permission.getComponent());
           menuChildMap.put("createTime",permission.getCreatedAt());
           menuChildMap.put("orderNo",permission.getOrderNo());
           menuChildMap.put("status",permission.getStatus());
           menuChildMap.put("type",permission.getType());
           menuChildMap.put("icon",permission.getIcon());
           menuChildMap.put("showFlag",permission.getShowFlag());
           menuChildMap.put("title",permission.getTitle());
           menuChildMap.put("requestUrl",permission.getRequestUrl());
           menuChildMap.put("requestMethod",permission.getRequestMethod());

           Map<String, Object> metaChildMap = new HashMap<>();
           metaChildMap.put("title",permission.getTitle());
           metaChildMap.put("icon",permission.getIcon());

           menuChildMap.put("meta",metaChildMap);
           menuChildMap.put("children",findChildren(permission.getId(),permissionList));
           children.add(menuChildMap);
       }
   }
   // 根据orderNo排序 https://www.cnblogs.com/mr-wuxiansheng/p/7768491.html
   Collections.sort(children, new Comparator<Map<String, Object>>() {
       public int compare(Map<String, Object> o1, Map<String, Object> o2) {
           Integer name1 = Integer.valueOf(o1.get("orderNo").toString()) ;//name1是从你list里面拿出来的一个
           Integer name2 = Integer.valueOf(o2.get("orderNo").toString()) ; //name1是从你list里面拿出来的第二个name
           return name1.compareTo(name2);
       }
   });

   return children;
}

/**
* Notes:  递归找到某个权限的所有父节点，协助生成菜单结构
* @param: [permission, allPermissionList, fathers]
* @return: void
* Author: 涛声依旧 [email protected]
* Time: 2022/9/19 16:10
**/
public static void findFathers(Permission permission, List<Permission> allPermissionList , List<Permission> fathers){
   if (permission.getId() != 0L){
       for (Permission permission1 : allPermissionList) {
           if (permission.getId().equals(permission1.getId())){
               if (!fathers.contains(permission1)){
                   fathers.add(permission1); // 加入自身
               }
           }
           if (permission1.getId().equals(permission.getPid())){
               if (!fathers.contains(permission1)){
                   fathers.add(permission1); // 加入父亲
               }
               findFathers(permission1,allPermissionList,fathers); // 继续寻找父亲的父亲
           }
       }
   }
}

/**
 * Notes:  获得用户的菜单
 * @param: [id]
 * @return: java.util.List>
 * Author: 涛声依旧 [email protected]
 * Time: 2022/9/19 16:38
 **/
@Override
public List<Map<String, Object>> getMenusByUid(BigInteger id) {
    List<Permission> permissionList = getPermissionsByUid(id);
    List<Permission> allPermissionList = getAllPermissions();
    List<Permission> fathers = new ArrayList<>();

    // 找到所有父节点菜单
    for (Permission permission : permissionList) {
        AuthUtil.findFathers(permission,allPermissionList,fathers);
    }

    // 去掉按钮
    List<Permission> menuList = new ArrayList<Permission>();
    for (Permission permission : fathers) {
        if (permission.getType() != 2){
            menuList.add(permission);
        }
    }

    // 生成目录结构
    List<Map<String, Object>> treeMenu = AuthUtil.findChildren(0L,menuList);
    return treeMenu;
}

二、将权限点分配给角色

/**
 * Notes:  同时修改角色和权限的关系
 * @param: [entity]
 * @return: boolean
 * Author: 涛声依旧 [email protected]
 * Time: 2022/9/17 17:29
 **/
@Override
public boolean updateById(Role entity) {
    // 1. 删除所有改角色的权限点
    QueryWrapper<RolePermission> queryWrapper=new QueryWrapper<>();
    queryWrapper.eq("rid", entity.getId());
    rolePermissionService.remove(queryWrapper);
    // 2. 重新给该角色赋予权限点
    List<RolePermission> rolePermissions = new ArrayList<>();
    for (Long menu : entity.getMenu()) {
        RolePermission rolePermission = new RolePermission();
        rolePermission.setPid(menu);
        rolePermission.setRid(entity.getId());
        rolePermissions.add(rolePermission);
    }
    rolePermissionService.saveBatch(rolePermissions);
    // 更新该角色的其他信息
    return super.updateById(entity);  // TODO 需要进行事务处理
}

三、前端展现

前端这边的代码基本上用了Vben自己的代码，修改了部分字段名字，实现了后端的接口。
效果如下：

---

总结

1. Vben的前端预留界面还是不错的，直接用就行
2. 对于递归的理解是菜单管理的关键

---

代码地址

Springboot 代码
VbenAdmin 代码

---

参考文档：
MyBatis-Plus的saveBatch批量插入为何效率很低，耗时很长，怎么解决（）
MyBatis 批量插入数据的 3 种方法！
三分钟学会使用Mybatis-Plus——笔记