zTree插件 角色、部门、人员分类选择

// 传参数调用

function test(){
roleOrOrgSelect(3,function(data){
console.log(data);
});
}

/**
*
* @param type （1：返回选中的角色数据 2：返回选中的机构数据 3：返回选中的人员数据）
* @param callback （用户自定义回调函数）
* @returns
*/

    
function roleOrOrgSelect(type,callback){
layer.open({
type: 2 //此处以iframe举例
, title: "选择用户"
, area: ['800px', ($(window).height())+'px']
, shade: 0
, offset:'rb',
scrollbar: false,
shade:0.5,
shift: 2,
fixed:false,
resize:false,
scrollbar:true,
move:false
, maxmin: false
, content: 'appDataController.do?roleOrOrgSelect'
, zIndex: layer.zIndex 
, success: function (layero) {
layer.setTop(layero); 
}
, btn: ['确定']
, yes: function(index){
var child = 'layui-layer-iframe'+index;
$child = $("#"+child)[0].contentWindow;
var data = $child.submit();
console.log(data);
var user =[];
var role =[];
var org =[];
$.each(data,function(i,item){
var itype = item.type;
if(itype ==1){
role.push(item);
}else if(itype ==1){
org.push(item);
}else{
user.push(item);
}
})
if(type == 1){
callback(role);
}else if(type == 2){
callback(org);
}else{
callback(user);
}
layer.close(index);
}
});
}

//ztree 构建

<script type="text/javascript">

var setting = {
check: {
enable: true,
},
view:{
showIcon:true,
},
data: {
simpleData: {
enable: true,
}
},
async: {
enable: true,
url:"userController.do?roleTreeList",
dataFilter: filter
},
callback: {
beforeAsync: function(){},
onAsyncSuccess: function(event, treeId, treeNode, msg){

},
onCheck: onCheck,
onAsyncError: function(){},
onClick: function (event, treeId, treeNode){

}
}
};

$(function(){
$.fn.zTree.init($("#tree"), setting);
})

var vm = new Vue({
el : "#selected",
data : {
selectedList : [], //右侧显示勾选项
dataList:[], //最后提交得数据

},
mounted: function () {
this.$nextTick(function () {
})
},
})

// 数据过滤
function filter(treeId, parentNode, childNodes){
if (!childNodes) return null;
for (var i=0, l=childNodes.length; i<l; i++) {
childNodes[i].name = childNodes[i].text;
childNodes[i].type = childNodes[i].type;
if(childNodes[i].type ==3){
childNodes[i].icon = "images/user.png";
}
//childNodes[i].open = (childNodes[i].state === "open");//异步加载，该项无效
if (childNodes[i].children != null) {
childNodes[i].nodes = childNodes[i].children;
filter(null, childNodes[i], childNodes[i].nodes);//递归设置子节点
}
}
return childNodes;
}
//展开角色tree
function getRoleList(){
setting.async.url="userController.do?roleTreeList";
$.fn.zTree.init($("#tree"), setting);
}
//展开机构tree
function getOrgList(){
setting.async.url="userController.do?orgTreeList";
$.fn.zTree.init($("#tree"), setting);
}
//checkbox勾选事件
function onCheck(event, treeId, treeNode){
var treeObj=$.fn.zTree.getZTreeObj("tree");
var selected=treeObj.getCheckedNodes(true);
vm.selectedList=selected;
var dataSelected =[];
$.each(selected,function(i,item){
var row={};
row.name = item.name;
row.id = item.id;
row.type = item.type;
dataSelected.push(row);
});
vm.dataList = dataSelected;
}
//清空
function clearAll(){
vm.selectedList=null;
}
//全选
function checkAll(){
var treeObj=$.fn.zTree.getZTreeObj("tree");
var flag = $("#selectAll").attr("data-flag");
if(flag ==1){
treeObj.checkAllNodes(false);
$("#selectAll").attr("data-flag",2);
}else{
treeObj.checkAllNodes(true);
$("#selectAll").attr("data-flag",1);
}
var selected=treeObj.getCheckedNodes(true);
vm.selectedList=selected;
var dataSelected =[];
$.each(selected,function(i,item){
var row={};
row.name = item.name;
row.id = item.id;
row.type = item.type;
dataSelected.push(row);
});
vm.dataList = dataSelected;
}
//确定
function submit(){
return vm.dataList;
}

</script>