vxe-table 3.11.26 → 3.11.27-beta.1

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 (151) hide show
  1. package/es/index.css +1 -1
  2. package/es/index.min.css +1 -1
  3. package/es/locale/lang/ar-EG.js +3 -3
  4. package/es/locale/lang/de-DE.js +3 -3
  5. package/es/locale/lang/en-US.js +3 -3
  6. package/es/locale/lang/es-ES.js +3 -3
  7. package/es/locale/lang/fr-FR.js +3 -3
  8. package/es/locale/lang/hu-HU.js +3 -3
  9. package/es/locale/lang/hy-AM.js +3 -3
  10. package/es/locale/lang/ja-JP.js +3 -3
  11. package/es/locale/lang/ko-KR.js +3 -3
  12. package/es/locale/lang/nb-NO.js +3 -3
  13. package/es/locale/lang/pt-BR.js +3 -3
  14. package/es/locale/lang/ru-RU.js +3 -3
  15. package/es/locale/lang/ug-CN.js +3 -3
  16. package/es/locale/lang/uk-UA.js +3 -3
  17. package/es/locale/lang/vi-VN.js +3 -3
  18. package/es/locale/lang/zh-CHT.js +3 -3
  19. package/es/locale/lang/zh-CN.js +3 -3
  20. package/es/style.css +1 -1
  21. package/es/style.min.css +1 -1
  22. package/es/table/module/custom/mixin.js +2 -0
  23. package/es/table/module/custom/panel.js +433 -231
  24. package/es/table/src/body.js +2 -2
  25. package/es/table/src/cell.js +2 -2
  26. package/es/table/src/column.js +10 -8
  27. package/es/table/src/group.js +37 -6
  28. package/es/table/src/methods.js +167 -73
  29. package/es/table/src/table.js +1 -1
  30. package/es/table/src/util.js +0 -1
  31. package/es/table/style.css +106 -37
  32. package/es/table/style.min.css +1 -1
  33. package/es/ui/index.js +1 -1
  34. package/es/ui/src/dom.js +1 -0
  35. package/es/ui/src/log.js +1 -1
  36. package/es/vxe-table/style.css +106 -37
  37. package/es/vxe-table/style.min.css +1 -1
  38. package/lib/index.css +1 -1
  39. package/lib/index.min.css +1 -1
  40. package/lib/index.umd.js +618 -260
  41. package/lib/index.umd.min.js +1 -1
  42. package/lib/locale/lang/ar-EG.js +3 -3
  43. package/lib/locale/lang/ar-EG.min.js +1 -1
  44. package/lib/locale/lang/de-DE.js +3 -3
  45. package/lib/locale/lang/de-DE.min.js +1 -1
  46. package/lib/locale/lang/en-US.js +3 -3
  47. package/lib/locale/lang/en-US.min.js +1 -1
  48. package/lib/locale/lang/en-US.umd.js +3 -3
  49. package/lib/locale/lang/es-ES.js +3 -3
  50. package/lib/locale/lang/es-ES.min.js +1 -1
  51. package/lib/locale/lang/es-ES.umd.js +3 -3
  52. package/lib/locale/lang/fr-FR.js +3 -3
  53. package/lib/locale/lang/fr-FR.min.js +1 -1
  54. package/lib/locale/lang/hu-HU.js +3 -3
  55. package/lib/locale/lang/hu-HU.min.js +1 -1
  56. package/lib/locale/lang/hu-HU.umd.js +3 -3
  57. package/lib/locale/lang/hy-AM.js +3 -3
  58. package/lib/locale/lang/hy-AM.min.js +1 -1
  59. package/lib/locale/lang/ja-JP.js +3 -3
  60. package/lib/locale/lang/ja-JP.min.js +1 -1
  61. package/lib/locale/lang/ja-JP.umd.js +3 -3
  62. package/lib/locale/lang/ko-KR.js +3 -3
  63. package/lib/locale/lang/ko-KR.min.js +1 -1
  64. package/lib/locale/lang/ko-KR.umd.js +3 -3
  65. package/lib/locale/lang/nb-NO.js +3 -3
  66. package/lib/locale/lang/nb-NO.min.js +1 -1
  67. package/lib/locale/lang/pt-BR.js +3 -3
  68. package/lib/locale/lang/pt-BR.min.js +1 -1
  69. package/lib/locale/lang/pt-BR.umd.js +3 -3
  70. package/lib/locale/lang/ru-RU.js +3 -3
  71. package/lib/locale/lang/ru-RU.min.js +1 -1
  72. package/lib/locale/lang/ru-RU.umd.js +3 -3
  73. package/lib/locale/lang/ug-CN.js +3 -3
  74. package/lib/locale/lang/ug-CN.min.js +1 -1
  75. package/lib/locale/lang/uk-UA.js +3 -3
  76. package/lib/locale/lang/uk-UA.min.js +1 -1
  77. package/lib/locale/lang/uk-UA.umd.js +3 -3
  78. package/lib/locale/lang/vi-VN.js +3 -3
  79. package/lib/locale/lang/vi-VN.min.js +1 -1
  80. package/lib/locale/lang/zh-CHT.js +3 -3
  81. package/lib/locale/lang/zh-CHT.min.js +1 -1
  82. package/lib/locale/lang/zh-CHT.umd.js +3 -3
  83. package/lib/locale/lang/zh-CN.js +3 -3
  84. package/lib/locale/lang/zh-CN.min.js +1 -1
  85. package/lib/locale/lang/zh-CN.umd.js +3 -3
  86. package/lib/style.css +1 -1
  87. package/lib/style.min.css +1 -1
  88. package/lib/table/module/custom/mixin.js +2 -0
  89. package/lib/table/module/custom/mixin.min.js +1 -1
  90. package/lib/table/module/custom/panel.js +369 -156
  91. package/lib/table/module/custom/panel.min.js +1 -1
  92. package/lib/table/src/body.js +2 -2
  93. package/lib/table/src/body.min.js +1 -1
  94. package/lib/table/src/cell.js +2 -1
  95. package/lib/table/src/cell.min.js +1 -1
  96. package/lib/table/src/column.js +11 -9
  97. package/lib/table/src/column.min.js +1 -1
  98. package/lib/table/src/group.js +39 -6
  99. package/lib/table/src/group.min.js +1 -1
  100. package/lib/table/src/methods.js +181 -74
  101. package/lib/table/src/methods.min.js +1 -1
  102. package/lib/table/src/table.js +1 -1
  103. package/lib/table/src/table.min.js +1 -1
  104. package/lib/table/src/util.js +0 -1
  105. package/lib/table/src/util.min.js +1 -1
  106. package/lib/table/style/style.css +106 -37
  107. package/lib/table/style/style.min.css +1 -1
  108. package/lib/ui/index.js +1 -1
  109. package/lib/ui/index.min.js +1 -1
  110. package/lib/ui/src/dom.js +2 -0
  111. package/lib/ui/src/dom.min.js +1 -1
  112. package/lib/ui/src/log.js +1 -1
  113. package/lib/ui/src/log.min.js +1 -1
  114. package/lib/vxe-table/style/style.css +106 -37
  115. package/lib/vxe-table/style/style.min.css +1 -1
  116. package/package.json +2 -2
  117. package/packages/locale/lang/ar-EG.ts +3 -3
  118. package/packages/locale/lang/de-DE.ts +3 -3
  119. package/packages/locale/lang/en-US.ts +3 -3
  120. package/packages/locale/lang/es-ES.ts +3 -3
  121. package/packages/locale/lang/fr-FR.ts +3 -3
  122. package/packages/locale/lang/hu-HU.ts +3 -3
  123. package/packages/locale/lang/hy-AM.ts +3 -3
  124. package/packages/locale/lang/ja-JP.ts +3 -3
  125. package/packages/locale/lang/ko-KR.ts +3 -3
  126. package/packages/locale/lang/nb-NO.ts +3 -3
  127. package/packages/locale/lang/pt-BR.ts +3 -3
  128. package/packages/locale/lang/ru-RU.ts +3 -3
  129. package/packages/locale/lang/ug-CN.ts +3 -3
  130. package/packages/locale/lang/uk-UA.ts +3 -3
  131. package/packages/locale/lang/vi-VN.ts +3 -3
  132. package/packages/locale/lang/zh-CHT.ts +3 -3
  133. package/packages/locale/lang/zh-CN.ts +3 -3
  134. package/packages/table/module/custom/mixin.ts +2 -0
  135. package/packages/table/module/custom/panel.ts +458 -234
  136. package/packages/table/src/body.ts +2 -2
  137. package/packages/table/src/cell.ts +2 -2
  138. package/packages/table/src/column.ts +10 -8
  139. package/packages/table/src/group.ts +40 -6
  140. package/packages/table/src/methods.ts +182 -86
  141. package/packages/table/src/table.ts +1 -1
  142. package/packages/table/src/util.ts +0 -1
  143. package/packages/ui/src/dom.ts +2 -0
  144. package/styles/components/table-module/custom.scss +92 -12
  145. package/styles/components/table.scss +5 -0
  146. /package/es/{iconfont.1733885890565.ttf → iconfont.1734000397391.ttf} +0 -0
  147. /package/es/{iconfont.1733885890565.woff → iconfont.1734000397391.woff} +0 -0
  148. /package/es/{iconfont.1733885890565.woff2 → iconfont.1734000397391.woff2} +0 -0
  149. /package/lib/{iconfont.1733885890565.ttf → iconfont.1734000397391.ttf} +0 -0
  150. /package/lib/{iconfont.1733885890565.woff → iconfont.1734000397391.woff} +0 -0
  151. /package/lib/{iconfont.1733885890565.woff2 → iconfont.1734000397391.woff2} +0 -0
