仅支持回显以及选择,不支持在树中的编辑
搭建后台回显以及修改的模块
JSON数据封装
public class Msg { private int code; private String msg; private Map<String,Object> extend=new HashMap<String,Object>(); //还有一些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<ZtreePermission> 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<String> 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<Long> 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">Close</span></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><!-- /.modal-content --> </div><!-- /.modal-dialog --> </div>
完整项目地址
这是我第一个写的web项目,代码烂得飞起,仅供纪念,不做参考
带Shiro版:https://github.com/EnTaroAdunZ/ssm_rbac_shiro.git
不带Shiro版:https://github.com/EnTaroAdunZ/ssm_rbac.git
---------------------
版权声明:本文为CSDN博主「EnTaroAdunZ」的原创文章,遵循CC 4.0 by-sa版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/EnTaroAdunZ/article/details/76112781