基于SSM的RBAC权限系统(1)-利用ajax，bootstrap，ztree完成权限树功能
基于SSM的RBAC权限系统(1)-利用ajax，bookstrap，ztree完成权限树功能
仅支持回显以及选择，不支持在树中的编辑
效果图如下
搭建后台回显以及修改的模块
JSON数据封装
public class Msg {
private int code;
private String msg;
private Map extend=new HashMap();
//还有一些getset方法没显示出来
public static Msg success(){
Msg result = new Msg();
result.setCode(100);
result.setMsg("处理成功");
return result;
}
public static Msg fail(){
Msg result = new Msg();
result.setCode(200);
result.setMsg("处理失败");
return result;
}
public static Msg noPermission(){
Msg result = new Msg();
result.setCode(250);
result.setMsg("没有权限");
return result;
}
public static Msg reject(){
Msg result = new Msg();
result.setCode(300);
result.setMsg("拒绝请求");
return result;
}
} Controller中的代码,RequiredPermission为自定义注解
@ResponseBody
@RequiredPermission("树形分配:获得回显信息")
@RequestMapping("role/treePermission_echo")
public Msg treePermission_echo(@RequestParam("ID")Long ID) throws Exception{
//这里判断有无权限，具体原因请看其他文章
Throwable t = new Throwable();
boolean isHasPermission=PermissionUtil.hasPermission(this.getClass(),t.getStackTrace()[0].getMethodName());
if(!isHasPermission)
return Msg.noPermission().add("returnMsg","您没有权限【树形分配:获得回显信息】");
//从下一层获取ztree权限树数据
List allZtreeMsg =
permissionService.getAllZtreeMsg(ID);
System.out.println();
return Msg.success().add("allZtreeMsg",allZtreeMsg);
}
@ResponseBody
@RequiredPermission("树形分配:修改")
@RequestMapping("role/treePermission_alter")
public Msg treePermission_alter(@RequestParam("permissionListTree")List permissionListTree
) throws Exception {
Throwable t = new Throwable();
boolean isHasPermission=PermissionUtil.hasPermission(this.getClass(),t.getStackTrace()[0].getMethodName());
if(!isHasPermission)
return Msg.noPermission().add("returnMsg","您没有权限【树形分配:修改】");
ArrayList permissionListID = new ArrayList<>();
Long ID=Long.valueOf(permissionListTree.get(0));
//判断是权限组还是权限，是权限则加入
for(String permissionID:permissionListTree){
if(permissionID.charAt(0)=='p'){
permissionListID.add(Long.valueOf(permissionID.substring(2,permissionID.length())));
}
}
//这里其实可以优化，我暂时采用了删除所有再更新的方法
roleToPermissionService.deleteById(ID);
for(Long id:permissionListID){
RoleToPermission roleToPermission=new RoleToPermission();
Role role = new Role();
role.setId(ID);
Permission permission=new Permission();
permission.setId(id);
roleToPermission.setRole(role);
roleToPermission.setPermission(permission);
roleToPermissionService.addItem(roleToPermission);
}
return Msg.success();
} ztree树的构建
因为我需要的功能复杂度不高，所以ztree设定很简单
var setting = {
check: {
enable: true
},
data: {
simpleData: {
enable: true
}
}
};
var zNodes ;
function setCheck() {
var zTree = $.fn.zTree.getZTreeObj("treeDemo"),
type = { "Y" : "ps", "N" : "ps" };
zTree.setting.check.chkboxType = type;
}
$(".treeBtn").each(function () {
$(this).click(function () {
ID = $(this).attr("name");
$.ajax({
url: "role/treePermission_echo",
//ID为你本次选择需要为哪个角色分配权限的角色ID
data: "ID=" + ID,
type: "POST",
success: function (result) {
if (result.code == 100) {
zNodes=result.extend.allZtreeMsg;
$.fn.zTree.init($("#treeDemo"), setting, zNodes);
setCheck();
} else if(result.code==250){
//弹出权限不足的窗口
$("#btn_closeTree").click();
show_errorWindows(result.extend.returnMsg);
}
}
});
});
});看看最简单的checkbox权限树结构
ztree非常方便，甚至不用我们自己写算法递归出树，因此只要将结构封装成一样的json丢给zNodes就可以了！
ztree对应的实体类
public class ZtreePermission {
String id;
String pId;
String name;
Boolean checked;
Boolean open;
public ZtreePermission(){
}
public ZtreePermission(Permission permission){
this.id="p."+permission.getId();
this.pId="g."+permission.getParentID();
this.name=permission.getName();
this.open=false;
this.checked=false;
}
public ZtreePermission(Permission_Groud permission_groud){
this.id="g."+permission_groud.getId();
this.pId="g."+permission_groud.getParentID();
this.name=permission_groud.getName();
this.checked=null;
this.open=true;
}
}值得注意的是如果你有两张表而且id重复的话，可以这样 id=”student.1” pid=”teacher.2”
回显部分代码
这里只获取了ID，如果需要其他数据可以查看API文档
$("#btn_inputTree").click(function () {
var zTree = $.fn.zTree.getZTreeObj("treeDemo");
var nodes=zTree.getCheckedNodes(true);
permissionListTree = new Array();
//这里我把ID丟进了ID第一位，后台要注意！！
permissionListTree.push(ID);
for ( var j = 0; j < nodes.length; j++) {
permissionListTree.push(nodes[j].id);
}
$.ajax({
url: "role/treePermission_alter",
data: "permissionListTree="+permissionListTree,
type: "POST",
success: function (result) {
if(result.code ==100){
$("#btn_closeTree").click();
}else if(result.code==250){
$("#btn_closeTree").click();
//权限不足，显示窗口 show_errorWindows(result.extend.returnMsg);
}
}
});
});最后来看看最简单窗口代码
<div class="modal fade" id="dtreeModal" tabindex="-1" role="dialog" aria-labelledby="preModalLabel">
<div class="modal-dialog">
<div class="modal-content">
<form role="form" action="" method="post">
<div class="modal-header">
<button data-dismiss="modal" class="close" type="button"><span
aria-hidden="true">×span><span
class="sr-only">Closespan>button>
<h4 class="modal-title">树形分配h4>
div>
<div class="modal-body" >
<div>
<ul id="treeDemo" class="ztree">ul>
div>
div>
<div class="modal-footer">
<button id="btn_closeTree" data-dismiss="modal" class="btn btn-default" type="button">
关闭
button>
<button id="btn_inputTree" class="btn btn-primary" type="button">提交button>
div>
form>
div>
div>
div>完整项目地址
这是我第一个写的web项目，代码烂得飞起，仅供纪念，不做参考
带Shiro版：https://github.com/EnTaroAdunZ/ssm_rbac_shiro.git
不带Shiro版：https://github.com/EnTaroAdunZ/ssm_rbac.git