功能需求：從數據庫里取出帶有id和父級id關系的表里的全部數據，經過服務端處理成樹形分層的json，返回給前端插件顯示多級結構。
核心步驟：將取出的數據根據每行的id處理成相同格式的數組形式以后進行遞歸，沒有父級id的作為根節點層，有父級id的講自己寫為父級的子級層
示例如下：
var getRiskJson = function (data,callback){
console.log("getRiskJson data length:"+data.length);
var riskTree = {};
var riskdata = {}; //risks
for(var i in data){
var row = data[i];
riskdata[row.id] = row;
}
for(var i in riskdata){
// console.log(riskdata[i]);
makeRiskTree(riskTree,riskdata,riskdata[i]);
}
callback(riskTree);
}
function makeRiskTree(risktree,risks,risk) { //樹 正在堆的父級 子集
if(!risk.sub){//如果本條沒有子集 添加本條
risk.sub = {};
}
if(risk.super_id){ //如果有父級 就取出自己做成父級的數組形式
var super_id = risks[risk.super_id];
console.log('now super_id，risk.super_id are:'+super_id+"———n(*≧▽≦*)n———"+risk.super_id);
makeRiskTree(risktree,risks,super_id);
super_id.sub[risk.id] = risk;
}else{ //若沒有父級 則自己就是根節點
risktree[risk.id]= risk;
}
};
//測試數據
var data = [
{
"id": "0013bf81-1f4f-4a8b-8900-c894d4afd890",
"super_id": null,
"level": "1",
"content": "配電",
"status": "1",
"createdAt": null,
"updatedAt": null,
"parentContent": null
},
{
"id": "00b0bd76-a9be-4f1e-94ea-6847090e8a55",
"super_id": null,
"level": "1",
"content": "變電",
"status": "1",
"createdAt": null,
"updatedAt": null,
"parentContent": null
},
{
"id": "1111181-1f4f-4a8b-8900-c894d4afd890",
"super_id": "2213bf81-1f4f-4a8b-8900-c894d4afd890",
"level": "4",
"content": "過往行人進入作業現場",
"status": "1",
"createdAt": "2017-03-08T07:42:20.000Z",
"updatedAt": "2017-03-25T07:42:24.000Z",
"parentContent": "帶電斷、接引線"
},
{
"id": "1113bf81-1f4f-4a8b-8900-c894d4afd890",
"super_id": "0013bf81-1f4f-4a8b-8900-c894d4afd890",
"level": "2",
"content": "配電帶電作業",
"status": "1",
"createdAt": null,
"updatedAt": null,
"parentContent": "配電"
},
{
"id": "11b0bd76-a9be-4f1e-94ea-6847090e8a55",
"super_id": "00b0bd76-a9be-4f1e-94ea-6847090e8a55",
"level": "2",
"content": "變電操作",
"status": "1",
"createdAt": null,
"updatedAt": null,
"parentContent": "變電"
},
{
"id": "2213bf81-1f4f-4a8b-8900-c894d4afd890",
"super_id": "1113bf81-1f4f-4a8b-8900-c894d4afd890",
"level": "3",
"content": "帶電斷、接引線",
"status": "1",
"createdAt": null,
"updatedAt": null,
"parentContent": "配電帶電作業"
},
{
"id": "3313bf81-1f4f-4a8b-8900-c894d4afd890",
"super_id": "2213bf81-1f4f-4a8b-8900-c894d4afd890",
"level": "4",
"content": "絕緣斗臂車被其它車輛碰撞；過往行人進入作業現場；高空落物傷人。",
"status": "1",
"createdAt": null,
"updatedAt": null,
"parentContent": "帶電斷、接引線"
}
];
//data的格式是直接從mysql里select出來的 數據結構為：
// CREATE TABLE `t_risk_point` (
// `id` varchar(64) NOT NULL,
// `super_id` varchar(64) DEFAULT NULL,
// `level` varchar(64) DEFAULT NULL,
// `content` varchar(64) DEFAULT NULL,
// `status` varchar(64) DEFAULT NULL,
// `createdAt` datetime DEFAULT NULL,
// `updatedAt` datetime DEFAULT NULL,
// PRIMARY KEY (`id`)
// ) ENGINE=InnoDB DEFAULT CHARSET=utf8;
getRiskJson(data,function(data){
console.log("Print Tree ："+JSON.stringify(data));
});
遞歸好以后：
{
"0013bf81-1f4f-4a8b-8900-c894d4afd890": {
"id": "0013bf81-1f4f-4a8b-8900-c894d4afd890",
"super_id": null,
"level": "1",
"content": "配電",
"status": "1",
"createdAt": null,
"updatedAt": null,
"parentContent": null,
"sub": {
"1113bf81-1f4f-4a8b-8900-c894d4afd890": {
"id": "1113bf81-1f4f-4a8b-8900-c894d4afd890",
"super_id": "0013bf81-1f4f-4a8b-8900-c894d4afd890",
"level": "2",
"content": "配電帶電作業",
"status": "1",
"createdAt": null,
"updatedAt": null,
"parentContent": "配電",
"sub": {
"2213bf81-1f4f-4a8b-8900-c894d4afd890": {
"id": "2213bf81-1f4f-4a8b-8900-c894d4afd890",
"super_id": "1113bf81-1f4f-4a8b-8900-c894d4afd890",
"level": "3",
"content": "帶電斷、接引線",
"status": "1",
"createdAt": null,
"updatedAt": null,
"parentContent": "配電帶電作業",
"sub": {
"1111181-1f4f-4a8b-8900-c894d4afd890": {
"id": "1111181-1f4f-4a8b-8900-c894d4afd890",
"super_id": "2213bf81-1f4f-4a8b-8900-c894d4afd890",
"level": "4",
"content": "過往行人進入作業現場",
"status": "1",
"createdAt": "2017-03-08T07:42:20.000Z",
"updatedAt": "2017-03-25T07:42:24.000Z",
"parentContent": "帶電斷、接引線",
"sub": {
}
},
"3313bf81-1f4f-4a8b-8900-c894d4afd890": {
"id": "3313bf81-1f4f-4a8b-8900-c894d4afd890",
"super_id": "2213bf81-1f4f-4a8b-8900-c894d4afd890",
"level": "4",
"content": "絕緣斗臂車被其它車輛碰撞；過往行人進入作業現場；高空落物傷人。",
"status": "1",
"createdAt": null,
"updatedAt": null,
"parentContent": "帶電斷、接引線",
"sub": {
}
}
}
}
}
}
}
},
"00b0bd76-a9be-4f1e-94ea-6847090e8a55": {
"id": "00b0bd76-a9be-4f1e-94ea-6847090e8a55",
"super_id": null,
"level": "1",
"content": "變電",
"status": "1",
"createdAt": null,
"updatedAt": null,
"parentContent": null,
"sub": {
"11b0bd76-a9be-4f1e-94ea-6847090e8a55": {
"id": "11b0bd76-a9be-4f1e-94ea-6847090e8a55",
"super_id": "00b0bd76-a9be-4f1e-94ea-6847090e8a55",
"level": "2",
"content": "變電操作",
"status": "1",
"createdAt": null,
"updatedAt": null,
"parentContent": "變電",
"sub": {
}
}
}
}
}