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
@@ -2,6 +2,7 @@ import { defineComponent, TransitionGroup, h, ref, Ref, PropType, inject, nextTi
2
2
  import XEUtils from 'xe-utils'
3
3
  import { VxeUI } from '../../ui'
4
4
  import { updateCellTitle, getPropClass } from '../../ui/src/dom'
5
+ import { getCellHeight } from './util'
5
6
 
6
7
  import type { VxeTablePrivateMethods, VxeTableConstructor, VxeTableMethods, VxeTableDefines } from '../../../types'
7
8
 
@@ -47,7 +48,7 @@ export default defineComponent({
47
48
  const $xeTable = inject('$xeTable', {} as VxeTableConstructor & VxeTableMethods & VxeTablePrivateMethods)
48
49
 
49
50
  const { xID, props: tableProps, reactData: tableReactData, internalData: tableInternalData } = $xeTable
50
- const { computeTooltipOpts, computeColumnOpts, computeColumnDragOpts } = $xeTable.getComputeMaps()
51
+ const { computeTooltipOpts, computeColumnOpts, computeColumnDragOpts, computeCellOpts, computeFooterCellOpts, computeDefaultRowHeight } = $xeTable.getComputeMaps()
51
52
 
52
53
  const refElem = ref() as Ref<HTMLDivElement>
53
54
  const refFooterScroll = ref() as Ref<HTMLDivElement>
@@ -63,21 +64,27 @@ export default defineComponent({
63
64
  const { scrollXStore } = tableInternalData
64
65
  const tooltipOpts = computeTooltipOpts.value
65
66
  const columnOpts = computeColumnOpts.value
67
+ const defaultRowHeight = computeDefaultRowHeight.value
68
+ const cellOpts = computeCellOpts.value
69
+ const footerCellOpts = computeFooterCellOpts.value
70
+ const currCellHeight = getCellHeight(footerCellOpts.height || cellOpts.height) || defaultRowHeight
66
71
 
67
72
  return tableColumn.map((column, $columnIndex) => {
68
73
  const { type, showFooterOverflow, footerAlign, align, footerClassName, editRender, cellRender } = column
74
+ const colid = column.id
69
75
  const renderOpts = editRender || cellRender
70
76
  const compConf = renderOpts ? renderer.get(renderOpts.name) : null
71
77
  const showAllTip = tooltipOpts.showAll
72
78
  const isColGroup = column.children && column.children.length
73
79
  const fixedHiddenColumn = fixedType ? column.fixed !== fixedType && !isColGroup : column.fixed && overflowX
80
+ const isPadding = XEUtils.isBoolean(footerCellOpts.padding) ? footerCellOpts.padding : cellOpts.padding
74
81
  const footOverflow = XEUtils.eqNull(showFooterOverflow) ? allColumnFooterOverflow : showFooterOverflow
75
82
  const footAlign = footerAlign || (compConf ? compConf.tableFooterCellAlign : '') || allFooterAlign || align || (compConf ? compConf.tableCellAlign : '') || allAlign
76
83
  let showEllipsis = footOverflow === 'ellipsis'
77
84
  const showTitle = footOverflow === 'title'
78
85
  const showTooltip = footOverflow === true || footOverflow === 'tooltip'
79
86
  let hasEllipsis = showTitle || showTooltip || showEllipsis
80
- const attrs: any = { colid: column.id }
87
+ const attrs: any = { colid }
81
88
  const tfOns: any = {}
82
89
  const columnIndex = $xeTable.getColumnIndex(column)
83
90
  const _columnIndex = $xeTable.getVTColumnIndex(column)
@@ -153,20 +160,29 @@ export default defineComponent({
153
160
  attrs.colspan = colspan
154
161
  }
155
162
  }
163
+ const isLastColumn = $columnIndex === tableColumn.length - 1
156
164
  const isAutoCellWidth = !column.resizeWidth && (column.minWidth === 'auto' || column.width === 'auto')
157
165
 
158
- let isPreLoadStatus = false
159
- if (scrollXLoad && !column.fixed && (_columnIndex < scrollXStore.visibleStartIndex || _columnIndex > scrollXStore.visibleEndIndex)) {
160
- isPreLoadStatus = true
166
+ let isVNPreEmptyStatus = false
167
+ if (scrollXLoad && !column.fixed && (_columnIndex < scrollXStore.visibleStartIndex - scrollXStore.preloadSize || _columnIndex > scrollXStore.visibleEndIndex + scrollXStore.preloadSize)) {
168
+ isVNPreEmptyStatus = true
169
+ }
170
+
171
+ const tcStyle: Record<string, string> = {}
172
+ if (hasEllipsis) {
173
+ tcStyle.height = `${currCellHeight}px`
174
+ } else {
175
+ tcStyle.minHeight = `${currCellHeight}px`
161
176
  }
162
177
 
163
178
  return h('td', {
164
179
  class: ['vxe-footer--column', column.id, {
165
180
  [`col--${footAlign}`]: footAlign,
166
181
  [`col--${type}`]: type,
167
- 'col--last': $columnIndex === tableColumn.length - 1,
182
+ 'col--last': isLastColumn,
168
183
  'fixed--width': !isAutoCellWidth,
169
184
  'fixed--hidden': fixedHiddenColumn,
185
+ 'is--padding': isPadding,
170
186
  'col--ellipsis': hasEllipsis,
171
187
  'col--current': currentColumn === column
172
188
  }, getPropClass(footerClassName, cellParams), getPropClass(footerCellClassName, cellParams)],
@@ -180,8 +196,16 @@ export default defineComponent({
180
196
  'c--title': showTitle,
181
197
  'c--tooltip': showTooltip,
182
198
  'c--ellipsis': showEllipsis
183
- }]
184
- }, isPreLoadStatus ? [] : column.renderFooter(cellParams))
199
+ }],
200
+ style: tcStyle
201
+ }, isVNPreEmptyStatus
202
+ ? []
203
+ : [
204
+ h('div', {
205
+ colid,
206
+ class: 'vxe-cell--wrapper'
207
+ }, column.renderFooter(cellParams))
208
+ ])
185
209
  ])
186
210
  })
