vxe-table 3.10.16 → 3.11.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.
Files changed (122) hide show
  1. package/README.md +1 -1
  2. package/es/locale/lang/en-US.js +1 -0
  3. package/es/locale/lang/es-ES.js +1 -0
  4. package/es/locale/lang/hu-HU.js +1 -0
  5. package/es/locale/lang/ja-JP.js +1 -0
  6. package/es/locale/lang/ko-KR.js +1 -0
  7. package/es/locale/lang/pt-BR.js +1 -0
  8. package/es/locale/lang/ru-RU.js +1 -0
  9. package/es/locale/lang/uk-UA.js +1 -0
  10. package/es/locale/lang/vi-VN.js +1 -0
  11. package/es/locale/lang/zh-CHT.js +1 -0
  12. package/es/locale/lang/zh-CN.js +1 -0
  13. package/es/style.css +1 -1
  14. package/es/style.min.css +1 -1
  15. package/es/table/module/custom/mixin.js +5 -1
  16. package/es/table/module/edit/mixin.js +32 -15
  17. package/es/table/src/body.js +40 -24
  18. package/es/table/src/cell.js +75 -32
  19. package/es/table/src/footer.js +159 -131
  20. package/es/table/src/header.js +128 -90
  21. package/es/table/src/methods.js +284 -65
  22. package/es/table/src/props.js +5 -1
  23. package/es/table/src/table.js +64 -20
  24. package/es/table/style.css +33 -20
  25. package/es/table/style.min.css +1 -1
  26. package/es/ui/index.js +9 -4
  27. package/es/ui/src/log.js +1 -1
  28. package/es/vxe-table/style.css +33 -20
  29. package/es/vxe-table/style.min.css +1 -1
  30. package/helper/vetur/attributes.json +1 -1
  31. package/helper/vetur/tags.json +1 -1
  32. package/lib/index.umd.js +917 -449
  33. package/lib/index.umd.min.js +1 -1
  34. package/lib/locale/lang/en-US.js +1 -0
  35. package/lib/locale/lang/en-US.min.js +1 -1
  36. package/lib/locale/lang/en-US.umd.js +1 -0
  37. package/lib/locale/lang/es-ES.js +1 -0
  38. package/lib/locale/lang/es-ES.min.js +1 -1
  39. package/lib/locale/lang/es-ES.umd.js +1 -0
  40. package/lib/locale/lang/hu-HU.js +1 -0
  41. package/lib/locale/lang/hu-HU.min.js +1 -1
  42. package/lib/locale/lang/hu-HU.umd.js +1 -0
  43. package/lib/locale/lang/ja-JP.js +1 -0
  44. package/lib/locale/lang/ja-JP.min.js +1 -1
  45. package/lib/locale/lang/ja-JP.umd.js +1 -0
  46. package/lib/locale/lang/ko-KR.js +1 -0
  47. package/lib/locale/lang/ko-KR.min.js +1 -1
  48. package/lib/locale/lang/ko-KR.umd.js +1 -0
  49. package/lib/locale/lang/pt-BR.js +1 -0
  50. package/lib/locale/lang/pt-BR.min.js +1 -1
  51. package/lib/locale/lang/pt-BR.umd.js +1 -0
  52. package/lib/locale/lang/ru-RU.js +1 -0
  53. package/lib/locale/lang/ru-RU.min.js +1 -1
  54. package/lib/locale/lang/ru-RU.umd.js +1 -0
  55. package/lib/locale/lang/uk-UA.js +1 -0
  56. package/lib/locale/lang/uk-UA.min.js +1 -1
  57. package/lib/locale/lang/uk-UA.umd.js +1 -0
  58. package/lib/locale/lang/vi-VN.js +1 -0
  59. package/lib/locale/lang/vi-VN.min.js +1 -1
  60. package/lib/locale/lang/zh-CHT.js +1 -0
  61. package/lib/locale/lang/zh-CHT.min.js +1 -1
  62. package/lib/locale/lang/zh-CHT.umd.js +1 -0
  63. package/lib/locale/lang/zh-CN.js +1 -0
  64. package/lib/locale/lang/zh-CN.min.js +1 -1
  65. package/lib/locale/lang/zh-CN.umd.js +1 -0
  66. package/lib/style.css +1 -1
  67. package/lib/style.min.css +1 -1
  68. package/lib/table/module/custom/mixin.js +5 -1
  69. package/lib/table/module/custom/mixin.min.js +1 -1
  70. package/lib/table/module/edit/mixin.js +34 -15
  71. package/lib/table/module/edit/mixin.min.js +1 -1
  72. package/lib/table/src/body.js +31 -15
  73. package/lib/table/src/body.min.js +1 -1
  74. package/lib/table/src/cell.js +82 -35
  75. package/lib/table/src/cell.min.js +1 -1
  76. package/lib/table/src/footer.js +198 -161
  77. package/lib/table/src/footer.min.js +1 -1
  78. package/lib/table/src/header.js +169 -128
  79. package/lib/table/src/header.min.js +1 -1
  80. package/lib/table/src/methods.js +313 -68
  81. package/lib/table/src/methods.min.js +1 -1
  82. package/lib/table/src/props.js +5 -1
  83. package/lib/table/src/props.min.js +1 -1
  84. package/lib/table/src/table.js +70 -20
  85. package/lib/table/src/table.min.js +1 -1
  86. package/lib/table/style/style.css +33 -20
  87. package/lib/table/style/style.min.css +1 -1
  88. package/lib/ui/index.js +9 -4
  89. package/lib/ui/index.min.js +1 -1
  90. package/lib/ui/src/log.js +1 -1
  91. package/lib/ui/src/log.min.js +1 -1
  92. package/lib/vxe-table/style/style.css +33 -20
  93. package/lib/vxe-table/style/style.min.css +1 -1
  94. package/package.json +3 -3
  95. package/packages/locale/lang/en-US.ts +1 -0
  96. package/packages/locale/lang/es-ES.ts +1 -0
  97. package/packages/locale/lang/hu-HU.ts +1 -0
  98. package/packages/locale/lang/ja-JP.ts +1 -0
  99. package/packages/locale/lang/ko-KR.ts +1 -0
  100. package/packages/locale/lang/pt-BR.ts +1 -0
  101. package/packages/locale/lang/ru-RU.ts +1 -0
  102. package/packages/locale/lang/uk-UA.ts +1 -0
  103. package/packages/locale/lang/vi-VN.ts +1 -0
  104. package/packages/locale/lang/zh-CHT.ts +1 -0
  105. package/packages/locale/lang/zh-CN.ts +1 -0
  106. package/packages/table/module/custom/mixin.ts +5 -1
  107. package/packages/table/module/edit/mixin.ts +32 -15
  108. package/packages/table/src/body.ts +43 -25
  109. package/packages/table/src/cell.ts +120 -67
  110. package/packages/table/src/footer.ts +164 -150
  111. package/packages/table/src/header.ts +136 -90
  112. package/packages/table/src/methods.ts +296 -67
  113. package/packages/table/src/props.ts +5 -1
  114. package/packages/table/src/table.ts +71 -19
  115. package/packages/ui/index.ts +8 -3
  116. package/styles/components/table.scss +42 -35
  117. /package/es/{iconfont.1731633464058.ttf → iconfont.1731937243466.ttf} +0 -0
  118. /package/es/{iconfont.1731633464058.woff → iconfont.1731937243466.woff} +0 -0
  119. /package/es/{iconfont.1731633464058.woff2 → iconfont.1731937243466.woff2} +0 -0
  120. /package/lib/{iconfont.1731633464058.ttf → iconfont.1731937243466.ttf} +0 -0
  121. /package/lib/{iconfont.1731633464058.woff → iconfont.1731937243466.woff} +0 -0
  122. /package/lib/{iconfont.1731633464058.woff2 → iconfont.1731937243466.woff2} +0 -0
