vxe-table 4.10.6-beta.3 → 4.10.6-beta.30

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 (178) 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/locale/lang/ar-EG.js +2 -1
  5. package/es/locale/lang/de-DE.js +2 -1
  6. package/es/locale/lang/en-US.js +4 -3
  7. package/es/locale/lang/es-ES.js +2 -1
  8. package/es/locale/lang/fr-FR.js +2 -1
  9. package/es/locale/lang/hu-HU.js +2 -1
  10. package/es/locale/lang/hy-AM.js +2 -1
  11. package/es/locale/lang/it-IT.js +2 -1
  12. package/es/locale/lang/ja-JP.js +2 -1
  13. package/es/locale/lang/ko-KR.js +2 -1
  14. package/es/locale/lang/nb-NO.js +2 -1
  15. package/es/locale/lang/pt-BR.js +2 -1
  16. package/es/locale/lang/ru-RU.js +4 -3
  17. package/es/locale/lang/th-TH.js +2 -1
  18. package/es/locale/lang/ug-CN.js +2 -1
  19. package/es/locale/lang/uk-UA.js +518 -517
  20. package/es/locale/lang/vi-VN.js +2 -1
  21. package/es/locale/lang/zh-CHT.js +2 -1
  22. package/es/locale/lang/zh-CN.js +2 -1
  23. package/es/style.css +1 -1
  24. package/es/style.min.css +1 -1
  25. package/es/table/module/edit/hook.js +7 -7
  26. package/es/table/module/export/hook.js +97 -62
  27. package/es/table/module/keyboard/hook.js +63 -27
  28. package/es/table/src/body.js +112 -77
  29. package/es/table/src/cell.js +28 -46
  30. package/es/table/src/column.js +13 -1
  31. package/es/table/src/columnInfo.js +3 -0
  32. package/es/table/src/emits.js +2 -0
  33. package/es/table/src/footer.js +32 -8
  34. package/es/table/src/header.js +73 -158
  35. package/es/table/src/props.js +6 -2
  36. package/es/table/src/table.js +1175 -633
  37. package/es/table/src/util.js +77 -62
  38. package/es/table/style.css +357 -213
  39. package/es/table/style.min.css +1 -1
  40. package/es/ui/index.js +24 -11
  41. package/es/ui/src/log.js +1 -1
  42. package/es/vxe-table/style.css +357 -213
  43. package/es/vxe-table/style.min.css +1 -1
  44. package/lib/grid/src/grid.js +1 -1
  45. package/lib/grid/src/grid.min.js +1 -1
  46. package/lib/index.css +1 -1
  47. package/lib/index.min.css +1 -1
  48. package/lib/index.umd.js +1833 -1161
  49. package/lib/index.umd.min.js +1 -1
  50. package/lib/locale/lang/ar-EG.js +2 -1
  51. package/lib/locale/lang/ar-EG.min.js +1 -1
  52. package/lib/locale/lang/de-DE.js +2 -1
  53. package/lib/locale/lang/de-DE.min.js +1 -1
  54. package/lib/locale/lang/en-US.js +4 -3
  55. package/lib/locale/lang/en-US.min.js +1 -1
  56. package/lib/locale/lang/en-US.umd.js +4 -3
  57. package/lib/locale/lang/es-ES.js +2 -1
  58. package/lib/locale/lang/es-ES.min.js +1 -1
  59. package/lib/locale/lang/es-ES.umd.js +2 -1
  60. package/lib/locale/lang/fr-FR.js +2 -1
  61. package/lib/locale/lang/fr-FR.min.js +1 -1
  62. package/lib/locale/lang/hu-HU.js +2 -1
  63. package/lib/locale/lang/hu-HU.min.js +1 -1
  64. package/lib/locale/lang/hu-HU.umd.js +2 -1
  65. package/lib/locale/lang/hy-AM.js +2 -1
  66. package/lib/locale/lang/hy-AM.min.js +1 -1
  67. package/lib/locale/lang/it-IT.js +2 -1
  68. package/lib/locale/lang/it-IT.min.js +1 -1
  69. package/lib/locale/lang/ja-JP.js +2 -1
  70. package/lib/locale/lang/ja-JP.min.js +1 -1
  71. package/lib/locale/lang/ja-JP.umd.js +2 -1
  72. package/lib/locale/lang/ko-KR.js +2 -1
  73. package/lib/locale/lang/ko-KR.min.js +1 -1
  74. package/lib/locale/lang/ko-KR.umd.js +2 -1
  75. package/lib/locale/lang/nb-NO.js +2 -1
  76. package/lib/locale/lang/nb-NO.min.js +1 -1
  77. package/lib/locale/lang/pt-BR.js +2 -1
  78. package/lib/locale/lang/pt-BR.min.js +1 -1
  79. package/lib/locale/lang/pt-BR.umd.js +2 -1
  80. package/lib/locale/lang/ru-RU.js +4 -3
  81. package/lib/locale/lang/ru-RU.min.js +1 -1
  82. package/lib/locale/lang/ru-RU.umd.js +4 -3
  83. package/lib/locale/lang/th-TH.js +2 -1
  84. package/lib/locale/lang/th-TH.min.js +1 -1
  85. package/lib/locale/lang/ug-CN.js +2 -1
  86. package/lib/locale/lang/ug-CN.min.js +1 -1
  87. package/lib/locale/lang/uk-UA.js +518 -517
  88. package/lib/locale/lang/uk-UA.min.js +1 -1
  89. package/lib/locale/lang/uk-UA.umd.js +518 -517
  90. package/lib/locale/lang/vi-VN.js +2 -1
  91. package/lib/locale/lang/vi-VN.min.js +1 -1
  92. package/lib/locale/lang/zh-CHT.js +2 -1
  93. package/lib/locale/lang/zh-CHT.min.js +1 -1
  94. package/lib/locale/lang/zh-CN.js +2 -1
  95. package/lib/locale/lang/zh-CN.min.js +1 -1
  96. package/lib/locale/lang/zh-CN.umd.js +2 -1
  97. package/lib/style.css +1 -1
  98. package/lib/style.min.css +1 -1
  99. package/lib/table/module/edit/hook.js +12 -2
  100. package/lib/table/module/edit/hook.min.js +1 -1
  101. package/lib/table/module/export/hook.js +97 -57
  102. package/lib/table/module/export/hook.min.js +1 -1
  103. package/lib/table/module/keyboard/hook.js +71 -28
  104. package/lib/table/module/keyboard/hook.min.js +1 -1
  105. package/lib/table/src/body.js +104 -76
  106. package/lib/table/src/body.min.js +1 -1
  107. package/lib/table/src/cell.js +27 -38
  108. package/lib/table/src/cell.min.js +1 -1
  109. package/lib/table/src/column.js +13 -1
  110. package/lib/table/src/column.min.js +1 -1
  111. package/lib/table/src/columnInfo.js +3 -0
  112. package/lib/table/src/columnInfo.min.js +1 -1
  113. package/lib/table/src/emits.js +1 -1
  114. package/lib/table/src/emits.min.js +1 -1
  115. package/lib/table/src/footer.js +30 -8
  116. package/lib/table/src/footer.min.js +1 -1
  117. package/lib/table/src/header.js +57 -169
  118. package/lib/table/src/header.min.js +1 -1
  119. package/lib/table/src/props.js +6 -2
  120. package/lib/table/src/props.min.js +1 -1
  121. package/lib/table/src/table.js +1227 -625
  122. package/lib/table/src/table.min.js +1 -1
  123. package/lib/table/src/util.js +100 -82
  124. package/lib/table/src/util.min.js +1 -1
  125. package/lib/table/style/style.css +357 -213
  126. package/lib/table/style/style.min.css +1 -1
  127. package/lib/ui/index.js +24 -11
  128. package/lib/ui/index.min.js +1 -1
  129. package/lib/ui/src/log.js +1 -1
  130. package/lib/ui/src/log.min.js +1 -1
  131. package/lib/vxe-table/style/style.css +357 -213
  132. package/lib/vxe-table/style/style.min.css +1 -1
  133. package/package.json +2 -2
  134. package/packages/grid/src/grid.ts +1 -1
  135. package/packages/locale/lang/ar-EG.ts +2 -1
  136. package/packages/locale/lang/de-DE.ts +2 -1
  137. package/packages/locale/lang/en-US.ts +4 -3
  138. package/packages/locale/lang/es-ES.ts +2 -1
  139. package/packages/locale/lang/fr-FR.ts +2 -1
  140. package/packages/locale/lang/hu-HU.ts +2 -1
  141. package/packages/locale/lang/hy-AM.ts +2 -1
  142. package/packages/locale/lang/it-IT.ts +2 -1
  143. package/packages/locale/lang/ja-JP.ts +2 -1
  144. package/packages/locale/lang/ko-KR.ts +2 -1
  145. package/packages/locale/lang/nb-NO.ts +2 -1
  146. package/packages/locale/lang/pt-BR.ts +2 -1
  147. package/packages/locale/lang/ru-RU.ts +4 -3
  148. package/packages/locale/lang/th-TH.ts +2 -1
  149. package/packages/locale/lang/ug-CN.ts +2 -1
  150. package/packages/locale/lang/uk-UA.ts +518 -517
  151. package/packages/locale/lang/vi-VN.ts +2 -1
  152. package/packages/locale/lang/zh-CHT.ts +2 -1
  153. package/packages/locale/lang/zh-CN.ts +2 -1
  154. package/packages/table/module/edit/hook.ts +7 -7
  155. package/packages/table/module/export/hook.ts +118 -65
  156. package/packages/table/module/keyboard/hook.ts +59 -25
  157. package/packages/table/src/body.ts +122 -80
  158. package/packages/table/src/cell.ts +28 -54
  159. package/packages/table/src/column.ts +13 -1
  160. package/packages/table/src/columnInfo.ts +3 -0
  161. package/packages/table/src/emits.ts +5 -1
  162. package/packages/table/src/footer.ts +32 -8
  163. package/packages/table/src/header.ts +73 -158
  164. package/packages/table/src/props.ts +6 -2
  165. package/packages/table/src/table.ts +1179 -631
  166. package/packages/table/src/util.ts +81 -62
  167. package/packages/ui/index.ts +23 -10
  168. package/styles/components/table.scss +428 -290
  169. package/styles/theme/base.scss +4 -6
  170. package/styles/theme/dark.scss +1 -0
  171. package/styles/theme/light.scss +1 -0
  172. package/styles/variable.scss +1 -1
  173. /package/es/{iconfont.1736748534420.ttf → iconfont.1737460213413.ttf} +0 -0
  174. /package/es/{iconfont.1736748534420.woff → iconfont.1737460213413.woff} +0 -0
  175. /package/es/{iconfont.1736748534420.woff2 → iconfont.1737460213413.woff2} +0 -0
  176. /package/lib/{iconfont.1736748534420.ttf → iconfont.1737460213413.ttf} +0 -0
  177. /package/lib/{iconfont.1736748534420.woff → iconfont.1737460213413.woff} +0 -0
  178. /package/lib/{iconfont.1736748534420.woff2 → iconfont.1737460213413.woff2} +0 -0
