Browse Source

perf(treeTable): 改进 flatToTree (#1912)

* perf(treeTable): 改进 flatToTree 性能

* test: 新增 treeTable 平铺模式的测试数据

* test: 微调 treeTable 测试用例

* refactor(treeTable): 剔除多余循环,进一步优化性能

* fix: 修复一些边缘情况

---------

Co-authored-by: 贤心 <3277200+sentsim@users.noreply.github.com>
pull/1923/head
morning-star 6 months ago committed by GitHub
parent
commit
21272d3510
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
  1. 33
      examples/json/treeTable/demo-simple.json
  2. 3
      examples/treeTable.html
  3. 51
      src/modules/treeTable.js

33
examples/json/treeTable/demo-simple.json

@ -0,0 +1,33 @@
{
"code": 0,
"count": 100,
"data": [
{
"id":1,"name":"User-1","type":1,"status":2,"score":11,"experience":123,"sex":"女","city":"北京市","description":"-","createTime":"2016-10-14 10:00:00","parentId":null
},
{
"id":2,"name":"User-2","type":1,"status":2,"score":22,"experience":456,"sex":"男","city":"上海市","description":"-","createTime":"2016-10-14 10:00:00","parentId":1
},
{
"id":3,"name":"User-3","type":1,"status":2,"score":33,"experience":777,"sex":"男","city":"广州市","description":"-","createTime":"2016-10-14 10:00:00","parentId":2
},
{
"id":4,"name":"User-4","type":1,"status":2,"score":44,"experience":888,"sex":"男","city":"深圳市","description":"-","createTime":"2016-10-14 10:00:00","parentId":null
},
{
"id":5,"name":"User-5","type":1,"status":2,"score":55,"experience":999,"sex":"男","city":"重庆市","description":"-","createTime":"2016-10-14 10:00:00","parentId":null
},
{
"id":6,"name":"User-6","type":1,"status":2,"score":66,"experience":1000,"sex":"男","city":"成都市","description":"-","createTime":"2016-10-14 10:00:00","parentId":5
},
{
"id":7,"name":"User-7","type":1,"status":2,"score":77,"experience":1001,"sex":"男","city":"苏州市","description":"-","createTime":"2016-10-14 10:00:00","parentId":5
},
{
"id":8,"name":"User-8","type":1,"status":2,"score":88,"experience":1002,"sex":"男","city":"杭州市","description":"-","createTime":"2016-10-14 10:00:00","parentId":null
},
{
"id":9,"name":"User-9","type":1,"status":2,"score":99,"experience":1003,"sex":"男","city":"武汉市","description":"-","createTime":"2016-10-14 10:00:00","parentId":null
}
]
}

3
examples/treeTable.html

@ -44,6 +44,9 @@ layui.use(['treeTable', 'dropdown', 'layer'], function(){
},
view: {
iconLeaf: ''
},
data: {
// isSimpleData: true
}
},
cols: [[

51
src/modules/treeTable.js

@ -325,31 +325,40 @@ layui.define(['table'], function (exports) {
idKey = idKey || 'id';
pIdKey = pIdKey || 'parentId';
childrenKey = childrenKey || 'children';
// 创建一个空的 nodes 对象,用于保存所有的节点
var nodes = {};
// 遍历所有节点,将其加入 nodes 对象中
// 创建一个空的 map 对象,用于保存所有的节点
var map = {};
var rootNodes = [];
var idTemp = '';
layui.each(flatArr, function (index, item) {
idTemp = idKey + item[idKey];
nodes[idTemp] = $.extend({}, item);
nodes[idTemp][childrenKey] = [];
})
// 遍历所有节点,将其父子关系加入 nodes 对象
var pidTemp = '';
layui.each(nodes, function (index, item) {
layui.each(flatArr, function(index, item){
idTemp = idKey + item[idKey];
pidTemp = idKey + item[pIdKey];
if (pidTemp && nodes[pidTemp]) {
nodes[pidTemp][childrenKey].push(item);
// 将节点存入 map 对象
if(!map[idTemp]){
map[idTemp] = {};
map[idTemp][childrenKey] = [];
}
})
// 返回顶层节点
return Object.keys(nodes)
.map(function(k) {
return nodes[k];
})
.filter(function (item) {
return rootPid ? item[pIdKey] === rootPid : !item[pIdKey];
})
// 合并节点
var tempObj = {};
tempObj[childrenKey] = map[idTemp][childrenKey];
map[idTemp] = $.extend({}, item, tempObj);
var isRootNode = (rootPid ? map[idTemp][pIdKey] === rootPid : !map[idTemp][pIdKey]);
if(isRootNode){
rootNodes.push(map[idTemp]);
}else{
if(!map[pidTemp]){
map[pidTemp] = {};
map[pidTemp][childrenKey] = [];
}
map[pidTemp][childrenKey].push(map[idTemp]);
}
});
return rootNodes;
}
Class.prototype.flatToTree = function (tableData) {

Loading…
Cancel
Save