html部分:
<div style="height: 350px;overflow-y: auto;overflow-x: hidden;">
<input id="roleId" type="hidden" value="${roleId}">
<ul id="treeAuth" class="ztree" style="padding: 20px 0px 20px 40px;"></ul>
</div>
js部分:
<script>
layui.use(['layer', 'admin'], function () {
var $ = layui.jquery;
var layer = layui.layer;
var admin = layui.admin;
var roleId = $('#roleId').val();
layer.load(2);
var setting = {
check: {enable: true},//设置ztree上的节点是否显示check/radio true/false分别表示显示不显示单选框或复选框
data: {
simpleData: {enable: true}//确定ztree初始化时的节点数据、异步加载时的节点数据、或addNodes方法中输入的newNodes数据是否采用简单数据模式
}
};
$.get('authTree', {
roleId: roleId
}, function (data) {
$.fn.zTree.init($('#treeAuth'), setting, data);
layer.closeAll('loading');
}, 'json');
// 保存按钮点击事件
$('#btnSave').click(function () {
layer.load(2);
var treeObj = $.fn.zTree.getZTreeObj('treeAuth');
var nodes = treeObj.getCheckedNodes(true);
var ids = new Array();
for (var i = 0; i < nodes.length; i++) {
ids[i] = nodes[i].id;
}
$.post('updateRoleAuth', {
roleId: roleId,
authIds: JSON.stringify(ids)
}, function (data) {
layer.closeAll('loading');
if (200 == data.code) {
top.layer.msg(data.msg, {icon: 1});
// 关闭当前iframe弹出层
parent.layer.close(parent.layer.getFrameIndex(window.name));
} else {
top.layer.msg(data.msg, {icon: 2});
}
}, 'json');
});
});
</script>
后台代码:
/**
* 角色权限树
*/
@ResponseBody
@GetMapping("/authTree")
public List<Map<String, Object>> authTree(Integer roleId) {
List<Authorities> roleAuths = authoritiesService.listByRoleId(roleId);
List<Authorities> allAuths = authoritiesService.list();
List<Map<String, Object>> authTrees = new ArrayList<>();
for (Authorities one : allAuths) {
Map<String, Object> authTree = new HashMap<>();
authTree.put("id", one.getAuthorityId());
authTree.put("name", one.getAuthorityName() + " " + StringUtil.getStr(one.getAuthority()));
authTree.put("pId", one.getParentId());
authTree.put("open", true);
authTree.put("checked", false);
for (Authorities temp : roleAuths) {
if (temp.getAuthorityId().equals(one.getAuthorityId())) {
authTree.put("checked", true);
break;
}
}
authTrees.add(authTree);
}
return authTrees;
}
页面展示: