vxe-table 4.11.17 → 4.11.19

package/packages/table/src/table.ts

@@ -9,7 +9,7 @@ import TableHeaderComponent from './header'
 import TableFooterComponent from './footer'
 import tableProps from './props'
 import tableEmits from './emits'
-import { getRowUniqueId, clearTableAllStatus, getRowkey, getRowid, rowToVisible, colToVisible, getCellValue, setCellValue, handleFieldOrColumn, toTreePathSeq, restoreScrollLocation, getRootColumn, getRefElem, getColReMinWidth } from './util'
+import { getRowUniqueId, clearTableAllStatus, getRowkey, getRowid, rowToVisible, colToVisible, getCellValue, setCellValue, handleRowidOrRow, handleFieldOrColumn, toTreePathSeq, restoreScrollLocation, getRootColumn, getRefElem, getColReMinWidth } from './util'
 import { getSlotVNs } from '../../ui/src/vn'
 import { warnLog, errLog } from '../../ui/src/log'
 import TableCustomPanelComponent from '../module/custom/panel'
@@ -2846,7 +2846,7 @@ export default defineComponent({
           //   warnLog('vxe.error.reqProp', ['table.show-overflow'])
           // }
           if (props.spanMethod) {
-            warnLog('vxe.error.scrollErrProp', ['table.span-method'])
+            errLog('vxe.error.scrollErrProp', ['table.span-method'])
           }
         }
 
@@ -3524,6 +3524,9 @@ export default defineComponent({
 
     tableMethods = {
       dispatchEvent,
+      getEl () {
+        return refElem.value
+      },
       /**
        * 重置表格的一切数据状态
        */
@@ -3841,12 +3844,12 @@ export default defineComponent({
        */
       revertData (rows: any, field) {
         const { keepSource, treeConfig } = props
-        const { fullAllDataRowIdData, tableSourceData, sourceDataRowIdData, tableFullData, afterFullData } = internalData
+        const { fullAllDataRowIdData, fullDataRowIdData, tableSourceData, sourceDataRowIdData, tableFullData, afterFullData } = internalData
         const treeOpts = computeTreeOpts.value
         const { transform } = treeOpts
         if (!keepSource) {
           if (process.env.VUE_APP_VXE_ENV === 'development') {
-            warnLog('vxe.error.reqProp', ['keep-source'])
+            errLog('vxe.error.reqProp', ['keep-source'])
           }
           return nextTick()
         }
@@ -3860,22 +3863,22 @@ export default defineComponent({
         }
         let reDelFlag = false
         if (targetRows.length) {
-          targetRows.forEach((row: any) => {
-            if (!$xeTable.isInsertByRow(row)) {
-              const rowid = getRowid($xeTable, row)
-              const oRow = sourceDataRowIdData[rowid]
-              if (oRow && row) {
-                if (field) {
-                  XEUtils.set(row, field, XEUtils.clone(XEUtils.get(oRow, field), true))
-                } else {
-                  XEUtils.destructuring(row, XEUtils.clone(oRow, true))
-                }
-                if ($xeTable.isRemoveByRow(row)) {
-                  const rowRest = fullAllDataRowIdData[rowid]
-                  if (rowRest) {
-                    const reRow = rowRest.row
-                    tableFullData.unshift(reRow)
-                    afterFullData.unshift(reRow)
+          targetRows.forEach((item: any) => {
+            const rowid = getRowid($xeTable, item)
+            const rowRest = fullAllDataRowIdData[rowid]
+            if (rowRest) {
+              const row = rowRest.row
+              if (!$xeTable.isInsertByRow(row)) {
+                const oRow = sourceDataRowIdData[rowid]
+                if (oRow && row) {
+                  if (field) {
+                    XEUtils.set(row, field, XEUtils.clone(XEUtils.get(oRow, field), true))
+                  } else {
+                    XEUtils.destructuring(row, XEUtils.clone(oRow, true))
+                  }
+                  if (!fullDataRowIdData[rowid] && $xeTable.isRemoveByRow(row)) {
+                    tableFullData.unshift(row)
+                    afterFullData.unshift(row)
                     reDelFlag = true
                   }
                 }
@@ -4032,18 +4035,20 @@ export default defineComponent({
       },
       /**
        * 检查行或列数据是否发生改变
-       * @param {Row} row 行对象
+       * @param {Row} rowOrId 行对象
        * @param {String} field 字段名
        */
-      isUpdateByRow (row, field) {
+      isUpdateByRow (rowOrId, field) {
         const { keepSource } = props
         const { tableFullColumn, fullDataRowIdData, sourceDataRowIdData } = internalData
         if (keepSource) {
-          const rowid = getRowid($xeTable, row)
+          const rowid = XEUtils.isString(rowOrId) || XEUtils.isNumber(rowOrId) ? rowOrId : getRowid($xeTable, rowOrId)
+          const rowRest = fullDataRowIdData[rowid]
           // 新增的数据不需要检测
-          if (!fullDataRowIdData[rowid]) {
+          if (!rowRest) {
             return false
           }
+          const row = rowRest.row
           const oRow = sourceDataRowIdData[rowid]
           if (oRow) {
             if (arguments.length > 1) {
@@ -4107,6 +4112,92 @@ export default defineComponent({
           tableColumn: reactData.tableColumn.slice(0)
         }
       },
+      /**
+       * 移动列到指定列的位置
+       * @param fieldOrColumn
+       * @param targetFieldOrColumn
+       * @param options
+       */
+      moveColumnTo (fieldOrColumn, targetFieldOrColumn, options) {
+        const { fullColumnIdData, visibleColumn } = internalData
+        const { dragToChild, dragPos, isCrossDrag } = Object.assign({}, options)
+        const dragCol = handleFieldOrColumn($xeTable, fieldOrColumn)
+        let prevDragCol: VxeTableDefines.ColumnInfo | null = null
+        const colRest = dragCol ? fullColumnIdData[dragCol.id] : null
+        let defPos: 'left' | 'right' = 'left'
+        if (XEUtils.isNumber(targetFieldOrColumn)) {
+          if (colRest && targetFieldOrColumn) {
+            let currList = colRest.items
+            let offsetIndex = colRest._index + targetFieldOrColumn
+            if (isCrossDrag) {
+              currList = visibleColumn
+              offsetIndex = colRest._index + targetFieldOrColumn
+            }
+            if (offsetIndex > 0 && offsetIndex < currList.length - 1) {
+              prevDragCol = currList[offsetIndex]
+            }
+            if (targetFieldOrColumn > 0) {
+              defPos = 'right'
+            }
+          }
+        } else {
+          prevDragCol = handleFieldOrColumn($xeTable, targetFieldOrColumn)
+          const targetColRest = prevDragCol ? fullColumnIdData[prevDragCol.id] : null
+          if (colRest && targetColRest) {
+            if (targetColRest._index > colRest._index) {
+              defPos = 'right'
+            }
+          }
+        }
+        return $xeTable.handleColDragSwapEvent(null, true, dragCol, prevDragCol, dragPos || defPos, dragToChild === true)
+      },
+      /**
+       * 移动行到指定行的位置
+       * @param rowidOrRow
+       * @param targetRowidOrRow
+       * @param options
+       */
+      moveRowTo (rowidOrRow, targetRowidOrRow, options) {
+        const { treeConfig } = props
+        const { fullAllDataRowIdData, afterFullData } = internalData
+        const { dragToChild, dragPos, isCrossDrag } = Object.assign({}, options)
+        const treeOpts = computeTreeOpts.value
+        const dragRow = handleRowidOrRow($xeTable, rowidOrRow)
+        let prevDragRow: any = null
+        let defPos: 'top' | 'bottom' = 'top'
+        const rowRest = dragRow ? fullAllDataRowIdData[getRowid($xeTable, dragRow)] : null
+        if (XEUtils.isNumber(targetRowidOrRow)) {
+          if (rowRest && targetRowidOrRow) {
+            let currList = afterFullData
+            let offsetIndex = rowRest._index + targetRowidOrRow
+            if (treeConfig) {
+              currList = rowRest.items
+              if (treeOpts.transform) {
+                offsetIndex = rowRest.treeIndex + targetRowidOrRow
+                if (isCrossDrag) {
+                  currList = afterFullData
+                  offsetIndex = rowRest._index + targetRowidOrRow
+                }
+              }
+            }
+            if (offsetIndex >= 0 && offsetIndex <= currList.length - 1) {
+              prevDragRow = currList[offsetIndex]
+            }
+            if (targetRowidOrRow > 0) {
+              defPos = 'bottom'
+            }
+          }
+        } else {
+          prevDragRow = handleRowidOrRow($xeTable, targetRowidOrRow)
+          const targetRowRest = prevDragRow ? fullAllDataRowIdData[getRowid($xeTable, prevDragRow)] : null
+          if (rowRest && targetRowRest) {
+            if (targetRowRest._index > rowRest._index) {
+              defPos = 'bottom'
+            }
+          }
+        }
+        return $xeTable.handleRowDragSwapEvent(null, true, dragRow, prevDragRow, dragPos || defPos, dragToChild === true)
+      },
       /**
        * 获取表格的全量列
        */
@@ -6712,7 +6803,15 @@ export default defineComponent({
         if (el) {
           const parentElem = el.parentNode as HTMLElement
           const parentPaddingSize = height === '100%' || height === 'auto' ? getPaddingTopBottomSize(parentElem) : 0
-          return Math.floor($xeGrid ? $xeGrid.getParentHeight() : XEUtils.toNumber(getComputedStyle(parentElem).height) - parentPaddingSize)
+          let parentWrapperHeight = 0
+          if (parentElem) {
+            if ($xeGrid && hasClass(parentElem, 'vxe-grid--table-wrapper')) {
+              parentWrapperHeight = $xeGrid.getParentHeight()
+            } else {
+              parentWrapperHeight = parentElem.clientHeight
+            }
+          }
+          return Math.floor(parentWrapperHeight - parentPaddingSize)
         }
         return 0
       },
@@ -8125,6 +8224,9 @@ export default defineComponent({
         const { afterFullData, tableFullData } = internalData
         const dEndMethod = dragEndMethod || (dragConfig ? dragConfig.dragEndMethod : null)
         const dragOffsetIndex = prevDragPos === 'bottom' ? 1 : 0
+        const errRest = {
+          status: false
+        }
         if (prevDragRow && dragRow) {
           // 判断是否有拖动
           if (prevDragRow !== dragRow) {
@@ -8139,7 +8241,7 @@ export default defineComponent({
             const isDragToChildFlag = isSelfToChildDrag && dragToChildMethod ? dragToChildMethod(dragParams) : prevDragToChild
             return Promise.resolve(dEndMethod ? dEndMethod(dragParams) : true).then((status) => {
               if (!status) {
-                return
+                return errRest
               }
 
               let oafIndex = -1
@@ -8170,11 +8272,11 @@ export default defineComponent({
                       if (isPeerDrag && !isCrossDrag) {
                         if (oldRest.row[parentField] !== newRest.row[parentField]) {
                           // 非同级
-                          return
+                          return errRest
                         }
                       } else {
                         if (!isCrossDrag) {
-                          return
+                          return errRest
                         }
                         if (oldAllMaps[newRowid]) {
                           isSelfToChildStatus = true
@@ -8185,7 +8287,7 @@ export default defineComponent({
                                 content: getI18n('vxe.error.treeDragChild')
                               })
                             }
-                            return
+                            return errRest
                           }
                         }
                       }
@@ -8193,13 +8295,13 @@ export default defineComponent({
                       // 子到根
 
                       if (!isCrossDrag) {
-                        return
+                        return errRest
                       }
                     } else if (newLevel) {
                       // 根到子
 
                       if (!isCrossDrag) {
-                        return
+                        return errRest
                       }
                       if (oldAllMaps[newRowid]) {
                         isSelfToChildStatus = true
@@ -8210,7 +8312,7 @@ export default defineComponent({
                               content: getI18n('vxe.error.treeDragChild')
                             })
                           }
-                          return
+                          return errRest
                         }
                       }
                     } else {
@@ -8274,28 +8376,36 @@ export default defineComponent({
               if (reactData.scrollYLoad) {
                 $xeTable.updateScrollYSpace()
               }
-              nextTick().then(() => {
+
+              if (evnt) {
+                dispatchEvent('row-dragend', {
+                  oldRow: dragRow,
+                  newRow: prevDragRow,
+                  dragRow,
+                  dragPos: prevDragPos as any,
+                  dragToChild: isDragToChildFlag,
+                  offsetIndex: dragOffsetIndex,
+                  _index: {
+                    newIndex: nafIndex,
+                    oldIndex: oafIndex
+                  }
+                }, evnt)
+              }
+
+              return nextTick().then(() => {
                 $xeTable.updateCellAreas()
                 $xeTable.recalculate()
-              })
-
-              dispatchEvent('row-dragend', {
-                oldRow: dragRow,
-                newRow: prevDragRow,
-                dragRow,
-                dragPos: prevDragPos as any,
-                dragToChild: isDragToChildFlag,
-                offsetIndex: dragOffsetIndex,
-                _index: {
-                  newIndex: nafIndex,
-                  oldIndex: oafIndex
+              }).then(() => {
+                return {
+                  status: true
                 }
-              }, evnt)
+              })
             }).catch(() => {
+              return errRest
             })
           }
         }
-        return Promise.resolve()
+        return Promise.resolve(errRest)
       },
       handleRowDragDragendEvent (evnt) {
         const { treeConfig } = props
@@ -8420,6 +8530,9 @@ export default defineComponent({
         const { isPeerDrag, isCrossDrag, isSelfToChildDrag, isToChildDrag, dragEndMethod, dragToChildMethod } = columnDragOpts
         const { collectColumn } = internalData
         const dragOffsetIndex = prevDragPos === 'right' ? 1 : 0
+        const errRest = {
+          status: false
+        }
         if (prevDragCol && dragCol) {
           // 判断是否有拖动
           if (prevDragCol !== dragCol) {
@@ -8436,7 +8549,7 @@ export default defineComponent({
             const isDragToChildFlag = isSelfToChildDrag && dragToChildMethod ? dragToChildMethod(dragParams) : prevDragToChild
             return Promise.resolve(dragEndMethod ? dragEndMethod(dragParams) : true).then((status) => {
               if (!status) {
-                return
+                return errRest
               }
 
               let oafIndex = -1
@@ -8455,11 +8568,11 @@ export default defineComponent({
                 if (isPeerDrag && !isCrossDrag) {
                   if (dragColumn.parentId !== newColumn.parentId) {
                     // 非同级
-                    return
+                    return errRest
                   }
                 } else {
                   if (!isCrossDrag) {
-                    return
+                    return errRest
                   }
 
                   if (oldAllMaps[newColumn.id]) {
@@ -8471,7 +8584,7 @@ export default defineComponent({
                           content: getI18n('vxe.error.treeDragChild')
                         })
                       }
-                      return
+                      return errRest
                     }
                   }
                 }
@@ -8479,13 +8592,13 @@ export default defineComponent({
                 // 子到根
 
                 if (!isCrossDrag) {
-                  return
+                  return errRest
                 }
               } else if (newColumn.parentId) {
                 // 根到子
 
                 if (!isCrossDrag) {
-                  return
+                  return errRest
                 }
                 if (oldAllMaps[newColumn.id]) {
                   isSelfToChildStatus = true
@@ -8496,7 +8609,7 @@ export default defineComponent({
                         content: getI18n('vxe.error.treeDragChild')
                       })
                     }
-                    return
+                    return errRest
                   }
                 }
               } else {
@@ -8560,27 +8673,34 @@ export default defineComponent({
                 }
               }
 
-              dispatchEvent('column-dragend', {
-                oldColumn: dragColumn,
-                newColumn,
-                dragColumn,
-                dragPos: prevDragPos,
-                dragToChild: isDragToChildFlag,
-                offsetIndex: dragOffsetIndex,
-                _index: {
-                  newIndex: nafIndex,
-                  oldIndex: oafIndex
-                }
-              }, evnt)
+              if (evnt) {
+                dispatchEvent('column-dragend', {
+                  oldColumn: dragColumn,
+                  newColumn,
+                  dragColumn,
+                  dragPos: prevDragPos,
+                  dragToChild: isDragToChildFlag,
+                  offsetIndex: dragOffsetIndex,
+                  _index: {
+                    newIndex: nafIndex,
+                    oldIndex: oafIndex
+                  }
+                }, evnt)
+              }
 
               if (isSyncColumn) {
                 $xeTable.handleColDragSwapColumn()
               }
+
+              return {
+                status: true
+              }
             }).catch(() => {
+              return errRest
             })
           }
         }
-        return Promise.resolve()
+        return Promise.resolve(errRest)
       },
       handleHeaderCellDragDragendEvent (evnt) {
         const { dragCol } = reactData

package/packages/table/src/util.ts

@@ -101,15 +101,19 @@ export function getRowUniqueId () {
 export function getRowkey ($xeTable: VxeTableConstructor) {
   const { props } = $xeTable
   const { computeRowOpts } = $xeTable.getComputeMaps()
-  const { rowId } = props
   const rowOpts = computeRowOpts.value
-  return rowId || rowOpts.keyField || '_X_ROW_KEY'
+  return `${props.rowId || rowOpts.keyField || '_X_ROW_KEY'}`
 }
 
 // 行主键 value
 export function getRowid ($xeTable: VxeTableConstructor, row: any) {
   const rowid = XEUtils.get(row, getRowkey($xeTable))
-  return XEUtils.eqNull(rowid) ? '' : encodeURIComponent(rowid)
+  return encodeRowid(rowid)
+}
+
+// 编码行主键
+export function encodeRowid (rowVal: string) {
+  return XEUtils.eqNull(rowVal) ? '' : encodeURIComponent(rowVal)
 }
 
 export interface XEColumnInstance {
@@ -123,6 +127,14 @@ export const handleFieldOrColumn = ($xeTable: VxeTableConstructor, fieldOrColumn
   return null
 }
 
+export const handleRowidOrRow = ($xeTable: VxeTableConstructor, rowidOrRow: any) => {
+  if (rowidOrRow) {
+    const rowid = XEUtils.isString(rowidOrRow) || XEUtils.isNumber(rowidOrRow) ? rowidOrRow : getRowid($xeTable, rowidOrRow)
+    return $xeTable.getRowById(rowid)
+  }
+  return null
+}
+
 function getPaddingLeftRightSize (elem: HTMLElement | null) {
   if (elem) {
     const computedStyle = getComputedStyle(elem)