vxe-table 4.16.0-beta.5 → 4.16.0-beta.7

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 (48) hide show
  1. package/es/index.css +1 -1
  2. package/es/index.min.css +1 -1
  3. package/es/style.css +1 -1
  4. package/es/style.min.css +1 -1
  5. package/es/table/module/custom/panel.js +119 -125
  6. package/es/table/src/anime.js +4 -4
  7. package/es/table/src/cell.js +29 -6
  8. package/es/table/src/table.js +145 -70
  9. package/es/table/style.css +178 -163
  10. package/es/table/style.min.css +1 -1
  11. package/es/ui/index.js +1 -1
  12. package/es/ui/src/log.js +1 -1
  13. package/es/vxe-table/style.css +178 -163
  14. package/es/vxe-table/style.min.css +1 -1
  15. package/lib/index.css +1 -1
  16. package/lib/index.min.css +1 -1
  17. package/lib/index.umd.js +70 -39
  18. package/lib/index.umd.min.js +1 -1
  19. package/lib/style.css +1 -1
  20. package/lib/style.min.css +1 -1
  21. package/lib/table/module/custom/panel.js +2 -8
  22. package/lib/table/module/custom/panel.min.js +1 -1
  23. package/lib/table/src/anime.js +4 -4
  24. package/lib/table/src/anime.min.js +1 -1
  25. package/lib/table/src/cell.js +39 -3
  26. package/lib/table/src/cell.min.js +1 -1
  27. package/lib/table/src/table.js +22 -22
  28. package/lib/table/src/table.min.js +1 -1
  29. package/lib/table/style/style.css +178 -163
  30. package/lib/table/style/style.min.css +1 -1
  31. package/lib/ui/index.js +1 -1
  32. package/lib/ui/index.min.js +1 -1
  33. package/lib/ui/src/log.js +1 -1
  34. package/lib/ui/src/log.min.js +1 -1
  35. package/lib/vxe-table/style/style.css +178 -163
  36. package/lib/vxe-table/style/style.min.css +1 -1
  37. package/package.json +3 -2
  38. package/packages/table/module/custom/panel.ts +128 -134
  39. package/packages/table/src/anime.ts +4 -4
  40. package/packages/table/src/cell.ts +30 -6
  41. package/packages/table/src/table.ts +149 -71
  42. package/styles/components/table.scss +166 -165
  43. /package/es/{iconfont.1755588973979.ttf → iconfont.1755651021240.ttf} +0 -0
  44. /package/es/{iconfont.1755588973979.woff → iconfont.1755651021240.woff} +0 -0
  45. /package/es/{iconfont.1755588973979.woff2 → iconfont.1755651021240.woff2} +0 -0
  46. /package/lib/{iconfont.1755588973979.ttf → iconfont.1755651021240.ttf} +0 -0
  47. /package/lib/{iconfont.1755588973979.woff → iconfont.1755651021240.woff} +0 -0
  48. /package/lib/{iconfont.1755588973979.woff2 → iconfont.1755651021240.woff2} +0 -0
@@ -1,4 +1,4 @@
1
- import { h, inject, ref, provide, nextTick, TransitionGroup, createCommentVNode, reactive, Teleport, onUnmounted } from 'vue';
1
+ import { h, inject, ref, provide, nextTick, TransitionGroup, createCommentVNode, reactive, onUnmounted } from 'vue';
2
2
  import { defineVxeComponent } from '../../../ui/src/comp';
3
3
  import { VxeUI } from '../../../ui';
4
4
  import { formatText } from '../../../ui/src/utils';
@@ -565,7 +565,6 @@ export default defineVxeComponent({
565
565
  const { customStore } = props;
566
566
  const { treeConfig, rowGroupConfig, aggregateConfig } = tableProps;
567
567
  const { isCustomStatus, customColumnList } = tableReactData;
568
- const { teleportToWrapperElem } = tableInternalData;
569
568
  const customOpts = computeCustomOpts.value;
570
569
  const { immediate } = customOpts;
571
570
  const columnDragOpts = computeColumnDragOpts.value;
@@ -701,141 +700,136 @@ export default defineVxeComponent({
701
700
  ]));
702
701
  }
