【SaaS - Export项目】17 - 给用户授予角色，更新用户的角色来实现授权，使用checkbox复选框选择角色（非zTree）

浅浅的花香味﹌ 2022-12-19 11:54 107阅读 0赞

### 文章目录 ###

*   *   *  1. export\_domain子工程Role类添加字段checked
         *  2. export\_system\_service子工程编写测试类
         *  3. export\_system\_service子工程的service接口和实现类
         *  4. export\_dao子工程写dao接口及其映射
         *  5. export\_web\_manager子工程编写controller
         *  6. export\_web\_manager子工程编写jsp页面

效果图  
![在这里插入图片描述][20201107153647479.gif_pic_center]  
只需要对用户角色表一张表进行操作就行。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwNTQyNTM0_size_16_color_FFFFFF_t_70_pic_center]

### 1. export\_domain子工程Role类添加字段checked ###

`Role` 因为用复选框显示所有信息，回显的时候需要给用户已经拥有的角色打钩，通过checked来实现判断。

//在角色列表中打上勾，是否选中该角色
        private boolean checked;
        
        public boolean isChecked() { 
            return checked;
        }
        public void setChecked(boolean checked) { 
            this.checked = checked;
        }

### 2. export\_system\_service子工程编写测试类 ###

`TestRoleService`

//测试查询公司所有的角色、查询用户的角色
        @Test
        public void test05(){ 
            //user的角色列表
            String userId="e0de22fe-2c50-4216-ad75-ed0494d2dc92";
            String companyId="1";
            //所有的角色
            List<Role> allList =  iRoleService.findAll(companyId);
            //查找user自己的角色
            List<Role> userList =  iRoleService.findRolesByUserId(userId);
            l.info("test05 公司的所有角色的数量："+ allList.size() +"\tallList = "+allList);
            l.info("test05 用户的角色的数量： "+ userList.size() +"\tuserList = "+userList);
        }
    
        //测试给用户更新角色
        @Test
        public void test06(){ 
            //老王的角色列表
            String userId="e0de22fe-2c50-4216-ad75-ed0494d2dc92";
            String[] roleIds = { "4028a1cd4ee2d9d6014ee2df4c6a0001"};    //总经理角色
            iRoleService.updateUserRole(userId,roleIds);
        }

### 3. export\_system\_service子工程的service接口和实现类 ###

`IRoleService`

//通过companyId查询该公司的所有角色列表（给用户授予角色的时候要显示所有角色列表，勾选授权）
        List<Role> findAll(String companyId);
        //通过userid查询用户的角色列表
        List<Role> findRolesByUserId(String userId);
        //更新用户的角色 （包括删除角色(deleteUserRoleByUserId)、新增角色两个(saveUserRole)）
        void updateUserRole(String userId, String[] roleIds);

`RoleServiceImpl`

@Override
        public List<Role> findAll(String companyId) { 
            return iRoleDao.findAll(companyId);
        }
    
        @Override
        public List<Role> findRolesByUserId(String userId) { 
            return iRoleDao.findByUserId(userId);
        }
    
        //更新用户的角色表，需要先删除用户角色表，然后再保存新的
        @Override
        public void updateUserRole(String userId, String[] roleIds) { 
            //先做删除，删除角色在中间表（用户角色表）中的记录
            iRoleDao.deleteUserRoleByUserId(userId);//删除 用户角色中间表
    
            //判断角色是否清空（清空角色，也就相当于没有了角色的权限，没有任何权限 类似于封号）
            if(roleIds != null && roleIds.length>0){ 
                //循环遍历添加用户的角色
                for(String roleId:roleIds){ 
                    iRoleDao.saveUserRole(userId,roleId);
                }
            }else { 
                System.out.println("userId = "+ userId + "的用户没有任何角色权限了");
            }
        }

### 4. export\_dao子工程写dao接口及其映射 ###

`IRoleDao`

//通过userid查询用户的角色列表
        List<Role> findByUserId(String userId);
        //通过userid删除用户的所有角色
        void deleteUserRoleByUserId(String userId);
        //保存用户的一个角色
        void saveUserRole(String userId, String roleId);

`IRoleDao.xml`

