vxe-table 4.13.33 → 4.13.35

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 (69) hide show
  1. package/es/grid/src/grid.js +1 -1
  2. package/es/index.css +1 -1
  3. package/es/index.min.css +1 -1
  4. package/es/style.css +1 -1
  5. package/es/style.min.css +1 -1
  6. package/es/table/src/body.js +20 -3
  7. package/es/table/src/cell.js +55 -39
  8. package/es/table/src/column.js +2 -0
  9. package/es/table/src/columnInfo.js +2 -0
  10. package/es/table/src/props.js +3 -1
  11. package/es/table/src/table.js +130 -74
  12. package/es/table/src/util.js +7 -4
  13. package/es/table/style.css +9 -3
  14. package/es/table/style.min.css +1 -1
  15. package/es/ui/index.js +4 -4
  16. package/es/ui/src/log.js +1 -1
  17. package/es/vxe-table/style.css +9 -3
  18. package/es/vxe-table/style.min.css +1 -1
  19. package/lib/grid/src/grid.js +1 -1
  20. package/lib/grid/src/grid.min.js +1 -1
  21. package/lib/index.css +1 -1
  22. package/lib/index.min.css +1 -1
  23. package/lib/index.umd.js +117 -76
  24. package/lib/index.umd.min.js +1 -1
  25. package/lib/style.css +1 -1
  26. package/lib/style.min.css +1 -1
  27. package/lib/table/src/body.js +19 -2
  28. package/lib/table/src/body.min.js +1 -1
  29. package/lib/table/src/cell.js +47 -32
  30. package/lib/table/src/cell.min.js +1 -1
  31. package/lib/table/src/column.js +2 -0
  32. package/lib/table/src/column.min.js +1 -1
  33. package/lib/table/src/columnInfo.js +2 -0
  34. package/lib/table/src/columnInfo.min.js +1 -1
  35. package/lib/table/src/props.js +3 -1
  36. package/lib/table/src/props.min.js +1 -1
  37. package/lib/table/src/table.js +31 -31
  38. package/lib/table/src/table.min.js +1 -1
  39. package/lib/table/src/util.js +10 -7
  40. package/lib/table/src/util.min.js +1 -1
  41. package/lib/table/style/style.css +9 -3
  42. package/lib/table/style/style.min.css +1 -1
  43. package/lib/ui/index.js +4 -4
  44. package/lib/ui/index.min.js +1 -1
  45. package/lib/ui/src/log.js +1 -1
  46. package/lib/ui/src/log.min.js +1 -1
  47. package/lib/vxe-table/style/style.css +9 -3
  48. package/lib/vxe-table/style/style.min.css +1 -1
  49. package/package.json +1 -1
  50. package/packages/grid/src/grid.ts +1 -1
  51. package/packages/table/src/body.ts +20 -3
  52. package/packages/table/src/cell.ts +55 -39
  53. package/packages/table/src/column.ts +2 -0
  54. package/packages/table/src/columnInfo.ts +3 -0
  55. package/packages/table/src/props.ts +3 -1
  56. package/packages/table/src/table.ts +132 -73
  57. package/packages/table/src/util.ts +7 -3
  58. package/packages/ui/index.ts +1 -1
  59. package/styles/components/table.scss +13 -9
  60. package/styles/theme/base.scss +0 -2
  61. package/styles/theme/dark.scss +4 -1
  62. package/styles/theme/light.scss +3 -0
  63. package/styles/variable.scss +4 -1
  64. /package/es/{iconfont.1749019395589.ttf → iconfont.1749202972772.ttf} +0 -0
  65. /package/es/{iconfont.1749019395589.woff → iconfont.1749202972772.woff} +0 -0
  66. /package/es/{iconfont.1749019395589.woff2 → iconfont.1749202972772.woff2} +0 -0
  67. /package/lib/{iconfont.1749019395589.ttf → iconfont.1749202972772.ttf} +0 -0
  68. /package/lib/{iconfont.1749019395589.woff → iconfont.1749202972772.woff} +0 -0
  69. /package/lib/{iconfont.1749019395589.woff2 → iconfont.1749202972772.woff2} +0 -0
@@ -1,7 +1,7 @@
1
1
  import { defineComponent, TransitionGroup, h, ref, inject, nextTick, onMounted, onUnmounted } from 'vue';
2
2
  import XEUtils from 'xe-utils';
3
3
  import { VxeUI } from '../../ui';
4
- import { getOffsetSize, calcTreeLine, getRowid, createHandleGetRowId } from './util';
4
+ import { getOffsetSize, calcTreeLine, getRowid, createHandleGetRowId, getCellRestHeight } from './util';
5
5
  import { updateCellTitle, getPropClass } from '../../ui/src/dom';