187
211
  }
@@ -1,12 +1,11 @@
1
1
  import { defineComponent, TransitionGroup, h, ref, Ref, PropType, inject, nextTick, watch, onMounted, onUnmounted } from 'vue'
2
2
  import XEUtils from 'xe-utils'
3
3
  import { VxeUI } from '../../ui'
4
- import { convertHeaderColumnToRows, getColReMinWidth, getRefElem } from './util'
5
- import { hasClass, getOffsetPos, addClass, removeClass } from '../../ui/src/dom'
4
+ import { getCellHeight, convertHeaderColumnToRows } from './util'
6
5
 
7
6
  import type { VxeTablePrivateMethods, VxeTableConstructor, VxeTableMethods, VxeTableDefines, VxeColumnPropTypes } from '../../../types'
8
7
 
9
- const { getI18n, renderer, renderEmptyElement } = VxeUI
8
+ const { renderer, renderEmptyElement } = VxeUI
10
9
 
11
10
  const renderType = 'header'
12
11
 
@@ -26,8 +25,7 @@ export default defineComponent({
26
25
  const $xeTable = inject('$xeTable', {} as VxeTableConstructor & VxeTableMethods & VxeTablePrivateMethods)
27
26
 
28
27
  const { xID, props: tableProps, reactData: tableReactData, internalData: tableInternalData } = $xeTable
29
- const { refElem: tableRefElem, refLeftContainer, refRightContainer, refCellResizeBar, refCellResizeTip } = $xeTable.getRefMaps()
30
- const { computeColumnOpts, computeColumnDragOpts, computeResizableOpts } = $xeTable.getComputeMaps()
28
+ const { computeColumnOpts, computeColumnDragOpts, computeCellOpts, computeMouseOpts, computeHeaderCellOpts, computeDefaultRowHeight } = $xeTable.getComputeMaps()
31
29
 
32
30
  const headerColumn = ref([] as VxeTableDefines.ColumnInfo[][])
33
31
 
@@ -44,130 +42,6 @@ export default defineComponent({
44
42
  headerColumn.value = isGroup ? convertHeaderColumnToRows(props.tableGroupColumn) : []
45
43
  }
46
44
 
47
- const resizeMousedownEvent = (evnt: MouseEvent, params: VxeTableDefines.CellRenderHeaderParams & { $table: VxeTableConstructor & VxeTablePrivateMethods }) => {
48
- const { column } = params
49
- const { fixedType } = props
50
- const { elemStore, visibleColumn } = tableInternalData
51
- const resizableOpts = computeResizableOpts.value
52
- const tableEl = tableRefElem.value
53
- const leftContainerElem = refLeftContainer.value
54
- const rightContainerElem = refRightContainer.value
55
- const resizeBarElem = refCellResizeBar.value
56
- const resizeTipElem = refCellResizeTip.value
57
- const { clientX: dragClientX } = evnt
58
- const wrapperElem = refElem.value
59
- const dragBtnElem = evnt.target as HTMLDivElement
60
- const cell = dragBtnElem.parentNode as HTMLTableCellElement
61
- const cellParams = Object.assign(params, { cell })
62
- let dragLeft = 0
63
- const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
64
- if (!bodyScrollElem) {
65
- return
66
- }
67
- const pos = getOffsetPos(dragBtnElem, wrapperElem)
68
- const dragBtnWidth = dragBtnElem.clientWidth
69
- const dragBtnOffsetWidth = Math.floor(dragBtnWidth / 2)
70
- const minInterval = getColReMinWidth(cellParams) - dragBtnOffsetWidth // 列之间的最小间距
71
- let dragMinLeft = pos.left - cell.clientWidth + dragBtnWidth + minInterval
72
- let dragPosLeft = pos.left + dragBtnOffsetWidth
73
- const domMousemove = document.onmousemove
74
- const domMouseup = document.onmouseup
75
- const isLeftFixed = fixedType === 'left'
76
- const isRightFixed = fixedType === 'right'
77
-
78
- // 计算左右侧固定列偏移量
79
- let fixedOffsetWidth = 0
80
- if (isLeftFixed || isRightFixed) {
81
- const siblingProp = isLeftFixed ? 'nextElementSibling' : 'previousElementSibling'
82
- let tempCellElem = cell[siblingProp] as HTMLTableCellElement
83
- while (tempCellElem) {
84
- if (hasClass(tempCellElem, 'fixed--hidden')) {
85
- break
86
- } else if (!hasClass(tempCellElem, 'col--group')) {
87
- fixedOffsetWidth += tempCellElem.offsetWidth
88
- }
89
- tempCellElem = tempCellElem[siblingProp] as HTMLTableCellElement
90
- }
91
- if (isRightFixed && rightContainerElem) {
92
- dragPosLeft = rightContainerElem.offsetLeft + fixedOffsetWidth
93
- }
94
- }
95
-
96
- // 处理拖动事件
97
- const updateEvent = function (evnt: MouseEvent) {
98
- evnt.stopPropagation()
99
- evnt.preventDefault()
100
- const offsetX = evnt.clientX - dragClientX
101
- let left = dragPosLeft + offsetX
102
- const scrollLeft = fixedType ? 0 : bodyScrollElem.scrollLeft
103
- if (isLeftFixed) {
104
- // 左固定列(不允许超过右侧固定列、不允许超过右边距)
105
- left = Math.min(left, (rightContainerElem ? rightContainerElem.offsetLeft : bodyScrollElem.clientWidth) - fixedOffsetWidth - minInterval)
106
- } else if (isRightFixed) {
107
- // 右侧固定列(不允许超过左侧固定列、不允许超过左边距)
108
- dragMinLeft = (leftContainerElem ? leftContainerElem.clientWidth : 0) + fixedOffsetWidth + minInterval
109
- left = Math.min(left, dragPosLeft + cell.clientWidth - minInterval)
110
- } else {
111
- dragMinLeft = Math.max(bodyScrollElem.scrollLeft, dragMinLeft)
112
- // left = Math.min(left, bodyScrollElem.clientWidth + bodyScrollElem.scrollLeft - 40)
113
- }
114
- dragLeft = Math.max(left, dragMinLeft)
115
- const resizeBarLeft = dragLeft - scrollLeft
116
- resizeBarElem.style.left = `${resizeBarLeft}px`
117
- if (resizableOpts.showDragTip && resizeTipElem) {
118
- const tableWidth = tableEl.clientWidth
119
- const wrapperRect = wrapperElem.getBoundingClientRect()
120
- const resizeBarWidth = resizeBarElem.clientWidth
121
- const resizeTipWidth = resizeTipElem.clientWidth
122
- const resizeTipHeight = resizeTipElem.clientHeight
123
- let resizeTipLeft = -resizeTipWidth
124
- if (resizeBarLeft < resizeTipWidth + resizeBarWidth) {
125
- resizeTipLeft = resizeTipWidth + resizeBarWidth - resizeBarLeft
126
- } else if (resizeBarLeft > tableWidth) {
127
- resizeTipLeft += tableWidth - resizeBarLeft
128
- }
129
- resizeTipElem.style.left = `${resizeTipLeft}px`
130
- resizeTipElem.style.top = `${Math.min(tableEl.clientHeight - resizeTipHeight, Math.max(0, evnt.clientY - wrapperRect.y - resizeTipHeight / 2))}px`
131
- resizeTipElem.textContent = getI18n('vxe.table.resizeColTip', [column.renderWidth + (isRightFixed ? dragPosLeft - dragLeft : dragLeft - dragPosLeft)])
132
- }
133
- }
134
-
135
- tableReactData._isResize = true
136
- addClass(tableEl, 'drag--resize')
137
- resizeBarElem.style.display = 'block'
138
- document.onmousemove = updateEvent
139
- document.onmouseup = function (evnt) {
140
- document.onmousemove = domMousemove
141
- document.onmouseup = domMouseup
142
- const resizeWidth = column.renderWidth + (isRightFixed ? dragPosLeft - dragLeft : dragLeft - dragPosLeft)
143
- column.resizeWidth = resizeWidth
144
- if (resizableOpts.dragMode === 'fixed') {
145
- visibleColumn.forEach(item => {
146
- if (item.id !== column.id) {
147
- if (!item.resizeWidth) {
148
- item.resizeWidth = item.renderWidth
149
- }
150
- }
151
- })
152
- }
153
- resizeBarElem.style.display = 'none'
154
- tableReactData._isResize = false
155
- tableInternalData._lastResizeTime = Date.now()
156
- $xeTable.analyColumnWidth()
157
- $xeTable.recalculate(true).then(() => {
158
- $xeTable.saveCustomStore('update:visible')
159
- $xeTable.updateCellAreas()
160
- $xeTable.dispatchEvent('resizable-change', { ...params, resizeWidth }, evnt)
161
- setTimeout(() => $xeTable.recalculate(true), 300)
162
- })
163
- removeClass(tableEl, 'drag--resize')
164
- }
165
- updateEvent(evnt)
166
- if ($xeTable.closeMenu) {
167
- $xeTable.closeMenu()
168
- }
169
- }
170
-
171
45
  const renderRows = (isGroup: boolean, isOptimizeMode: boolean, cols: VxeTableDefines.ColumnInfo[], $rowIndex: number) => {
172
46
  const { fixedType } = props
173
47
  const { resizable: allResizable, border, columnKey, headerCellClassName, headerCellStyle, showHeaderOverflow: allColumnHeaderOverflow, headerAlign: allHeaderAlign, align: allAlign, mouseConfig } = tableProps
@@ -175,6 +49,10 @@ export default defineComponent({
175
49
  const { scrollXStore } = tableInternalData
176
50
  const columnOpts = computeColumnOpts.value
177
51
  const columnDragOpts = computeColumnDragOpts.value
52
+ const cellOpts = computeCellOpts.value
53
+ const defaultRowHeight = computeDefaultRowHeight.value
54
+ const headerCellOpts = computeHeaderCellOpts.value
55
+ const currCellHeight = getCellHeight(headerCellOpts.height || cellOpts.height) || defaultRowHeight
178
56
  const { disabledMethod: dragDisabledMethod, isCrossDrag, isPeerDrag } = columnDragOpts
179
57
  return cols.map((column, $columnIndex) => {
180
58
  const { type, showHeaderOverflow, headerAlign, align, filters, headerClassName, editRender, cellRender } = column
@@ -183,6 +61,7 @@ export default defineComponent({
183
61
  const compConf = renderOpts ? renderer.get(renderOpts.name) : null
184
62
  const isColGroup = column.children && column.children.length
185
63
  const fixedHiddenColumn = fixedType ? (column.fixed !== fixedType && !isColGroup) : !!column.fixed && overflowX
64
+ const isPadding = XEUtils.isBoolean(headerCellOpts.padding) ? headerCellOpts.padding : cellOpts.padding
186
65
  const headOverflow = XEUtils.eqNull(showHeaderOverflow) ? allColumnHeaderOverflow : showHeaderOverflow
187
66
  const headAlign = headerAlign || (compConf ? compConf.tableHeaderCellAlign : '') || allHeaderAlign || align || (compConf ? compConf.tableCellAlign : '') || allAlign
188
67
  let showEllipsis = headOverflow === 'ellipsis'
@@ -197,7 +76,7 @@ export default defineComponent({
197
76
  }
198
77
  const columnIndex = $xeTable.getColumnIndex(column)
199
78
  const _columnIndex = $xeTable.getVTColumnIndex(column)
200
- const params: VxeTableDefines.CellRenderHeaderParams & {
79
+ const cellParams: VxeTableDefines.CellRenderHeaderParams & {
201
80
  $table: VxeTableConstructor & VxeTablePrivateMethods
202
81
  } = { $table: $xeTable, $grid: $xeTable.xegrid, $rowIndex, column, columnIndex, $columnIndex, _columnIndex, firstFilterOption, fixed: fixedType, type: renderType, isHidden: fixedHiddenColumn, hasFilter }
203
82
  const thAttrs: Record<string, string | number | null> = {
@@ -206,8 +85,8 @@ export default defineComponent({
206
85
  rowspan: column.rowSpan > 1 ? column.rowSpan : null
207
86
  }
208
87
  const thOns: any = {
209
- onClick: (evnt: MouseEvent) => $xeTable.triggerHeaderCellClickEvent(evnt, params),
210
- onDblclick: (evnt: MouseEvent) => $xeTable.triggerHeaderCellDblclickEvent(evnt, params)
88
+ onClick: (evnt: MouseEvent) => $xeTable.triggerHeaderCellClickEvent(evnt, cellParams),
89
+ onDblclick: (evnt: MouseEvent) => $xeTable.triggerHeaderCellDblclickEvent(evnt, cellParams)
211
90
  }
212
91
  // 横向虚拟滚动不支持动态行高
213
92
  if (scrollXLoad && !hasEllipsis) {
@@ -216,11 +95,11 @@ export default defineComponent({
216
95
  const isColDragCell = columnOpts.drag && columnDragOpts.trigger === 'cell'
217
96
  let isDisabledDrag = false
218
97
  if (isColDragCell) {
219
- isDisabledDrag = !!(dragDisabledMethod && dragDisabledMethod(params))
98
+ isDisabledDrag = !!(dragDisabledMethod && dragDisabledMethod(cellParams))
220
99
  }
221
100
  // 按下事件处理
222
101
  if (mouseConfig || isColDragCell) {
223
- thOns.onMousedown = (evnt: MouseEvent) => $xeTable.triggerHeaderCellMousedownEvent(evnt, params)
102
+ thOns.onMousedown = (evnt: MouseEvent) => $xeTable.triggerHeaderCellMousedownEvent(evnt, cellParams)
224
103
  }
225
104
  // 拖拽列事件
226
105
  if (columnOpts.drag) {
@@ -231,23 +110,33 @@ export default defineComponent({
231
110
  thOns.onMouseup = $xeTable.handleHeaderCellDragMouseupEvent
232
111
  }
233
112
  }
113
+ const isLastColumn = $columnIndex === cols.length - 1
114
+ const showResizable = (XEUtils.isBoolean(column.resizable) ? column.resizable : (columnOpts.resizable || allResizable))
234
115
  const isAutoCellWidth = !column.resizeWidth && (column.minWidth === 'auto' || column.width === 'auto')
235
116
 
236
- let isPreLoadStatus = false
237
- if (scrollXLoad && !isGroup && !column.fixed && (_columnIndex < scrollXStore.visibleStartIndex || _columnIndex > scrollXStore.visibleEndIndex)) {
238
- isPreLoadStatus = true
117
+ let isVNPreEmptyStatus = false
118
+ if (scrollXLoad && !column.fixed && (_columnIndex < scrollXStore.visibleStartIndex - scrollXStore.preloadSize || _columnIndex > scrollXStore.visibleEndIndex + scrollXStore.preloadSize)) {
119
+ isVNPreEmptyStatus = true
120
+ }
121
+
122
+ const tcStyle: Record<string, string> = {}
123
+ if (hasEllipsis) {
124
+ tcStyle.height = `${currCellHeight}px`
125
+ } else {
126
+ tcStyle.minHeight = `${currCellHeight}px`
239
127
  }
240
128
 
241
129
  return h('th', {
242
130
  class: ['vxe-header--column', colid, {
243
131
  [`col--${headAlign}`]: headAlign,
244
132
  [`col--${type}`]: type,
245
- 'col--last': $columnIndex === cols.length - 1,
133
+ 'col--last': isLastColumn,
246
134
  'col--fixed': column.fixed,
247
135
  'col--group': isColGroup,
248
136
  'col--ellipsis': hasEllipsis,
249
137
  'fixed--width': !isAutoCellWidth,
250
138
  'fixed--hidden': fixedHiddenColumn,
139
+ 'is--padding': isPadding,
251
140
  'is--sortable': column.sortable,
252
141
  'col--filter': !!filters,
253
142
  'is--filter-active': hasFilter,
@@ -255,10 +144,10 @@ export default defineComponent({
255
144
  'is--drag-disabled': isDisabledDrag,
256
145
  'col--current': currentColumn === column
257
146
  },
258
- headerClassName ? (XEUtils.isFunction(headerClassName) ? headerClassName(params) : headerClassName) : '',
259
- headerCellClassName ? (XEUtils.isFunction(headerCellClassName) ? headerCellClassName(params) : headerCellClassName) : ''
147
+ headerClassName ? (XEUtils.isFunction(headerClassName) ? headerClassName(cellParams) : headerClassName) : '',
148
+ headerCellClassName ? (XEUtils.isFunction(headerCellClassName) ? headerCellClassName(cellParams) : headerCellClassName) : ''
260
149
  ],
261
- style: headerCellStyle ? (XEUtils.isFunction(headerCellStyle) ? headerCellStyle(params) : headerCellStyle) : null,
150
+ style: headerCellStyle ? (XEUtils.isFunction(headerCellStyle) ? headerCellStyle(cellParams) : headerCellStyle) : null,
262
151
  ...thAttrs,
263
152
  ...thOns,
264
153
  key: columnKey || scrollXLoad || scrollYLoad || columnOpts.useKey || columnOpts.drag || isColGroup ? colid : $columnIndex
@@ -268,20 +157,28 @@ export default defineComponent({
268
157
  'c--title': showTitle,
269
158
  'c--tooltip': showTooltip,
270
159
  'c--ellipsis': showEllipsis
271
- }]
272
- }, isPreLoadStatus || (isOptimizeMode && fixedHiddenColumn) ? [] : column.renderHeader(params)),
160
+ }],
161
+ style: tcStyle
162
+ }, isVNPreEmptyStatus || (isOptimizeMode && fixedHiddenColumn)
163
+ ? []
164
+ : [
165
+ h('div', {
166
+ colid,
167
+ class: 'vxe-cell--wrapper'
168
+ }, column.renderHeader(cellParams))
169
+ ]),
273
170
  /**
274
171
  * 列宽拖动
275
172
  */
276
- !fixedHiddenColumn && !isColGroup && (XEUtils.isBoolean(column.resizable) ? column.resizable : (columnOpts.resizable || allResizable))
173
+ !fixedHiddenColumn && showResizable
277
174
  ? h('div', {
278
- class: ['vxe-resizable', {
175
+ class: ['vxe-cell--col-resizable', {
279
176
  'is--line': !border || border === 'none'
280
177
  }],
281
- onMousedown: (evnt: MouseEvent) => resizeMousedownEvent(evnt, params),
282
- onDblclick: (evnt: MouseEvent) => $xeTable.handleResizeDblclickEvent(evnt, params)
178
+ onMousedown: (evnt: MouseEvent) => $xeTable.handleColResizeMousedownEvent(evnt, fixedType, cellParams),
179
+ onDblclick: (evnt: MouseEvent) => $xeTable.handleColResizeDblclickEvent(evnt, cellParams)
283
180
  })
284
- : null
181
+ : renderEmptyElement($xeTable)
285
182
  ])
286
183
  })
287
184
  }
@@ -323,10 +220,11 @@ export default defineComponent({
323
220
 
324
221
  const renderVN = () => {
325
222
  const { fixedType, fixedColumn, tableColumn } = props
326
- const { showHeaderOverflow: allColumnHeaderOverflow, spanMethod, footerSpanMethod } = tableProps
223
+ const { mouseConfig, showHeaderOverflow: allColumnHeaderOverflow, spanMethod, footerSpanMethod } = tableProps
327
224
  const { isGroup, scrollXLoad, scrollYLoad, dragCol } = tableReactData
328
225
  const { visibleColumn, fullColumnIdData } = tableInternalData
329
226
 
227
+ const mouseOpts = computeMouseOpts.value
330
228
  let renderHeaderList = headerColumn.value
331
229
  let renderColumnList = tableColumn as VxeTableDefines.ColumnInfo[]
332
230
  let isOptimizeMode = false
@@ -423,15 +321,32 @@ export default defineComponent({
423
321
  h('thead', {
424
322
  ref: refHeaderTHead
425
323
  }, renderHeads(isGroup, isOptimizeMode, renderHeaderList))
426
- ])
427
- ]),
428
- /**
429
- * 其他
430
- */
431
- h('div', {
432
- ref: refHeaderBorderRepair,
433
- class: 'vxe-table--header-border-line'
434
- })
324
+ ]),
325
+ mouseConfig && mouseOpts.area
326
+ ? h('div', {
327
+ class: 'vxe-table--cell-area'
328
+ }, [
329
+ h('span', {
330
+ class: 'vxe-table--cell-main-area'
331
+ }),
332
+ h('span', {
333
+ class: 'vxe-table--cell-copy-area'
334
+ }),
335
+ h('span', {
336
+ class: 'vxe-table--cell-extend-area'
337
+ }),
338
+ h('span', {
339
+ class: 'vxe-table--cell-multi-area'
340
+ }),
341
+ h('span', {
342
+ class: 'vxe-table--cell-active-area'
343
+ }),
344
+ h('span', {
345
+ class: 'vxe-table--cell-col-status-area'
346
+ })
347
+ ])
348
+ : renderEmptyElement($xeTable)
349
+ ])
435
350
  ])
436
351
  }
437
352
 
@@ -34,10 +34,10 @@ export default {
34
34
  type: [Boolean, String] as PropType<VxeTablePropTypes.Border>,
35
35
  default: () => getConfig().table.border
36
36
  },
37
- // 单元格是否有边距
37
+ // 已废弃,被 cell-config.padding 替换
38
38
  padding: {
39
39
  type: Boolean as PropType<VxeTablePropTypes.Padding>,
40
- default: () => getConfig().table.padding
40
+ default: null
41
41
  },
42
42
  // 是否圆角边框
43
43
  round: {
@@ -185,6 +185,10 @@ export default {
185
185
  columnConfig: Object as PropType<VxeTablePropTypes.ColumnConfig>,
186
186
  // 单元格配置信息
187
187
  cellConfig: Object as PropType<VxeTablePropTypes.CellConfig>,
188
+ // 表头单元格配置信息
189
+ headerCellConfig: Object as PropType<VxeTablePropTypes.HeaderCellConfig>,
190
+ // 表尾单元格配置信息
191
+ footerCellConfig: Object as PropType<VxeTablePropTypes.FooterCellConfig>,
188
192
  // 行配置信息
189
193
  rowConfig: Object as PropType<VxeTablePropTypes.RowConfig>,
190
194
  // 已废弃,被 rowDragConfig 替换