<select id="findByUserId" parameterType="string" resultMap="roleMap">
                select *
                from pe_role_user ru inner join pe_role r
                on ru.role_id= r.role_id
                where ru.user_id = #{userId}
        </select>
    
        
        <delete id="deleteUserRoleByUserId" parameterType="string">
                delete from pe_role_user  where user_id=#{userId}
        </delete>
    
        
        <insert id="saveUserRole" >
                insert into pe_role_user values(#{arg0},#{arg1})
        </insert>

### 5. export\_web\_manager子工程编写controller ###

`UserController`

// 去用户的角色页面
        @RequestMapping(path = "/toUserRole", method = { RequestMethod.GET, RequestMethod.POST})
        public String toUserRole(String userId){ 
            //接收页面传过来的userId
            l.info("toUserRole userId="+userId);
            //使用userId查找用户对象
            User user = iUserService.findUserById(userId);
            //放到请求域中
            request.setAttribute("user",user);
    
            //获取公司的id
            String companyId=getLoginCompanyId();
            //所有角色的数据
            List<Role> roleList =  iRoleService.findAll(companyId);
            //当前登录用户的角色数据
            List<Role> userRoleList =  iRoleService.findRolesByUserId(userId);
            l.info("toUserRole 所有角色的数据roleList = "+roleList);
            l.info("toUserRole 前登录用户的角色数据userRoleList = "+userRoleList);
    
            for(Role role: roleList){ 
                //遍历当前公司的所有的角色，通过自定义函数isInUserRoleList判断角色是否是当前用户拥有的角色
                if(isInUserRoleList(role,userRoleList)){ 
                    role.setChecked(true);  //如果当前user拥有该角色，选择（打钩）
                }
            }
            //转发到页面
            request.setAttribute("roleList",roleList);  //该公司所有角色列表
            request.setAttribute("userRoleList",userRoleList);  //用户的角色列表
            return "system/user/user-role";
        }
    
        //自定义函数isInUserRoleList判断角色是否在用户的角色列表中，在，复选框打钩
        private boolean isInUserRoleList(Role role, List<Role> userRoleList) { 
            for( Role r:userRoleList){ 
                if(r.getRoleId().equals(role.getRoleId())){ 
                    return true;
                }
            }//end for
            return false;
        }
    
        // 更新用户的角色 ${path}/system/user/updateUserRole
        @RequestMapping(path = "/updateUserRole", method = { RequestMethod.GET, RequestMethod.POST})
        public String updateUserRole(String userId,String[] roleIds){ //接收用户的userId与角色的roleIds
            l.info("updateUserRole userId = "+userId);
            l.info("updateUserRole roleIds = "+ Arrays.toString(roleIds));
            //用户的角色修改
            iRoleService.updateUserRole(userId,roleIds);
            //打开列表页面
            return "redirect:/system/user/toList";
        }

### 6. export\_web\_manager子工程编写jsp页面 ###

`user-list`页面角色按钮

角色按钮绑定事件

//选中用户点击角色的时候，进入用户的角色列表
        function roleList() { 
            var userId = getCheckId()
            if(userId) { 
                location.href="${path}/system/user/toUserRole?userId="+userId;
            }else{ 
                alert("请勾选待处理的记录，且每次只能勾选一个")
            }
        }

`user-role.jsp`显示用户角色列表

<section class="content">
            
            <div class="box box-primary">
                <div class="box-header with-border">
                    <h3 class="box-title">用户 [ ${user.userName} ] 的角色列表</h3>
                </div>
    
                <div class="box-body">
                    <form name="icform" method="post" >
                        <input type="hidden" name="userId" value="${user.userId}"/>
    
                        <div class="textbox" id="centerTextbox">
                            <div style="text-align:left">
    
                                <c:forEach items="${roleList}" var="role" varStatus="vs">
                                         <span style="padding:3px;margin-right:30px;width: 160px;display: inline-block">
                                             <%-- 复选框的形式展示 --%>
                                             <input type="checkbox" name="roleIds" value="${role.roleId}" <%-- 根据role对象中的checked属性进行判断，如果为true，则打勾，否不打勾 --%>
                                                     <c:if test="${role.checked}">
                                                         checked
                                                     </c:if>
    
                                             />
                                             ${role.name}
                                         </span>
                                </c:forEach>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
    
            <div class="box-tools text-center">
                <button type="button" class="btn bg-maroon" onclick="formSubmit()">保存</button>
                <button type="button" class="btn bg-default" onclick="history.back(-1);">返回</button>
            </div>
        </section>

保存绑定提交表单事件

//表单提交
        function formSubmit() { 
            document.icform.action="${path}/system/user/updateUserRole";
            document.icform.submit();
        }

[20201107153647479.gif_pic_center]: /images/20221120/38cc48d2e69f41c7902f3db8dd49460a.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwNTQyNTM0_size_16_color_FFFFFF_t_70_pic_center]: /images/20221120/18a4732b0b734f8e98ada9fbc273d6f6.png