703
702
  });
704
- return h(Teleport, {
705
- to: teleportToWrapperElem,
706
- disabled: !($xeGantt && teleportToWrapperElem)
707
- }, [
708
- h('div', {
709
- ref: refElem,
710
- key: 'simple',
711
- class: ['vxe-table-custom-wrapper', `placement--${placement}`, {
712
- 'is--active': customStore.visible
713
- }],
714
- style: maxHeight && !['left', 'right'].includes(placement || '')
715
- ? {
716
- maxHeight: `${maxHeight}px`
717
- }
718
- : {}
719
- }, customStore.visible
720
- ? [
703
+ return h('div', {
704
+ ref: refElem,
705
+ key: 'simple',
706
+ class: ['vxe-table-custom-wrapper', `placement--${placement}`, {
707
+ 'is--active': customStore.visible
708
+ }],
709
+ style: maxHeight && !['left', 'right'].includes(placement || '')
710
+ ? {
711
+ maxHeight: `${maxHeight}px`
712
+ }
713
+ : {}
714
+ }, customStore.visible
715
+ ? [
716
+ h('div', {
717
+ ref: refBodyWrapperElem,
718
+ class: 'vxe-table-custom-simple--body-wrapper'
719
+ }, [
720
+ !treeConfig && (aggregateConfig || rowGroupConfig) && $xeTable.getPivotTableAggregateSimplePanel
721
+ ? h($xeTable.getPivotTableAggregateSimplePanel(), {
722
+ customStore
723
+ })
724
+ : renderEmptyElement($xeTable),
721
725
  h('div', {
722
- ref: refBodyWrapperElem,
723
- class: 'vxe-table-custom-simple--body-wrapper'
726
+ ref: refCustomBodyElem,
727
+ class: 'vxe-table-custom--handle-wrapper'
724
728
  }, [
725
- !treeConfig && (aggregateConfig || rowGroupConfig) && $xeTable.getPivotTableAggregateSimplePanel
726
- ? h($xeTable.getPivotTableAggregateSimplePanel(), {
727
- customStore
728
- })
729
- : renderEmptyElement($xeTable),
730
729
  h('div', {
731
- ref: refCustomBodyElem,
732
- class: 'vxe-table-custom--handle-wrapper'
733
- }, [
734
- h('div', {
735
- class: 'vxe-table-custom--header'
736
- }, headerSlot
737
- ? $xeTable.callSlot(headerSlot, params)
738
- : [
739
- h('ul', {
740
- class: 'vxe-table-custom--panel-list'
730
+ class: 'vxe-table-custom--header'
731
+ }, headerSlot
732
+ ? $xeTable.callSlot(headerSlot, params)
733
+ : [
734
+ h('ul', {
735
+ class: 'vxe-table-custom--panel-list'
736
+ }, [
737
+ h('li', {
738
+ class: 'vxe-table-custom--option'
741
739
  }, [
742
- h('li', {
743
- class: 'vxe-table-custom--option'
744
- }, [
745
- allowVisible
746
- ? h('div', {
747
- class: ['vxe-table-custom--checkbox-option', {
748
- 'is--checked': isAllChecked,
749
- 'is--indeterminate': isAllIndeterminate
750
- }],
751
- title: getI18n('vxe.table.allTitle'),
752
- onClick: allOptionEvent
753
- }, [
754
- h('span', {
755
- class: ['vxe-checkbox--icon', isAllIndeterminate ? getIcon().TABLE_CHECKBOX_INDETERMINATE : (isAllChecked ? getIcon().TABLE_CHECKBOX_CHECKED : getIcon().TABLE_CHECKBOX_UNCHECKED)]
756
- }),
757
- h('span', {
758
- class: 'vxe-checkbox--label'
759
- }, getI18n('vxe.toolbar.customAll'))
760
- ])
761
- : h('span', {
740
+ allowVisible
741
+ ? h('div', {
742
+ class: ['vxe-table-custom--checkbox-option', {
743
+ 'is--checked': isAllChecked,
744
+ 'is--indeterminate': isAllIndeterminate
745
+ }],
746
+ title: getI18n('vxe.table.allTitle'),
747
+ onClick: allOptionEvent
748
+ }, [
749
+ h('span', {
750
+ class: ['vxe-checkbox--icon', isAllIndeterminate ? getIcon().TABLE_CHECKBOX_INDETERMINATE : (isAllChecked ? getIcon().TABLE_CHECKBOX_CHECKED : getIcon().TABLE_CHECKBOX_UNCHECKED)]
751
+ }),
752
+ h('span', {
762
753
  class: 'vxe-checkbox--label'
763
- }, getI18n('vxe.table.customTitle'))
764
- ])
754
+ }, getI18n('vxe.toolbar.customAll'))
755
+ ])
756
+ : h('span', {
757
+ class: 'vxe-checkbox--label'
758
+ }, getI18n('vxe.table.customTitle'))
765
759
  ])
766
- ]),
767
- h('div', {
768
- class: 'vxe-table-custom--body'
769
- }, [
770
- topSlot
771
- ? h('div', {
772
- class: 'vxe-table-custom--panel-top'
773
- }, $xeTable.callSlot(topSlot, params))
774
- : renderEmptyElement($xeTable),
775
- defaultSlot
776
- ? h('div', {
777
- class: 'vxe-table-custom--panel-body'
778
- }, $xeTable.callSlot(defaultSlot, params))
779
- : h(TransitionGroup, Object.assign({ class: 'vxe-table-custom--panel-list', name: 'vxe-table-custom--list', tag: 'ul' }, customWrapperOns), {
780
- default: () => colVNs
781
- }),
782
- bottomSlot
783
- ? h('div', {
784
- class: 'vxe-table-custom--panel-bottom'
785
- }, $xeTable.callSlot(bottomSlot, params))
786
- : renderEmptyElement($xeTable)
760
+ ])
787
761
  ]),
788
- customOpts.showFooter
762
+ h('div', {
763
+ class: 'vxe-table-custom--body'
764
+ }, [
765
+ topSlot
766
+ ? h('div', {
767
+ class: 'vxe-table-custom--panel-top'
768
+ }, $xeTable.callSlot(topSlot, params))
769
+ : renderEmptyElement($xeTable),
770
+ defaultSlot
771
+ ? h('div', {
772
+ class: 'vxe-table-custom--panel-body'
773
+ }, $xeTable.callSlot(defaultSlot, params))
774
+ : h(TransitionGroup, Object.assign({ class: 'vxe-table-custom--panel-list', name: 'vxe-table-custom--list', tag: 'ul' }, customWrapperOns), {
775
+ default: () => colVNs
776
+ }),
777
+ bottomSlot
789
778
  ? h('div', {
790
- class: 'vxe-table-custom--footer'
791
- }, footerSlot
792
- ? $xeTable.callSlot(footerSlot, params)
793
- : [
794
- h('div', {
795
- class: 'vxe-table-custom--footer-buttons'
796
- }, [
797
- VxeUIButtonComponent
779
+ class: 'vxe-table-custom--panel-bottom'
780
+ }, $xeTable.callSlot(bottomSlot, params))
781
+ : renderEmptyElement($xeTable)
782
+ ]),
783
+ customOpts.showFooter
784
+ ? h('div', {
785
+ class: 'vxe-table-custom--footer'
786
+ }, footerSlot
787
+ ? $xeTable.callSlot(footerSlot, params)
788
+ : [
789
+ h('div', {
790
+ class: 'vxe-table-custom--footer-buttons'
791
+ }, [
792
+ VxeUIButtonComponent
793
+ ? h(VxeUIButtonComponent, {
794
+ mode: 'text',
795
+ content: customOpts.resetButtonText || getI18n('vxe.table.customRestore'),
796
+ disabled: !isCustomStatus,
797
+ onClick: resetCustomEvent
798
+ })
799
+ : createCommentVNode(),
800
+ immediate
801
+ ? (VxeUIButtonComponent
798
802
  ? h(VxeUIButtonComponent, {
799
803
  mode: 'text',
800
- content: customOpts.resetButtonText || getI18n('vxe.table.customRestore'),
801
- disabled: !isCustomStatus,
802
- onClick: resetCustomEvent
804
+ content: customOpts.closeButtonText || getI18n('vxe.table.customClose'),
805
+ onClick: cancelCloseEvent
803
806
  })
804
- : createCommentVNode(),
805
- immediate
806
- ? (VxeUIButtonComponent
807
- ? h(VxeUIButtonComponent, {
808
- mode: 'text',
809
- content: customOpts.closeButtonText || getI18n('vxe.table.customClose'),
810
- onClick: cancelCloseEvent
811
- })
812
- : createCommentVNode())
813
- : (VxeUIButtonComponent
814
- ? h(VxeUIButtonComponent, {
815
- mode: 'text',
816
- content: customOpts.cancelButtonText || getI18n('vxe.table.customCancel'),
817
- onClick: cancelCustomEvent
818
- })
819
- : createCommentVNode()),
820
- immediate
821
- ? createCommentVNode()
822
- : (VxeUIButtonComponent
823
- ? h(VxeUIButtonComponent, {
824
- mode: 'text',
825
- status: 'primary',
826
- content: customOpts.confirmButtonText || getI18n('vxe.table.customConfirm'),
827
- onClick: confirmCustomEvent
828
- })
829
- : createCommentVNode())
830
- ])
807
+ : createCommentVNode())
808
+ : (VxeUIButtonComponent
809
+ ? h(VxeUIButtonComponent, {
810
+ mode: 'text',
811
+ content: customOpts.cancelButtonText || getI18n('vxe.table.customCancel'),
812
+ onClick: cancelCustomEvent
813
+ })
814
+ : createCommentVNode()),
815
+ immediate
816
+ ? createCommentVNode()
817
+ : (VxeUIButtonComponent
818
+ ? h(VxeUIButtonComponent, {
819
+ mode: 'text',
820
+ status: 'primary',
821
+ content: customOpts.confirmButtonText || getI18n('vxe.table.customConfirm'),
822
+ onClick: confirmCustomEvent
823
+ })
824
+ : createCommentVNode())
831
825
  ])
832
- : null
833
- ]),
834
- renderDragTip()
835
- ])
836
- ]
837
- : [])
838
- ]);
826
+ ])
827
+ : null
828
+ ]),
829
+ renderDragTip()
830
+ ])
831
+ ]
832
+ : []);
839
833
  };
