vxe-table 3.4.7-beta.0 → 3.4.7-beta.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -6,12 +6,12 @@ import { browse } from '../../tools/src/dom'
6
6
  const { getRowid } = UtilTools
7
7
 
8
8
  function insertTreeRow (_vm, newRecords, isAppend) {
9
- const { treeFullData, afterFullData, fullDataRowIdData, fullAllDataRowIdData, treeOpts } = _vm
9
+ const { tableFullTreeData, afterFullData, fullDataRowIdData, fullAllDataRowIdData, treeOpts } = _vm
10
10
  const funcName = isAppend ? 'push' : 'unshift'
11
11
  newRecords.forEach(item => {
12
12
  const parentRowId = item[treeOpts.parentField]
13
13
  const rowid = getRowid(_vm, item)
14
- const matchObj = parentRowId ? XEUtils.findTree(treeFullData, item => parentRowId === item[treeOpts.rowField], treeOpts) : null
14
+ const matchObj = parentRowId ? XEUtils.findTree(tableFullTreeData, item => parentRowId === item[treeOpts.rowField], treeOpts) : null
15
15
  if (matchObj) {
16
16
  const { item: parentRow } = matchObj
17
17
  const parentRest = fullAllDataRowIdData[getRowid(_vm, parentRow)]
@@ -31,13 +31,12 @@ function insertTreeRow (_vm, newRecords, isAppend) {
31
31
  }
32
32
  }
33
33
  afterFullData[funcName](item)
34
- treeFullData[funcName](item)
35
- const rest = { row: item, rowid, seq: -1, index: -1, _index: -1, $index: -1, items: treeFullData, parent: null, level: 0 }
34
+ tableFullTreeData[funcName](item)
35
+ const rest = { row: item, rowid, seq: -1, index: -1, _index: -1, $index: -1, items: tableFullTreeData, parent: null, level: 0 }
36
36
  fullDataRowIdData[rowid] = rest
37
37
  fullAllDataRowIdData[rowid] = rest
38
38
  }
39
39
  })
40
- _vm.updateVirtualTreeData()
41
40
  }
42
41
 