@@ -323,7 +323,7 @@ function renderColumn (h: any, _vm: any, $xetable: any, seq: any, rowid: any, fi
323
323
  getClass(className, params),
324
324
  getClass(allCellClassName, params)
325
325
  ],
326
- key: columnKey || columnOpts.useKey || rowOpts.useKey ? column.id : $columnIndex,
326
+ key: columnKey || columnOpts.useKey || rowOpts.useKey || columnOpts.drag ? column.id : $columnIndex,
327
327
  attrs,
328
328
  style: Object.assign({
329
329
  height: cellHeight
@@ -453,7 +453,7 @@ function renderRows (h: CreateElement, _vm: any, $xeTable: any, fixedType: any,
453
453
  rowid
454
454
  },
455
455
  style: rowStyle ? (XEUtils.isFunction(rowStyle) ? rowStyle(params) : rowStyle) : null,
456
- key: rowKey || rowOpts.useKey || rowOpts.drag || treeConfig ? rowid : $rowIndex,
456
+ key: rowKey || rowOpts.useKey || rowOpts.drag || columnOpts.drag || treeConfig ? rowid : $rowIndex,
457
457
  nativeOn: trOn
458
458
  }, tdVNs)
459
459
  : h('tr', {
@@ -106,10 +106,10 @@ function renderHeaderCellDragIcon (h: CreateElement, params: VxeTableDefines.Cel
106
106
  const { $table, column } = params
107
107
  const columnOpts = $table.computeColumnOpts
108
108
  const columnDragOpts = $table.computeColumnDragOpts
109
- const { showIcon, icon, visibleMethod, disabledMethod } = columnDragOpts
109
+ const { showIcon, icon, isCrossDrag, visibleMethod, disabledMethod } = columnDragOpts
110
110
  const isDisabled = disabledMethod && disabledMethod(params)
111
111
  if (columnOpts.drag && showIcon && (!visibleMethod || visibleMethod(params))) {
112
- if (!(column.fixed || column.parentId)) {
112
+ if (!column.fixed && (isCrossDrag || !column.parentId)) {
113
113
  return h('span', {
114
114
  key: 'dg',
115
115
  class: ['vxe-cell--drag-handle', {
@@ -1,7 +1,8 @@
1
1
  import Cell from './cell'
2
+ import { defineVxeComponent } from '../../ui/src/comp'
2
3
  import { assembleColumn, destroyColumn } from './util'
3
4
 
4
- const props = {
5
+ export const columnProps = {
5
6
  // 列唯一主键
6
7
  colId: [String, Number],
7
8
  // 渲染类型 seq,radio,checkbox,expand,html
@@ -94,9 +95,9 @@ const props = {
94
95
  params: Object
95
96
  }
96
97
 
97
- const watch: any = {}
98
- Object.keys(props).forEach(name => {
99
- watch[name] = function (value: any) {
98
+ export const columnWatch: Record<string, any> = {}
99
+ Object.keys(columnProps).forEach(name => {
100
+ columnWatch[name] = function (value: any) {
100
101
  this.columnConfig.update(name, value)
101
102
  if (this.$xetable) {
102
103
  if (name === 'filters') {
@@ -109,9 +110,9 @@ Object.keys(props).forEach(name => {
109
110
  }
110
111
  })
111
112
 
112
- export default {
113
+ export default defineVxeComponent({
113
114
  name: 'VxeColumn',
114
- props,
115
+ props: columnProps,
115
116
  provide () {
116
117
  return {
117
118
  $xecolumn: this,
@@ -126,11 +127,12 @@ export default {
126
127
  default: null
127
128
  }
128
129
  },
129
- watch,
130
+ watch: columnWatch,
130
131
  created (this: any) {
131
132
  this.columnConfig = this.createColumn(this.$xetable, this)
132
133
  },
133
134
  mounted () {
135
+ this.columnConfig.slots = this.$scopedSlots
134
136
  assembleColumn(this)
135
137
  },
136
138
  destroyed () {
@@ -140,4 +142,4 @@ export default {
140
142
  return h('div', this.$slots.default)
141
143
  },
142
144
  methods: Cell
143
- }
145
+ })
@@ -1,12 +1,46 @@
1
- import VxeTableColumn from './column'
1
+ import Cell from './cell'
2
+ import { defineVxeComponent } from '../../ui/src/comp'
3
+ import { assembleColumn, destroyColumn } from './util'
4
+ import { columnProps, columnWatch } from './column'
2
5
 
3
- export default {
6
+ export default defineVxeComponent({
4
7
  name: 'VxeColgroup',
5
- extends: VxeTableColumn,
8
+ props: columnProps,
6
9
  provide () {
7
10
  return {
8
- xecolgroup: this,
11
+ $xecolumn: this,
9
12
  $xegrid: null
10
13
  }
11
- }
12
- }
14
+ },
15
+ inject: {
16
+ $xetable: {
17
+ default: null
18
+ },
19
+ $xecolumn: {
20
+ default: null
21
+ }
22
+ },
23
+ watch: columnWatch,
24
+ created (this: any) {
25
+ this.columnConfig = this.createColumn(this.$xetable, this)
26
+ },
27
+ mounted () {
28
+ const { $scopedSlots } = this
29
+ const columnSlots: {
30
+ header?: any
31
+ } = {}
32
+
33
+ if ($scopedSlots.header) {
34
+ columnSlots.header = $scopedSlots.header
35
+ }
36
+ this.columnConfig.slots = columnSlots
37
+ assembleColumn(this)
38
+ },
39
+ destroyed () {
40
+ destroyColumn(this)
41
+ },
42
+ render (this: any, h: any) {
43
+ return h('div', this.$slots.default)
44
+ },
45
+ methods: Cell
46
+ })
@@ -1,5 +1,5 @@
1
1
  import XEUtils from 'xe-utils'
2
- import { browse, isPx, isScale, hasClass, addClass, removeClass, getEventTargetNode, getPaddingTopBottomSize, setScrollTop, setScrollLeft, isNodeElement } from '../../ui/src/dom'
2
+ import { tpImg, browse, isPx, isScale, hasClass, addClass, removeClass, getEventTargetNode, getPaddingTopBottomSize, setScrollTop, setScrollLeft, isNodeElement } from '../../ui/src/dom'
3
3
  import { getLastZIndex, nextZIndex, hasChildrenList, getFuncText, isEnableConf, formatText, eqEmptyValue } from '../../ui/src/utils'
4
4
  import { VxeUI } from '../../ui'
5
5
  import Cell from './cell'
@@ -7,7 +7,7 @@ import { getRowUniqueId, clearTableAllStatus, getRowkey, getRowid, rowToVisible,
7
7
  import { getSlotVNs } from '../../ui/src/vn'
8
8
  import { warnLog, errLog } from '../../ui/src/log'
9
9
 
10
- import type { VxeTableDefines, VxeTableEmits, ValueOf } from '../../../types'
10
+ import type { VxeTableDefines, VxeColumnPropTypes, VxeTableEmits, ValueOf } from '../../../types'
11
11
 
12
12
  const { getConfig, getI18n, renderer, formats, interceptor, createEvent } = VxeUI
13
13
 
@@ -470,11 +470,18 @@ function showDropTip ($xeTable: any, evnt: DragEvent | MouseEvent, trEl: HTMLEle
470
470
  if (cdLineEl) {
471
471
  if (showLine) {
472
472
  const thRect = thEl.getBoundingClientRect()
473
+ const offsetTop = Math.max(0, thRect.y - wrapperRect.y)
473
474
  cdLineEl.style.display = 'block'
475
+ cdLineEl.style.top = `${offsetTop}px`
474
476
  cdLineEl.style.left = `${Math.max(1, thRect.x - wrapperRect.x)}px`
475
477
  cdLineEl.style.width = `${thRect.width}px`
476
- cdLineEl.style.height = `${wrapperRect.height - scrollbarHeight}px`
478
+ if (prevDragToChild) {
479
+ cdLineEl.style.height = `${thRect.height}px`
480
+ } else {
481
+ cdLineEl.style.height = `${wrapperRect.height - offsetTop - scrollbarHeight}px`
482
+ }
477
483
  cdLineEl.setAttribute('drag-pos', dragPos)
484
+ cdLineEl.setAttribute('drag-to-child', prevDragToChild ? 'y' : 'n')
478
485
  } else {
479
486
  cdLineEl.style.display = ''
480
487
  }
@@ -971,12 +978,12 @@ const Methods = {
971
978
  if (!cacheItem) {
972
979
  cacheItem = { row, rowid, seq, index: -1, _index: -1, $index: -1, items, parent, level, height: 0 }
973
980
  }
981
+ cacheItem.row = row
982
+ cacheItem.items = items
983
+ cacheItem.parent = parent
984
+ cacheItem.level = level
985
+ cacheItem.index = treeConfig && parent ? -1 : index
974
986
  if (isSource) {
975
- cacheItem.row = row
976
- cacheItem.items = items
977
- cacheItem.parent = parent
978
- cacheItem.level = level
979
- cacheItem.index = treeConfig && parent ? -1 : index
980
987
  fullDataRowIdMaps[rowid] = cacheItem
981
988
  }
982
989
  fullAllDataRowIdMaps[rowid] = cacheItem
@@ -1059,36 +1066,46 @@ const Methods = {
1059
1066
  * 牺牲数据组装的耗时,用来换取使用过程中的流畅
1060
1067
  */
1061
1068
  cacheColumnMap () {
1062
- const { tableFullColumn, collectColumn, fullColumnMap, showOverflow, columnOpts, rowOpts } = this
1063
- const fullColumnIdData: any = this.fullColumnIdData = {}
1064
- const fullColumnFieldData: any = this.fullColumnFieldData = {}
1069
+ const $xeTable = this
1070
+ const props = $xeTable
1071
+ const reactData = $xeTable
1072
+ const internalData = $xeTable
1073
+
1074
+ const { tableFullColumn, collectColumn } = internalData
1075
+ const fullColumnIdData: Record<string, VxeTableDefines.ColumnCacheItem> = internalData.fullColumnIdData = {}
1076
+ const fullColumnFieldData: Record<string, VxeTableDefines.ColumnCacheItem> = internalData.fullColumnFieldData = {}
1077
+ const mouseOpts = $xeTable.computeMouseOpts
1078
+ const columnOpts = $xeTable.computeColumnOpts
1079
+ const columnDragOpts = $xeTable.computeColumnDragOpts
1080
+ const { isCrossDrag, isSelfToChildDrag } = columnDragOpts
1081
+ const rowOpts = $xeTable.computeRowOpts
1065
1082
  const isGroup = collectColumn.some(hasChildrenList)
1066
- let isAllOverflow = !!showOverflow
1067
- let expandColumn: any
1068
- let treeNodeColumn: any
1069
- let checkboxColumn: any
1070
- let radioColumn: any
1071
- let htmlColumn: any
1072
- let hasFixed: any
1073
- const handleFunc = (column: any, index: any, items: any, path: any, parent: any) => {
1083
+ let isAllOverflow = !!props.showOverflow
1084
+ let expandColumn: VxeTableDefines.ColumnInfo | undefined
1085
+ let treeNodeColumn: VxeTableDefines.ColumnInfo | undefined
1086
+ let checkboxColumn: VxeTableDefines.ColumnInfo | undefined
1087
+ let radioColumn: VxeTableDefines.ColumnInfo | undefined
1088
+ let htmlColumn: VxeTableDefines.ColumnInfo | undefined
1089
+ let hasFixed: VxeColumnPropTypes.Fixed | undefined
1090
+ const handleFunc = (column: VxeTableDefines.ColumnInfo, index: number, items: VxeTableDefines.ColumnInfo[], path?: string[], parent?: VxeTableDefines.ColumnInfo) => {
1074
1091
  const { id: colid, field, fixed, type, treeNode } = column
1075
- const rest = { column, colid, index, items, parent: parent || null, width: 0 }
1092
+ const rest = { $index: -1, _index: -1, column, colid, index, items, parent: parent || null, width: 0 }
1076
1093
  if (field) {
1077
- if (process.env.VUE_APP_VXE_ENV === 'development') {
1078
- if (fullColumnFieldData[field]) {
1079
- warnLog('vxe.error.colRepet', ['field', field])
1080
- }
1094
+ if (fullColumnFieldData[field]) {
1095
+ errLog('vxe.error.colRepet', ['field', field])
1081
1096
  }
1082
1097
  fullColumnFieldData[field] = rest
1098
+ } else {
1099
+ if (isCrossDrag || isSelfToChildDrag) {
1100
+ errLog('vxe.error.emptyProp', ['column.field'])
1101
+ }
1083
1102
  }
1084
-
1085
1103
  if (!hasFixed && fixed) {
1086
1104
  hasFixed = fixed
1087
1105
  }
1088
1106
  if (!htmlColumn && type === 'html') {
1089
1107
  htmlColumn = column
1090
1108
  }
1091
-
1092
1109
  if (treeNode) {
1093
1110
  if (process.env.VUE_APP_VXE_ENV === 'development') {
1094
1111
  if (treeNodeColumn) {
@@ -1125,29 +1142,6 @@ const Methods = {
1125
1142
  }
1126
1143
  }
1127
1144
  }
1128
- if (process.env.VUE_APP_VXE_ENV === 'development') {
1129
- if (this.showOverflow && column.showOverflow === false) {
1130
- warnLog('vxe.error.errConflicts', [`table.show-overflow=${this.showOverflow}`, `column.show-overflow=${column.showOverflow}`])
1131
- }
1132
- if (this.showHeaderOverflow && column.showHeaderOverflow === false) {
1133
- warnLog('vxe.error.errConflicts', [`table.show-header-overflow=${this.showHeaderOverflow}`, `column.show-header-overflow=${column.showHeaderOverflow}`])
1134
- }
1135
- if (this.showFooterOverflow && column.showFooterOverflow === false) {
1136
- warnLog('vxe.error.errConflicts', [`table.show-footer-overflow=${this.showFooterOverflow}`, `column.show-footer-overflow=${column.showFooterOverflow}`])
1137
- }
1138
- }
1139
-
1140
- if (process.env.VUE_APP_VXE_ENV === 'development') {
1141
- if (htmlColumn) {
1142
- if (!columnOpts.useKey) {
1143
- errLog('vxe.error.reqProp', ['column-config.useKey', 'column.type=html'])
1144
- }
1145
- if (!rowOpts.useKey) {
1146
- errLog('vxe.error.reqProp', ['row-config.useKey', 'column.type=html'])
1147
- }
1148
- }
1149
- }
1150
-
1151
1145
  if (isAllOverflow && column.showOverflow === false) {
1152
1146
  isAllOverflow = false
1153
1147
  }
@@ -1155,9 +1149,8 @@ const Methods = {
1155
1149
  errLog('vxe.error.colRepet', ['colId', colid])
1156
1150
  }
1157
1151
  fullColumnIdData[colid] = rest
1158
- fullColumnMap.set(column, rest)
1159
1152
  }
1160
- fullColumnMap.clear()
1153
+
1161
1154
  if (isGroup) {
1162
1155
  XEUtils.eachTree(collectColumn, (column, index, items, path, parent, nodes) => {
1163
1156
  column.level = nodes.length
@@ -1168,15 +1161,26 @@ const Methods = {
1168
1161
  }
1169
1162
 
1170
1163
  if (process.env.VUE_APP_VXE_ENV === 'development') {
1171
- if (expandColumn && this.mouseOpts.area) {
1164
+ if (expandColumn && mouseOpts.area) {
1172
1165
  errLog('vxe.error.errConflicts', ['mouse-config.area', 'column.type=expand'])
1173
1166
  }
1174
1167
  }
1175
1168
 
1176
- this.isGroup = isGroup
1177
- this.treeNodeColumn = treeNodeColumn
1178
- this.expandColumn = expandColumn
1179
- this.isAllOverflow = isAllOverflow
1169
+ if (process.env.VUE_APP_VXE_ENV === 'development') {
1170
+ if (htmlColumn) {
1171
+ if (!columnOpts.useKey) {
1172
+ errLog('vxe.error.reqProp', ['column-config.useKey & column.type=html'])
1173
+ }
1174
+ if (!rowOpts.useKey) {
1175
+ errLog('vxe.error.reqProp', ['row-config.useKey & column.type=html'])
1176
+ }
1177
+ }
1178
+ }
1179
+
1180
+ reactData.isGroup = isGroup
1181
+ reactData.treeNodeColumn = treeNodeColumn
1182
+ reactData.expandColumn = expandColumn
1183
+ reactData.isAllOverflow = isAllOverflow
1180
1184
  },
1181
1185
  /**
1182
1186
  * 根据 tr 元素获取对应的 row 信息
@@ -2679,6 +2683,10 @@ const Methods = {
2679
2683
  const internalData = $xeTable
2680
2684
 
2681
2685
  const { rceTimeout } = internalData
2686
+ const el = $xeTable.$refs.refElem
2687
+ if (!el || !el.clientWidth) {
2688
+ $xeTable.autoCellWidth()
2689
+ }
2682
2690
  if (rceTimeout) {
2683
2691
  clearTimeout(rceTimeout)
2684
2692
  $xeTable.$nextTick(() => {
@@ -5070,8 +5078,9 @@ const Methods = {
5070
5078
  * 行拖拽
5071
5079
  */
5072
5080
  handleRowDragDragstartEvent (evnt: DragEvent) {
5073
- const img = new Image()
5074
5081
  if (evnt.dataTransfer) {
5082
+ const img = new Image()
5083
+ img.src = tpImg
5075
5084
  evnt.dataTransfer.setDragImage(img, 0, 0)
5076
5085
  }
5077
5086
  },
@@ -5137,8 +5146,8 @@ const Methods = {
5137
5146
  return
5138
5147
  }
5139
5148
  if (oldAllMaps[newRowid]) {
5149
+ isSelfToChildStatus = true
5140
5150
  if (!isSelfToChildDrag) {
5141
- isSelfToChildStatus = true
5142
5151
  if (VxeUI.modal) {
5143
5152
  VxeUI.modal.message({
5144
5153
  status: 'error',
@@ -5220,7 +5229,7 @@ const Methods = {
5220
5229
 
5221
5230
  reactData.isDragRowMove = true
5222
5231
  $xeTable.handleTableData(treeConfig && transform)
5223
- $xeTable.cacheRowMap(true)
5232
+ $xeTable.cacheRowMap()
5224
5233
  $xeTable.updateScrollYStatus()
5225
5234
  if (!(treeConfig && transform)) {
5226
5235
  $xeTable.updateAfterDataIndex()
@@ -5250,6 +5259,7 @@ const Methods = {
5250
5259
  }
5251
5260
  hideDropTip($xeTable)
5252
5261
  clearRowDropOrigin($xeTable)
5262
+ internalData.prevDragToChild = false
5253
5263
  reactData.dragRow = null
5254
5264
  reactData.dragCol = null
5255
5265
  setTimeout(() => {
@@ -5303,7 +5313,6 @@ const Methods = {
5303
5313
  const props = $xeTable
5304
5314
  const reactData = $xeTable
5305
5315
 
5306
- evnt.stopPropagation()
5307
5316
  const { dragConfig } = props
5308
5317
  const rowDragOpts = $xeTable.computeRowDragOpts
5309
5318
  const { dragStartMethod } = rowDragOpts
@@ -5342,8 +5351,9 @@ const Methods = {
5342
5351
  * 列拖拽
5343
5352
  */
5344
5353
  handleHeaderCellDragDragstartEvent (evnt: DragEvent) {
5345
- const img = new Image()
5346
5354
  if (evnt.dataTransfer) {
5355
+ const img = new Image()
5356
+ img.src = tpImg
5347
5357
  evnt.dataTransfer.setDragImage(img, 0, 0)
5348
5358
  }
5349
5359
  },
@@ -5355,18 +5365,20 @@ const Methods = {
5355
5365
 
5356
5366
  const { mouseConfig } = props
5357
5367
  const columnDragOpts = $xeTable.computeColumnDragOpts
5358
- const { dragEndMethod } = columnDragOpts
5368
+ const { isCrossDrag, isSelfToChildDrag, isToChildDrag, dragEndMethod } = columnDragOpts
5359
5369
  const { dragCol } = reactData
5360
- const { collectColumn, prevDragCol, prevDragPos } = internalData
5370
+ const { collectColumn, prevDragCol, prevDragPos, prevDragToChild } = internalData
5361
5371
  const dragOffsetIndex = prevDragPos === 'right' ? 1 : 0
5362
5372
  if (prevDragCol && dragCol) {
5363
5373
  // 判断是否有拖动
5364
5374
  if (prevDragCol !== dragCol) {
5375
+ const oldColumn: VxeTableDefines.ColumnInfo = dragCol
5376
+ const newColumn: VxeTableDefines.ColumnInfo = prevDragCol
5365
5377
  Promise.resolve(
5366
5378
  dragEndMethod
5367
5379
  ? dragEndMethod({
5368
- oldColumn: dragCol,
5369
- newColumn: prevDragCol,
5380
+ oldColumn,
5381
+ newColumn,
5370
5382
  dragPos: prevDragPos as any,
5371
5383
  offsetIndex: dragOffsetIndex
5372
5384
  })
@@ -5376,6 +5388,101 @@ const Methods = {
5376
5388
  return
5377
5389
  }
5378
5390
 
5391
+ let oafIndex = -1
5392
+ let nafIndex = -1
5393
+
5394
+ const oldAllMaps: Record<string, any> = {}
5395
+ XEUtils.eachTree([oldColumn], column => {
5396
+ oldAllMaps[column.id] = column
5397
+ })
5398
+
5399
+ let isSelfToChildStatus = false
5400
+
5401
+ if (oldColumn.parentId && newColumn.parentId) {
5402
+ // 子到子
5403
+
5404
+ if (!isCrossDrag) {
5405
+ return
5406
+ }
5407
+ if (oldAllMaps[newColumn.id]) {
5408
+ isSelfToChildStatus = true
5409
+ if (!isSelfToChildDrag) {
5410
+ if (VxeUI.modal) {
5411
+ VxeUI.modal.message({
5412
+ status: 'error',
5413
+ content: getI18n('vxe.error.treeDragChild')
5414
+ })
5415
+ }
5416
+ return
5417
+ }
5418
+ }
5419
+ } else if (oldColumn.parentId) {
5420
+ // 子到根
5421
+
5422
+ if (!isCrossDrag) {
5423
+ return
5424
+ }
5425
+ } else if (newColumn.parentId) {
5426
+ // 根到子
5427
+
5428
+ if (!isCrossDrag) {
5429
+ return
5430
+ }
5431
+ if (oldAllMaps[newColumn.id]) {
5432
+ isSelfToChildStatus = true
5433
+ if (!isSelfToChildDrag) {
5434
+ if (VxeUI.modal) {
5435
+ VxeUI.modal.message({
5436
+ status: 'error',
5437
+ content: getI18n('vxe.error.treeDragChild')
5438
+ })
5439
+ }
5440
+ return
5441
+ }
5442
+ }
5443
+ } else {
5444
+ // 根到根
5445
+ }
5446
+
5447
+ const oldewMatchRest = XEUtils.findTree(collectColumn as VxeTableDefines.ColumnInfo[], item => item.id === oldColumn.id)
5448
+
5449
+ // 改变层级
5450
+ if (isSelfToChildStatus && isSelfToChildDrag) {
5451
+ if (oldewMatchRest) {
5452
+ const { items: oCols, index: oIndex } = oldewMatchRest
5453
+ const childList = oldColumn.children || []
5454
+ childList.forEach(column => {
5455
+ column.parentId = oldColumn.parentId
5456
+ })
5457
+ oCols.splice(oIndex, 1, ...childList)
5458
+ oldColumn.children = []
5459
+ }
5460
+ } else {
5461
+ if (oldewMatchRest) {
5462
+ const { items: oCols, index: oIndex, parent: oParent } = oldewMatchRest
5463
+ oCols.splice(oIndex, 1)
5464
+ if (!oParent) {
5465
+ oafIndex = oIndex
5466
+ }
5467
+ }
5468
+ }
5469
+
5470
+ const newMatchRest = XEUtils.findTree(collectColumn as VxeTableDefines.ColumnInfo[], item => item.id === newColumn.id)
5471
+ if (newMatchRest) {
5472
+ const { items: nCols, index: nIndex, parent: nParent } = newMatchRest
5473
+ // 转子级
5474
+ if (isToChildDrag && prevDragToChild) {
5475
+ oldColumn.parentId = newColumn.id
5476
+ newColumn.children = (newColumn.children || []).concat([oldColumn])
5477
+ } else {
5478
+ oldColumn.parentId = newColumn.parentId
5479
+ nCols.splice(nIndex + dragOffsetIndex, 0, oldColumn)
5480
+ }
5481
+ if (!nParent) {
5482
+ nafIndex = nIndex
5483
+ }
5484
+ }
5485
+
5379
5486
  XEUtils.eachTree(collectColumn, (column, index, items, path, parent) => {
5380
5487
  if (!parent) {
5381
5488
  const sortIndex = index + 1
@@ -5383,19 +5490,6 @@ const Methods = {
5383
5490
  }
5384
5491
  })
5385
5492
 
5386
- const oafIndex = XEUtils.findIndexOf(collectColumn, item => item.id === dragCol.id)
5387
- const nafIndex = XEUtils.findIndexOf(collectColumn, item => item.id === prevDragCol.id) + dragOffsetIndex
5388
-
5389
- const newTargetCol = collectColumn[nafIndex]
5390
- if (newTargetCol) {
5391
- // 插入最后位置
5392
- dragCol.renderSortNumber = newTargetCol.renderSortNumber
5393
- newTargetCol.renderSortNumber = dragCol.renderSortNumber + 0.5
5394
- } else {
5395
- // 插入新位置
5396
- dragCol.renderSortNumber = collectColumn.length + 1.5
5397
- }
5398
-
5399
5493
  reactData.isDragColMove = true
5400
5494
  if (mouseConfig) {
5401
5495
  if ($xeTable.clearSelected) {
@@ -5406,15 +5500,14 @@ const Methods = {
5406
5500
  $xeTable.clearCopyCellArea()
5407
5501
  }
5408
5502
  }
5409
- $xeTable.analyColumnWidth()
5410
- $xeTable.$nextTick().then(() => {
5503
+
5504
+ $xeTable.refreshColumn(true).then(() => {
5411
5505
  $xeTable.updateCellAreas()
5412
- $xeTable.refreshColumn(true)
5413
5506
  })
5414
5507
 
5415
5508
  $xeTable.dispatchEvent('column-dragend', {
5416
- oldColumn: dragCol,
5417
- newColumn: prevDragCol,
5509
+ oldColumn,
5510
+ newColumn,
5418
5511
  dragPos: prevDragPos,
5419
5512
  offsetIndex: dragOffsetIndex,
5420
5513
  _index: {
@@ -5430,6 +5523,7 @@ const Methods = {
5430
5523
  }
5431
5524
  hideDropTip($xeTable)
5432
5525
  clearColDropOrigin($xeTable)
5526
+ internalData.prevDragToChild = false
5433
5527
  reactData.dragRow = null
5434
5528
  reactData.dragCol = null
5435
5529
  setTimeout(() => {
@@ -5442,10 +5536,13 @@ const Methods = {
5442
5536
  const internalData = $xeTable
5443
5537
 
5444
5538
  const { dragCol } = reactData
5539
+ const columnDragOpts = $xeTable.computeColumnDragOpts
5540
+ const { isToChildDrag, isCrossDrag } = columnDragOpts
5445
5541
  if (!dragCol) {
5446
5542
  evnt.preventDefault()
5447
5543
  return
5448
5544
  }
5545
+ const hasCtrlKey = evnt.ctrlKey
5449
5546
  const thEl = evnt.currentTarget as HTMLElement
5450
5547
  const colid = thEl.getAttribute('colid')
5451
5548
  const column = $xeTable.getColumnById(colid)
@@ -5454,11 +5551,11 @@ const Methods = {
5454
5551
  const { dragCol } = reactData
5455
5552
  const offsetX = evnt.clientX - thEl.getBoundingClientRect().x
5456
5553
  const dragPos = offsetX < thEl.clientWidth / 2 ? 'left' : 'right'
5457
- if (dragCol.id === column.id || column.parentId) {
5554
+ if ((dragCol && dragCol.id === column.id) || (!isCrossDrag && column.parentId)) {
5458
5555
  showDropTip($xeTable, evnt, null, thEl, false, dragPos)
5459
5556
  return
5460
5557
  }
5461
- internalData.prevDragToChild = false
5558
+ internalData.prevDragToChild = !!(isToChildDrag && hasCtrlKey)
5462
5559
  internalData.prevDragCol = column
5463
5560
  internalData.prevDragPos = dragPos
5464
5561
  showDropTip($xeTable, evnt, null, thEl, true, dragPos)
@@ -5473,7 +5570,6 @@ const Methods = {
5473
5570
  const $xeTable = this
5474
5571
  const reactData = $xeTable
5475
5572
 
5476
- evnt.stopPropagation()
5477
5573
  const columnDragOpts = $xeTable.computeColumnDragOpts
5478
5574
  const { dragStartMethod } = columnDragOpts
5479
5575
  const { column } = params
@@ -790,7 +790,7 @@ export default {
790
790
  })
791
791
  },
792
792
  staticColumns (value: any) {
793
- this.handleColumn(value)
793
+ this.handleColumn(XEUtils.clone(value))
794
794
  },
795
795
  tableColumn () {
796
796
  this.analyColumnWidth()
@@ -137,7 +137,6 @@ export function handleFieldOrColumn (_vm: any, fieldOrColumn: any) {
137
137
  export function assembleColumn (_vm: any) {
138
138
  const { $el, $xetable, $xecolumn, columnConfig } = _vm
139
139
  const groupConfig = $xecolumn ? $xecolumn.columnConfig : null
140
- columnConfig.slots = _vm.$scopedSlots
141
140
  if (groupConfig) {
142
141
  if (process.env.VUE_APP_VXE_ENV === 'development') {
143
142
  if ($xecolumn.$options._componentTag === 'vxe-table-column') {
@@ -4,6 +4,8 @@ const reClsMap: { [key: string]: any } = {}
4
4
 
5
5
  export const browse = XEUtils.browse()
6
6
 
7
+ export const tpImg = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII='
8
+
7
9
  export function getPropClass (property: any, params: any) {
8
10
  return property ? XEUtils.isFunction(property) ? property(params) : property : ''
9
11
  }