840
834
  const renderPopupPanel = () => {
841
835
  const $xeGrid = $xeTable.xeGrid;
@@ -16,10 +16,10 @@ export function moveRowAnimateToTb(elemList, offsetTop) {
16
16
  });
17
17
  });
18
18
  }
19
- export function clearRowAnimate(elem) {
19
+ export function clearRowAnimate(elem, clss) {
20
20
  setTimeout(() => {
21
21
  if (elem) {
22
- XEUtils.arrayEach(elem.querySelectorAll(`.vxe-body--row.${rowMoveCls}`), elem => removeClass(elem, rowMoveCls));
22
+ XEUtils.arrayEach(elem.querySelectorAll(clss.map(cls => `${cls}.${rowMoveCls}`).join(',')), elem => removeClass(elem, rowMoveCls));
23
23
  }
24
24
  }, 500);
25
25
  }
@@ -37,10 +37,10 @@ export function moveColAnimateToLr(elemList, offsetLeft) {
37
37
  });
38
38
  });
39
39
  }
40
- export function clearColAnimate(elem) {
40
+ export function clearColAnimate(elem, clss) {
41
41
  setTimeout(() => {
42
42
  if (elem) {
43
- XEUtils.arrayEach(elem.querySelectorAll(`.vxe-table--column.${colMoveClass}`), elem => removeClass(elem, colMoveClass));
43
+ XEUtils.arrayEach(elem.querySelectorAll(clss.map(cls => `${cls}.${rowMoveCls}`).join(',')), elem => removeClass(elem, colMoveClass));
44
44
  }
45
45
  }, 500);
46
46
  }
@@ -402,9 +402,14 @@ export const Cell = {
402
402
  groupColumn: (colRest ? colRest.column : null),
403
403
  column,
404
404
  groupValue: groupContent,
405
- children: childList,
405
+ childList,
406
406
  childCount,
407
407
  aggValue: null,
408
+ /**
409
+ * 已废弃
410
+ * @deprecated
411
+ */
412
+ children: childList,
408
413
  /**
409
414
  * 已废弃
410
415
  * @deprecated
@@ -412,7 +417,7 @@ export const Cell = {
412
417
  totalValue: childCount
413
418
  };
414
419
  if (gcSlot) {
415
- return renderCellBaseVNs(params, $table.callSlot(gcSlot, Object.assign({ groupField, groupContent, childCount }, params)));
420
+ return renderCellBaseVNs(params, $table.callSlot(gcSlot, Object.assign({ groupField, groupContent, childList, childCount }, params)));
416
421
  }
417
422
  if (mode === 'column' ? field === aggRow.groupField : rowGroupNode) {
418
423
  cellValue = groupContent;
@@ -1115,9 +1120,12 @@ export const Cell = {
1115
1120
  return Cell.renderDeepNodeBtn(params, Cell.renderCellEdit(params));
1116
1121
  },
1117
1122
  runRenderer(params, isEdit) {
1118
- const { $table, column } = params;
1119
- const { slots, editRender, formatter } = column;
1123
+ const { $table, row, column } = params;
1124
+ const tableReactData = $table.reactData;
1125
+ const { isRowGroupStatus } = tableReactData;
1126
+ const { slots, field, editRender, formatter } = column;
1120
1127
  const defaultSlot = slots ? slots.default : null;
1128
+ const gcSlot = slots ? (slots.groupContent || slots['group-content']) : null;
1121
1129
  const editSlot = slots ? slots.edit : null;
1122
1130
  const compConf = renderer.get(editRender.name);
1123
1131
  const rtEdit = compConf ? (compConf.renderTableEdit || compConf.renderEdit) : null;
@@ -1132,8 +1140,23 @@ export const Cell = {
1132
1140
  }
1133
1141
  return [];
1134
1142
  }
1135
- if (defaultSlot) {
1136
- return renderCellBaseVNs(params, $table.callSlot(defaultSlot, cellParams));
1143
+ if (isRowGroupStatus && field && row.isAggregate) {
1144
+ const aggRow = row;
1145
+ const { computeAggregateOpts } = $table.getComputeMaps();
1146
+ const aggregateOpts = computeAggregateOpts.value;
1147
+ const { mapChildrenField } = aggregateOpts;
1148
+ const groupField = aggRow.groupField;
1149
+ const groupContent = aggRow.groupContent;
1150
+ const childList = mapChildrenField ? (aggRow[mapChildrenField] || []) : [];
1151
+ const childCount = aggRow.childCount;
1152
+ if (gcSlot) {
1153
+ return renderCellBaseVNs(params, $table.callSlot(gcSlot, Object.assign({ groupField, groupContent, childList, childCount }, params)));
1154
+ }
1155
+ }
1156
+ else {
1157
+ if (defaultSlot) {
1158
+ return renderCellBaseVNs(params, $table.callSlot(defaultSlot, cellParams));
1159
+ }
1137
1160
  }
1138
1161
  if (formatter) {
1139
1162
  return renderCellBaseVNs(params, [