通过服务器API请求数据,使用【easyui-tree】实现动态填充单位列表的展示
<!--右侧单位列表开始-->
<div id="unit-list" class="easyui-panel">
<div id="unit-list_title">
单位列表
<a id="unit-list-close-btn" class="fa fa-times" style="float: right" href="javascript:;"></a>
</div>
<ul id="tt" class="easyui-tree" data-options="url:'',method:'get',animate:true"></ul>
</div>
<!--右侧单位列表结束-->
var EnterPriseAllList_tree = format_tree_data(EnterPriseAllList);//格式化单位列表
$("#tt").tree({//Easy ui tree 加载列表
data: EnterPriseAllList_tree
});
//=======================================
//格式化接收到的单位列表,easy UI 用于显示
//=========================================
function format_tree_data(data) {
var unit_Type = [
"人员密集类",//11,12
"石油化工类",//21,22
"高层建筑类",
"大型仓储类",
"地下建筑类",
"其他类"
];
var tree_list_array = [];
$.each(unit_Type, function (i, obj) {
var List_obj;
if (i == 0) {
List_obj = {
"id": i + 1,
"text": obj,
"state": "opened",
"iconCls": "fa fa-home icon-unit-list",
"children": [
{
"id": (i + 1) * 10 + 1,
"text": "一级重点单位",
"state": "opened",
"iconCls": "fa fa-home icon-unit-list",
"children": []
}, {
"id": (i + 1) * 10 + 2,
"text": "二级重点单位",
"state": "closed",
"iconCls": "fa fa-home icon-unit-list",
"children": []
}
]
};
} else {
List_obj = {
"id": i + 1,
"text": obj,
"state": "closed",
"iconCls": "fa fa-home icon-unit-list",
"children": [
{
"id": (i + 1) * 10 + 1,
"text": "一级重点单位",
"state": "closed",
"iconCls": "fa fa-home icon-unit-list",
"children": []
}, {
"id": (i + 1) * 10 + 2,
"text": "二级重点单位",
"state": "closed",
"iconCls": "fa fa-home icon-unit-list",
"children": []
}
]
};
}
tree_list_array.push(List_obj);
});
$.each(data, function (i, obj) {
var unit = {
"id": obj.Id,
"text": obj.Name,
"iconCls": "fa fa-hand-o-right icon-unit-list",
};
switch (obj.Type) {
case "人员密集类":
if (obj.Level == "一级重点单位") {
tree_list_array[0].children[0].children.push(unit);
}
else {
tree_list_array[0][1].children[1].children.push(unit);
}
break;
case "石油化工类":
if (obj.Level == "一级重点单位") {
console.log(tree_list_array[0].children[0]);
tree_list_array[1].children[0].children.push(unit);
}
else {
tree_list_array[1][1].children[1].children.push(unit);
}
break;
case "高层建筑类":
if (obj.Level == "一级重点单位") {
console.log(tree_list_array[0].children[0]);
tree_list_array[2].children[0].children.push(unit);
}
else {
tree_list_array[2][1].children[1].children.push(unit);
}
break;
case "大型仓储类":
if (obj.Level == "一级重点单位") {
console.log(tree_list_array[0].children[0]);
tree_list_array[03].children[0].children.push(unit);
}
else {
tree_list_array[3][1].children[1].children.push(unit);
}
break;
case "地下建筑类":
if (obj.Level == "一级重点单位") {
console.log(tree_list_array[0].children[0]);
tree_list_array[4].children[0].children.push(unit);
}
else {
tree_list_array[4][1].children[1].children.push(unit);
}
break;
case "其他类":
if (obj.Level == "一级重点单位") {
console.log(tree_list_array[0].children[0]);
tree_list_array[5].children[0].children.push(unit);
}
else {
tree_list_array[5][1].children[1].children.push(unit);
}
break;
default:
return;
};
});
return tree_list_array;
}