今日内容:
一.角色管理模块的增删改查
二.对用户进行角色的分配
1.相关数据表的设计与分析
角色表:
create table ROLE_P
(
ROLE_ID varchar(40) not null,
NAME varchar(30),
REMARKS varchar(100),
ORDER_NO int,
CREATE_BY varchar(40),
CREATE_DEPT varchar(40),
CREATE_TIME timestamp,
UPDATE_BY varchar(40),
UPDATE_TIME timestamp,
primary key (ROLE_ID)
);
角色权限
create table ROLE_MODULE_P
(
MODULE_ID varchar(40),
ROLE_ID varchar(40)
);
数据表之间的关系:两者为多对多关系
2.角色管理模块的增删改查
由于此模块和用户增删改查基本一样所以不做代码分析,可以借鉴day02的用户增删改查模块。
3.对用户进行角色的分配
流程为:
用户选中需要分配角色的用户复选框,然后点击角色按钮进入角色的展示页面,然后选中需要分配的角色后,保存即可。如下图:
由于展示用户角色用到了zTree插件,所以先对ztree插件进行介绍:
zTree树能够将数据以树形结构的方式进行展现的一大段js,但是传递给插件的必须为json格式的数据
zTree树的格式要求
复杂格式:[{id:" ",pId:" ",name:" ",checked:"true/false"}]
属性如下:
1.id:唯一标号当前对象
2. pId:表示上级ID 切记 I字母一定要大写
3.name:表示节点名称
4.checked: 节点是否被选中
如下JSON:
[
{id:1,name:"小短剑",pId:0},
{id:2,name:"十字镐",pId:1,checked:"true"},
{id:3,name:"暴风巨剑",pId:1},
{id:4,name:"负极斗篷",pId:1}
]
因为要对角色表的进行展示,所以要将实体类转换为josn串。方法如下:
使用ObjcetMapper对象
1.引入jar包,在pom.xml中引入
版本定义 <jackson.version>2.4.2</jackson.version>
<!-- Jackson Json处理工具包 -->
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-databind</artifactId>
<version>${jackson.version}</version>
</dependency>
2.实现转化
ObjectMapper objectMapper = new ObjectMapper();
//把所有角色的集合 转化为json字符串
String jsonString = objectMapper.writeValueAsString(roles);
System.out.println(jsonString);
3.改造方法
为了满足zTree树的要求,需要手动修改方法,在role的实体类中加入如下的get方法,否则获取不到id,只能获取到role_id。
public String getId(){
return roleId;
}
4.使用zTree完成用户角色分配
思路:
- 在用户列表页面添加一个角色的按钮点击跳转到分配角色的页面
- 实现分配角色的页面 通过zTree显示所有待分配的角色,通过checkbox选中要分配的角色
- 保存用户和角色之间的关系
- 当再次给某个用户分配角色的时候 需要显示之前所分配的角色信息
1.在userList页面中添加按钮
<li id="new"><a href="#" onclick="formSubmit(‘role‘,‘_self‘);this.blur();">角色</a></li>
2.处理请求,转向到分配页面
1.接收userId,
2,准备roleList信息
3.将list集合转化为JSON
4.进行转向
3.用户选中角色入库操作
将表单域中的userid和roleids传入,将其保存。
在controller层实现保存方法:
4.用户重复提交问题
多对多关联插入时,可能会造成重复数据.这时应该先删除之前的数据.之后再插入.
5.回显角色数据
思路:
1.根据userId查询当前用户的全部角色信息
2.将用户的角色Id,与全部角色列表做比较.如果ID一致.应该为checked设置为true
3.将转化后的list集合 经过工具类转化为JSON串,回显页面.
这样,角色的分配就大致完成了。源码在如下地址:
https://gitee.com/smeb1/HuiTongday02