vxe-table 3.4.7-beta.2 → 3.4.10-beta.0

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.
@@ -2,7 +2,7 @@ import XEUtils from 'xe-utils'
2
2
  import GlobalConfig from '../../v-x-e-table/src/conf'
3
3
  import VXETable from '../../v-x-e-table'
4
4
  import { UtilTools } from '../../tools'
5
- import { mergeBodyMethod, toTreePathSeq } from '../../table/src/util'
5
+ import { mergeBodyMethod } from '../../table/src/util'
6
6
  import { browse } from '../../tools/src/dom'
7
7
 
8
8
  const { formatText } = UtilTools
@@ -40,16 +40,13 @@ function hasTreeChildren ($xetable, row) {
40
40
  return row[treeOpts.children] && row[treeOpts.children].length > 0
41
41
  }
42
42
 
43
- function getSeq ($xetable, row, rowIndex, column, columnIndex, path) {
43
+ function getSeq ($xetable, row, rowIndex, column, columnIndex) {
44
44
  const seqOpts = $xetable.seqOpts
45
45
  const seqMethod = seqOpts.seqMethod || column.seqMethod
46
46
  if (seqMethod) {
47
47
  return seqMethod({ row, rowIndex, column, columnIndex })
48
48
  }
49
- if (path) {
50
- return toTreePathSeq(path)
51
- }
52
- return seqOpts.startIndex + rowIndex + 1
49
+ return $xetable.getRowSeq(row)
53
50
  }
54
51
 
55
52
  function defaultFilterExportColumn (column) {
@@ -106,7 +103,7 @@ function getLabelData ($xetable, opts, columns, datas) {
106
103
  } else {
107
104
  switch (column.type) {
108
105
  case 'seq':
109
- cellValue = getSeq($xetable, row, rowIndex, column, columnIndex, path)
106
+ cellValue = getSeq($xetable, row, rowIndex, column, columnIndex)
110
107
  break
111
108
  case 'checkbox':
112
109
  cellValue = toBooleanValue($xetable.isCheckedByCheckboxRow(row))
@@ -162,7 +159,7 @@ function getLabelData ($xetable, opts, columns, datas) {
162
159
  } else {
163
160
  switch (column.type) {
164
161
  case 'seq':
165
- cellValue = getSeq($xetable, row, rowIndex, column, columnIndex, null)
162
+ cellValue = getSeq($xetable, row, rowIndex, column, columnIndex)
166
163
  break
167
164
  case 'checkbox':
168
165
  cellValue = toBooleanValue($xetable.isCheckedByCheckboxRow(row))
@@ -12,10 +12,20 @@ function isOperateMouse ($xetable) {
12
12
  return $xetable._isResize || ($xetable.lastScrollTime && Date.now() < $xetable.lastScrollTime + $xetable.delayHover)
13
13
  }
14
14
 
15
- function renderLine (h, _vm, $xetable, rowLevel, items, params) {
16
- const column = params.column
17
- const { treeOpts, treeConfig } = $xetable
15
+ function renderLine (h, _vm, $xetable, params) {
16
+ const { row, column } = params
17
+ const { treeOpts, treeConfig, fullAllDataRowIdData } = $xetable
18
18
  const { slots, treeNode } = column
19
+ const rowid = UtilTools.getRowid($xetable, row)
20
+ const rest = fullAllDataRowIdData[rowid]
21
+ let rLevel = 0
22
+ let rIndex = 0
23
+ let items = []
24
+ if (rest) {
25
+ rLevel = rest.level
26
+ rIndex = rest._index
27
+ items = rest.items
28
+ }
19
29
  if (slots && slots.line) {
20
30
  return $xetable.callSlot(slots.line, params, h)
21
31
  }
@@ -27,8 +37,8 @@ function renderLine (h, _vm, $xetable, rowLevel, items, params) {
27
37
  h('div', {
28
38
  class: 'vxe-tree--line',
29
39
  style: {
30
- height: `${calcTreeLine(params, items)}px`,
31
- left: `${(rowLevel * treeOpts.indent) + (rowLevel ? 2 - getOffsetSize($xetable) : 0) + 16}px`
40
+ height: `${calcTreeLine(params, items, rIndex)}px`,
41
+ left: `${(rLevel * treeOpts.indent) + (rLevel ? 2 - getOffsetSize($xetable) : 0) + 16}px`
32
42
  }
33
43
  })
34
44
  ])
@@ -213,7 +223,7 @@ function renderColumn (h, _vm, $xetable, seq, rowid, fixedType, rowLevel, row, r
213
223
  } else {
214
224
  // 渲染单元格
215
225
  tdVNs.push(
216
- ...renderLine(h, _vm, $xetable, rowLevel, items, params),
226
+ ...renderLine(h, _vm, $xetable, params),
217
227
  h('div', {
218
228
  class: ['vxe-cell', {
219
229
  'c--title': showTitle,
@@ -286,7 +296,7 @@ function renderRows (h, _vm, $xetable, fixedType, tableData, tableColumn) {
286
296
  checkboxOpts,
287
297
  expandColumn,
288
298
  hasFixedColumn,
289
- fullDataRowIdData,
299
+ fullAllDataRowIdData,
290
300
  rowOpts
291
301
  } = $xetable
292
302
  const rows = []
@@ -312,7 +322,7 @@ function renderRows (h, _vm, $xetable, fixedType, tableData, tableColumn) {
312
322
  }
313
323
  }
314
324
  const rowid = UtilTools.getRowid($xetable, row)
315
- const rest = fullDataRowIdData[rowid]
325
+ const rest = fullAllDataRowIdData[rowid]
316
326
  const rowLevel = rest ? rest.level : 0
317
327
  const seq = rest ? rest.seq : -1
318
328
  const params = { $table: $xetable, seq, rowid, fixed: fixedType, type: renderType, level: rowLevel, row, rowIndex, $rowIndex }
@@ -283,7 +283,7 @@ const Methods = {
283
283
  return clearTableAllStatus(this)
284
284
  },
285
285
  /**
286
- * 同步 data 数据
286
+ * 同步 data 数据(即将废弃)
287
287
  * 如果用了该方法,那么组件将不再记录增删改的状态,只能自行实现对应逻辑
288
288
  * 对于某些特殊的场景,比如深层树节点元素发生变动时可能会用到
289
289
  */
@@ -301,23 +301,14 @@ const Methods = {
301
301
  return this.handleTableData(true).then(this.updateFooter).then(this.recalculate)
302
302
  },
303
303
  handleTableData (force) {
304
- const { treeConfig, scrollYLoad, scrollYStore, fullDataRowIdData, treeExpandeds, treeOpts } = this
305
- let fullList = []
304
+ const { scrollYLoad, scrollYStore, fullDataRowIdData, afterFullData } = this
305
+ let fullList = afterFullData
306
306
  // 是否进行数据处理
307
307
  if (force) {
308
+ // 更新数据,处理筛选和排序
308
309
  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
310
+ // 如果为虚拟树,将树结构拍平
311
+ fullList = this.handleVirtualTreeToList()
321
312
  }
322
313
  const tableData = scrollYLoad ? fullList.slice(scrollYStore.startIndex, scrollYStore.endIndex) : fullList.slice(0)
323
314
  tableData.forEach((row, $index) => {
@@ -1111,6 +1102,27 @@ const Methods = {
1111
1102
  }
1112
1103
  return rowList
1113
1104
  },
1105
+ /**
1106
+ * 如果为虚拟树,将树结构拍平
1107
+ * @returns
1108
+ */
1109
+ handleVirtualTreeToList () {
1110
+ const { treeOpts, treeConfig, treeExpandeds, afterTreeFullData, afterFullData } = this
1111
+ if (treeConfig && treeOpts.transform) {
1112
+ const fullData = []
1113
+ const expandMaps = new Map()
1114
+ XEUtils.eachTree(afterTreeFullData, (row, index, items, path, parent) => {
1115
+ if (!parent || (expandMaps.has(parent) && treeExpandeds.indexOf(parent) > -1)) {
1116
+ expandMaps.set(row, 1)
1117
+ fullData.push(row)
1118
+ }
1119
+ }, { children: treeOpts.mapChildren })
1120
+ this.afterFullData = fullData
1121
+ this.updateScrollYStatus(fullData)
1122
+ return fullData
1123
+ }
1124
+ return afterFullData
1125
+ },
1114
1126
  /**
1115
1127
  * 获取处理后全量的表格数据
1116
1128
  * 如果存在筛选条件,继续处理
@@ -1167,34 +1179,53 @@ const Methods = {
1167
1179
  })
1168
1180
  }
1169
1181
  if (treeConfig && transform) {
1182
+ // 筛选虚拟树
1170
1183
  tableTree = XEUtils.searchTree(tableFullTreeData, handleFilter, { ...treeOpts, original: true })
1184
+ tableData = tableTree
1171
1185
  } else {
1172
1186
  tableData = treeConfig ? tableFullTreeData.filter(handleFilter) : tableFullData.filter(handleFilter)
1173
1187
  tableTree = tableData
1174
1188
  }
1175
1189
  } else {
1176
- tableData = treeConfig ? tableFullTreeData.slice(0) : tableFullData.slice(0)
1177
- tableTree = tableData
1190
+ if (treeConfig && transform) {
1191
+ // 还原虚拟树
1192
+ tableTree = XEUtils.searchTree(tableFullTreeData, () => true, { ...treeOpts, original: true })
1193
+ tableData = tableTree
1194
+ } else {
1195
+ tableData = treeConfig ? tableFullTreeData.slice(0) : tableFullData.slice(0)
1196
+ tableTree = tableData
1197
+ }
1178
1198
  }
1179
1199
  const firstOrderColumn = orderColumns[0]
1180
1200
  if (!allRemoteSort && firstOrderColumn) {
1181
- if (allSortMethod) {
1182
- const sortRests = allSortMethod({ data: tableData, column: firstOrderColumn.column, property: firstOrderColumn.property, order: firstOrderColumn.order, sortList: orderColumns, $table: this })
1183
- tableData = XEUtils.isArray(sortRests) ? sortRests : tableData
1201
+ if (treeConfig && transform) {
1202
+ // 虚拟树和列表一样,只能排序根级节点
1203
+ if (allSortMethod) {
1204
+ const sortRests = allSortMethod({ data: tableTree, sortList: orderColumns, $table: this })
1205
+ tableTree = XEUtils.isArray(sortRests) ? sortRests : tableTree
1206
+ } else {
1207
+ tableTree = XEUtils.orderBy(tableTree, orderColumns.map(({ column, order }) => [getOrderField(this, column), order]))
1208
+ }
1209
+ tableData = tableTree
1184
1210
  } else {
1185
- // 兼容 v4
1186
- if (sortMultiple) {
1187
- tableData = XEUtils.orderBy(tableData, orderColumns.map(({ column, order }) => [getOrderField(this, column), order]))
1211
+ if (allSortMethod) {
1212
+ const sortRests = allSortMethod({ data: tableData, column: firstOrderColumn.column, property: firstOrderColumn.property, order: firstOrderColumn.order, sortList: orderColumns, $table: this })
1213
+ tableData = XEUtils.isArray(sortRests) ? sortRests : tableData
1188
1214
  } else {
1189
- // 兼容 v2,在 v4 中废弃, sortBy 不能为数组
1190
- let sortByConfs
1191
- if (XEUtils.isArray(firstOrderColumn.sortBy)) {
1192
- sortByConfs = firstOrderColumn.sortBy.map(item => [item, firstOrderColumn.order])
1215
+ // 兼容 v4
1216
+ if (sortMultiple) {
1217
+ tableData = XEUtils.orderBy(tableData, orderColumns.map(({ column, order }) => [getOrderField(this, column), order]))
1218
+ } else {
1219
+ // 兼容 v2,在 v4 中废弃, sortBy 不能为数组
1220
+ let sortByConfs
1221
+ if (XEUtils.isArray(firstOrderColumn.sortBy)) {
1222
+ sortByConfs = firstOrderColumn.sortBy.map(item => [item, firstOrderColumn.order])
1223
+ }
1224
+ tableData = XEUtils.orderBy(tableData, sortByConfs || [firstOrderColumn].map(({ column, order }) => [getOrderField(this, column), order]))
1193
1225
  }
1194
- tableData = XEUtils.orderBy(tableData, sortByConfs || [firstOrderColumn].map(({ column, order }) => [getOrderField(this, column), order]))
1195
1226
  }
1227
+ tableTree = tableData
1196
1228
  }
1197
- tableTree = tableData
1198
1229
  }
1199
1230
  this.afterFullData = tableData
1200
1231
  this.afterTreeFullData = tableTree
@@ -1210,33 +1241,28 @@ const Methods = {
1210
1241
  XEUtils.eachTree(afterTreeFullData, (row, index, items, path) => {
1211
1242
  const rowid = getRowid(this, row)
1212
1243
  const allrest = fullAllDataRowIdData[rowid]
1213
- const fullrest = fullDataRowIdData[rowid]
1214
1244
  const seq = path.map((num, i) => i % 2 === 0 ? (Number(num) + 1) : '.').join('')
1215
1245
  if (allrest) {
1216
1246
  allrest.seq = seq
1217
- }
1218
- if (fullrest) {
1219
- fullrest.seq = seq
1247
+ allrest._index = index
1220
1248
  } else {
1221
- fullAllDataRowIdData[rowid] = { row, rowid, seq, index: -1, $index: -1, _index: index, items: [], parent: null, level: 0 }
1222
- fullDataRowIdData[rowid] = { row, rowid, seq, index: -1, $index: -1, _index: index, items: [], parent: null, level: 0 }
1249
+ const rest = { row, rowid, seq, index: -1, $index: -1, _index: index, items: [], parent: null, level: 0 }
1250
+ fullAllDataRowIdData[rowid] = rest
1251
+ fullDataRowIdData[rowid] = rest
1223
1252
  }
1224
- }, treeOpts)
1253
+ }, { children: treeOpts.mapChildren })
1225
1254
  } else {
1226
1255
  afterFullData.forEach((row, index) => {
1227
1256
  const rowid = getRowid(this, row)
1228
1257
  const allrest = fullAllDataRowIdData[rowid]
1229
- const fullrest = fullDataRowIdData[rowid]
1230
1258
  const seq = index + 1
1231
1259
  if (allrest) {
1232
1260
  allrest.seq = seq
1233
- }
1234
- if (fullrest) {
1235
- fullrest.seq = seq
1236
- fullrest._index = index
1261
+ allrest._index = index
1237
1262
  } else {
1238
- fullAllDataRowIdData[rowid] = { row, rowid, seq, index: -1, $index: -1, _index: index, items: [], parent: null, level: 0 }
1239
- fullDataRowIdData[rowid] = { row, rowid, seq, index: -1, $index: -1, _index: index, items: [], parent: null, level: 0 }
1263
+ const rest = { row, rowid, seq, index: -1, $index: -1, _index: index, items: [], parent: null, level: 0 }
1264
+ fullAllDataRowIdData[rowid] = rest
1265
+ fullDataRowIdData[rowid] = rest
1240
1266
  }
1241
1267
  })
1242
1268
  }
@@ -3785,12 +3811,16 @@ const Methods = {
3785
3811
  },
3786
3812
  clearTreeExpandLoaded (row) {
3787
3813
  const { treeOpts, treeExpandeds, fullAllDataRowMap } = this
3788
- const { lazy } = treeOpts
3814
+ const { transform, lazy } = treeOpts
3789
3815
  const rest = fullAllDataRowMap.get(row)
3790
3816
  if (lazy && rest) {
3791
3817
  rest.treeLoaded = false
3792
3818
  XEUtils.remove(treeExpandeds, item => row === item)
3793
3819
  }
3820
+ if (transform) {
3821
+ this.handleVirtualTreeToList()
3822
+ return this.handleTableData()
3823
+ }
3794
3824
  return this.$nextTick()
3795
3825
  },
3796
3826
  /**
@@ -3805,6 +3835,7 @@ const Methods = {
3805
3835
  return this.handleAsyncTreeExpandChilds(row)
3806
3836
  }).then(() => {
3807
3837
  if (transform) {
3838
+ this.handleVirtualTreeToList()
3808
3839
  return this.handleTableData()
3809
3840
  }
3810
3841
  }).then(() => {
@@ -3967,6 +3998,7 @@ const Methods = {
3967
3998
  */
3968
3999
  handleVirtualTreeExpand (rows, expanded) {
3969
4000
  return this.handleBaseTreeExpand(rows, expanded).then(() => {
4001
+ this.handleVirtualTreeToList()
3970
4002
  return this.handleTableData()
3971
4003
  }).then(() => {
3972
4004
  return this.recalculate()
@@ -4009,13 +4041,18 @@ const Methods = {
4009
4041
  */
4010
4042
  clearTreeExpand () {
4011
4043
  const { treeOpts, treeExpandeds, tableFullData } = this
4012
- const { reserve } = treeOpts
4044
+ const { transform, reserve } = treeOpts
4013
4045
  const isExists = treeExpandeds.length
4014
4046
  this.treeExpandeds = []
4015
4047
  if (reserve) {
4016
4048
  XEUtils.eachTree(tableFullData, row => this.handleTreeExpandReserve(row, false), treeOpts)
4017
4049
  }
4018
4050
  return this.handleTableData().then(() => {
4051
+ if (transform) {
4052
+ this.handleVirtualTreeToList()
4053
+ return this.handleTableData()
4054
+ }
4055
+ }).then(() => {
4019
4056
  if (isExists) {
4020
4057
  this.recalculate()
4021
4058
  }
@@ -115,9 +115,12 @@ export function getColMinWidth (params) {
115
115
  }
116
116
 
117
117
  function countTreeExpand (prevRow, params) {
118
+ let count = 1
119
+ if (!prevRow) {
120
+ return count
121
+ }
118
122
  const { $table } = params
119
123
  const rowChildren = prevRow[$table.treeOpts.children]
120
- let count = 1
121
124
  if ($table.isTreeExpandByRow(prevRow)) {
122
125
  for (let index = 0; index < rowChildren.length; index++) {
123
126
  count += countTreeExpand(rowChildren[index], params)
@@ -130,13 +133,13 @@ export function getOffsetSize ($xetable) {
130
133
  return lineOffsetSizes[$xetable.vSize] || 0
131
134
  }
132
135
 
133
- export function calcTreeLine (params, items) {
134
- const { $table, $rowIndex } = params
136
+ export function calcTreeLine (params, items, rIndex) {
137
+ const { $table } = params
135
138
  let expandSize = 1
136
- if ($rowIndex) {
137
- expandSize = countTreeExpand(items[$rowIndex - 1], params)
139
+ if (rIndex) {
140
+ expandSize = countTreeExpand(items[rIndex - 1], params)
138
141
  }
139
- return $table.rowHeight * expandSize - ($rowIndex ? 1 : (12 - getOffsetSize($table)))
142
+ return $table.rowHeight * expandSize - (rIndex ? 1 : (12 - getOffsetSize($table)))
140
143
  }
141
144
 
142
145
  export function mergeBodyMethod (mergeList, _rowIndex, _columnIndex) {
@@ -1,4 +1,5 @@
1
1
  import XEUtils from 'xe-utils'
2
+ import GlobalConfig from '../../v-x-e-table/src/conf'
2
3
  import { UtilTools, DomTools } from '../../tools'
3
4
  import { eqEmptyValue } from '../../tools/src/utils'
4
5
 
@@ -151,21 +152,26 @@ export default {
151
152
  const ruleProps = Object.keys(validRest)
152
153
  return this.$nextTick().then(() => {
153
154
  if (ruleProps.length) {
154
- return validRest[ruleProps[0]][0]
155
+ return Promise.reject(validRest[ruleProps[0]][0])
155
156
  }
156
157
  if (cb) {
157
158
  cb()
158
159
  }
159
160
  })
160
161
  }).catch(firstErrParams => {
161
- return new Promise((resolve) => {
162
+ return new Promise((resolve, reject) => {
162
163
  const finish = () => {
163
164
  this.$nextTick(() => {
164
165
  if (cb) {
165
166
  cb(validRest)
166
167
  resolve()
167
168
  } else {
168
- resolve(validRest)
169
+ if (GlobalConfig.validToReject) {
170
+ // 已废弃,校验失败将不会执行catch
171
+ reject(validRest)
172
+ } else {
173
+ resolve(validRest)
174
+ }
169
175
  }
170
176
  })
171
177
  }
package/types/table.d.ts CHANGED
@@ -272,6 +272,7 @@ export declare class Table extends VXETableComponent {
272
272
  /**
273
273
  * 同步 data 数据;如果用了该方法,那么组件将不再记录增删改的状态,只能自行实现对应逻辑
274
274
  * 对于某些特殊的场景,比如深层树节点元素发生变动时可能会用到
275
+ * @deprecated
275
276
  */
276
277
  syncData(): Promise<any>;
277
278
  /**