6
6
  import { isEnableConf } from '../../ui/src/utils';
7
7
  import { getSlotVNs } from '../../ui/src/vn';
@@ -208,6 +208,7 @@ export default defineComponent({
208
208
  $xeTable.triggerCellDblclickEvent(evnt, cellParams);
209
209
  };
210
210
  let isMergeCell = false;
211
+ let mergeRowspan = 1;
211
212
  // 合并行或列
212
213
  if (mergeBodyFlag && mergeBodyList.length) {
213
214
  const spanRest = mergeBodyCellMaps[`${_rowIndex}:${_columnIndex}`];
@@ -218,6 +219,7 @@ export default defineComponent({
218
219
  }
219
220
  if (rowspan > 1) {
220
221
  isMergeCell = true;
222
+ mergeRowspan = rowspan;
221
223
  tdAttrs.rowspan = rowspan;
222
224
  }
223
225
  if (colspan > 1) {
@@ -233,9 +235,12 @@ export default defineComponent({
233
235
  return null;
234
236
  }
235
237
  if (rowspan > 1) {
238
+ isMergeCell = true;
239
+ mergeRowspan = rowspan;
236
240
  tdAttrs.rowspan = rowspan;
237
241
  }
238
242
  if (colspan > 1) {
243
+ isMergeCell = true;
239
244
  tdAttrs.colspan = colspan;
240
245
  }
241
246
  }
@@ -250,7 +255,7 @@ export default defineComponent({
250
255
  isDirty = $xeTable.isUpdateByRow(row, column.field);
251
256
  }
252
257
  const isVNAutoHeight = scrollYLoad && !hasEllipsis;
253
- const cellHeight = rowRest.resizeHeight || cellOpts.height || rowOpts.height || rowRest.height || defaultRowHeight;
258
+ let cellHeight = getCellRestHeight(rowRest, cellOpts, rowOpts, defaultRowHeight);
254
259
  const isLastColumn = $columnIndex === columns.length - 1;
255
260
  const isAutoCellWidth = !column.resizeWidth && (column.minWidth === 'auto' || column.width === 'auto');
256
261
  let isVNPreEmptyStatus = false;
@@ -264,6 +269,15 @@ export default defineComponent({
264
269
  }
265
270
  }
266
271
  }
272
+ if (mergeRowspan > 1) {
273
+ const mEndRow = afterFullData[_rowIndex + mergeRowspan - 1];
274
+ if (mEndRow) {
275
+ const meRowRest = fullAllDataRowIdData[getRowid($xeTable, mEndRow)];
276
+ if (meRowRest) {
277
+ cellHeight += meRowRest.oTop - rowRest.oTop + getCellRestHeight(meRowRest, cellOpts, rowOpts, defaultRowHeight);
278
+ }
279
+ }
280
+ }
267
281
  const tcStyle = {};
268
282
  if (hasEllipsis && resizeWidthFlag) {
269
283
  let tsColspan = tdAttrs.colspan || 0;
@@ -297,7 +311,10 @@ export default defineComponent({
297
311
  }
298
312
  else {
299
313
  // 渲染单元格
300
- tdVNs.push(...renderLine(rowid, cellParams, cellHeight), h('div', {
314
+ if (treeConfig) {
315
+ tdVNs.push(...renderLine(rowid, cellParams, cellHeight));
316
+ }
317
+ tdVNs.push(h('div', {
301
318
  key: 'tc',
302
319
  class: ['vxe-cell', {
303
320
  'c--title': showTitle,
@@ -257,12 +257,12 @@ function renderCellHandle(params) {
257
257
  const { isRowGroupStatus } = tableReactData;
258
258
  const { editConfig } = tableProps;
259
259
  const { type, treeNode, rowGroupNode, editRender } = column;
260
- const { computeEditOpts, computeCheckboxOpts, computeRowGroupOpts } = $table.getComputeMaps();
261
- const rowGroupOpts = computeRowGroupOpts.value;
262
- const { mode } = rowGroupOpts;
260
+ const { computeEditOpts, computeCheckboxOpts, computeAggregateOpts } = $table.getComputeMaps();
261
+ const aggregateOpts = computeAggregateOpts.value;
262
+ const { mode } = aggregateOpts;
263
263
  const checkboxOpts = computeCheckboxOpts.value;
264
264
  const editOpts = computeEditOpts.value;
265
- const isDeepCell = treeNode || (isRowGroupStatus && row.isAggregate && (mode === 'column' ? column.field === row.groupField : rowGroupNode));
265
+ const isDeepCell = treeNode || (isRowGroupStatus && (mode === 'column' ? column.field === row.groupField : rowGroupNode));
266
266
  switch (type) {
267
267
  case 'seq':
268
268
  return isDeepCell ? Cell.renderDeepIndexCell(params) : Cell.renderSeqCell(params);
@@ -364,7 +364,7 @@ export const Cell = {
364
364
  const tableReactData = $table.reactData;
365
365
  const tableInternalData = $table.internalData;
366
366
  const { isRowGroupStatus } = tableReactData;
367
- const { field, slots, editRender, cellRender, rowGroupNode } = column;
367
+ const { field, slots, editRender, cellRender, rowGroupNode, aggFunc } = column;
368
368
  const renderOpts = editRender || cellRender;
369
369
  const defaultSlot = slots ? slots.default : null;
370
370
  if (defaultSlot) {
@@ -382,41 +382,53 @@ export const Cell = {
382
382
  }
383
383
  }
384
384
  let cellValue = '';
385
- if (isRowGroupStatus && row.isAggregate) {
385
+ if (isRowGroupStatus && field && row.isAggregate) {
386
+ const aggRow = row;
386
387
  const { fullColumnFieldData } = tableInternalData;
387
- const { computeRowGroupOpts } = $table.getComputeMaps();
388
- const rowGroupOpts = computeRowGroupOpts.value;
389
- const { mode, showTotal, totalMethod, countFields, countMethod, contentMethod, mapChildrenField } = rowGroupOpts;
390
- const groupField = row.groupField;
391
- const groupContent = row.groupContent;
392
- const childList = mapChildrenField ? (row[mapChildrenField] || []) : [];
393
- const totalValue = row.childCount;
388
+ const { computeAggregateOpts } = $table.getComputeMaps();
389
+ const aggregateOpts = computeAggregateOpts.value;
390
+ const { mode, showTotal, totalMethod, countFields, contentMethod, mapChildrenField } = aggregateOpts;
391
+ const aggMethod = aggregateOpts.aggregateMethod || aggregateOpts.countMethod;
392
+ const groupField = aggRow.groupField;
393
+ const groupContent = aggRow.groupContent;
394
+ const childList = mapChildrenField ? (aggRow[mapChildrenField] || []) : [];
395
+ const childCount = aggRow.childCount;
394
396
  const colRest = fullColumnFieldData[groupField] || {};
395
- const params = {
397
+ const ctParams = {
396
398
  $table,
397
399
  groupField,
398
400
  groupColumn: (colRest ? colRest.column : null),
399
401
  column,
400
402
  groupValue: groupContent,
401
403
  children: childList,
402
- totalValue: totalValue
404
+ childCount,
405
+ aggValue: null,
406
+ /**
407
+ * 已废弃
408
+ * @deprecated
409
+ */
410
+ totalValue: childCount
403
411
  };
404
- if (mode === 'column' ? column.field === row.groupField : rowGroupNode) {
412
+ if (mode === 'column' ? field === aggRow.groupField : rowGroupNode) {
405
413
  cellValue = groupContent;
406
414
  if (contentMethod) {
407
- cellValue = `${contentMethod(params)}`;
415
+ cellValue = `${contentMethod(ctParams)}`;
408
416
  }
409
417
  if (showTotal) {
410
- cellValue = getI18n('vxe.table.rowGroupContentTotal', [cellValue, totalMethod ? totalMethod(params) : totalValue, totalValue]);
418
+ cellValue = getI18n('vxe.table.rowGroupContentTotal', [cellValue, totalMethod ? totalMethod(ctParams) : childCount, childCount]);
411
419
  }
412
420
  }
413
- else if (countFields && countFields.includes(field)) {
414
- if (countMethod) {
415
- cellValue = `${countMethod(params)}`;
421
+ else if ($table.getPivotTableAggregateCellAggValue) {
422
+ cellValue = $table.getPivotTableAggregateCellAggValue(params);
423
+ }
424
+ else if (aggFunc === true || (countFields && countFields.includes(field))) {
425
+ if (aggMethod) {
426
+ ctParams.aggValue = childCount;
427
+ cellValue = `${aggMethod(ctParams)}`;
416
428
  }
417
429
  }
418
430
  }
419
- else if (!(isRowGroupStatus && row.isAggregate)) {
431
+ else {
420
432
  cellValue = $table.getCellLabel(row, column);
421
433
  }
422
434
  const cellPlaceholder = editRender ? editRender.placeholder : '';
@@ -447,11 +459,11 @@ export const Cell = {
447
459
  const tableReactData = $table.reactData;
448
460
  const tableInternalData = $table.internalData;
449
461
  const { row, level } = params;
450
- const { computeRowGroupOpts } = $table.getComputeMaps();
462
+ const { computeAggregateOpts } = $table.getComputeMaps();
451
463
  const { rowGroupExpandedFlag } = tableReactData;
452
464
  const { rowGroupExpandedMaps } = tableInternalData;
453
- const rowGroupOpts = computeRowGroupOpts.value;
454
- const { padding, indent } = rowGroupOpts;
465
+ const aggregateOpts = computeAggregateOpts.value;
466
+ const { padding, indent } = aggregateOpts;
455
467
  const rowid = getRowid($table, row);
456
468
  const isExpand = !!rowGroupExpandedFlag && !!rowGroupExpandedMaps[rowid];
457
469
  return h('div', {
@@ -464,16 +476,18 @@ export const Cell = {
464
476
  }
465
477
  : undefined
466
478
  }, [
467
- h('span', {
468
- class: 'vxe-row-group--node-btn',
469
- onClick(evnt) {
470
- $table.triggerRowGroupExpandEvent(evnt, params);
471
- }
472
- }, [
473
- h('i', {
474
- class: isExpand ? getIcon().TABLE_ROW_GROUP_OPEN : getIcon().TABLE_ROW_GROUP_CLOSE
475
- })
476
- ]),
479
+ row.isAggregate
480
+ ? h('span', {
481
+ class: 'vxe-row-group--node-btn',
482
+ onClick(evnt) {
483
+ $table.triggerRowGroupExpandEvent(evnt, params);
484
+ }
485
+ }, [
486
+ h('i', {
487
+ class: isExpand ? getIcon().TABLE_ROW_GROUP_OPEN : getIcon().TABLE_ROW_GROUP_CLOSE
488
+ })
489
+ ])
490
+ : renderEmptyElement($table),
477
491
  h('div', {
478
492
  class: 'vxe-row-group-cell'
479
493
  }, cellVNodes)
@@ -552,10 +566,12 @@ export const Cell = {
552
566
  renderDeepNodeBtn(params, cellVNodes) {
553
567
  const { $table, row, column } = params;
554
568
  const { rowGroupNode } = column;
555
- if (row.isAggregate) {
556
- const { computeRowGroupOpts } = $table.getComputeMaps();
557
- const rowGroupOpts = computeRowGroupOpts.value;
558
- const { mode } = rowGroupOpts;
569
+ const tableReactData = $table.reactData;
570
+ const { rowGroupList } = tableReactData;
571
+ if (rowGroupList.length) {
572
+ const { computeAggregateOpts } = $table.getComputeMaps();
573
+ const aggregateOpts = computeAggregateOpts.value;
574
+ const { mode } = aggregateOpts;
559
575
  if (mode === 'column' ? column.field === row.groupField : rowGroupNode) {
560
576
  return [Cell.renderRowGroupBtn(params, cellVNodes)];
561
577
  }
@@ -121,6 +121,8 @@ export const columnProps = {
121
121
  editRender: Object,
122
122
  // 内容渲染配置项
123
123
  contentRender: Object,
124
+ // 聚合函数
125
+ aggFunc: [String, Boolean],
124
126
  // 额外的参数
125
127
  params: Object
126
128
  };
@@ -90,6 +90,7 @@ export class ColumnInfo {
90
90
  titleHelp: _vm.titleHelp,
91
91
  titlePrefix: _vm.titlePrefix,
92
92
  titleSuffix: _vm.titleSuffix,
93
+ aggFunc: _vm.aggFunc,
93
94
  // 自定义参数
94
95
  params: _vm.params,
95
96
  // 渲染属性
@@ -115,6 +116,7 @@ export class ColumnInfo {
115
116
  // 列排序
116
117
  sortNumber: 0,
117
118
  renderSortNumber: 0,
119
+ renderAggFn: '',
118
120
  renderFixed: '',
119
121
  renderVisible: false,
120
122
  renderWidth: 0,
@@ -192,7 +192,9 @@ export default {
192
192
  footerCellConfig: Object,
193
193
  // 行配置项
194
194
  rowConfig: Object,
195
- // 行分组配置项
195
+ // 数据聚合配置项
196
+ aggregateConfig: Object,
197
+ // 已废弃,被 aggregateConfig 替换
196
198
  rowGroupConfig: Object,
197
199
  // 当前行配置项
198
200
  currentRowConfig: Object,