<div>
<ul id="permissionTree" class="ztree"></ul>
</div>
<script src="${APP_PATH}/ztree/jquery.ztree.all-3.5.min.js"></script>
<script type="text/javascript">
$(function () {
var setting = {
async: {//异步获取数据用的
enable: true,
url:"${APP_PATH}/permission/loadData",
autoParam:["id", "name=n", "level=lv"]
},
view: { //就是当鼠标放在一个菜单条目上的显示
//tId、level都是zTree自动生成的,
//当前所在的目录上,treeId对 应 zTree 的 treeId,便于用户操控 treeNode需要显示自定义控件的节点 JSON 数据对象
selectedMulti: false,
//添加自定义的图标控件
addDiyDom: function(treeId, treeNode){
var icoObj = $("#" + treeNode.tId + "_ico"); //tId = permissionTree_1, $("#permissionTree_1_ico")
//tId是zTree自动生成的,当前节点的图标,有图标是图标,没图标就是文件夹图标
if ( treeNode.icon ) {//json对象里面有没有icon,数据库里面增加对应的图标样式就可以应用过来
//把数据库中的样式增加到图标
icoObj.removeClass("button ico_docu ico_open").addClass(treeNode.icon).css("background","");
}
},
//用于当鼠标移动到节点上时,做用户自定义控件
addHoverDom: function(treeId, treeNode){ //添加自定义的控件功能
// <a><span></span></a>
var aObj = $("#" + treeNode.tId + "_a"); // tId = permissionTree_1, ==> $("#permissionTree_1_a") treeNode节点的唯一标识 tId。
aObj.attr("href", "javascript:;");
if (treeNode.editNameFlag || $("#btnGroup"+treeNode.tId).length>0) return;
var s = '<span id="btnGroup'+treeNode.tId+'">';
if ( treeNode.level == 0 ) {//根节点
s += '<a class="btn btn-info dropdown-toggle btn-xs" style="margin-left:10px;padding-top:0px;" onclick="addNode('+treeNode.id+')" href="#" > <i class="fa fa-fw fa-plus rbg "></i></a>';
} else if ( treeNode.level == 1 ) {//第一层,
s += '<a class="btn btn-info dropdown-toggle btn-xs" style="margin-left:10px;padding-top:0px;" onclick="editNode('+treeNode.id+')" href="#" title="修改权限信息"> <i class="fa fa-fw fa-edit rbg "></i></a>';
if (treeNode.children.length == 0) {//叶子节点(多一个删除功能)
s += '<a class="btn btn-info dropdown-toggle btn-xs" style="margin-left:10px;padding-top:0px;" onclick="deleteNode('+treeNode.id+')" href="#" > <i class="fa fa-fw fa-times rbg "></i></a>';
}
s += '<a class="btn btn-info dropdown-toggle btn-xs" style="margin-left:10px;padding-top:0px;" onclick="addNode('+treeNode.id+')" href="#" > <i class="fa fa-fw fa-plus rbg "></i></a>';
} else if ( treeNode.level == 2 ) {//第二层为叶子节点,直接删除和编辑功能两个
s += '<a class="btn btn-info dropdown-toggle btn-xs" style="margin-left:10px;padding-top:0px;" onclick="editNode('+treeNode.id+')" href="#" title="修改权限信息"> <i class="fa fa-fw fa-edit rbg "></i></a>';
s += '<a class="btn btn-info dropdown-toggle btn-xs" style="margin-left:10px;padding-top:0px;" onclick="deleteNode('+treeNode.id+')" href="#"> <i class="fa fa-fw fa-times rbg "></i></a>';
}
s += '</span>';
aObj.after(s);
},
removeHoverDom: function(treeId, treeNode){//鼠标不在节点上时候,隐藏节点的自定义控件,如增加,修改,删除等控件功能
$("#btnGroup"+treeNode.tId).remove();
}
}
};
// 异步获取树形结构数据
$.fn.zTree.init($("#permissionTree"), setting);
});
function addNode(id) {
window.location.href = "${APP_PATH}/permission/add?id="+id;//传入当前节点
}
function editNode(id) {
window.location.href = "${APP_PATH}/permission/edit?id="+id;
}
function deleteNode(id) {
layer.confirm("删除许可信息, 是否继续", {icon: 3, title:'提示'}, function(cindex){
// 删除选择的用户信息
$.ajax({
type : "POST",
url : "${APP_PATH}/permission/delete",
data : {
id : id
},
success : function(result) {
if ( result.success ) {
// 刷新数据
var treeObj = $.fn.zTree.getZTreeObj("permissionTree");
treeObj.reAsyncChildNodes(null, "refresh");
} else {
layer.msg("许可信息删除失败", {time:2000, icon:5, shift:6}, function(){
});
}
}
});
layer.close(cindex);
}, function(cindex){
layer.close(cindex);
});
}
</script>