vxe-table 3.22.12 → 3.23.0-beta.0

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 (57) 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/edit/mixin.js +57 -20
  6. package/es/table/module/keyboard/mixin.js +2 -2
  7. package/es/table/render/index.js +130 -23
  8. package/es/table/src/cell.js +12 -20
  9. package/es/table/src/methods.js +38 -28
  10. package/es/table/src/table.js +1 -1
  11. package/es/table/style.css +9 -0
  12. package/es/table/style.min.css +1 -1
  13. package/es/ui/index.js +4 -2
  14. package/es/ui/src/log.js +1 -1
  15. package/es/vxe-table/style.css +9 -0
  16. package/es/vxe-table/style.min.css +1 -1
  17. package/lib/index.css +1 -1
  18. package/lib/index.min.css +1 -1
  19. package/lib/index.umd.js +368 -161
  20. package/lib/index.umd.min.js +1 -1
  21. package/lib/style.css +1 -1
  22. package/lib/style.min.css +1 -1
  23. package/lib/table/module/edit/mixin.js +72 -24
  24. package/lib/table/module/edit/mixin.min.js +1 -1
  25. package/lib/table/module/keyboard/mixin.js +2 -2
  26. package/lib/table/module/keyboard/mixin.min.js +1 -1
  27. package/lib/table/render/index.js +171 -26
  28. package/lib/table/render/index.min.js +1 -1
  29. package/lib/table/src/cell.js +8 -16
  30. package/lib/table/src/cell.min.js +1 -1
  31. package/lib/table/src/methods.js +16 -16
  32. package/lib/table/src/methods.min.js +1 -1
  33. package/lib/table/src/table.js +1 -1
  34. package/lib/table/src/table.min.js +1 -1
  35. package/lib/table/style/style.css +9 -0
  36. package/lib/table/style/style.min.css +1 -1
  37. package/lib/ui/index.js +4 -2
  38. package/lib/ui/index.min.js +1 -1
  39. package/lib/ui/src/log.js +1 -1
  40. package/lib/ui/src/log.min.js +1 -1
  41. package/lib/vxe-table/style/style.css +9 -0
  42. package/lib/vxe-table/style/style.min.css +1 -1
  43. package/package.json +2 -2
  44. package/packages/table/module/edit/mixin.ts +83 -25
  45. package/packages/table/module/keyboard/mixin.ts +2 -2
  46. package/packages/table/render/index.ts +144 -25
  47. package/packages/table/src/cell.ts +12 -20
  48. package/packages/table/src/methods.ts +38 -28
  49. package/packages/table/src/table.ts +1 -1
  50. package/packages/ui/index.ts +3 -1
  51. package/styles/components/table.scss +18 -0
  52. /package/es/{iconfont.1786589170707.ttf → iconfont.1786796852436.ttf} +0 -0
  53. /package/es/{iconfont.1786589170707.woff → iconfont.1786796852436.woff} +0 -0
  54. /package/es/{iconfont.1786589170707.woff2 → iconfont.1786796852436.woff2} +0 -0
  55. /package/lib/{iconfont.1786589170707.ttf → iconfont.1786796852436.ttf} +0 -0
  56. /package/lib/{iconfont.1786589170707.woff → iconfont.1786796852436.woff} +0 -0
  57. /package/lib/{iconfont.1786589170707.woff2 → iconfont.1786796852436.woff2} +0 -0
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "vxe-table",
3
- "version": "3.22.12",
3
+ "version": "3.23.0-beta.0",
4
4
  "description": "A PC-end table component based on Vxe UI, supporting copy-paste, data pivot table, and high-performance virtual list table solution.",
5
5
  "scripts": {
6
6
  "update": "npm install --legacy-peer-deps",
@@ -65,7 +65,7 @@
65
65
  "vue-i18n": "^8.15.1",
66
66
  "vue-router": "^3.5.1",
67
67
  "vue-template-compiler": "2.6.14",
68
- "vxe-pc-ui": "3.16.27"
68
+ "vxe-pc-ui": "3.17.1"
69
69
  },
