SaaS-分配角色

2 分配角色

2.1 需求分析

由于使用了RBAC模型对权限进行统一管理，所以每个SAAS-HRM平台的用户都应该具有角色的信息。进而通过角色完成对权限的识别。众所周知，一个用户可以具有很多的角色，一个角色可以被分配给不同的用户。所以用户和角色之间是多对多系。

2.2 服务端代码实现

（1） 改造用户实体类，添加角色的id集合属性，表明一个用户具有的多个角色id在 User 用户实体类中添加与角色的多对多关系并进行JPA的配置

@ManyToMany
@JsonIgnore
@JoinTable(name="pe_user_role",joinColumns= {@JoinColumn(name="user_id",referencedColumnName="id")},
   inverseJoinColumns={@JoinColumn(name="role_id",referencedColumnName="id")}
)
private Set<Role> roles = new HashSet<Role>();//用户与角色   多对多

在Role角色实体类中配置角色与用户的多对多关系并进行JPA配置

@JsonIgnore
@ManyToMany(mappedBy="roles")
private Set<User> users = new HashSet<User>(0);//角色与用户   多对多

（2） 在 UserController 添加分配角色的控制器方法实现

  /**
     * 分配角色
     */
    @RequestMapping(value = "/user/assignRoles", method = RequestMethod.PUT)
    public Result assignRoles(@RequestBody Map<String,Object> map) {
        //1.获取被分配的用户id
        String userId = (String) map.get("id");
        //2.获取到角色的id列表
        List<String> roleIds = (List<String>) map.get("roleIds");
        //3.调用service完成角色分配
        userService.assignRoles(userId,roleIds);
        return new Result(ResultCode.SUCCESS);
   }

（3） 业务逻辑层添加分配角色的业务方法

   /**
     * 分配角色
     */
    public void assignRoles(String userId,List<String> roleIds) {
        //1.根据id查询用户
        User user = userDao.findById(userId).get();
        //2.设置用户的角色集合
        Set<Role> roles = new HashSet<>();
        for (String roleId : roleIds) {
            Role role = roleDao.findById(roleId).get();
            roles.add(role);
       }
        //设置用户和角色集合的关系
        user.setRoles(roles);
        //3.更新用户
        userDao.save(user);
   }

2.3 前端代码实现

（1） \src\module-employees 添加分配角色的组件

<template>
  <div class="add-form">
    <el-dialog title="分配角色" :visible.sync="roleFormVisible" style="height:300px">
      <el-form  :model="formBase"  label-position="left" label-width="120px"
style='margin-left:120px; width:500px;'>
          <el-checkbox-group
            v-model="checkedCities1">
            <el-checkbox v-for="(item,index) in cities" :label="item.id" :key="index">
{{item.name}}</el-checkbox>
          </el-checkbox-group>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="createData">提交</el-button>
         <el-button @click="roleFormVisible=false">取消</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import {findAll} from "@/api/base/role"
import {assignRoles} from "@/api/base/users"
export default {
    data () {
        return {
            roleFormVisible:false,
            formBase:{},
            checkedCities1:[],
            data:[],
            cities:[],
            id:null
       }
   },
    methods: {
        toAssignPrem(id) {
            findAll().then(res => {
                this.id = id;
                this.cities = res.data.data
                this.roleFormVisible=true
           })
       },
        createData() {
            assignRoles({id:this.id,ids:this.checkedCities1}).then(res => {
               
this.$message({message:res.data.message,type:res.data.success?"success":"error"});
                this.roleFormVisible=false
           })
       }
   }
}
</script>

（2） \src\module-employees\pages\employees-list.vue 引入组件

<!--分配角色组件 -->
<component v-bind:is="addRole" ref="addRole"></component>