43
42
  export default {
@@ -59,7 +58,7 @@ export default {
59
58
  * @param {Row} row 指定行
60
59
  */
61
60
  _insertAt (records, row) {
62
- const { treeFullData, mergeList, afterFullData, editStore, sYOpts, scrollYLoad, tableFullData, treeConfig, fullDataRowIdData, fullAllDataRowIdData, treeOpts } = this
61
+ const { tableFullTreeData, mergeList, afterFullData, editStore, tableFullData, treeConfig, fullDataRowIdData, fullAllDataRowIdData, treeOpts } = this
63
62
  const { transform } = treeOpts
64
63
  if (!XEUtils.isArray(records)) {
65
64
  records = [records]
@@ -99,7 +98,7 @@ export default {
99
98
  } else {
100
99
  // 如果为虚拟树
101
100
  if (treeConfig && transform) {
102
- const matchObj = XEUtils.findTree(treeFullData, item => row[treeOpts.rowField] === item[treeOpts.rowField], treeOpts)
101
+ const matchObj = XEUtils.findTree(tableFullTreeData, item => row[treeOpts.rowField] === item[treeOpts.rowField], treeOpts)
103
102
  if (matchObj) {
104
103
  const { parent: parentRow } = matchObj
105
104
  const parentChilds = matchObj.items
@@ -122,7 +121,6 @@ export default {
122
121
  fullDataRowIdData[rowid] = rest
123
122
  fullAllDataRowIdData[rowid] = rest
124
123
  })
125
- this.updateVirtualTreeData()
126
124
  } else {
127
125
  if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') {
128
126
  UtilTools.warn('vxe.error.unableInsert')
@@ -152,13 +150,12 @@ export default {
152
150
  }
153
151
  }
154
152
  editStore.insertList.unshift(...newRecords)
155
- this.scrollYLoad = !treeConfig && sYOpts.gt > -1 && sYOpts.gt < tableFullData.length
156
- this.handleTableData(transform)
153
+ this.handleTableData(treeConfig && treeOpts.transform)
157
154
  this.updateFooter()
158
155
  this.cacheRowMap()
159
156
  this.updateAfterDataIndex()
160
157
  this.checkSelectionStatus()
161
- if (scrollYLoad) {
158
+ if (this.scrollYLoad) {
162
159
  this.updateScrollYSpace()
163
160
  }
164
161
  return this.$nextTick().then(() => {
@@ -178,7 +175,7 @@ export default {
178
175
  * 如果为空则删除所有
179
176
  */
180
177
  _remove (rows) {
181
- const { afterFullData, tableFullData, treeFullData, treeConfig, mergeList, editStore, checkboxOpts, selection, isInsertByRow, sYOpts, scrollYLoad, treeOpts } = this
178
+ const { afterFullData, tableFullData, tableFullTreeData, treeConfig, mergeList, editStore, checkboxOpts, selection, isInsertByRow, treeOpts } = this
182
179
  const { transform } = treeOpts
183
180
  const { actived, removeList, insertList } = editStore
184
181
  const { checkField: property } = checkboxOpts
@@ -214,7 +211,7 @@ export default {
214
211
  if (treeConfig && transform) {
215
212
  rows.forEach((row) => {
216
213
  const rowid = getRowid(this, row)
217
- const matchObj = XEUtils.findTree(treeFullData, item => rowid === getRowid(this, item), treeOpts)
214
+ const matchObj = XEUtils.findTree(tableFullTreeData, item => rowid === getRowid(this, item), treeOpts)
218
215
  if (matchObj) {
219
216
  const rItems = matchObj.items.splice(matchObj.index, 1)
220
217
  rest.push(rItems[0])
@@ -223,7 +220,6 @@ export default {
223
220
  if (afIndex > -1) {
224
221
  afterFullData.splice(afIndex, 1)
225
222
  }
226
- this.updateVirtualTreeData()
227
223
  })
228
224
  } else {
229
225
  rows.forEach(row => {
@@ -259,13 +255,12 @@ export default {
259
255
  insertList.splice(iIndex, 1)
260
256
  }
261
257
  })
262
- this.scrollYLoad = !treeConfig && sYOpts.gt > -1 && sYOpts.gt < tableFullData.length
263
- this.handleTableData(transform)
258
+ this.handleTableData(treeConfig && treeOpts.transform)
264
259
  this.updateFooter()
265
260
  this.cacheRowMap()
266
261
  this.updateAfterDataIndex()
267
262
  this.checkSelectionStatus()
268
- if (scrollYLoad) {
263
+ if (this.scrollYLoad) {
269
264
  this.updateScrollYSpace()
270
265
  }
271
266
  return this.$nextTick().then(() => {
@@ -318,7 +313,7 @@ export default {
318
313
  * 获取新增的临时数据
319
314
  */
320
315
  _getInsertRecords () {
321
- const { treeConfig, treeFullData, tableFullData, treeOpts } = this
316
+ const { treeConfig, tableFullTreeData, tableFullData, treeOpts } = this
322
317
  const insertList = this.editStore.insertList
323
318
  const insertRecords = []
324
319
  if (insertList.length) {
@@ -326,7 +321,7 @@ export default {
326
321
  if (treeConfig && treeOpts.transform) {
327
322
  insertList.forEach(row => {
328
323
  const rowid = getRowid(this, row)
329
- const matchObj = XEUtils.findTree(treeFullData, item => rowid === getRowid(this, item), treeOpts)
324
+ const matchObj = XEUtils.findTree(tableFullTreeData, item => rowid === getRowid(this, item), treeOpts)
330
325
  if (matchObj) {
331
326
  insertRecords.push(row)
332
327
  }
@@ -104,7 +104,7 @@ export default {
104
104
  // 判断面板不能大于表格高度
105
105
  let maxHeight = null
106
106
  if (filterHeight >= bodyElem.clientHeight) {
107
- maxHeight = Math.max(40, bodyElem.clientHeight - (filterFootElem ? filterFootElem.offsetHeight : 0) - (filterHeadElem ? filterHeadElem.offsetHeight : 0))
107
+ maxHeight = Math.max(60, bodyElem.clientHeight - (filterFootElem ? filterFootElem.offsetHeight : 0) - (filterHeadElem ? filterHeadElem.offsetHeight : 0))
108
108
  }
109
109
  if (column.fixed === 'left') {
110
110
  left = targetElem.offsetLeft + targetElem.offsetParent.offsetLeft - centerWidth
@@ -13,7 +13,7 @@ function getOptUniqueId () {
13
13
  }
14
14
 
15
15
  function getOptkey (_vm) {
16
- return _vm.optionId || '_XID'
16
+ return _vm.optionId || '_X_ID'
17
17
  }
18
18
 
19
19
  function getOptid (_vm, option) {
@@ -377,7 +377,7 @@ function renderRows (h, _vm, $xetable, fixedType, tableData, tableColumn) {
377
377
  )
378
378
  }
379
379
  // 如果是树形表格
380
- if (treeConfig && !scrollYLoad && treeExpandeds.length) {
380
+ if (treeConfig && !scrollYLoad && !treeOpts.transform && treeExpandeds.length) {
381
381
  const rowChildren = row[treeOpts.children]
382
382
  if (rowChildren && rowChildren.length && treeExpandeds.indexOf(row) > -1) {
383
383
  rows.push(...renderRows(h, _vm, $xetable, fixedType, rowChildren, tableColumn))
@@ -301,9 +301,33 @@ const Methods = {
301
301
  return this.handleTableData(true).then(this.updateFooter).then(this.recalculate)
302
302
  },
303
303
  handleTableData (force) {
304
- const { scrollYLoad, scrollYStore } = this
305
- const fullData = force ? this.updateAfterFullData() : this.afterFullData
306
- this.tableData = scrollYLoad ? fullData.slice(scrollYStore.startIndex, scrollYStore.endIndex) : fullData.slice(0)
304
+ const { treeConfig, scrollYLoad, scrollYStore, fullDataRowIdData, treeExpandeds, treeOpts } = this
305
+ let fullList = []
306
+ // 是否进行数据处理
307
+ if (force) {
308
+ this.updateAfterFullData()
309
+ }
310
+ // 如果为虚拟树,将树结构拍平
311
+ if (treeConfig && treeOpts.transform) {
312
+ const expandMaps = new Map()
313
+ XEUtils.eachTree(this.afterTreeFullData, (row, index, items, path, parent) => {
314
+ if (!parent || (expandMaps.has(parent) && treeExpandeds.indexOf(parent) > -1)) {
315
+ expandMaps.set(row, 1)
316
+ fullList.push(row)
317
+ }
318
+ }, { children: treeOpts.mapChildren })
319
+ } else {
320
+ fullList = this.afterFullData
321
+ }
322
+ const tableData = scrollYLoad ? fullList.slice(scrollYStore.startIndex, scrollYStore.endIndex) : fullList.slice(0)
323
+ tableData.forEach((row, $index) => {
324
+ const rowid = getRowid(this, row)
325
+ const rest = fullDataRowIdData[rowid]
326
+ if (rest) {
327
+ rest.$index = $index
328
+ }
329
+ })
330
+ this.tableData = tableData
307
331
  return this.$nextTick()
308
332
  },
309
333
  updateScrollYStatus (fullData) {
@@ -334,13 +358,24 @@ const Methods = {
334
358
  if (!treeOpts.children) {
335
359
  UtilTools.error('vxe.error.reqProp', ['tree-config.children'])
336
360
  }
361
+ if (!treeOpts.mapChildren) {
362
+ UtilTools.error('vxe.error.reqProp', ['tree-config.mapChildren'])
363
+ }
364
+ if (treeOpts.children === treeOpts.mapChildren) {
365
+ UtilTools.error('vxe.error.errConflicts', ['tree-config.children', 'tree-config.mapChildren'])
366
+ }
337
367
  fullData.forEach(row => {
338
368
  if (row[treeOpts.children] && row[treeOpts.children].length) {
339
369
  UtilTools.warn('vxe.error.errConflicts', ['tree-config.transform', `row.${treeOpts.children}`])
340
370
  }
341
371
  })
342
372
  }
343
- treeData = XEUtils.toArrayTree(fullData, { key: treeOpts.rowField, parentKey: treeOpts.parentField, children: treeOpts.children })
373
+ treeData = XEUtils.toArrayTree(fullData, {
374
+ key: treeOpts.rowField,
375
+ parentKey: treeOpts.parentField,
376
+ children: treeOpts.children,
377
+ mapChildren: treeOpts.mapChildren
378
+ })
344
379
  fullData = treeData.slice(0)
345
380
  } else {
346
381
  treeData = fullData.slice(0)
@@ -356,7 +391,7 @@ const Methods = {
356
391
  this.scrollYLoad = sYLoad
357
392
  // 全量数据
358
393
  this.tableFullData = fullData
359
- this.treeFullData = treeData
394
+ this.tableFullTreeData = treeData
360
395
  // 缓存数据
361
396
  this.cacheRowMap(true)
362
397
  // 原始数据
@@ -530,7 +565,7 @@ const Methods = {
530
565
  * 牺牲数据组装的耗时,用来换取使用过程中的流畅
531
566
  */
532
567
  cacheRowMap (source) {
533
- const { treeConfig, treeOpts, tableFullData, fullDataRowMap, fullAllDataRowMap } = this
568
+ const { treeConfig, treeOpts, tableFullData, fullDataRowMap, fullAllDataRowMap, tableFullTreeData } = this
534
569
  let { fullDataRowIdData, fullAllDataRowIdData } = this
535
570
  const rowkey = getRowkey(this)
536
571
  const isLazy = treeConfig && treeOpts.lazy
@@ -560,7 +595,7 @@ const Methods = {
560
595
  fullAllDataRowIdData = this.fullAllDataRowIdData = {}
561
596
  fullAllDataRowMap.clear()
562
597
  if (treeConfig) {
563
- XEUtils.eachTree(tableFullData, handleCache, treeOpts)
598
+ XEUtils.eachTree(tableFullTreeData, handleCache, treeOpts)
564
599
  } else {
565
600
  tableFullData.forEach(handleCache)
566
601
  }
@@ -1078,10 +1113,12 @@ const Methods = {
1078
1113
  * 如果存在筛选条件,继续处理
1079
1114
  */
1080
1115
  updateAfterFullData () {
1081
- const { tableFullColumn, tableFullData, filterOpts, sortOpts } = this
1116
+ const { tableFullColumn, tableFullData, filterOpts, sortOpts, treeConfig, treeOpts, tableFullTreeData } = this
1082
1117
  const { remote: allRemoteFilter, filterMethod: allFilterMethod } = filterOpts
1083
1118
  const { remote: allRemoteSort, sortMethod: allSortMethod, multiple: sortMultiple } = sortOpts
1084
- let tableData = tableFullData.slice(0)
1119
+ const { transform } = treeOpts
1120
+ let tableData = []
1121
+ let tableTree = []
1085
1122
  const filterColumns = []
1086
1123
  const orderColumns = []
1087
1124
  tableFullColumn.forEach(column => {
@@ -1104,7 +1141,7 @@ const Methods = {
1104
1141
  }
1105
1142
  })
1106
1143
  if (filterColumns.length) {
1107
- tableData = tableData.filter(row => {
1144
+ const handleFilter = (row) => {
1108
1145
  return filterColumns.every(({ column, valueList, itemList }) => {
1109
1146
  if (valueList.length && !allRemoteFilter) {
1110
1147
  const { filterMethod, filterRender } = column
@@ -1125,7 +1162,16 @@ const Methods = {
1125
1162
  }
1126
1163
  return true
1127
1164
  })
1128
- })
1165
+ }
1166
+ if (treeConfig && transform) {
1167
+ tableTree = XEUtils.searchTree(tableFullTreeData, handleFilter, { ...treeOpts, original: true })
1168
+ } else {
1169
+ tableData = treeConfig ? tableFullTreeData.filter(handleFilter) : tableFullData.filter(handleFilter)
1170
+ tableTree = tableData
1171
+ }
1172
+ } else {
1173
+ tableData = treeConfig ? tableFullTreeData.slice(0) : tableFullData.slice(0)
1174
+ tableTree = tableData
1129
1175
  }
1130
1176
  const firstOrderColumn = orderColumns[0]
1131
1177
  if (!allRemoteSort && firstOrderColumn) {
@@ -1145,18 +1191,20 @@ const Methods = {
1145
1191
  tableData = XEUtils.orderBy(tableData, sortByConfs || [firstOrderColumn].map(({ column, order }) => [getOrderField(this, column), order]))
1146
1192
  }
1147
1193
  }
1194
+ tableTree = tableData
1148
1195
  }
1149
1196
  this.afterFullData = tableData
1150
- return tableData
1197
+ this.afterTreeFullData = tableTree
1198
+ this.updateAfterDataIndex()
1151
1199
  },
1152
1200
  /**
1153
1201
  * 预编译
1154
1202
  * 对渲染中的数据提前解析序号及索引。牺牲提前编译耗时换取渲染中额外损耗,使运行时更加流畅
1155
1203
  */
1156
1204
  updateAfterDataIndex () {
1157
- const { treeConfig, afterFullData, fullDataRowIdData, fullAllDataRowIdData, treeFullData, treeOpts } = this
1205
+ const { treeConfig, afterFullData, fullDataRowIdData, fullAllDataRowIdData, afterTreeFullData, treeOpts } = this
1158
1206
  if (treeConfig) {
1159
- XEUtils.eachTree(treeFullData, (row, index, items, path) => {
1207
+ XEUtils.eachTree(afterTreeFullData, (row, index, items, path) => {
1160
1208
  const rowid = getRowid(this, row)
1161
1209
  const allrest = fullAllDataRowIdData[rowid]
1162
1210
  const fullrest = fullDataRowIdData[rowid]
@@ -3754,7 +3802,7 @@ const Methods = {
3754
3802
  return this.handleAsyncTreeExpandChilds(row)
3755
3803
  }).then(() => {
3756
3804
  if (transform) {
3757
- return this.updateVirtualTreeData()
3805
+ return this.handleTableData()
3758
3806
  }
3759
3807
  }).then(() => {
3760
3808
  return this.recalculate()
@@ -3900,23 +3948,6 @@ const Methods = {
3900
3948
  }
3901
3949
  return Promise.all(result).then(this.recalculate)
3902
3950
  },
3903
- updateVirtualTreeData () {
3904
- const { scrollYLoad: oldScrollYLoad, treeExpandeds, treeOpts, treeFullData } = this
3905
- const fullData = []
3906
- const expandMaps = new Map()
3907
- XEUtils.eachTree(treeFullData, (row, index, items, path, parent) => {
3908
- if (!parent || (expandMaps.has(parent) && treeExpandeds.indexOf(parent) > -1)) {
3909
- expandMaps.set(row, 1)
3910
- fullData.push(row)
3911
- }
3912
- }, treeOpts)
3913
- const scrollYLoad = this.updateScrollYStatus(fullData)
3914
- this.tableFullData = scrollYLoad ? fullData : treeFullData
3915
- if (scrollYLoad || oldScrollYLoad !== scrollYLoad) {
3916
- return this.handleTableData(true).then(() => this.recalculate())
3917
- }
3918
- return this.$nextTick()
3919
- },
3920
3951
  /**
3921
3952
  * 虚拟树的展开与收起
3922
3953
  * @param rows
@@ -3925,7 +3956,7 @@ const Methods = {
3925
3956
  */
3926
3957
  handleVirtualTreeExpand (rows, expanded) {
3927
3958
  return this.handleBaseTreeExpand(rows, expanded).then(() => {
3928
- return this.updateVirtualTreeData()
3959
+ return this.handleTableData()
3929
3960
  }).then(() => {
3930
3961
  return this.recalculate()
3931
3962
  })
@@ -3973,7 +4004,7 @@ const Methods = {
3973
4004
  if (reserve) {
3974
4005
  XEUtils.eachTree(tableFullData, row => this.handleTreeExpandReserve(row, false), treeOpts)
3975
4006
  }
3976
- return this.updateVirtualTreeData().then(() => {
4007
+ return this.handleTableData().then(() => {
3977
4008
  if (isExists) {
3978
4009
  this.recalculate()
3979
4010
  }
@@ -183,7 +183,7 @@ export const UtilTools = {
183
183
  },
184
184
  // 行主键 key
185
185
  getRowkey ($xetable) {
186
- return $xetable.rowId || '_XID'
186
+ return $xetable.rowId || '_X_ID'
187
187
  },
188
188
  // 行主键 value
189
189
  getRowid ($xetable, row) {
@@ -49,7 +49,7 @@ export default {
49
49
  // storage: false,
50
50
  // checkMethod () {}
51
51
  // },
52
- // rowId: '_XID', // 行数据的唯一主键字段名
52
+ // rowId: '_X_ID', // 行数据的唯一主键字段名
53
53
  sortConfig: {
54
54
  // remote: false,
55
55
  // trigger: 'default',
@@ -67,6 +67,7 @@ export default {
67
67
  parentField: 'parentId',
68
68
  children: 'children',
69
69
  hasChild: 'hasChild',
70
+ mapChildren: '_X_CHILD',
70
71
  indent: 20,
71
72
  showIcon: true
72
73
  },