70
70
  "vetur": {
71
71
  "tags": "helper/vetur/tags.json",
@@ -5,7 +5,7 @@ import { getCellValue, setCellValue, getRowid } from '../../src/util'
5
5
  import { removeClass, addClass } from '../../../ui/src/dom'
6
6
  import { createComponentLog } from '../../../ui/src/log'
7
7
 
8
- import type { VxeTableConstructor, TableInternalData, VxeTableDefines, TableReactData, VxeTablePrivateMethods } from '../../../../types'
8
+ import type { VxeTableConstructor, TableInternalData, VxeTableDefines, TableReactData, VxeTablePrivateMethods, VxeGlobalRendererHandles } from '../../../../types'
9
9
 
10
10
  const { warnLog, errLog } = createComponentLog('table')
11
11
 
@@ -387,7 +387,18 @@ function handleClearEdit ($xeTable: VxeTableConstructor & VxeTablePrivateMethods
387
387
  return $xeTable.$nextTick().then(() => $xeTable.updateCellAreas())
388
388
  }
389
389
 
390
- function handleEditActive ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, params: any, evnt: Event | null, options: {
390
+ function handleEditActive ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, params: {
391
+ $table: VxeTableConstructor
392
+ column: VxeTableDefines.ColumnInfo
393
+ columnIndex: number
394
+ _columnIndex: number
395
+ $columnIndex: number
396
+ rowIndex: number
397
+ $rowIndex: number
398
+ _rowIndex: number
399
+ row: any
400
+ cell?: HTMLElement
401
+ }, evnt: Event | null, options: {
391
402
  isClear?: boolean
392
403
  isFocus?: boolean
393
404
  isPos?: boolean
@@ -395,6 +406,7 @@ function handleEditActive ($xeTable: VxeTableConstructor & VxeTablePrivateMethod
395
406
  const props = $xeTable
396
407
  const reactData = $xeTable as unknown as TableReactData
397
408
  const $xeGrid = $xeTable.$xeGrid
409
+ const $xeGantt = $xeTable.$xeGantt
398
410
 
399
411
  const { editConfig, mouseConfig } = props
400
412
  const { editStore, tableColumn } = reactData
@@ -404,16 +416,16 @@ function handleEditActive ($xeTable: VxeTableConstructor & VxeTablePrivateMethod
404
416
  const { row, column } = params
405
417
  const { editRender } = column
406
418
  const { isFocus, isPos, isClear } = options
407
- const cell = (params.cell || $xeTable.getCellElement(row, column))
419
+ const cell = (params.cell || $xeTable.getCellElement(row, column)) as HTMLElement
408
420
  const beforeEditMethod = editOpts.beforeEditMethod || editOpts.activeMethod
409
- params.cell = cell
421
+ const editParams = { ...params, cell }
410
422
  if (cell && isEnableConf(editConfig) && isEnableConf(editRender)) {
411
423
  // 激活编辑
412
424
  if (!$xeTable.isPendingByRow(row) && !$xeTable.isAggregateRecord(row)) {
413
425
  if (actived.row !== row || (mode === 'cell' ? actived.column !== column : false)) {
414
426
  // 判断是否禁用编辑
415
427
  let type: 'edit-disabled' | 'edit-activated' = 'edit-disabled'
416
- if (!beforeEditMethod || beforeEditMethod({ ...params, $table: $xeTable, $grid: $xeGrid })) {
428
+ if (!beforeEditMethod || beforeEditMethod({ ...editParams, $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt })) {
417
429
  if (mouseConfig) {
418
430
  $xeTable.clearSelected()
419
431
  if ($xeTable.clearCellAreas) {
@@ -427,7 +439,7 @@ function handleEditActive ($xeTable: VxeTableConstructor & VxeTablePrivateMethod
427
439
  }
428
440
  type = 'edit-activated'
429
441
  column.renderHeight = cell.offsetHeight
430
- actived.args = params
442
+ actived.args = editParams
431
443
  actived.row = row
432
444
  actived.column = column
433
445
  $xeTable.handlePushStack()
@@ -442,10 +454,10 @@ function handleEditActive ($xeTable: VxeTableConstructor & VxeTablePrivateMethod
442
454
  const afterEditMethod = editOpts.afterEditMethod
443
455
  $xeTable.$nextTick(() => {
444
456
  if (isFocus) {
445
- $xeTable.handleFocus(params, evnt)
457
+ $xeTable.handleFocus(editParams, evnt)
446
458
  }
447
459
  if (afterEditMethod) {
448
- afterEditMethod({ ...params, $table: $xeTable, $grid: $xeGrid })
460
+ afterEditMethod({ ...editParams, $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt })
449
461
  }
450
462
  })
451
463
  }
@@ -488,11 +500,11 @@ function handleEditActive ($xeTable: VxeTableConstructor & VxeTablePrivateMethod
488
500
  }
489
501
  }
490
502
  column.renderHeight = cell.offsetHeight
491
- actived.args = params
503
+ actived.args = editParams
492
504
  actived.column = column
493
505
  if (isPos) {
494
506
  setTimeout(() => {
495
- $xeTable.handleFocus(params, evnt)
507
+ $xeTable.handleFocus(editParams, evnt)
496
508
  })
497
509
  }
498
510
  }
@@ -522,8 +534,12 @@ function handleEditCell ($xeTable: VxeTableConstructor & VxeTablePrivateMethods,
522
534
  handleEditActive($xeTable, {
523
535
  row,
524
536
  rowIndex: $xeTable.getRowIndex(row),
537
+ $rowIndex: $xeTable.getVMRowIndex(row),
538
+ _rowIndex: $xeTable.getVTRowIndex(row),
525
539
  column,
526
540
  columnIndex: $xeTable.getColumnIndex(column),
541
+ $columnIndex: $xeTable.getVMColumnIndex(column),
542
+ _columnIndex: $xeTable.getVTColumnIndex(column),
527
543
  cell,
528
544
  $table: $xeTable
529
545
  }, null, options)
@@ -948,32 +964,34 @@ export default {
948
964
  const { editStore } = reactData
949
965
  return editStore.actived.row === row
950
966
  },
951
- /**
952
- * 处理聚焦
953
- */
954
- handleFocus (params: any) {
967
+ handleCellFocus (cell: HTMLElement, params: {
968
+ $table: VxeTableConstructor
969
+ column: VxeTableDefines.ColumnInfo
970
+ row: any
971
+ }) {
955
972
  const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
973
+ const props = $xeTable
956
974
 
957
- const { row, column, cell } = params
975
+ const { editConfig } = props
976
+ const { column } = params
958
977
  const { editRender } = column
959
978
  const editOpts = $xeTable.computeEditOpts
960
- if (isEnableConf(editRender)) {
961
- const browseObj = XEUtils.browse()
979
+ if (editConfig && isEnableConf(editRender)) {
962
980
  const compRender = renderer.get(editRender.name)
963
- let autoFocus = editRender.autofocus || editRender.autoFocus
981
+ let autoFocus: boolean | string | ((params: VxeGlobalRendererHandles.TableAutoFocusParams) => HTMLElement | null) | null | undefined = editRender.autofocus || editRender.autoFocus
964
982
  let autoSelect = editRender.autoSelect || editRender.autoselect
965
- let inputElem
983
+ let inputElem: HTMLElement | null = null
966
984
  // 是否启用聚焦
967
985
  if (editOpts.autoFocus) {
968
986
  if (!autoFocus && compRender) {
969
- autoFocus = compRender.tableAutoFocus || compRender.tableAutofocus || (compRender as any).autoFocus || compRender.autofocus
987
+ autoFocus = compRender.tableAutoFocus || compRender.tableAutofocus || compRender.autofocus
970
988
  }
971
989
  if (!autoSelect && compRender) {
972
- autoSelect = compRender.tableAutoSelect || (compRender as any).autoSelect || compRender.autoselect
990
+ autoSelect = compRender.tableAutoSelect || compRender.autoselect
973
991
  }
974
992
  // 如果指定了聚焦 class
975
993
  if (XEUtils.isFunction(autoFocus)) {
976
- inputElem = autoFocus.call($xeTable, params)
994
+ inputElem = autoFocus(params)
977
995
  } else if (autoFocus) {
978
996
  if (autoFocus === true) {
979
997
  // 自动匹配模式,会自动匹配第一个可输入元素
@@ -986,13 +1004,35 @@ export default {
986
1004
  }
987
1005
  }
988
1006
  }
1007
+ return inputElem as HTMLInputElement
1008
+ }
1009
+ return null
1010
+ },
1011
+ /**
1012
+ * 处理聚焦
1013
+ */
1014
+ handleFocus (params: {
1015
+ $table: VxeTableConstructor<any>;
1016
+ column: VxeTableDefines.ColumnInfo<any>;
1017
+ row: any;
1018
+ cell: HTMLElement;
1019
+ }) {
1020
+ const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
1021
+
1022
+ const { row, column, cell } = params
1023
+ const { editRender } = column
1024
+ const editOpts = $xeTable.computeEditOpts
1025
+ if (isEnableConf(editRender)) {
1026
+ const browseObj = XEUtils.browse()
1027
+ const autoSelect = editRender.autoSelect || editRender.autoselect
1028
+ const inputElem = $xeTable.handleCellFocus(cell, params)
989
1029
  if (inputElem) {
990
1030
  if (autoSelect) {
991
1031
  inputElem.select()
992
1032
  } else {
993
1033
  // 保持一致行为,光标移到末端
994
1034
  if (browseObj.msie) {
995
- const textRange = inputElem.createTextRange()
1035
+ const textRange = (inputElem as any).createTextRange()
996
1036
  textRange.collapse(false)
997
1037
  textRange.select()
998
1038
  }
@@ -1073,13 +1113,18 @@ export default {
1073
1113
  if (rowIndex > -1) {
1074
1114
  const cell = $xeTable.getCellElement(row, column)
1075
1115
  const params = {
1116
+ $table: $xeTable,
1076
1117
  row,
1077
1118
  rowIndex,
1119
+ $rowIndex: $xeTable.getVMRowIndex(row),
1120
+ _rowIndex: $xeTable.getVTRowIndex(row),
1078
1121
  column,
1079
1122
  columnIndex: $xeTable.getColumnIndex(column),
1123
+ $columnIndex: $xeTable.getVMColumnIndex(column),
1124
+ _columnIndex: $xeTable.getVTColumnIndex(column),
1080
1125
  cell
1081
1126
  }
1082
- $xeTable.handleSelected(params, {})
1127
+ $xeTable.handleSelected(params, null)
1083
1128
  }
1084
1129
  }
1085
1130
  return $xeTable.$nextTick()
@@ -1092,7 +1137,7 @@ export default {
1092
1137
  const props = $xeTable
1093
1138
  const reactData = $xeTable as unknown as TableReactData
1094
1139
 
1095
- const { mouseConfig } = props
1140
+ const { mouseConfig, editConfig } = props
1096
1141
  const { editStore } = reactData
1097
1142
  const mouseOpts = $xeTable.computeMouseOpts
1098
1143
  const editOpts = $xeTable.computeEditOpts
@@ -1115,6 +1160,19 @@ export default {
1115
1160
  $xeTable.addCellSelectedClass()
1116
1161
  }
1117
1162
  $xeTable.focus()
1163
+ // 如果是支持可复用控件
1164
+ if (editConfig && editOpts.isReuseKeep && isEnableConf(editOpts) && isEnableConf(column.editRender)) {
1165
+ setTimeout(() => {
1166
+ const cell = $xeTable.getCellElement(row, column)
1167
+ if (cell) {
1168
+ const hasReusekeep = cell.querySelector('.vxe-reusekeep-control')
1169
+ if (hasReusekeep) {
1170
+ params.cell = cell
1171
+ $xeTable.handleCellFocus(cell, params)
1172
+ }
1173
+ }
1174
+ }, 0)
1175
+ }
1118
1176
  if (evnt) {
1119
1177
  $xeTable.dispatchEvent('cell-selected', params, evnt)
1120
1178
  }
@@ -494,8 +494,8 @@ export default {
494
494
  const checkboxOpts = $xeTable.computeCheckboxOpts
495
495
  const mouseOpts = $xeTable.computeMouseOpts
496
496
  const editOpts = $xeTable.computeEditOpts
497
- if (mouseConfig && mouseOpts.area && $xeTable.triggerCelllAreaMnEvent) {
498
- return $xeTable.triggerCelllAreaMnEvent(evnt, params)
497
+ if (mouseConfig && mouseOpts.area && $xeTable.triggerClAreaMnEvent) {
498
+ return $xeTable.triggerClAreaMnEvent(evnt, params)
499
499
  } else {
500
500
  if (checkboxConfig && checkboxOpts.range) {
501
501
  handleCheckboxRangeEvent($xeTable, evnt, params)
@@ -1,4 +1,4 @@
1
- import { CreateElement } from 'vue'
1
+ import { CreateElement, VNode } from 'vue'
2
2
  import XEUtils from 'xe-utils'
3
3
  import { VxeUI } from '../../ui'
4
4
  import { getCellValue, setCellValue } from '../src/util'
@@ -6,7 +6,7 @@ import { getFuncText, formatText, isEmptyValue } from '../../ui/src/utils'
6
6
  import { getOnName, getModelEvent, getChangeEvent, hasInputType } from '../../ui/src/vn'
7
7
  import { createComponentLog } from '../../ui/src/log'
8
8
 
9
- import type { VxeGlobalRendererHandles, VxeColumnPropTypes, VxeTableConstructor, VxeTablePrivateMethods, VxeTableDefines } from '../../../types'
9
+ import type { VxeGlobalRendererHandles, VxeColumnPropTypes, VxeTableConstructor, VxeTablePrivateMethods, VxeTableDefines, TableReactData } from '../../../types'
10
10
 
11
11
  const { errLog } = createComponentLog('table')
12
12
 
@@ -104,6 +104,7 @@ function getCellLabelVNs (h: CreateElement, renderOpts: VxeGlobalRendererHandles
104
104
  const { placeholder } = renderOpts
105
105
  return [
106
106
  h('span', {
107
+ key: 1,
107
108
  class: ['vxe-cell--label', opts ? opts.class : '']
108
109
  }, placeholder && isEmptyValue(cellLabel)
109
110
  ? [
@@ -384,22 +385,34 @@ function getNativeFilterOns (renderOpts: VxeGlobalRendererHandles.RenderTableFil
384
385
  })
385
386
  }
386
387
 
388
+ function nativeInputCellRender (h: CreateElement, renderOpts: VxeGlobalRendererHandles.RenderTableCellOptions, renderParams: VxeGlobalRendererHandles.RenderTableEditParams & { $table: VxeTableConstructor & VxeTablePrivateMethods }) {
389
+ const { row, column } = renderParams
390
+ const cellValue = XEUtils.get(row, column.field)
391
+ const cellVNs = [
392
+ h('span', {
393
+ key: 1
394
+ }, cellValue)
395
+ ]
396
+ return getNativeInputRenderCellVNs(h, cellValue, cellVNs, renderOpts, renderParams)
397
+ }
398
+
387
399
  /**
388
400
  * 单元格可编辑渲染-原生的标签
389
- * input、textarea、select
401
+ * input、textarea
390
402
  */
391
- function nativeEditRender (h: CreateElement, renderOpts: VxeGlobalRendererHandles.RenderTableEditOptions, params: any) {
392
- const { row, column } = params
403
+ function nativeInputEditRender (h: CreateElement, renderOpts: VxeGlobalRendererHandles.RenderTableEditOptions, renderParams: VxeGlobalRendererHandles.RenderTableEditParams) {
404
+ const { row, column } = renderParams
393
405
  const { name } = renderOpts
394
- const cellValue = isImmediateCell(renderOpts, params) ? getCellValue(row, column) : column.model.value
406
+ const cellValue = isImmediateCell(renderOpts, renderParams) ? getCellValue(row, column) : column.model.value
395
407
  return [
396
- h(`${name}`, {
408
+ h('' + name, {
409
+ key: 2,
397
410
  class: `vxe-default-${name}`,
398
411
  attrs: getNativeAttrs(renderOpts),
399
412
  domProps: {
400
413
  value: cellValue
401
414
  },
402
- on: getNativeEditOns(renderOpts, params)
415
+ on: getNativeEditOns(renderOpts, renderParams)
403
416
  })
404
417
  ]
405
418
  }
@@ -413,6 +426,18 @@ function buttonCellRender (h: CreateElement, renderOpts: VxeGlobalRendererHandle
413
426
  ]
414
427
  }
415
428
 
429
+ function defaultInputEditRender (h: CreateElement, renderOpts: VxeGlobalRendererHandles.RenderTableEditOptions, params: VxeGlobalRendererHandles.RenderEditParams & { $table: VxeTableConstructor & VxeTablePrivateMethods }) {
430
+ const { row, column } = params
431
+ const cellValue = getCellValue(row, column)
432
+ return [
433
+ h(getDefaultComponent(renderOpts), {
434
+ key: 2,
435
+ props: getCellEditProps(renderOpts, params, cellValue),
436
+ on: getEditOns(renderOpts, params)
437
+ })
438
+ ]
439
+ }
440
+
416
441
  function defaultEditRender (h: CreateElement, renderOpts: VxeGlobalRendererHandles.RenderTableEditOptions, params: VxeGlobalRendererHandles.RenderEditParams & { $table: VxeTableConstructor & VxeTablePrivateMethods }) {
417
442
  const { row, column } = params
418
443
  const cellValue = getCellValue(row, column)
@@ -736,11 +761,9 @@ function handleExportTreeSelectMethod (params: any) {
736
761
  return options.original ? getCellValue(row, column) : getTreeSelectCellValue(column.editRender || column.cellRender, params)
737
762
  }
738
763
 
739
- function handleNumberCell (h: CreateElement, renderOpts: VxeGlobalRendererHandles.RenderTableDefaultOptions, params: VxeGlobalRendererHandles.RenderTableDefaultParams) {
764
+ function handleNumberCell (h: CreateElement, cellValue: any, renderOpts: VxeGlobalRendererHandles.RenderTableDefaultOptions, params: VxeGlobalRendererHandles.RenderTableDefaultParams) {
740
765
  const { props = {}, showNegativeStatus } = renderOpts
741
- const { row, column } = params
742
766
  const { type } = props
743
- let cellValue = XEUtils.get(row, column.field)
744
767
  let isNegative = false
745
768
  if (!isEmptyValue(cellValue)) {
746
769
  const numberInputConfig = getConfig().numberInput || {}
@@ -891,20 +914,100 @@ function handleSetTreeSelectValue (renderOpts: VxeGlobalRendererHandles.RenderTa
891
914
  }
892
915
  }
893
916
 
917
+ function getNativeInputRenderCellVNs (h: CreateElement, cellValue: any, labelVNs: VNode[], renderOpts: VxeGlobalRendererHandles.RenderTableDefaultOptions, renderParams: VxeGlobalRendererHandles.RenderTableEditParams & { $table: VxeTableConstructor & VxeTablePrivateMethods }) {
918
+ const { $table, row, column } = renderParams
919
+ const { name } = renderOpts
920
+ const tableProps = $table
921
+ const { editConfig, mouseConfig } = tableProps
922
+ let isColSelected = false
923
+ let isActiveCellArea = false
924
+ if (editConfig && mouseConfig) {
925
+ const tableReactData = $table as unknown as TableReactData
926
+ const { editStore } = tableReactData
927
+ const { selected } = editStore
928
+ isColSelected = row === selected.row && column === selected.column
929
+ if ($table.getActiveCellArea) {
930
+ const activeCellArea = $table.getActiveCellArea()
931
+ if (activeCellArea) {
932
+ isActiveCellArea = row === activeCellArea.row && column === activeCellArea.column
933
+ }
934
+ }
935
+ }
936
+ const cellVNs = labelVNs
937
+ if (isActiveCellArea || isColSelected) {
938
+ cellVNs.push(
939
+ h('' + name, {
940
+ key: 2,
941
+ class: `vxe-default-${name} vxe-reusekeep-control`,
942
+ attrs: getNativeAttrs(renderOpts),
943
+ domProps: {
944
+ value: cellValue
945
+ },
946
+ on: getNativeEditOns(renderOpts, renderParams)
947
+ })
948
+ )
949
+ }
950
+ return cellVNs
951
+ }
952
+
953
+ function getInputRenderCellVNs (h: CreateElement, cellValue: any, labelVNs: VNode[], renderOpts: VxeGlobalRendererHandles.RenderTableDefaultOptions, renderParams: VxeGlobalRendererHandles.RenderTableEditParams & { $table: VxeTableConstructor & VxeTablePrivateMethods }) {
954
+ const { $table, row, column } = renderParams
955
+ const tableProps = $table
956
+ const { editConfig, mouseConfig } = tableProps
957
+ let isColSelected = false
958
+ let isActiveCellArea = false
959
+ if (editConfig && mouseConfig) {
960
+ const tableReactData = $table as unknown as TableReactData
961
+ const { editStore } = tableReactData
962
+ const editOpts = $table.computeEditOpts
963
+ if (editOpts.isReuseKeep) {
964
+ const { selected } = editStore
965
+ isColSelected = row === selected.row && column === selected.column
966
+ if ($table.getActiveCellArea) {
967
+ const activeCellArea = $table.getActiveCellArea()
968
+ if (activeCellArea) {
969
+ isActiveCellArea = row === activeCellArea.row && column === activeCellArea.column
970
+ }
971
+ }
972
+ }
973
+ }
974
+ const cellVNs = labelVNs
975
+ if (isActiveCellArea || isColSelected) {
976
+ const compProps = getCellEditProps(renderOpts, renderParams, cellValue)
977
+ const { className, inputClassName } = compProps
978
+ cellVNs.push(
979
+ h(getDefaultComponent(renderOpts), {
980
+ key: 2,
981
+ props: {
982
+ ...compProps,
983
+ className: 'vxe-reusekeep-control' + (className ? (' ' + className) : ''),
984
+ inputClassName: 'vxe-reusekeep-control' + (inputClassName ? (' ' + inputClassName) : '')
985
+ },
986
+ on: getEditOns(renderOpts, renderParams)
987
+ })
988
+ )
989
+ }
990
+ return cellVNs
991
+ }
992
+
894
993
  /**
895
994
  * 表格 - 渲染器
896
995
  */
897
996
  renderer.mixin({
898
997
  input: {
899
998
  tableAutoFocus: true,
900
- renderTableEdit: nativeEditRender,
901
- renderTableDefault: nativeEditRender,
999
+ renderTableEdit: nativeInputEditRender,
1000
+ renderTableCell: nativeInputCellRender,
1001
+ renderTableDefault: nativeInputEditRender,
1002
+ createTableFilterOptions: defaultFilterOptions,
902
1003
  renderTableFilter: nativeFilterRender,
903
1004
  tableFilterDefaultMethod: handleInputFilterMethod
904
1005
  },
905
1006
  textarea: {
906
1007
  tableAutoFocus: true,
907
- renderTableEdit: nativeEditRender
1008
+ renderTableEdit: nativeInputEditRender,
1009
+ renderTableCell: nativeInputCellRender,
1010
+ renderTableDefault: nativeInputEditRender
908
1011
  },
909
1012
  select: {
910
1013
  renderTableEdit: nativeSelectEditRender,
@@ -949,10 +1052,10 @@ renderer.mixin({
949
1052
  },
950
1053
  VxeInput: {
951
1054
  tableAutoFocus: true,
952
- renderTableEdit: defaultEditRender,
953
- renderTableCell (h, renderOpts, params) {
1055
+ renderTableEdit: defaultInputEditRender,
1056
+ renderTableCell (h, renderOpts, renderParams: VxeGlobalRendererHandles.RenderTableEditParams & { $table: VxeTableConstructor & VxeTablePrivateMethods }) {
954
1057
  const { props = {} } = renderOpts
955
- const { row, column } = params
1058
+ const { row, column } = renderParams
956
1059
  const inputConfig = getConfig().input || {}
957
1060
  const digits = props.digits || inputConfig.digits || 2
958
1061
  let cellValue = XEUtils.get(row, column.field)
@@ -970,16 +1073,21 @@ renderer.mixin({
970
1073
  break
971
1074
  }
972
1075
  }
973
- return getCellLabelVNs(h, renderOpts, params, cellValue)
1076
+ const cellVNs = getCellLabelVNs(h, renderOpts, renderParams, cellValue)
1077
+ return getInputRenderCellVNs(h, cellValue, cellVNs, renderOpts, renderParams)
974
1078
  },
975
- renderTableDefault: defaultEditRender,
1079
+ renderTableDefault: defaultInputEditRender,
976
1080
  createTableFilterOptions: defaultFilterOptions,
977
1081
  renderTableFilter: defaultFilterRender,
978
1082
  renderTableFloatingFilter: defaultFloatingFilterRender,
979
1083
  tableFilterDefaultMethod: handleInputFilterMethod
980
1084
  },
981
1085
  FormatNumberInput: {
982
- renderTableDefault: handleNumberCell,
1086
+ renderTableDefault (h, renderOpts, renderParams) {
1087
+ const { row, column } = renderParams
1088
+ const cellValue = XEUtils.get(row, column.field)
1089
+ return handleNumberCell(h, cellValue, renderOpts, renderParams)
1090
+ },
983
1091
  tableFilterDefaultMethod ({ option, row, column }) {
984
1092
  const { data } = option
985
1093
  const cellValue = XEUtils.get(row, column.field)
@@ -994,8 +1102,13 @@ renderer.mixin({
994
1102
  },
995
1103
  VxeNumberInput: {
996
1104
  tableAutoFocus: true,
997
- renderTableEdit: defaultEditRender,
998
- renderTableCell: handleNumberCell,
1105
+ renderTableEdit: defaultInputEditRender,
1106
+ renderTableCell (h, renderOpts, renderParams: VxeGlobalRendererHandles.RenderTableEditParams & { $table: VxeTableConstructor & VxeTablePrivateMethods }) {
1107
+ const { row, column } = renderParams
1108
+ const cellValue = XEUtils.get(row, column.field)
1109
+ const cellVNs = handleNumberCell(h, cellValue, renderOpts, renderParams)
1110
+ return getInputRenderCellVNs(h, cellValue, cellVNs, renderOpts, renderParams)
1111
+ },
999
1112
  renderTableFooter (h, renderOpts, params) {
1000
1113
  const { props = {} } = renderOpts
1001
1114
  const { row, column, _columnIndex } = params
@@ -1032,7 +1145,7 @@ renderer.mixin({
1032
1145
  }
1033
1146
  return getFuncText(itemValue, 1)
1034
1147
  },
1035
- renderTableDefault: defaultEditRender,
1148
+ renderTableDefault: defaultInputEditRender,
1036
1149
  createTableFilterOptions: defaultFilterOptions,
1037
1150
  renderTableFilter: defaultFilterRender,
1038
1151
  renderTableFloatingFilter: defaultFloatingFilterRender,
@@ -1180,8 +1293,14 @@ renderer.mixin({
1180
1293
  },
1181
1294
  VxeTextarea: {
1182
1295
  tableAutoFocus: true,
1183
- renderTableDefault: defaultEditRender,
1184
- renderTableEdit: defaultEditRender
1296
+ renderTableDefault: defaultInputEditRender,
1297
+ renderTableCell (h, renderOpts, renderParams: VxeGlobalRendererHandles.RenderTableEditParams & { $table: VxeTableConstructor & VxeTablePrivateMethods }) {
1298
+ const { row, column } = renderParams
1299
+ const cellValue = XEUtils.get(row, column.field)
1300
+ const cellVNs = getCellLabelVNs(h, renderOpts, renderParams, cellValue)
1301
+ return getInputRenderCellVNs(h, cellValue, cellVNs, renderOpts, renderParams)
1302
+ },
1303
+ renderTableEdit: defaultInputEditRender
1185
1304
  },
1186
1305
  VxeButton: {
1187
1306
  renderTableDefault: buttonCellRender
@@ -305,7 +305,11 @@ function renderHeaderHandle (h: CreateElement, params: VxeTableDefines.CellRende
305
305
  const { column, $table } = params
306
306
  const tableProps = $table
307
307
  const { editConfig } = tableProps
308
- const { type, filters, sortable, editRender } = column
308
+ const { type, filters, sortable, editRender, slots } = column
309
+ const headerSlot = slots ? slots.header : null
310
+ if (headerSlot) {
311
+ return renderTitleContent(h, params, $table.callSlot(headerSlot, params, h))
312
+ }
309
313
  switch (type) {
310
314
  case 'seq':
311
315
  return Cell.renderSeqHeader(h, params)
@@ -363,11 +367,7 @@ export const Cell = {
363
367
  const { $table, column } = params
364
368
  const tableProps = $table
365
369
  const { editConfig } = tableProps
366
- const { slots, editRender, cellRender } = column
367
- const headerSlot = slots ? slots.header : null
368
- if (headerSlot) {
369
- return renderTitleContent(h, params, $table.callSlot(headerSlot, params, h))
370
- }
370
+ const { editRender, cellRender } = column
371
371
  const isEnableEdit = editConfig && isEnableConf(editConfig)
372
372
  const editRenderOpts = isEnableEdit && isEnableConf(editRender) ? editRender : null
373
373
  const cellRenderOpts = isEnableConf(cellRender) ? cellRender : null
@@ -640,8 +640,7 @@ export const Cell = {
640
640
  */
641
641
  renderSeqHeader (h: CreateElement, params: VxeTableDefines.CellRenderHeaderParams & { $table: VxeTableConstructor & VxeTablePrivateMethods }) {
642
642
  const { $table, column } = params
643
- const { slots } = column
644
- return renderHeaderCellBaseVNs(h, params, renderTitleContent(h, params, slots && slots.header ? $table.callSlot(slots.header, params, h) : $table.getHeaderCellLabel(column)))
643
+ return renderHeaderCellBaseVNs(h, params, renderTitleContent(h, params, $table.getHeaderCellLabel(column)))
645
644
  },
646
645
  renderSeqCell (h: CreateElement, params: VxeTableDefines.CellRenderBodyParams & { $table: VxeTableConstructor & VxeTablePrivateMethods }) {
647
646
  const { $table, column } = params
@@ -668,16 +667,13 @@ export const Cell = {
668
667
  renderRadioHeader (h: CreateElement, params: VxeTableDefines.CellRenderHeaderParams & { $table: VxeTableConstructor & VxeTablePrivateMethods }) {
669
668
  const { $table, column } = params
670
669
  const { slots } = column
671
- const headerSlot = slots ? slots.header : null
672
670
  const titleSlot = slots ? slots.title : null
673
671
  return renderHeaderCellBaseVNs(h, params,
674
- renderTitleContent(h, params, headerSlot
675
- ? $table.callSlot(headerSlot, params, h)
676
- : [
677
- h('span', {
678
- class: 'vxe-radio--label'
679
- }, titleSlot ? $table.callSlot(titleSlot, params, h) : $table.getHeaderCellLabel(column))
680
- ])
672
+ renderTitleContent(h, params, [
673
+ h('span', {
674
+ class: 'vxe-radio--label'
675
+ }, titleSlot ? $table.callSlot(titleSlot, params, h) : $table.getHeaderCellLabel(column))
676
+ ])
681
677
  )
682
678
  },
683
679
  renderRadioCell (h: CreateElement, params: VxeTableDefines.CellRenderBodyParams & { $table: VxeTableConstructor & VxeTablePrivateMethods }) {
@@ -748,7 +744,6 @@ export const Cell = {
748
744
  const { isAllSelected: isAllCheckboxSelected, isIndeterminate: isAllCheckboxIndeterminate } = tableReactData
749
745
  const isAllCheckboxDisabled = $table.computeIsAllCheckboxDisabled
750
746
  const { slots } = column
751
- const headerSlot = slots ? slots.header : null
752
747
  const titleSlot = slots ? slots.title : null
753
748
  const checkboxOpts = $table.computeCheckboxOpts
754
749
  const { checkStrictly, showHeader, headerTitle } = checkboxOpts
@@ -762,9 +757,6 @@ export const Cell = {
762
757
  }
763
758
  }
764
759
  const checkboxParams = { ...params, checked: isAllCheckboxSelected, disabled: isAllCheckboxDisabled, indeterminate: isAllCheckboxIndeterminate }
765
- if (headerSlot) {
766
- return renderHeaderCellBaseVNs(h, params, renderTitleContent(h, checkboxParams, $table.callSlot(headerSlot, checkboxParams, h)))
767
- }
768
760
  if (checkStrictly ? !showHeader : showHeader === false) {
769
761
  return renderHeaderCellBaseVNs(h, params, renderTitleContent(h, checkboxParams, [
770
762
  h('span', {