@@ -270,7 +270,7 @@ function renderColumn(h, _vm, $xetable, seq, rowid, fixedType, rowLevel, row, ro
270
270
  }, tdVNs);
271
271
  }
272
272
  function renderRows(h, _vm, $xeTable, fixedType, tableData, tableColumn) {
273
- const { stripe, rowKey, highlightHoverRow, rowClassName, rowStyle, editConfig, showOverflow: allColumnOverflow, treeConfig, treeOpts, expandOpts, editOpts, treeExpandedMaps, scrollYLoad, rowExpandedMaps, radioOpts, checkboxOpts, expandColumn, hasFixedColumn, fullAllDataRowIdData, rowOpts, pendingRowList, pendingRowMaps } = $xeTable;
273
+ const { stripe, rowKey, highlightHoverRow, rowClassName, rowStyle, editConfig, showOverflow: allColumnOverflow, treeConfig, treeOpts, expandOpts, editOpts, treeExpandedMaps, scrollYLoad, rowExpandedMaps, radioOpts, checkboxOpts, expandColumn, hasFixedColumn, fullAllDataRowIdData, rowOpts, pendingRowList, pendingRowMaps, columnOpts, isDragColMove } = $xeTable;
274
274
  const childrenField = treeOpts.children || treeOpts.childrenField;
275
275
  const rows = [];
276
276
  tableData.forEach((row, $rowIndex) => {
@@ -325,31 +325,47 @@ function renderRows(h, _vm, $xeTable, fixedType, tableData, tableColumn) {
325
325
  rowChildren = row[childrenField];
326
326
  isExpandTree = rowChildren && rowChildren.length && !!treeExpandedMaps[rowid];
327
327
  }
328
- rows.push(h('tr', {
329
- class: [
330
- 'vxe-body--row',
331
- treeConfig ? `row--level-${rowLevel}` : '',
332
- {
333
- 'row--stripe': stripe && ($xeTable.getVTRowIndex(row) + 1) % 2 === 0,
334
- 'is--new': isNewRow,
335
- 'is--expand-row': isExpandRow,
336
- 'is--expand-tree': isExpandTree,
337
- 'row--new': isNewRow && (editOpts.showStatus || editOpts.showInsertStatus),
338
- 'row--radio': radioOpts.highlight && $xeTable.selectRadioRow === row,
339
- 'row--checked': checkboxOpts.highlight && $xeTable.isCheckedByCheckboxRow(row),
340
- 'row--pending': pendingRowList.length && !!pendingRowMaps[rowid]
341
- },
342
- rowClassName ? (XEUtils.isFunction(rowClassName) ? rowClassName(params) : rowClassName) : ''
343
- ],
344
- attrs: {
345
- rowid
328
+ const trClass = [
329
+ 'vxe-body--row',
330
+ treeConfig ? `row--level-${rowLevel}` : '',
331
+ {
332
+ 'row--stripe': stripe && ($xeTable.getVTRowIndex(row) + 1) % 2 === 0,
333
+ 'is--new': isNewRow,
334
+ 'is--expand-row': isExpandRow,
335
+ 'is--expand-tree': isExpandTree,
336
+ 'row--new': isNewRow && (editOpts.showStatus || editOpts.showInsertStatus),
337
+ 'row--radio': radioOpts.highlight && $xeTable.selectRadioRow === row,
338
+ 'row--checked': checkboxOpts.highlight && $xeTable.isCheckedByCheckboxRow(row),
339
+ 'row--pending': pendingRowList.length && !!pendingRowMaps[rowid]
346
340
  },
347
- style: rowStyle ? (XEUtils.isFunction(rowStyle) ? rowStyle(params) : rowStyle) : null,
348
- key: rowKey || rowOpts.useKey || rowOpts.drag || treeConfig ? rowid : $rowIndex,
349
- on: trOn
350
- }, tableColumn.map((column, $columnIndex) => {
341
+ rowClassName ? (XEUtils.isFunction(rowClassName) ? rowClassName(params) : rowClassName) : ''
342
+ ];
343
+ const tdVNs = tableColumn.map((column, $columnIndex) => {
351
344
  return renderColumn(h, _vm, $xeTable, seq, rowid, fixedType, rowLevel, row, rowIndex, $rowIndex, _rowIndex, column, $columnIndex, tableColumn, tableData);
352
- })));
345
+ });
346
+ rows.push(columnOpts.drag
347
+ ? h('transition-group', {
348
+ props: {
349
+ tag: 'tr',
350
+ name: `vxe-header--col-list${isDragColMove ? '' : '-disabled'}`
351
+ },
352
+ class: trClass,
353
+ attrs: {
354
+ rowid
355
+ },
356
+ style: rowStyle ? (XEUtils.isFunction(rowStyle) ? rowStyle(params) : rowStyle) : null,
357
+ key: rowKey || rowOpts.useKey || rowOpts.drag || treeConfig ? rowid : $rowIndex,
358
+ nativeOn: trOn
359
+ }, tdVNs)
360
+ : h('tr', {
361
+ class: trClass,
362
+ attrs: {
363
+ rowid
364
+ },
365
+ style: rowStyle ? (XEUtils.isFunction(rowStyle) ? rowStyle(params) : rowStyle) : null,
366
+ key: rowKey || rowOpts.useKey || rowOpts.drag || treeConfig ? rowid : $rowIndex,
367
+ on: trOn
368
+ }, tdVNs));
353
369
  // 如果行被展开了
354
370
  if (isExpandRow) {
355
371
  const { height: expandHeight, padding } = expandOpts;
@@ -45,9 +45,12 @@ function renderTitleSuffixIcon(h, params) {
45
45
  }
46
46
  function renderCellDragIcon(h, params) {
47
47
  const { $table } = params;
48
- const dragOpts = $table.computeDragOpts;
49
- const { rowIcon, rowDisabledMethod } = dragOpts;
50
- const isDisabled = rowDisabledMethod && rowDisabledMethod(params);
48
+ const tableProps = $table;
49
+ const { dragConfig } = tableProps;
50
+ const rowDragOpts = $table.computeRowDragOpts;
51
+ const { icon, disabledMethod } = rowDragOpts;
52
+ const rDisabledMethod = disabledMethod || (dragConfig ? dragConfig.rowDisabledMethod : null);
53
+ const isDisabled = rDisabledMethod && rDisabledMethod(params);
51
54
  return h('span', {
52
55
  key: 'dg',
53
56
  class: ['vxe-cell--drag-handle', {
@@ -63,26 +66,66 @@ function renderCellDragIcon(h, params) {
63
66
  }
64
67
  }, [
65
68
  h('i', {
66
- class: rowIcon || getIcon().TABLE_DRAG_ROW
69
+ class: icon || (dragConfig ? dragConfig.rowIcon : '') || getIcon().TABLE_DRAG_ROW
67
70
  })
68
71
  ]);
69
72
  }
70
73
  function renderCellBaseVNs(h, params, content) {
71
- const { $table, column, row, level } = params;
74
+ const { $table, column, level } = params;
72
75
  const { dragSort } = column;
73
76
  const tableProps = $table;
74
- const { treeConfig } = tableProps;
77
+ const { treeConfig, dragConfig } = tableProps;
75
78
  const rowOpts = $table.computeRowOpts;
76
- const dragOpts = $table.computeDragOpts;
77
- const { showRowIcon, rowVisibleMethod } = dragOpts;
79
+ const rowDragOpts = $table.computeRowDragOpts;
80
+ const { showIcon, visibleMethod } = rowDragOpts;
81
+ const rVisibleMethod = visibleMethod || (dragConfig ? dragConfig.rowVisibleMethod : null);
78
82
  const vns = XEUtils.isArray(content) ? content : [content];
79
- if (dragSort && rowOpts.drag && (showRowIcon && (!rowVisibleMethod || rowVisibleMethod({ row, column })))) {
83
+ if (dragSort && rowOpts.drag && ((showIcon || (dragConfig ? dragConfig.showRowIcon : false)) && (!rVisibleMethod || rVisibleMethod(params)))) {
80
84
  if (!treeConfig || !level) {
81
85
  vns.unshift(renderCellDragIcon(h, params));
82
86
  }
83
87
  }
84
88
  return vns;
85
89
  }
90
+ function renderHeaderCellDragIcon(h, params) {
91
+ const { $table, column } = params;
92
+ const columnOpts = $table.computeColumnOpts;
93
+ const columnDragOpts = $table.computeColumnDragOpts;
94
+ const { showIcon, icon, visibleMethod, disabledMethod } = columnDragOpts;
95
+ const isDisabled = disabledMethod && disabledMethod(params);
96
+ if (columnOpts.drag && showIcon && (!visibleMethod || visibleMethod(params))) {
97
+ if (!(column.fixed || column.parentId)) {
98
+ return h('span', {
99
+ key: 'dg',
100
+ class: ['vxe-cell--drag-handle', {
101
+ 'is--disabled': isDisabled
102
+ }],
103
+ on: {
104
+ mousedown(evnt) {
105
+ if (!isDisabled) {
106
+ $table.handleHeaderCellDragMousedownEvent(evnt, params);
107
+ }
108
+ },
109
+ mouseup: $table.handleHeaderCellDragMouseupEvent
110
+ }
111
+ }, [
112
+ h('i', {
113
+ class: icon || getIcon().TABLE_DRAG_COLUMN
114
+ })
115
+ ]);
116
+ }
117
+ }
118
+ return renderEmptyElement($table);
119
+ }
120
+ function renderHeaderCellBaseVNs(h, params, content) {
121
+ const vns = [
122
+ renderTitlePrefixIcon(h, params),
123
+ renderHeaderCellDragIcon(h, params),
124
+ ...(XEUtils.isArray(content) ? content : [content]),
125
+ renderTitleSuffixIcon(h, params)
126
+ ];
127
+ return vns;
128
+ }
86
129
  function renderTitleContent(h, params, content) {
87
130
  const { $table, column } = params;
88
131
  const { type, showHeaderOverflow } = column;
@@ -245,7 +288,7 @@ export const Cell = {
245
288
  return createColumn($xetable, _vm, renMaps);
246
289
  },
247
290
  /**
248
- * 单元格
291
+ * 列头标题
249
292
  */
250
293
  renderHeaderTitle(h, params) {
251
294
  const { $table, column } = params;
@@ -264,7 +307,7 @@ export const Cell = {
264
307
  return renderTitleContent(h, params, formatText(column.getTitle(), 1));
265
308
  },
266
309
  renderDefaultHeader(h, params) {
267
- return renderTitlePrefixIcon(h, params).concat(Cell.renderHeaderTitle(h, params)).concat(renderTitleSuffixIcon(h, params));
310
+ return renderHeaderCellBaseVNs(h, params, Cell.renderHeaderTitle(h, params));
268
311
  },
269
312
  renderDefaultCell(h, params) {
270
313
  const { $table, row, column } = params;
@@ -371,12 +414,12 @@ export const Cell = {
371
414
  ];
372
415
  },
373
416
  /**
374
- * 索引
417
+ * 序号
375
418
  */
376
419
  renderSeqHeader(h, params) {
377
420
  const { $table, column } = params;
378
421
  const { slots } = column;
379
- return renderTitleContent(h, params, slots && slots.header ? $table.callSlot(slots.header, params, h) : formatText(column.getTitle(), 1));
422
+ return renderHeaderCellBaseVNs(h, params, renderTitleContent(h, params, slots && slots.header ? $table.callSlot(slots.header, params, h) : formatText(column.getTitle(), 1)));
380
423
  },
381
424
  renderSeqCell(h, params) {
382
425
  const { $table, column } = params;
@@ -402,13 +445,13 @@ export const Cell = {
402
445
  const { slots } = column;
403
446
  const headerSlot = slots ? slots.header : null;
404
447
  const titleSlot = slots ? slots.title : null;
405
- return renderTitleContent(h, params, headerSlot
448
+ return renderHeaderCellBaseVNs(h, params, renderTitleContent(h, params, headerSlot
406
449
  ? $table.callSlot(headerSlot, params, h)
407
450
  : [
408
451
  h('span', {
409
452
  class: 'vxe-radio--label'
410
453
  }, titleSlot ? $table.callSlot(titleSlot, params, h) : formatText(column.getTitle(), 1))
411
- ]);
454
+ ]));
412
455
  },
413
456
  renderRadioCell(h, params) {
414
457
  const { $table, column, isHidden } = params;
@@ -485,16 +528,16 @@ export const Cell = {
485
528
  }
486
529
  const checkboxParams = Object.assign(Object.assign({}, params), { checked: isAllCheckboxSelected, disabled: isAllCheckboxDisabled, indeterminate: isAllCheckboxIndeterminate });
487
530
  if (headerSlot) {
488
- return renderTitleContent(h, checkboxParams, $table.callSlot(headerSlot, checkboxParams, h));
531
+ return renderHeaderCellBaseVNs(h, params, renderTitleContent(h, checkboxParams, $table.callSlot(headerSlot, checkboxParams, h)));
489
532
  }
490
533
  if (checkboxOpts.checkStrictly ? !checkboxOpts.showHeader : checkboxOpts.showHeader === false) {
491
- return renderTitleContent(h, checkboxParams, [
534
+ return renderHeaderCellBaseVNs(h, params, renderTitleContent(h, checkboxParams, [
492
535
  h('span', {
493
536
  class: 'vxe-checkbox--label'
494
537
  }, titleSlot ? $table.callSlot(titleSlot, checkboxParams, h) : headerTitle)
495
- ]);
538
+ ]));
496
539
  }
497
- return renderTitleContent(h, checkboxParams, [
540
+ return renderHeaderCellBaseVNs(h, params, renderTitleContent(h, checkboxParams, [
498
541
  h('span', {
499
542
  class: ['vxe-cell--checkbox', {
500
543
  'is--checked': isAllCheckboxSelected,
@@ -516,7 +559,7 @@ export const Cell = {
516
559
  }, titleSlot ? $table.callSlot(titleSlot, checkboxParams, h) : headerTitle)
517
560
  ]
518
561
  : []))
519
- ]);
562
+ ]));
520
563
  },
521
564
  renderCheckboxCell(h, params) {
522
565
  const { $table, row, column, isHidden } = params;
@@ -722,15 +765,13 @@ export const Cell = {
722
765
  * 排序和筛选
723
766
  */
724
767
  renderSortAndFilterHeader(h, params) {
725
- return Cell.renderDefaultHeader(h, params)
726
- .concat(Cell.renderSortIcon(h, params))
727
- .concat(Cell.renderFilterIcon(h, params));
768
+ return renderHeaderCellBaseVNs(h, params, Cell.renderHeaderTitle(h, params).concat(Cell.renderSortIcon(h, params)));
728
769
  },
729
770
  /**
730
771
  * 排序
731
772
  */
732
773
  renderSortHeader(h, params) {
733
- return Cell.renderDefaultHeader(h, params).concat(Cell.renderSortIcon(h, params));
774
+ return renderHeaderCellBaseVNs(h, params, Cell.renderHeaderTitle(h, params).concat(Cell.renderSortIcon(h, params)));
734
775
  },
735
776
  renderSortIcon(h, params) {
736
777
  const { $table, column } = params;
@@ -776,7 +817,7 @@ export const Cell = {
776
817
  * 筛选
777
818
  */
778
819
  renderFilterHeader(h, params) {
779
- return Cell.renderDefaultHeader(h, params).concat(Cell.renderFilterIcon(h, params));
820
+ return renderHeaderCellBaseVNs(h, params, Cell.renderHeaderTitle(h, params).concat(Cell.renderFilterIcon(h, params)));
780
821
  },
781
822
  renderFilterIcon(h, params) {
782
823
  const { $table, column, hasFilter } = params;
@@ -820,22 +861,24 @@ export const Cell = {
820
861
  isRequired = columnRules.some((rule) => rule.required);
821
862
  }
822
863
  }
823
- return (isEnableConf(editConfig)
824
- ? [
864
+ let editIconVNs = [];
865
+ if (isEnableConf(editConfig)) {
866
+ editIconVNs = [
825
867
  isRequired && editOpts.showAsterisk
826
868
  ? h('i', {
827
869
  class: 'vxe-cell--required-icon'
828
870
  })
829
- : null,
871
+ : renderEmptyElement($table),
830
872
  isEnableConf(editRender) && editOpts.showIcon
831
873
  ? h('i', {
832
874
  class: ['vxe-cell--edit-icon', editOpts.icon || getIcon().TABLE_EDIT]
833
875
  })
834
- : null
835
- ]
836
- : []).concat(Cell.renderDefaultHeader(h, params))
876
+ : renderEmptyElement($table)
877
+ ];
878
+ }
879
+ return renderHeaderCellBaseVNs(h, params, editIconVNs.concat(Cell.renderHeaderTitle(h, params))
837
880
  .concat(sortable || remoteSort ? Cell.renderSortIcon(h, params) : [])
838
- .concat(filters ? Cell.renderFilterIcon(h, params) : []);
881
+ .concat(filters ? Cell.renderFilterIcon(h, params) : []));
839
882
  },
840
883
  // 行格编辑模式
841
884
  renderRowEdit(h, params) {
@@ -17,6 +17,163 @@ function mergeFooterMethod(mergeFooterList, _rowIndex, _columnIndex) {
17
17
  }
18
18
  }
19
19
  }
20
+ function renderRows(h, _vm, tableColumn, footerTableData, row, $rowIndex, _rowIndex) {
21
+ const { $parent: $xetable, fixedType } = _vm;
22
+ const { $listeners: tableListeners, footerCellClassName, footerCellStyle, footerAlign: allFooterAlign, mergeFooterList, footerSpanMethod, align: allAlign, scrollXLoad, columnKey, columnOpts, showFooterOverflow: allColumnFooterOverflow, currentColumn, overflowX, scrollbarWidth, tooltipOpts } = $xetable;
23
+ return tableColumn.map((column, $columnIndex) => {
24
+ const { type, showFooterOverflow, footerAlign, align, footerClassName, editRender, cellRender } = column;
25
+ const renderOpts = editRender || cellRender;
26
+ const compConf = renderOpts ? renderer.get(renderOpts.name) : null;
27
+ const showAllTip = tooltipOpts.showAll || tooltipOpts.enabled;
28
+ const isColGroup = column.children && column.children.length;
29
+ const fixedHiddenColumn = fixedType ? column.fixed !== fixedType && !isColGroup : column.fixed && overflowX;
30
+ const footOverflow = XEUtils.isUndefined(showFooterOverflow) || XEUtils.isNull(showFooterOverflow) ? allColumnFooterOverflow : showFooterOverflow;
31
+ const footAlign = footerAlign || (compConf ? compConf.tableFooterCellAlign : '') || allFooterAlign || align || (compConf ? compConf.tableCellAlign : '') || allAlign;
32
+ let showEllipsis = footOverflow === 'ellipsis';
33
+ const showTitle = footOverflow === 'title';
34
+ const showTooltip = footOverflow === true || footOverflow === 'tooltip';
35
+ let hasEllipsis = showTitle || showTooltip || showEllipsis;
36
+ const attrs = { colid: column.id };
37
+ const tfOns = {};
38
+ const columnIndex = $xetable.getColumnIndex(column);
39
+ const _columnIndex = $xetable.getVTColumnIndex(column);
40
+ const itemIndex = _columnIndex;
41
+ const cellParams = {
42
+ $table: $xetable,
43
+ $grid: $xetable.xegrid,
44
+ row,
45
+ _rowIndex,
46
+ $rowIndex,
47
+ column,
48
+ columnIndex,
49
+ $columnIndex,
50
+ _columnIndex,
51
+ itemIndex,
52
+ items: row,
53
+ fixed: fixedType,
54
+ type: renderType,
55
+ data: footerTableData
56
+ };
57
+ // 虚拟滚动不支持动态高度
58
+ if (scrollXLoad && !hasEllipsis) {
59
+ showEllipsis = hasEllipsis = true;
60
+ }
61
+ if (showTitle || showTooltip || showAllTip) {
62
+ tfOns.mouseenter = (evnt) => {
63
+ if (showTitle) {
64
+ updateCellTitle(evnt.currentTarget, column);
65
+ }
66
+ else if (showTooltip || showAllTip) {
67
+ $xetable.triggerFooterTooltipEvent(evnt, cellParams);
68
+ }
69
+ };
70
+ }
71
+ if (showTooltip || showAllTip) {
72
+ tfOns.mouseleave = (evnt) => {
73
+ if (showTooltip || showAllTip) {
74
+ $xetable.handleTargetLeaveEvent(evnt);
75
+ }
76
+ };
77
+ }
78
+ if (tableListeners['footer-cell-click']) {
79
+ tfOns.click = (evnt) => {
80
+ $xetable.emitEvent('footer-cell-click', Object.assign({ cell: evnt.currentTarget }, cellParams), evnt);
81
+ };
82
+ }
83
+ if (tableListeners['footer-cell-dblclick']) {
84
+ tfOns.dblclick = (evnt) => {
85
+ $xetable.emitEvent('footer-cell-dblclick', Object.assign({ cell: evnt.currentTarget }, cellParams), evnt);
86
+ };
87
+ }
88
+ // 合并行或列
89
+ if (mergeFooterList.length) {
90
+ const spanRest = mergeFooterMethod(mergeFooterList, _rowIndex, _columnIndex);
91
+ if (spanRest) {
92
+ const { rowspan, colspan } = spanRest;
93
+ if (!rowspan || !colspan) {
94
+ return null;
95
+ }
96
+ if (rowspan > 1) {
97
+ attrs.rowspan = rowspan;
98
+ }
99
+ if (colspan > 1) {
100
+ attrs.colspan = colspan;
101
+ }
102
+ }
103
+ }
104
+ else if (footerSpanMethod) {
105
+ // 自定义合并方法
106
+ const { rowspan = 1, colspan = 1 } = footerSpanMethod(cellParams) || {};
107
+ if (!rowspan || !colspan) {
108
+ return null;
109
+ }
110
+ if (rowspan > 1) {
111
+ attrs.rowspan = rowspan;
112
+ }
113
+ if (colspan > 1) {
114
+ attrs.colspan = colspan;
115
+ }
116
+ }
117
+ return h('td', {
118
+ class: ['vxe-footer--column', column.id, {
119
+ [`col--${footAlign}`]: footAlign,
120
+ [`col--${type}`]: type,
121
+ 'col--last': $columnIndex === tableColumn.length - 1,
122
+ 'fixed--hidden': fixedHiddenColumn,
123
+ 'col--ellipsis': hasEllipsis,
124
+ 'col--current': currentColumn === column
125
+ }, getClass(footerClassName, cellParams), getClass(footerCellClassName, cellParams)],
126
+ attrs,
127
+ style: footerCellStyle ? (XEUtils.isFunction(footerCellStyle) ? footerCellStyle(cellParams) : footerCellStyle) : null,
128
+ on: tfOns,
129
+ key: columnKey || columnOpts.useKey || columnOpts.drag ? column.id : $columnIndex
130
+ }, [
131
+ h('div', {
132
+ class: ['vxe-cell', {
133
+ 'c--title': showTitle,
134
+ 'c--tooltip': showTooltip,
135
+ 'c--ellipsis': showEllipsis
136
+ }]
137
+ }, column.renderFooter(h, cellParams))
138
+ ]);
139
+ }).concat(scrollbarWidth
140
+ ? [
141
+ h('td', {
142
+ key: `gr${$rowIndex}`,
143
+ class: 'vxe-footer--gutter col--gutter'
144
+ })
145
+ ]
146
+ : []);
147
+ }
148
+ function renderHeads(h, _vm, footerTableData) {
149
+ const { $parent: $xetable, fixedType, tableColumn } = _vm;
150
+ const { footerRowClassName, footerRowStyle, isDragColMove } = $xetable;
151
+ const columnOpts = $xetable.columnOpts;
152
+ return footerTableData.map((row, $rowIndex) => {
153
+ const _rowIndex = $rowIndex;
154
+ const rowParams = { $table: $xetable, row, _rowIndex, $rowIndex, fixed: fixedType, type: renderType };
155
+ if (columnOpts.drag) {
156
+ return h('transition-group', {
157
+ props: {
158
+ tag: 'tr',
159
+ name: `vxe-header--col-list${isDragColMove ? '' : '-disabled'}`,
160
+ class: [
161
+ 'vxe-footer--row',
162
+ footerRowClassName ? XEUtils.isFunction(footerRowClassName) ? footerRowClassName(rowParams) : footerRowClassName : ''
163
+ ],
164
+ style: footerRowStyle ? (XEUtils.isFunction(footerRowStyle) ? footerRowStyle(rowParams) : footerRowStyle) : null
165
+ }
166
+ }, renderRows(h, _vm, tableColumn, footerTableData, row, $rowIndex, _rowIndex));
167
+ }
168
+ return h('tr', {
169
+ class: [
170
+ 'vxe-footer--row',
171
+ footerRowClassName ? XEUtils.isFunction(footerRowClassName) ? footerRowClassName(rowParams) : footerRowClassName : ''
172
+ ],
173
+ style: footerRowStyle ? (XEUtils.isFunction(footerRowStyle) ? footerRowStyle(rowParams) : footerRowStyle) : null
174
+ }, renderRows(h, _vm, tableColumn, footerTableData, row, $rowIndex, _rowIndex));
175
+ });
176
+ }
20
177
  export default {
21
178
  name: 'VxeTableFooter',
22
179
  props: {
@@ -48,7 +205,7 @@ export default {
48
205
  },
49
206
  render(h) {
50
207
  let { _e, $parent: $xetable, fixedType, fixedColumn, tableColumn, footerTableData } = this;
51
- const { $listeners: tableListeners, tId, footerRowClassName, footerCellClassName, footerRowStyle, footerCellStyle, footerAlign: allFooterAlign, mergeFooterList, footerSpanMethod, align: allAlign, scrollXLoad, columnKey, columnOpts, showFooterOverflow: allColumnFooterOverflow, currentColumn, overflowX, scrollbarWidth, tooltipOpts, visibleColumn, expandColumn } = $xetable;
208
+ const { tId, mergeFooterList, footerSpanMethod, scrollXLoad, showFooterOverflow: allColumnFooterOverflow, scrollbarWidth, visibleColumn, expandColumn } = $xetable;
52
209
  // 如果是使用优化模式
53
210
  if (fixedType) {
54
211
  // 如果存在展开行使用全量渲染
@@ -115,136 +272,7 @@ export default {
115
272
  */
116
273
  h('tfoot', {
117
274
  ref: 'tfoot'
118
- }, footerTableData.map((list, _rowIndex) => {
119
- const $rowIndex = _rowIndex;
120
- const rowParams = { $table: $xetable, row: list, _rowIndex, $rowIndex, fixed: fixedType, type: renderType };
121
- return h('tr', {
122
- class: ['vxe-footer--row', footerRowClassName ? XEUtils.isFunction(footerRowClassName) ? footerRowClassName(rowParams) : footerRowClassName : ''],
123
- style: footerRowStyle ? (XEUtils.isFunction(footerRowStyle) ? footerRowStyle(rowParams) : footerRowStyle) : null
124
- }, tableColumn.map((column, $columnIndex) => {
125
- const { type, showFooterOverflow, footerAlign, align, footerClassName, editRender, cellRender } = column;
126
- const renderOpts = editRender || cellRender;
127
- const compConf = renderOpts ? renderer.get(renderOpts.name) : null;
128
- const showAllTip = tooltipOpts.showAll || tooltipOpts.enabled;
129
- const isColGroup = column.children && column.children.length;
130
- const fixedHiddenColumn = fixedType ? column.fixed !== fixedType && !isColGroup : column.fixed && overflowX;
131
- const footOverflow = XEUtils.isUndefined(showFooterOverflow) || XEUtils.isNull(showFooterOverflow) ? allColumnFooterOverflow : showFooterOverflow;
132
- const footAlign = footerAlign || (compConf ? compConf.tableFooterCellAlign : '') || allFooterAlign || align || (compConf ? compConf.tableCellAlign : '') || allAlign;
133
- let showEllipsis = footOverflow === 'ellipsis';
134
- const showTitle = footOverflow === 'title';
135
- const showTooltip = footOverflow === true || footOverflow === 'tooltip';
136
- let hasEllipsis = showTitle || showTooltip || showEllipsis;
137
- const attrs = { colid: column.id };
138
- const tfOns = {};
139
- const columnIndex = $xetable.getColumnIndex(column);
140
- const _columnIndex = $xetable.getVTColumnIndex(column);
141
- const itemIndex = _columnIndex;
142
- const cellParams = {
143
- $table: $xetable,
144
- $grid: $xetable.xegrid,
145
- row: list,
146
- _rowIndex,
147
- $rowIndex,
148
- column,
149
- columnIndex,
150
- $columnIndex,
151
- _columnIndex,
152
- itemIndex,
153
- items: list,
154
- fixed: fixedType,
155
- type: renderType,
156
- data: footerTableData
157
- };
158
- // 虚拟滚动不支持动态高度
159
- if (scrollXLoad && !hasEllipsis) {
160
- showEllipsis = hasEllipsis = true;
161
- }
162
- if (showTitle || showTooltip || showAllTip) {
163
- tfOns.mouseenter = (evnt) => {
164
- if (showTitle) {
165
- updateCellTitle(evnt.currentTarget, column);
166
- }
167
- else if (showTooltip || showAllTip) {
168
- $xetable.triggerFooterTooltipEvent(evnt, cellParams);
169
- }
170
- };
171
- }
172
- if (showTooltip || showAllTip) {
173
- tfOns.mouseleave = (evnt) => {
174
- if (showTooltip || showAllTip) {
175
- $xetable.handleTargetLeaveEvent(evnt);
176
- }
177
- };
178
- }
179
- if (tableListeners['footer-cell-click']) {
180
- tfOns.click = (evnt) => {
181
- $xetable.emitEvent('footer-cell-click', Object.assign({ cell: evnt.currentTarget }, cellParams), evnt);
182
- };
183
- }
184
- if (tableListeners['footer-cell-dblclick']) {
185
- tfOns.dblclick = (evnt) => {
186
- $xetable.emitEvent('footer-cell-dblclick', Object.assign({ cell: evnt.currentTarget }, cellParams), evnt);
187
- };
188
- }
189
- // 合并行或列
190
- if (mergeFooterList.length) {
191
- const spanRest = mergeFooterMethod(mergeFooterList, _rowIndex, _columnIndex);
192
- if (spanRest) {
193
- const { rowspan, colspan } = spanRest;
194
- if (!rowspan || !colspan) {
195
- return null;
196
- }
197
- if (rowspan > 1) {
198
- attrs.rowspan = rowspan;
199
- }
200
- if (colspan > 1) {
201
- attrs.colspan = colspan;
202
- }
203
- }
204
- }
205
- else if (footerSpanMethod) {
206
- // 自定义合并方法
207
- const { rowspan = 1, colspan = 1 } = footerSpanMethod(cellParams) || {};
208
- if (!rowspan || !colspan) {
209
- return null;
210
- }
211
- if (rowspan > 1) {
212
- attrs.rowspan = rowspan;
213
- }
214
- if (colspan > 1) {
215
- attrs.colspan = colspan;
216
- }
217
- }
218
- return h('td', {
219
- class: ['vxe-footer--column', column.id, {
220
- [`col--${footAlign}`]: footAlign,
221
- [`col--${type}`]: type,
222
- 'col--last': $columnIndex === tableColumn.length - 1,
223
- 'fixed--hidden': fixedHiddenColumn,
224
- 'col--ellipsis': hasEllipsis,
225
- 'col--current': currentColumn === column
226
- }, getClass(footerClassName, cellParams), getClass(footerCellClassName, cellParams)],
227
- attrs,
228
- style: footerCellStyle ? (XEUtils.isFunction(footerCellStyle) ? footerCellStyle(cellParams) : footerCellStyle) : null,
229
- on: tfOns,
230
- key: columnKey || columnOpts.useKey ? column.id : $columnIndex
231
- }, [
232
- h('div', {
233
- class: ['vxe-cell', {
234
- 'c--title': showTitle,
235
- 'c--tooltip': showTooltip,
236
- 'c--ellipsis': showEllipsis
237
- }]
238
- }, column.renderFooter(h, cellParams))
239
- ]);
240
- }).concat(scrollbarWidth
241
- ? [
242
- h('td', {
243
- class: 'vxe-footer--gutter col--gutter'
244
- })
245
- ]
246
- : []));
247
- }))
275
+ }, renderHeads(h, this, footerTableData))
248
276
  ])
249
277
  ]);
250
278
  },