@@ -33,10 +33,10 @@ export default defineComponent({
33
33
  // 滚动、拖动过程中不需要触发
34
34
  const isVMScrollProcess = () => {
35
35
  const { delayHover } = tableProps;
36
- const { lastScrollTime, _isResize } = tableReactData;
37
- return !!(_isResize || (lastScrollTime && Date.now() < lastScrollTime + delayHover));
36
+ const { lastScrollTime, isDragResize } = tableReactData;
37
+ return !!(isDragResize || (lastScrollTime && Date.now() < lastScrollTime + delayHover));
38
38
  };
39
- const renderLine = (params) => {
39
+ const renderLine = (params, cellHeight) => {
40
40
  const { row, column } = params;
41
41
  const { afterFullData } = tableInternalData;
42
42
  const { treeConfig } = tableProps;
@@ -52,18 +52,20 @@ export default defineComponent({
52
52
  let prevRow = null;
53
53
  if (rest) {
54
54
  rLevel = rest.level;
55
- prevRow = rest.items[rest._index - 1];
55
+ prevRow = rest.items[rest.treeIndex - 1];
56
56
  }
57
57
  const isFirstRow = $xeTable.eqRow(afterFullData[0], row);
58
58
  if (treeConfig && treeNode && (treeOpts.showLine || treeOpts.line)) {
59
59
  return [
60
60
  h('div', {
61
+ key: 'tl',
61
62
  class: 'vxe-tree--line-wrapper'
62
63
  }, [
63
64
  h('div', {
64
65
  class: 'vxe-tree--line',
65
66
  style: {
66
67
  height: `${isFirstRow ? 1 : calcTreeLine(params, prevRow)}px`,
68
+ bottom: `-${Math.floor(cellHeight / 2)}px`,
67
69
  left: `${(rLevel * treeOpts.indent) + (rLevel ? 2 - getOffsetSize($xeTable) : 0) + 16}px`
68
70
  }
69
71
  })
@@ -77,8 +79,8 @@ export default defineComponent({
77
79
  */
78
80
  const renderTdColumn = (seq, rowid, fixedType, isOptimizeMode, rowLevel, row, rowIndex, $rowIndex, _rowIndex, column, $columnIndex, columns, items) => {
79
81
  const { fullAllDataRowIdData } = tableInternalData;
80
- const { columnKey, height, showOverflow: allColumnOverflow, cellClassName: allCellClassName, cellStyle, align: allAlign, spanMethod, mouseConfig, editConfig, editRules, tooltipConfig } = tableProps;
81
- const { tableData, overflowX, currentColumn, scrollXLoad, scrollYLoad, isCalcCellHeight, mergeList, editStore, isAllOverflow, validErrorMaps } = tableReactData;
82
+ const { columnKey, height, cellClassName: allCellClassName, cellStyle, align: allAlign, spanMethod, mouseConfig, editConfig, editRules, tooltipConfig, padding: allPadding } = tableProps;
83
+ const { tableData, overflowX, currentColumn, scrollXLoad, scrollYLoad, calcCellHeightFlag, resizeHeightFlag, mergeList, editStore, isAllOverflow, validErrorMaps } = tableReactData;
82
84
  const { afterFullData, scrollXStore, scrollYStore } = tableInternalData;
83
85
  const cellOpts = computeCellOpts.value;
84
86
  const validOpts = computeValidOpts.value;
@@ -88,15 +90,17 @@ export default defineComponent({
88
90
  const rowOpts = computeRowOpts.value;
89
91
  const rowDragOpts = computeRowDragOpts.value;
90
92
  const defaultRowHeight = computeDefaultRowHeight.value;
93
+ const customCellHeight = cellOpts.height || rowOpts.height;
94
+ const currCellHeight = customCellHeight || defaultRowHeight;
91
95
  const { disabledMethod: dragDisabledMethod, isCrossDrag, isPeerDrag } = rowDragOpts;
92
96
  const columnOpts = computeColumnOpts.value;
93
97
  const mouseOpts = computeMouseOpts.value;
94
98
  const areaOpts = computeAreaOpts.value;
95
99
  const { selectCellToRow } = areaOpts;
96
- const { type, cellRender, editRender, align, showOverflow, className, treeNode, slots } = column;
97
- const { verticalAlign } = cellOpts;
100
+ const { type, cellRender, editRender, align, showOverflow, className, treeNode, rowResize, padding, verticalAlign, slots } = column;
101
+ const { verticalAlign: allVerticalAlign } = cellOpts;
98
102
  const { actived } = editStore;
99
- const { height: customRHeight } = rowOpts;
103
+ const rowRest = fullAllDataRowIdData[rowid];
100
104
  const colid = column.id;
101
105
  const renderOpts = editRender || cellRender;
102
106
  const compConf = renderOpts ? renderer.get(renderOpts.name) : null;
@@ -106,21 +110,24 @@ export default defineComponent({
106
110
  const columnIndex = $xeTable.getColumnIndex(column);
107
111
  const _columnIndex = $xeTable.getVTColumnIndex(column);
108
112
  const isEdit = isEnableConf(editRender);
113
+ const resizeHeight = resizeHeightFlag ? rowRest.resizeHeight : 0;
109
114
  let fixedHiddenColumn = fixedType ? column.fixed !== fixedType : column.fixed && overflowX;
110
- const cellOverflow = (XEUtils.isUndefined(showOverflow) || XEUtils.isNull(showOverflow)) ? allColumnOverflow : showOverflow;
115
+ const isCellPadding = XEUtils.eqNull(padding) ? (allPadding === null ? cellOpts.padding : allPadding) : padding;
116
+ const cellOverflow = XEUtils.eqNull(showOverflow) ? isAllOverflow : showOverflow;
111
117
  const showEllipsis = cellOverflow === 'ellipsis';
112
118
  const showTitle = cellOverflow === 'title';
113
119
  const showTooltip = cellOverflow === true || cellOverflow === 'tooltip';
114
- // 如果表格加上 showOverflow 则不再支持列单独设置
115
- const hasEllipsis = allColumnOverflow || showTitle || showTooltip || showEllipsis;
120
+ const hasEllipsis = isAllOverflow || showTitle || showTooltip || showEllipsis;
121
+ const isCsHeight = !!customCellHeight;
122
+ const isRsHeight = resizeHeight > 0;
116
123
  let isDirty;
117
124
  const tdOns = {};
118
- const rest = fullAllDataRowIdData[rowid];
119
125
  const cellAlign = align || (compConf ? compConf.tableCellAlign : '') || allAlign;
126
+ const cellVerticalAlign = XEUtils.eqNull(verticalAlign) ? allVerticalAlign : verticalAlign;
120
127
  const errorValidItem = validErrorMaps[`${rowid}:${colid}`];
121
128
  const showValidTip = editRules && validOpts.showMessage && (validOpts.message === 'default' ? (height || tableData.length > 1) : validOpts.message === 'inline');
122
- const attrs = { colid };
123
- const params = {
129
+ const tdAttrs = { colid };
130
+ const cellParams = {
124
131
  $table: $xeTable,
125
132
  $grid: $xeTable.xegrid,
126
133
  isEdit: false,
@@ -148,7 +155,7 @@ export default defineComponent({
148
155
  isRowDragCell = rowDragOpts.trigger === 'row' || (column.dragSort && rowDragOpts.trigger === 'cell');
149
156
  }
150
157
  if (isRowDragCell) {
151
- isDisabledDrag = !!(dragDisabledMethod && dragDisabledMethod(params));
158
+ isDisabledDrag = !!(dragDisabledMethod && dragDisabledMethod(cellParams));
152
159
  }
153
160
  // hover 进入事件
154
161
  if (showTitle || showTooltip || showAllTip || tooltipConfig) {
@@ -161,9 +168,9 @@ export default defineComponent({
161
168
  }
162
169
  else if (showTooltip || showAllTip) {
163
170
  // 如果配置了显示 tooltip
164
- $xeTable.triggerBodyTooltipEvent(evnt, params);
171
+ $xeTable.triggerBodyTooltipEvent(evnt, cellParams);
165
172
  }
166
- $xeTable.dispatchEvent('cell-mouseenter', Object.assign({ cell: evnt.currentTarget }, params), evnt);
173
+ $xeTable.dispatchEvent('cell-mouseenter', Object.assign({ cell: evnt.currentTarget }, cellParams), evnt);
167
174
  };
168
175
  }
169
176
  // hover 退出事件
@@ -175,13 +182,13 @@ export default defineComponent({
175
182
  if (showTooltip || showAllTip) {
176
183
  $xeTable.handleTargetLeaveEvent(evnt);
177
184
  }
178
- $xeTable.dispatchEvent('cell-mouseleave', Object.assign({ cell: evnt.currentTarget }, params), evnt);
185
+ $xeTable.dispatchEvent('cell-mouseleave', Object.assign({ cell: evnt.currentTarget }, cellParams), evnt);
179
186
  };
180
187
  }
181
188
  // 按下事件处理
182
189
  if (isRowDragCell || checkboxOpts.range || mouseConfig) {
183
190
  tdOns.onMousedown = (evnt) => {
184
- $xeTable.triggerCellMousedownEvent(evnt, params);
191
+ $xeTable.triggerCellMousedownEvent(evnt, cellParams);
185
192
  };
186
193
  }
187
194
  // 拖拽列事件
@@ -190,11 +197,11 @@ export default defineComponent({
190
197
  }
191
198
  // 点击事件处理
192
199
  tdOns.onClick = (evnt) => {
193
- $xeTable.triggerCellClickEvent(evnt, params);
200
+ $xeTable.triggerCellClickEvent(evnt, cellParams);
194
201
  };
195
202
  // 双击事件处理
196
203
  tdOns.onDblclick = (evnt) => {
197
- $xeTable.triggerCellDblclickEvent(evnt, params);
204
+ $xeTable.triggerCellDblclickEvent(evnt, cellParams);
198
205
  };
199
206
  // 合并行或列
200
207
  if (mergeList.length) {
@@ -205,29 +212,29 @@ export default defineComponent({
205
212
  return null;
206
213
  }
207
214
  if (rowspan > 1) {
208
- attrs.rowspan = rowspan;
215
+ tdAttrs.rowspan = rowspan;
209
216
  }
210
217
  if (colspan > 1) {
211
- attrs.colspan = colspan;
218
+ tdAttrs.colspan = colspan;
212
219
  }
213
220
  }
214
221
  }
215
222
  else if (spanMethod) {
216
223
  // 自定义合并行或列的方法
217
- const { rowspan = 1, colspan = 1 } = spanMethod(params) || {};
224
+ const { rowspan = 1, colspan = 1 } = spanMethod(cellParams) || {};
218
225
  if (!rowspan || !colspan) {
219
226
  return null;
220
227
  }
221
228
  if (rowspan > 1) {
222
- attrs.rowspan = rowspan;
229
+ tdAttrs.rowspan = rowspan;
223
230
  }
224
231
  if (colspan > 1) {
225
- attrs.colspan = colspan;
232
+ tdAttrs.colspan = colspan;
226
233
  }
227
234
  }
228
235
  // 如果被合并不可隐藏
229
236
  if (fixedHiddenColumn && mergeList) {
230
- if (attrs.colspan > 1 || attrs.rowspan > 1) {
237
+ if (tdAttrs.colspan > 1 || tdAttrs.rowspan > 1) {
231
238
  fixedHiddenColumn = false;
232
239
  }
233
240
  }
@@ -235,37 +242,73 @@ export default defineComponent({
235
242
  if (!fixedHiddenColumn && editConfig && (editRender || cellRender) && (editOpts.showStatus || editOpts.showUpdateStatus)) {
236
243
  isDirty = $xeTable.isUpdateByRow(row, column.field);
237
244
  }
245
+ const isVNAutoHeight = scrollYLoad && !hasEllipsis;
246
+ let cellHeight = currCellHeight;
247
+ const vnHeight = calcCellHeightFlag ? rowRest.height : 0;
248
+ if (resizeHeight) {
249
+ cellHeight = resizeHeight;
250
+ }
251
+ else {
252
+ if (scrollYLoad) {
253
+ if (!hasEllipsis) {
254
+ cellHeight = vnHeight || currCellHeight;
255
+ }
256
+ }
257
+ }
258
+ const isLastColumn = $columnIndex === columns.length - 1;
259
+ const isAutoCellWidth = !column.resizeWidth && (column.minWidth === 'auto' || column.width === 'auto');
260
+ let isVNPreEmptyStatus = false;
261
+ if (scrollYLoad && (_rowIndex < scrollYStore.visibleStartIndex - scrollYStore.preloadSize || _rowIndex > scrollYStore.visibleEndIndex + scrollYStore.preloadSize)) {
262
+ isVNPreEmptyStatus = true;
263
+ }
264
+ else if (scrollXLoad && !column.fixed && (_columnIndex < scrollXStore.visibleStartIndex - scrollXStore.preloadSize || _columnIndex > scrollXStore.visibleEndIndex + scrollXStore.preloadSize)) {
265
+ isVNPreEmptyStatus = true;
266
+ }
267
+ const tcStyle = {};
268
+ if (scrollYLoad || hasEllipsis || isCsHeight || isRsHeight) {
269
+ tcStyle.height = `${cellHeight}px`;
270
+ }
271
+ else {
272
+ tcStyle.minHeight = `${cellHeight}px`;
273
+ }
238
274
  const tdVNs = [];
239
- if (fixedHiddenColumn && (allColumnOverflow ? isAllOverflow : allColumnOverflow)) {
275
+ if (fixedHiddenColumn && isAllOverflow) {
240
276
  tdVNs.push(h('div', {
277
+ key: 'tc',
241
278
  class: ['vxe-cell', {
242
279
  'c--title': showTitle,
243
280
  'c--tooltip': showTooltip,
244
281
  'c--ellipsis': showEllipsis
245
282
  }],
246
- style: {
247
- maxHeight: hasEllipsis && (customRHeight || defaultRowHeight) ? `${customRHeight || defaultRowHeight}px` : ''
248
- }
283
+ style: tcStyle
249
284
  }));
250
285
  }
251
286
  else {
252
287
  // 渲染单元格
253
- tdVNs.push(...renderLine(params), h('div', {
288
+ tdVNs.push(...renderLine(cellParams, cellHeight), h('div', {
289
+ key: 'tc',
254
290
  class: ['vxe-cell', {
255
291
  'c--title': showTitle,
256
292
  'c--tooltip': showTooltip,
257
293
  'c--ellipsis': showEllipsis
258
294
  }],
259
- style: {
260
- maxHeight: hasEllipsis && (customRHeight || defaultRowHeight) ? `${customRHeight || defaultRowHeight}px` : ''
261
- },
295
+ style: tcStyle,
262
296
  title: showTitle ? $xeTable.getCellLabel(row, column) : null
263
- }, column.renderCell(params)));
297
+ }, isVNPreEmptyStatus
298
+ ? []
299
+ : [
300
+ h('div', {
301
+ colid,
302
+ rowid,
303
+ class: 'vxe-cell--wrapper'
304
+ }, column.renderCell(cellParams))
305
+ ]));
264
306
  if (showValidTip && errorValidItem) {
265
307
  const errRule = errorValidItem.rule;
266
308
  const validSlot = slots ? slots.valid : null;
267
- const validParams = Object.assign(Object.assign(Object.assign({}, params), errorValidItem), { rule: errorValidItem });
309
+ const validParams = Object.assign(Object.assign(Object.assign({}, cellParams), errorValidItem), { rule: errorValidItem });
268
310
  tdVNs.push(h('div', {
311
+ key: 'tcv',
269
312
  class: ['vxe-cell--valid-error-tip', getPropClass(validOpts.className, validParams)],
270
313
  style: errRule && errRule.maxWidth
271
314
  ? {
@@ -287,48 +330,39 @@ export default defineComponent({
287
330
  ]));
288
331
  }
289
332
  }
290
- let cellHeight = '';
291
- const vnHeight = isCalcCellHeight ? rest.height : 0;
292
- if (hasEllipsis) {
293
- if (customRHeight) {
294
- cellHeight = `${customRHeight}px`;
295
- }
296
- else if (!isAllOverflow) {
297
- cellHeight = `${vnHeight || defaultRowHeight || 18}px`;
298
- }
299
- }
300
- else {
301
- cellHeight = `${vnHeight || defaultRowHeight || 18}px`;
302
- }
333
+ let showAreaRowStatus = false;
303
334
  if (mouseConfig && mouseOpts.area && selectCellToRow) {
304
- if ((!$columnIndex && selectCellToRow === true) ||
335
+ if ((!_columnIndex && selectCellToRow === true) ||
305
336
  (selectCellToRow === column.field)) {
306
- tdVNs.push(h('div', {
307
- class: 'vxe-cell--area-status'
308
- }));
337
+ showAreaRowStatus = true;
309
338
  }
310
339
  }
311
- const isAutoCellWidth = !column.resizeWidth && (column.minWidth === 'auto' || column.width === 'auto');
312
- let isPreLoadStatus = false;
313
- if (scrollYLoad && (_rowIndex < scrollYStore.visibleStartIndex || _rowIndex > scrollYStore.visibleEndIndex)) {
314
- isPreLoadStatus = true;
315
- }
316
- else if (scrollXLoad && !column.fixed && (_columnIndex < scrollXStore.visibleStartIndex || _columnIndex > scrollXStore.visibleEndIndex)) {
317
- isPreLoadStatus = true;
340
+ if (rowResize && rowOpts.resizable) {
341
+ tdVNs.push(h('div', {
342
+ key: 'tcr',
343
+ class: 'vxe-cell--row-resizable',
344
+ onMousedown: (evnt) => $xeTable.handleRowResizeMousedownEvent(evnt, cellParams),
345
+ onDblclick: (evnt) => $xeTable.handleRowResizeDblclickEvent(evnt, cellParams)
346
+ }));
318
347
  }
319
348
  return h('td', Object.assign(Object.assign(Object.assign({ class: [
320
349
  'vxe-body--column',
321
350
  colid,
351
+ cellVerticalAlign ? `col--vertical-${cellVerticalAlign}` : '',
352
+ cellAlign ? `col--${cellAlign}` : '',
353
+ type ? `col--${type}` : '',
322
354
  {
323
- [`col--${cellAlign}`]: cellAlign,
324
- [`col--vertical-${verticalAlign}`]: verticalAlign,
325
- [`col--${type}`]: type,
326
- 'col--last': $columnIndex === columns.length - 1,
355
+ 'col--last': isLastColumn,
327
356
  'col--tree-node': treeNode,
328
357
  'col--edit': isEdit,
329
358
  'col--ellipsis': hasEllipsis,
359
+ 'col--cs-height': isCsHeight,
360
+ 'col--rs-height': isRsHeight,
361
+ 'col--to-row': showAreaRowStatus,
362
+ 'col--auto-height': isVNAutoHeight,
330
363
  'fixed--width': !isAutoCellWidth,
331
364
  'fixed--hidden': fixedHiddenColumn,
365
+ 'is--padding': isCellPadding,
332
366
  'is--drag-cell': isRowDragCell && (isCrossDrag || isPeerDrag || !rowLevel),
333
367
  'is--drag-disabled': isDisabledDrag,
334
368
  'col--dirty': isDirty,
@@ -336,16 +370,14 @@ export default defineComponent({
336
370
  'col--valid-error': !!errorValidItem,
337
371
  'col--current': currentColumn === column
338
372
  },
339
- getPropClass(compCellClassName, params),
340
- getPropClass(className, params),
341
- getPropClass(allCellClassName, params)
342
- ], key: columnKey || scrollXLoad || scrollYLoad || columnOpts.useKey || rowOpts.useKey || columnOpts.drag ? colid : $columnIndex }, attrs), { style: Object.assign({
343
- height: cellHeight
344
- }, XEUtils.isFunction(compCellStyle) ? compCellStyle(params) : compCellStyle, XEUtils.isFunction(cellStyle) ? cellStyle(params) : cellStyle) }), tdOns), isPreLoadStatus || (isOptimizeMode && fixedHiddenColumn) ? [] : tdVNs);
373
+ getPropClass(compCellClassName, cellParams),
374
+ getPropClass(className, cellParams),
375
+ getPropClass(allCellClassName, cellParams)
376
+ ], key: columnKey || scrollXLoad || scrollYLoad || columnOpts.useKey || rowOpts.useKey || columnOpts.drag ? colid : $columnIndex }, tdAttrs), { style: Object.assign({}, XEUtils.isFunction(compCellStyle) ? compCellStyle(cellParams) : compCellStyle, XEUtils.isFunction(cellStyle) ? cellStyle(cellParams) : cellStyle) }), tdOns), isOptimizeMode && fixedHiddenColumn ? [] : tdVNs);
345
377
  };
346
378
  const renderRows = (fixedType, isOptimizeMode, tableData, tableColumn) => {
347
- const { stripe, rowKey, highlightHoverRow, rowClassName, rowStyle, showOverflow: allColumnOverflow, editConfig, treeConfig } = tableProps;
348
- const { hasFixedColumn, treeExpandedMaps, scrollXLoad, scrollYLoad, rowExpandedMaps, expandColumn, selectRadioRow, pendingRowMaps, isDragColMove } = tableReactData;
379
+ const { stripe, rowKey, highlightHoverRow, rowClassName, rowStyle, editConfig, treeConfig } = tableProps;
380
+ const { hasFixedColumn, treeExpandedMaps, scrollXLoad, scrollYLoad, isAllOverflow, rowExpandedMaps, expandColumn, selectRadioRow, pendingRowMaps, isDragColMove } = tableReactData;
349
381
  const { fullAllDataRowIdData } = tableInternalData;
350
382
  const checkboxOpts = computeCheckboxOpts.value;
351
383
  const radioOpts = computeRadioOpts.value;
@@ -447,7 +479,7 @@ export default defineComponent({
447
479
  cellStyle.paddingLeft = `${(rowLevel * treeOpts.indent) + 30}px`;
448
480
  }
449
481
  const { showOverflow } = expandColumn;
450
- const hasEllipsis = (XEUtils.isUndefined(showOverflow) || XEUtils.isNull(showOverflow)) ? allColumnOverflow : showOverflow;
482
+ const hasEllipsis = (XEUtils.isUndefined(showOverflow) || XEUtils.isNull(showOverflow)) ? isAllOverflow : showOverflow;
451
483
  const expandParams = { $table: $xeTable, seq, column: expandColumn, fixed: fixedType, type: renderType, level: rowLevel, row, rowIndex, $rowIndex, _rowIndex };
452
484
  rows.push(h('tr', Object.assign({ class: ['vxe-body--expanded-row', {
453
485
  'is--padding': padding
@@ -510,7 +542,7 @@ export default defineComponent({
510
542
  const renderVN = () => {
511
543
  const { slots } = tableContext;
512
544
  const { fixedColumn, fixedType, tableColumn } = props;
513
- const { showOverflow: allColumnOverflow, spanMethod, footerSpanMethod, mouseConfig } = tableProps;
545
+ const { spanMethod, footerSpanMethod, mouseConfig } = tableProps;
514
546
  const { isGroup, tableData, scrollXLoad, scrollYLoad, isAllOverflow, isDragRowMove, expandColumn, dragRow, dragCol } = tableReactData;
515
547
  const { visibleColumn, fullAllDataRowIdData, fullColumnIdData } = tableInternalData;
516
548
  const rowOpts = computeRowOpts.value;
@@ -523,7 +555,7 @@ export default defineComponent({
523
555
  let renderColumnList = tableColumn;
524
556
  let isOptimizeMode = false;
525
557
  // 如果是使用优化模式
526
- if (scrollXLoad || scrollYLoad || (allColumnOverflow && isAllOverflow)) {
558
+ if (scrollXLoad || scrollYLoad || isAllOverflow) {
527
559
  if (expandColumn || spanMethod || footerSpanMethod) {
528
560
  // 如果不支持优化模式
529
561
  }
@@ -690,6 +722,9 @@ export default defineComponent({
690
722
  }),
691
723
  h('span', {
692
724
  class: 'vxe-table--cell-active-area'
725
+ }),
726
+ h('span', {
727
+ class: 'vxe-table--cell-row-status-area'
693
728
  })
694
729
  ])
695
730
  : renderEmptyElement($xeTable),
@@ -152,7 +152,7 @@ function renderTitleContent(params, content) {
152
152
  const ons = {};
153
153
  if (showTitle || showTooltip || showAllTip) {
154
154
  ons.onMouseenter = (evnt) => {
155
- if (tableReactData._isResize) {
155
+ if (tableReactData.isDragResize) {
156
156
  return;
157
157
  }
158
158
  if (showTitle) {
@@ -165,7 +165,7 @@ function renderTitleContent(params, content) {
165
165
  }
166
166
  if (showTooltip || showAllTip) {
167
167
  ons.onMouseleave = (evnt) => {
168
- if (tableReactData._isResize) {
168
+ if (tableReactData.isDragResize) {
169
169
  return;
170
170
  }
171
171
  if (showTooltip || showAllTip) {
@@ -179,18 +179,6 @@ function renderTitleContent(params, content) {
179
179
  : h('span', Object.assign({ class: 'vxe-cell--title' }, ons), getSlotVNs(content))
180
180
  ];
181
181
  }
182
- function formatFooterLabel(footerFormatter, params) {
183
- if (XEUtils.isFunction(footerFormatter)) {
184
- return `${footerFormatter(params)}`;
185
- }
186
- const isArr = XEUtils.isArray(footerFormatter);
187
- const gFormatOpts = isArr ? formats.get(footerFormatter[0]) : formats.get(footerFormatter);
188
- const footerFormatMethod = gFormatOpts ? gFormatOpts.tableFooterCellFormatMethod : null;
189
- if (footerFormatMethod) {
190
- return `${isArr ? footerFormatMethod(params, ...footerFormatter.slice(1)) : footerFormatMethod(params)}`;
191
- }
192
- return '';
193
- }
194
182
  function getFooterContent(params) {
195
183
  const { $table, column, _columnIndex, items, row } = params;
196
184
  const { slots, editRender, cellRender, footerFormatter } = column;
@@ -199,42 +187,40 @@ function getFooterContent(params) {
199
187
  if (footerSlot) {
200
188
  return $table.callSlot(footerSlot, params);
201
189
  }
190
+ let itemValue = '';
191
+ // 兼容老模式
192
+ if (XEUtils.isArray(items)) {
193
+ itemValue = items[_columnIndex];
194
+ }
195
+ else {
196
+ itemValue = XEUtils.get(row, column.field);
197
+ }
198
+ const footParams = Object.assign(params, {
199
+ itemValue
200
+ });
201
+ if (footerFormatter) {
202
+ if (XEUtils.isFunction(footerFormatter)) {
203
+ return `${footerFormatter(footParams)}`;
204
+ }
205
+ const isArr = XEUtils.isArray(footerFormatter);
206
+ const gFormatOpts = isArr ? formats.get(footerFormatter[0]) : formats.get(footerFormatter);
207
+ const footerFormatMethod = gFormatOpts ? gFormatOpts.tableFooterCellFormatMethod : null;
208
+ if (footerFormatMethod) {
209
+ return `${isArr ? footerFormatMethod(footParams, ...footerFormatter.slice(1)) : footerFormatMethod(footParams)}`;
210
+ }
211
+ return '';
212
+ }
202
213
  if (renderOpts) {
203
214
  const compConf = renderer.get(renderOpts.name);
204
215
  if (compConf) {
205
216
  const rtFooter = compConf.renderTableFooter || compConf.renderFooter;
206
217
  if (rtFooter) {
207
- return getSlotVNs(rtFooter(renderOpts, params));
218
+ return getSlotVNs(rtFooter(renderOpts, footParams));
208
219
  }
209
220
  }
210
221
  }
211
- let itemValue = '';
212
- // 兼容老模式
213
- if (XEUtils.isArray(items)) {
214
- itemValue = items[_columnIndex];
215
- return [
216
- footerFormatter
217
- ? formatFooterLabel(footerFormatter, {
218
- itemValue,
219
- column,
220
- row,
221
- items,
222
- _columnIndex
223
- })
224
- : formatText(itemValue, 1)
225
- ];
226
- }
227
- itemValue = XEUtils.get(row, column.field);
228
222
  return [
229
- footerFormatter
230
- ? formatFooterLabel(footerFormatter, {
231
- itemValue,
232
- column,
233
- row,
234
- items,
235
- _columnIndex
236
- })
237
- : formatText(itemValue, 1)
223
+ formatText(itemValue, 1)
238
224
  ];
239
225
  }
240
226
  function getDefaultCellLabel(params) {
@@ -383,11 +369,7 @@ export const Cell = {
383
369
  return Cell.renderTreeIcon(params, Cell.renderDefaultCell(params));
384
370
  },
385
371
  renderDefaultFooter(params) {
386
- return [
387
- h('span', {
388
- class: 'vxe-cell--item'
389
- }, getFooterContent(params))
390
- ];
372
+ return getFooterContent(params);
391
373
  },
392
374
  /**
393
375
  * 树节点
@@ -54,6 +54,16 @@ export const columnProps = {
54
54
  formatter: [Function, Array, String],
55
55
  // 格式化表尾显示内容
56
56
  footerFormatter: [Function, Array, String],
57
+ // 是否显示间距
58
+ padding: {
59
+ type: Boolean,
60
+ default: null
61
+ },
62
+ // 垂直对齐方式
63
+ verticalAlign: {
64
+ type: String,
65
+ default: null
66
+ },
57
67
  // 是否允许排序
58
68
  sortable: Boolean,
59
69
  // 自定义排序的属性
@@ -80,8 +90,10 @@ export const columnProps = {
80
90
  filterRender: Object,
81
91
  // 设置为树节点
82
92
  treeNode: Boolean,
83
- // 指定为树节点
93
+ // 设置为拖拽排序
84
94
  dragSort: Boolean,
95
+ // 设置为行高拖拽
96
+ rowResize: Boolean,
85
97
  // 是否可视
86
98
  visible: {
87
99
  type: Boolean,
@@ -70,6 +70,8 @@ export class ColumnInfo {
70
70
  footerClassName: _vm.footerClassName,
71
71
  formatter: formatter,
72
72
  footerFormatter: _vm.footerFormatter,
73
+ padding: _vm.padding,
74
+ verticalAlign: _vm.verticalAlign,
73
75
  sortable: _vm.sortable,
74
76
  sortBy: _vm.sortBy,
75
77
  sortType: _vm.sortType,
@@ -81,6 +83,7 @@ export class ColumnInfo {
81
83
  filterRender: _vm.filterRender,
82
84
  treeNode: _vm.treeNode,
83
85
  dragSort: _vm.dragSort,
86
+ rowResize: _vm.rowResize,
84
87
  cellType: _vm.cellType,
85
88
  cellRender: _vm.cellRender,
86
89
  editRender: _vm.editRender,
@@ -35,6 +35,8 @@ export default [
35
35
  'filter-visible',
36
36
  'clear-filter',
37
37
  'resizable-change',
38
+ 'column-resizable-change',
39
+ 'row-resizable-change',
38
40
  'toggle-row-expand',
39
41
  'toggle-tree-expand',
40
42
  'menu-click',