vxe-table 3.18.0 → 3.18.2

package/lib/table/src/methods.js

@@ -13,6 +13,7 @@ var _util = require("./util");
 var _vn = require("../../ui/src/vn");
 var _anime = require("./anime");
 var _log = require("../../ui/src/log");
+var _store = require("./store");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const {
   getConfig,
@@ -27,6 +28,7 @@ const supportMaxRow = 5e6;
 const customStorageKey = 'VXE_CUSTOM_STORE';
 const maxYHeight = 5e6;
 const maxXWidth = 5e6;
+let crossTableDragRowObj = null;
 function eqCellValue(row1, row2, field) {
   const val1 = _xeUtils.default.get(row1, field);
   const val2 = _xeUtils.default.get(row2, field);
@@ -1274,20 +1276,25 @@ function updateStyle($xeTable) {
     emptyPlaceholderElem.style.top = `${tHeaderHeight}px`;
     emptyPlaceholderElem.style.height = bodyWrapperElem ? `${bodyWrapperElem.offsetHeight - osbHeight}px` : '';
   }
+  const scrollbarXConf = scrollbarOpts.x || {};
   const scrollbarXToTop = $xeTable.computeScrollbarXToTop;
+  const scrollbarYConf = scrollbarOpts.y || {};
   const scrollbarYToLeft = $xeTable.computeScrollbarYToLeft;
   let xScrollbarVisible = overflowX ? 'visible' : 'hidden';
-  if ($xeGanttView) {
+  if (scrollbarXConf.visible === 'visible' || $xeGanttView) {
     osbHeight = scrollbarHeight;
     xScrollbarVisible = 'visible';
-  } else if (scrollbarOpts.x && scrollbarOpts.x.visible === false) {
+  } else if (scrollbarXConf.visible === 'hidden' || scrollbarXConf.visible === false) {
     osbHeight = 0;
     xScrollbarVisible = 'hidden';
   }
   let yScrollbarVisible = overflowY ? 'visible' : 'hidden';
-  if (scrollbarOpts.y && scrollbarOpts.y.visible === false || $xeGanttView && !scrollbarYToLeft) {
+  if (scrollbarYConf.visible === 'hidden' || scrollbarYConf.visible === false || $xeGanttView && !scrollbarYToLeft) {
     osbWidth = 0;
     yScrollbarVisible = 'hidden';
+  } else if (scrollbarYConf.visible === 'visible') {
+    osbWidth = scrollbarWidth;
+    yScrollbarVisible = 'visible';
   }
   let tbHeight = 0;
   let bodyMaxHeight = 0;
@@ -1327,7 +1334,7 @@ function updateStyle($xeTable) {
   }
   if (xRightCornerEl) {
     xRightCornerEl.style.width = scrollbarXToTop ? '' : `${osbWidth}px`;
-    xRightCornerEl.style.display = scrollbarXToTop ? '' : overflowX && osbHeight ? 'block' : '';
+    xRightCornerEl.style.display = scrollbarXToTop ? '' : xScrollbarVisible === 'visible' ? 'block' : '';
   }
   const scrollYVirtualEl = $xeTable.$refs.refScrollYVirtualElem;
   if (scrollYVirtualEl) {
@@ -1338,7 +1345,7 @@ function updateStyle($xeTable) {
   const yTopCornerEl = $xeTable.$refs.refScrollYTopCornerElem;
   if (yTopCornerEl) {
     yTopCornerEl.style.height = `${tHeaderHeight}px`;
-    yTopCornerEl.style.display = overflowY && tHeaderHeight ? 'block' : '';
+    yTopCornerEl.style.display = tHeaderHeight && yScrollbarVisible === 'visible' ? 'block' : '';
   }
   const yWrapperEl = $xeTable.$refs.refScrollYWrapperElem;
   if (yWrapperEl) {
@@ -1349,7 +1356,7 @@ function updateStyle($xeTable) {
   if (yBottomCornerEl) {
     yBottomCornerEl.style.height = `${tFooterHeight}px`;
     yBottomCornerEl.style.top = `${tHeaderHeight + tbHeight}px`;
-    yBottomCornerEl.style.display = overflowY && tFooterHeight ? 'block' : '';
+    yBottomCornerEl.style.display = tFooterHeight && yScrollbarVisible === 'visible' ? 'block' : '';
   }
   const rowExpandEl = $xeTable.$refs.refRowExpandElem;
   if (rowExpandEl) {
@@ -2377,15 +2384,71 @@ function handleBodyMerge($xeTable, merges) {
     });
   }
 }
-function handleFooterMerge($xeTable, merges) {
+function removeBodyMerges($xeTable, merges) {
+  const internalData = $xeTable;
+  const {
+    mergeBodyList,
+    fullColumnIdData,
+    fullAllDataRowIdData,
+    mergeBodyMaps
+  } = internalData;
+  const rest = [];
+  if (merges) {
+    const {
+      handleGetRowId
+    } = (0, _util.createHandleGetRowId)($xeTable);
+    if (!_xeUtils.default.isArray(merges)) {
+      merges = [merges];
+    }
+    merges.forEach(item => {
+      const {
+        row: margeRow,
+        col: margeCol
+      } = item;
+      let mergeRowIndex = -1;
+      let mergeColumnIndex = -1;
+      if (_xeUtils.default.isNumber(margeRow)) {
+        mergeRowIndex = margeRow;
+      } else {
+        const rowid = margeRow ? handleGetRowId(margeRow) : null;
+        const rowRest = rowid ? fullAllDataRowIdData[rowid] : null;
+        if (rowRest) {
+          mergeRowIndex = rowRest._index;
+        }
+      }
+      if (_xeUtils.default.isNumber(margeCol)) {
+        mergeColumnIndex = margeCol;
+      } else {
+        const colid = margeCol ? margeCol.id : null;
+        const colRest = colid ? fullColumnIdData[colid] : null;
+        if (colRest) {
+          mergeColumnIndex = colRest._index;
+        }
+      }
+      const mcIndex = _xeUtils.default.findIndexOf(mergeBodyList, item => item.row === mergeRowIndex && item.col === mergeColumnIndex);
+      if (mcIndex > -1) {
+        const rItems = mergeBodyList.splice(mcIndex, 1);
+        const item = rItems[0];
+        if (item) {
+          rest.push(rItems[0]);
+          if (mergeBodyMaps[`${mergeRowIndex}:${mergeColumnIndex}`]) {
+            delete mergeBodyMaps[`${mergeRowIndex}:${mergeColumnIndex}`];
+          }
+        }
+      }
+    });
+  }
+  return rest;
+}
+function handleHeaderMerge($xeTable, merges) {
   const reactData = $xeTable;
   const internalData = $xeTable;
   const {
     footerTableData
   } = reactData;
   const {
-    mergeFooterList,
-    mergeFooterMaps,
+    mergeHeaderList,
+    mergeHeaderMaps,
     fullColumnIdData
   } = internalData;
   if (merges) {
@@ -2419,7 +2482,7 @@ function handleFooterMerge($xeTable, merges) {
         if (rowspan > 1 || colspan > 1) {
           const row = footerTableData[mergeRowIndex];
           const column = visibleColumn[mergeColumnIndex];
-          let mergeItem = mergeFooterMaps[`${mergeRowIndex}:${mergeColumnIndex}`];
+          let mergeItem = mergeHeaderMaps[`${mergeRowIndex}:${mergeColumnIndex}`];
           if (mergeItem) {
             mergeItem.rowspan = rowspan;
             mergeItem.colspan = colspan;
@@ -2436,27 +2499,23 @@ function handleFooterMerge($xeTable, merges) {
               _rowspan: rowspan,
               _colspan: colspan
             };
-            mergeFooterMaps[`${mergeRowIndex}:${mergeColumnIndex}`] = mergeItem;
-            mergeFooterList.push(mergeItem);
+            mergeHeaderMaps[`${mergeRowIndex}:${mergeColumnIndex}`] = mergeItem;
+            mergeHeaderList.push(mergeItem);
           }
         }
       }
     });
   }
 }
-function removeBodyMerges($xeTable, merges) {
+function removeHeaderMerges($xeTable, merges) {
   const internalData = $xeTable;
   const {
-    mergeBodyList,
+    mergeHeaderList,
     fullColumnIdData,
-    fullAllDataRowIdData,
-    mergeBodyMaps
+    mergeHeaderMaps
   } = internalData;
   const rest = [];
   if (merges) {
-    const {
-      handleGetRowId
-    } = (0, _util.createHandleGetRowId)($xeTable);
     if (!_xeUtils.default.isArray(merges)) {
       merges = [merges];
     }
@@ -2465,17 +2524,8 @@ function removeBodyMerges($xeTable, merges) {
         row: margeRow,
         col: margeCol
       } = item;
-      let mergeRowIndex = -1;
+      const mergeRowIndex = _xeUtils.default.isNumber(margeRow) ? margeRow : -1;
       let mergeColumnIndex = -1;
-      if (_xeUtils.default.isNumber(margeRow)) {
-        mergeRowIndex = margeRow;
-      } else {
-        const rowid = margeRow ? handleGetRowId(margeRow) : null;
-        const rowRest = rowid ? fullAllDataRowIdData[rowid] : null;
-        if (rowRest) {
-          mergeRowIndex = rowRest._index;
-        }
-      }
       if (_xeUtils.default.isNumber(margeCol)) {
         mergeColumnIndex = margeCol;
       } else {
@@ -2485,14 +2535,14 @@ function removeBodyMerges($xeTable, merges) {
           mergeColumnIndex = colRest._index;
         }
       }
-      const mcIndex = _xeUtils.default.findIndexOf(mergeBodyList, item => item.row === mergeRowIndex && item.col === mergeColumnIndex);
+      const mcIndex = _xeUtils.default.findIndexOf(mergeHeaderList, item => item.row === mergeRowIndex && item.col === mergeColumnIndex);
       if (mcIndex > -1) {
-        const rItems = mergeBodyList.splice(mcIndex, 1);
+        const rItems = mergeHeaderList.splice(mcIndex, 1);
         const item = rItems[0];
         if (item) {
-          rest.push(rItems[0]);
-          if (mergeBodyMaps[`${mergeRowIndex}:${mergeColumnIndex}`]) {
-            delete mergeBodyMaps[`${mergeRowIndex}:${mergeColumnIndex}`];
+          rest.push(item);
+          if (mergeHeaderMaps[`${mergeRowIndex}:${mergeColumnIndex}`]) {
+            delete mergeHeaderMaps[`${mergeRowIndex}:${mergeColumnIndex}`];
           }
         }
       }
@@ -2500,6 +2550,73 @@ function removeBodyMerges($xeTable, merges) {
   }
   return rest;
 }
+function handleFooterMerge($xeTable, merges) {
+  const reactData = $xeTable;
+  const internalData = $xeTable;
+  const {
+    footerTableData
+  } = reactData;
+  const {
+    mergeFooterList,
+    mergeFooterMaps,
+    fullColumnIdData
+  } = internalData;
+  if (merges) {
+    const {
+      visibleColumn
+    } = internalData;
+    if (!_xeUtils.default.isArray(merges)) {
+      merges = [merges];
+    }
+    merges.forEach(item => {
+      let {
+        row: margeRow,
+        col: margeCol,
+        rowspan,
+        colspan
+      } = item;
+      const mergeRowIndex = _xeUtils.default.isNumber(margeRow) ? margeRow : -1;
+      let mergeColumnIndex = -1;
+      if (_xeUtils.default.isNumber(margeCol)) {
+        mergeColumnIndex = margeCol;
+      } else {
+        const colid = margeCol ? margeCol.id : null;
+        const colRest = colid ? fullColumnIdData[colid] : null;
+        if (colRest) {
+          mergeColumnIndex = colRest._index;
+        }
+      }
+      if (mergeRowIndex > -1 && mergeColumnIndex > -1 && (rowspan || colspan)) {
+        rowspan = _xeUtils.default.toNumber(rowspan) || 1;
+        colspan = _xeUtils.default.toNumber(colspan) || 1;
+        if (rowspan > 1 || colspan > 1) {
+          const row = footerTableData[mergeRowIndex];
+          const column = visibleColumn[mergeColumnIndex];
+          let mergeItem = mergeFooterMaps[`${mergeRowIndex}:${mergeColumnIndex}`];
+          if (mergeItem) {
+            mergeItem.rowspan = rowspan;
+            mergeItem.colspan = colspan;
+            mergeItem._rowspan = rowspan;
+            mergeItem._colspan = colspan;
+          } else {
+            mergeItem = {
+              row: mergeRowIndex,
+              col: mergeColumnIndex,
+              rowspan,
+              colspan,
+              _row: row,
+              _col: column,
+              _rowspan: rowspan,
+              _colspan: colspan
+            };
+            mergeFooterMaps[`${mergeRowIndex}:${mergeColumnIndex}`] = mergeItem;
+            mergeFooterList.push(mergeItem);
+          }
+        }
+      }
+    });
+  }
+}
 function removeFooterMerges($xeTable, merges) {
   const internalData = $xeTable;
   const {
@@ -2627,10 +2744,26 @@ function clearAllSort($xeTable) {
 function calcTableHeight($xeTable, key) {
   const props = $xeTable;
   const reactData = $xeTable;
+  const {
+    editConfig
+  } = props;
   const {
     parentHeight
   } = reactData;
-  const val = props[key];
+  let val = props[key];
+  if (key === 'minHeight') {
+    const defMinHeight = getConfig().table.minHeight;
+    if (_xeUtils.default.eqNull(val)) {
+      if ((0, _utils.eqEmptyValue)(defMinHeight)) {
+        // 编辑模式默认最小高度
+        if ((0, _utils.isEnableConf)(editConfig)) {
+          val = 144;
+        }
+      } else {
+        val = defMinHeight;
+      }
+    }
+  }
   let num = 0;
   if (val) {
     if (val === '100%' || val === 'auto') {
@@ -2860,6 +2993,11 @@ function handleTargetEnterEvent($xeTable, isClear) {
     }
   }
 }
+function clearCrossTableDragStatus($xeTable) {
+  const crossTableDragRowInfo = (0, _store.getCrossTableDragRowInfo)($xeTable);
+  crossTableDragRowObj = null;
+  crossTableDragRowInfo.row = null;
+}
 function clearDragStatus($xeTable) {
   const reactData = $xeTable;
   const {
@@ -2870,6 +3008,7 @@ function clearDragStatus($xeTable) {
     clearColDropOrigin($xeTable);
     clearRowDropOrigin($xeTable);
     hideDropTip($xeTable);
+    clearCrossTableDragStatus($xeTable);
     reactData.dragRow = null;
     reactData.dragCol = null;
   }
@@ -3074,6 +3213,26 @@ function hideDropTip($xeTable) {
     cdLineEl.style.display = '';
   }
 }
+function clearRowDragData($xeTable) {
+  const $xeGantt = $xeTable.$xeGantt;
+  const reactData = $xeTable;
+  const internalData = $xeTable;
+  let wrapperEl = $xeTable.$refs.refElem;
+  const dtClss = ['.vxe-body--row'];
+  if ($xeGantt) {
+    const ganttContainerElem = $xeGantt.$refs.refGanttContainerElem;
+    if (ganttContainerElem) {
+      wrapperEl = ganttContainerElem;
+    }
+    dtClss.push('.vxe-gantt-view--body-row', '.vxe-gantt-view--chart-row');
+  }
+  hideDropTip($xeTable);
+  clearRowDropOrigin($xeTable);
+  (0, _anime.clearRowAnimate)(wrapperEl, dtClss);
+  internalData.prevDragToChild = false;
+  reactData.dragRow = null;
+  reactData.dragCol = null;
+}
 /**
  * 处理显示 tooltip
  * @param {Event} evnt 事件
@@ -3153,13 +3312,24 @@ function handleDefaultMergeCells($xeTable) {
     $xeTable.setMergeCells(mergeCells);
   }
 }
+function handleDefaultMergeHeaderItems($xeTable) {
+  const props = $xeTable;
+  const {
+    mergeHeaderCells
+  } = props;
+  if (mergeHeaderCells) {
+    $xeTable.setMergeHeaderCells(mergeHeaderCells);
+  }
+}
 function handleDefaultMergeFooterItems($xeTable) {
   const props = $xeTable;
   const {
+    mergeFooterCells,
     mergeFooterItems
   } = props;
-  if (mergeFooterItems) {
-    $xeTable.setMergeFooterItems(mergeFooterItems);
+  const mFooterCells = mergeFooterCells || mergeFooterItems;
+  if (mFooterCells) {
+    $xeTable.setMergeFooterCells(mFooterCells);
   }
 }
 // 计算可视渲染相关数据
@@ -3665,6 +3835,10 @@ function loadTableData($xeTable, datas, isReset) {
     }
     handleReserveStatus($xeTable);
     $xeTable.checkSelectionStatus();
+    $xeTable.dispatchEvent('data-change', {
+      visibleColumn: internalData.visibleColumn,
+      visibleData: internalData.afterFullData
+    }, null);
     return new Promise(resolve => {
       $xeTable.$nextTick().then(() => handleRecalculateStyle($xeTable, false, false, false)).then(() => {
         handleRecalculateStyle($xeTable, false, true, true);
@@ -3721,6 +3895,7 @@ function handleLoadDefaults($xeTable) {
   handleDefaultTreeExpand($xeTable);
   handleDefaultRowGroupExpand($xeTable);
   handleDefaultMergeCells($xeTable);
+  handleDefaultMergeHeaderItems($xeTable);
   handleDefaultMergeFooterItems($xeTable);
   $xeTable.$nextTick(() => setTimeout(() => $xeTable.recalculate()));
 }
@@ -5633,7 +5808,9 @@ const Methods = {
         }
       }
     }
-    return $xeTable.handleRowDragSwapEvent(null, true, dragRow, prevDragRow, dragPos || defPos, dragToChild === true);
+    const rest = $xeTable.handleRowDragSwapEvent(null, true, dragRow, prevDragRow, dragPos || defPos, dragToChild === true);
+    clearRowDragData($xeTable);
+    return rest;
   },
   /**
    * 获取表格的全量列
@@ -7213,7 +7390,7 @@ const Methods = {
                 // 如果点击了当前表格之外
                 !(0, _dom.getEventTargetNode)(evnt, $el).flag) {
                   setTimeout(() => {
-                    this.handleClearEdit(evnt).then(() => {
+                    $xeTable.handleClearEdit(evnt).then(() => {
                       // 如果存在校验，点击了表格之外则清除
                       if (!this.isActivated && editRules && validOpts.autoClear) {
                         this.validErrorMaps = {};
@@ -7228,17 +7405,17 @@ const Methods = {
       }
     } else if (mouseConfig) {
       if (!(0, _dom.getEventTargetNode)(evnt, $el).flag && !($xeGGWrapper && (0, _dom.getEventTargetNode)(evnt, $xeGGWrapper.$el).flag) && !(tableMenu && (0, _dom.getEventTargetNode)(evnt, tableMenu.$el).flag) && !($toolbar && (0, _dom.getEventTargetNode)(evnt, $toolbar.$el).flag)) {
-        if (this.clearSelected) {
-          this.clearSelected();
+        if ($xeTable.clearSelected) {
+          $xeTable.clearSelected();
         }
         if (areaOpts.autoClear) {
-          if (this.getCellAreas) {
-            const cellAreas = this.getCellAreas();
+          if ($xeTable.getCellAreas) {
+            const cellAreas = $xeTable.getCellAreas();
             if (cellAreas && cellAreas.length && !(0, _dom.getEventTargetNode)(evnt, document.body, 'vxe-table--ignore-areas-clear').flag) {
-              this.preventEvent(evnt, 'event.clearAreas', {}, () => {
-                this.clearCellAreas();
-                this.clearCopyCellArea();
-                this.emitEvent('clear-cell-area-selection', {
+              $xeTable.preventEvent(evnt, 'event.clearAreas', {}, () => {
+                $xeTable.clearCellAreas();
+                $xeTable.clearCopyCellArea();
+                $xeTable.dispatchEvent('clear-cell-area-selection', {
                   cellAreas
                 }, evnt);
               });
@@ -7277,6 +7454,7 @@ const Methods = {
    * 表格键盘事件
    */
   keydownEvent(evnt) {
+    const $xeTable = this;
     const {
       filterStore,
       ctxMenuStore,
@@ -7295,7 +7473,7 @@ const Methods = {
     const isEsc = keyCode === 27;
     if (isEsc) {
       this.preventEvent(evnt, 'event.keydown', null, () => {
-        this.emitEvent('keydown-start', {}, evnt);
+        $xeTable.dispatchEvent('keydown-start', {}, evnt);
         if (keyboardConfig && mouseConfig && mouseOpts.area && this.handleKeyboardCellAreaEvent) {
           this.handleKeyboardCellAreaEvent(evnt);
         } else if (actived.row || filterStore.visible || ctxMenuStore.visible) {
@@ -7315,8 +7493,8 @@ const Methods = {
             }
           }
         }
-        this.emitEvent('keydown', {}, evnt);
-        this.emitEvent('keydown-end', {}, evnt);
+        $xeTable.dispatchEvent('keydown', {}, evnt);
+        $xeTable.dispatchEvent('keydown-end', {}, evnt);
       });
     }
   },
@@ -7656,6 +7834,7 @@ const Methods = {
     }
   },
   handleGlobalPasteEvent(evnt) {
+    const $xeTable = this;
     const {
       isActivated,
       keyboardConfig,
@@ -7674,10 +7853,11 @@ const Methods = {
           this.handlePasteCellAreaEvent(evnt);
         }
       }
-      this.emitEvent('paste', {}, evnt);
+      $xeTable.dispatchEvent('paste', {}, evnt);
     }
   },
   handleGlobalCopyEvent(evnt) {
+    const $xeTable = this;
     const {
       isActivated,
       keyboardConfig,
@@ -7696,10 +7876,11 @@ const Methods = {
           this.handleCopyCellAreaEvent(evnt);
         }
       }
-      this.emitEvent('copy', {}, evnt);
+      $xeTable.dispatchEvent('copy', {}, evnt);
     }
   },
   handleGlobalCutEvent(evnt) {
+    const $xeTable = this;
     const {
       isActivated,
       keyboardConfig,
@@ -7718,7 +7899,7 @@ const Methods = {
           this.handleCutCellAreaEvent(evnt);
         }
       }
-      this.emitEvent('cut', {}, evnt);
+      $xeTable.dispatchEvent('cut', {}, evnt);
     }
   },
   handleGlobalResizeEvent() {
@@ -7741,6 +7922,16 @@ const Methods = {
     internalData.mergeBodyCellMaps = buildMergeData(mergeBodyList);
     reactData.mergeBodyFlag++;
   },
+  handleUpdateHeaderMerge() {
+    const $xeTable = this;
+    const reactData = $xeTable;
+    const internalData = $xeTable;
+    const {
+      mergeHeaderList
+    } = internalData;
+    internalData.mergeHeaderCellMaps = buildMergeData(mergeHeaderList);
+    reactData.mergeHeadFlag++;
+  },
   handleUpdateFooterMerge() {
     const $xeTable = this;
     const reactData = $xeTable;
@@ -9120,7 +9311,8 @@ const Methods = {
     return $xeTable.$nextTick();
   },
   triggerHeaderCellDblclickEvent(evnt, params) {
-    this.emitEvent('header-cell-dblclick', Object.assign({
+    const $xeTable = this;
+    $xeTable.dispatchEvent('header-cell-dblclick', Object.assign({
       cell: evnt.currentTarget
     }, params), evnt);
   },
@@ -9338,7 +9530,7 @@ const Methods = {
         }
       }
     }
-    this.emitEvent('cell-dblclick', params, evnt);
+    $xeTable.dispatchEvent('cell-dblclick', params, evnt);
   },
   handleColumnSortEvent(evnt, column) {
     const $xeTable = this;
@@ -9837,12 +10029,273 @@ const Methods = {
     }
     return Promise.resolve(errRest);
   },
-  handleRowDragDragendEvent(evnt) {
+  /**
+   * 处理跨表拖拽完成
+   */
+  handleCrossTableRowDragFinishEvent(evnt) {
+    const $xeTable = this;
+    const $xeGantt = $xeTable.$xeGantt;
+    const reactData = $xeTable;
+    const internalData = $xeTable;
+    const crossTableDragRowInfo = (0, _store.getCrossTableDragRowInfo)($xeTable);
+    const {
+      tableData
+    } = reactData;
+    const {
+      fullAllDataRowIdData
+    } = internalData;
+    const rowOpts = $xeTable.computeRowOpts;
+    const cellOpts = $xeTable.computeCellOpts;
+    const defaultRowHeight = $xeTable.computeDefaultRowHeight;
+    const rowDragOpts = $xeTable.computeRowDragOpts;
+    const {
+      animation,
+      isCrossTableDrag
+    } = rowDragOpts;
+    const treeOpts = $xeTable.computeTreeOpts;
+    const {
+      mapChildrenField
+    } = treeOpts;
+    const el = $xeTable.$refs.refElem;
+    if (isCrossTableDrag && crossTableDragRowObj && crossTableDragRowInfo) {
+      const {
+        row: dragRow
+      } = crossTableDragRowInfo;
+      if (dragRow) {
+        const dragRowid = (0, _util.getRowid)($xeTable, dragRow);
+        const dragRowRest = fullAllDataRowIdData[dragRowid];
+        let dragRowHeight = 0;
+        let rsIndex = -1;
+        if (dragRowRest) {
+          if (animation) {
+            dragRowHeight = (0, _util.getCellRestHeight)(dragRowRest, cellOpts, rowOpts, defaultRowHeight);
+          }
+          rsIndex = dragRowRest.$index;
+        }
+        const dragRangeList = rsIndex > -1 && rsIndex < tableData.length - 1 ? tableData.slice(rsIndex + 1) : [];
+        const dragList = _xeUtils.default.toTreeArray([dragRow], {
+          updated: true,
+          children: mapChildrenField
+        });
+        $xeTable.remove(dragList).then(() => {
+          if (animation && dragRowHeight && dragRangeList.length) {
+            const $xeGanttView = internalData.xeGanttView;
+            let wrapperEl = el;
+            if ($xeGantt && $xeGanttView) {
+              const ganttContainerElem = $xeGantt.$refs.refGanttContainerElem;
+              if (ganttContainerElem) {
+                wrapperEl = ganttContainerElem;
+              }
+            }
+            const dtClss = [];
+            dragRangeList.forEach(row => {
+              const rowid = (0, _util.getRowid)($xeTable, row);
+              dtClss.push(`.vxe-body--row[rowid="${rowid}"]`);
+              if ($xeGantt) {
+                dtClss.push(`.vxe-gantt-view--body-row[rowid="${rowid}"]`, `.vxe-gantt-view--chart-row[rowid="${rowid}"]`);
+              }
+            });
+            const dtTrList = wrapperEl.querySelectorAll(dtClss.join(','));
+            (0, _anime.moveRowAnimateToTb)(dtTrList, dragRowHeight);
+          }
+        });
+        $xeTable.dispatchEvent('row-remove-dragend', {
+          row: dragRow
+        }, evnt);
+        clearRowDragData($xeTable);
+        clearCrossTableDragStatus($xeTable);
+      }
+    }
+  },
+  /**
+   * 处理跨表拖至新的空表
+   */
+  handleCrossTableRowDragoverEmptyEvent(evnt) {
+    const $xeTable = this;
+    const reactData = $xeTable;
+    const internalData = $xeTable;
+    const {
+      tableData
+    } = reactData;
+    const rowDragOpts = $xeTable.computeRowDragOpts;
+    const {
+      isCrossTableDrag
+    } = rowDragOpts;
+    if (isCrossTableDrag && crossTableDragRowObj && !tableData.length) {
+      const {
+        $oldTable
+      } = crossTableDragRowObj;
+      if ($oldTable && $oldTable.xID !== $xeTable.xID) {
+        evnt.preventDefault();
+        crossTableDragRowObj.$newTable = $xeTable;
+        internalData.prevDragRow = null;
+      }
+    }
+  },
+  /**
+   * 处理跨表拖插入
+   */
+  handleCrossTableRowDragInsertEvent(evnt) {
     const $xeTable = this;
     const $xeGantt = $xeTable.$xeGantt;
     const props = $xeTable;
     const reactData = $xeTable;
     const internalData = $xeTable;
+    const crossTableDragRowInfo = (0, _store.getCrossTableDragRowInfo)($xeTable);
+    const {
+      treeConfig
+    } = props;
+    const {
+      prevDragRow,
+      prevDragPos,
+      prevDragToChild
+    } = internalData;
+    const rowDragOpts = $xeTable.computeRowDragOpts;
+    const {
+      animation,
+      isSelfToChildDrag,
+      isCrossTableDrag,
+      dragEndMethod,
+      dragToChildMethod
+    } = rowDragOpts;
+    const rowOpts = $xeTable.computeRowOpts;
+    const cellOpts = $xeTable.computeCellOpts;
+    const defaultRowHeight = $xeTable.computeDefaultRowHeight;
+    const treeOpts = $xeTable.computeTreeOpts;
+    const {
+      parentField,
+      mapChildrenField
+    } = treeOpts;
+    const childrenField = treeOpts.children || treeOpts.childrenField;
+    // 跨表拖拽
+    if (isCrossTableDrag && crossTableDragRowObj && crossTableDragRowInfo) {
+      const {
+        row: oldRow
+      } = crossTableDragRowInfo;
+      const {
+        $oldTable
+      } = crossTableDragRowObj;
+      const el = $xeTable.$refs.refElem;
+      if ($oldTable && oldRow) {
+        const dragRow = oldRow;
+        let dragOffsetIndex = -1;
+        if (prevDragRow) {
+          dragOffsetIndex = prevDragPos === 'bottom' ? 1 : 0;
+        }
+        const dragParams = {
+          oldRow: dragRow,
+          newRow: prevDragRow,
+          dragRow,
+          dragPos: prevDragPos,
+          dragToChild: !!prevDragToChild,
+          offsetIndex: dragOffsetIndex
+        };
+        const isDragToChildFlag = isSelfToChildDrag && dragToChildMethod ? dragToChildMethod(dragParams) : prevDragToChild;
+        const errRest = {
+          status: false
+        };
+        Promise.resolve(dragEndMethod ? dragEndMethod(dragParams) : true).then(status => {
+          if (!status) {
+            return errRest;
+          }
+          let insertRest = Promise.resolve();
+          if (treeConfig) {
+            const dragList = _xeUtils.default.toTreeArray([dragRow], {
+              updated: true,
+              children: mapChildrenField
+            });
+            $oldTable.handleCrossTableRowDragFinishEvent(evnt);
+            if (prevDragRow) {
+              dragRow[parentField] = prevDragRow[parentField];
+            } else {
+              dragRow[parentField] = null;
+            }
+            dragList.forEach(row => {
+              row[childrenField] = undefined;
+              row[mapChildrenField] = undefined;
+            });
+            if (prevDragRow) {
+              if (prevDragPos === 'bottom') {
+                insertRest = $xeTable.insertNextAt(dragList, prevDragRow);
+              } else {
+                insertRest = $xeTable.insertAt(dragList, prevDragRow);
+              }
+            } else {
+              insertRest = $xeTable.insert(dragList);
+            }
+          } else {
+            $oldTable.handleCrossTableRowDragFinishEvent(evnt);
+            if (prevDragRow) {
+              if (prevDragPos === 'bottom') {
+                insertRest = $xeTable.insertNextAt(dragRow, prevDragRow);
+              } else {
+                insertRest = $xeTable.insertAt(dragRow, prevDragRow);
+              }
+            } else {
+              insertRest = $xeTable.insert(dragRow);
+            }
+          }
+          $xeTable.dispatchEvent('row-insert-dragend', {
+            oldRow,
+            newRow: prevDragRow,
+            dragRow,
+            dragPos: prevDragPos,
+            dragToChild: isDragToChildFlag,
+            offsetIndex: dragOffsetIndex
+          }, evnt);
+          clearRowDragData($xeTable);
+          insertRest.then(() => {
+            const {
+              tableData
+            } = reactData;
+            const {
+              fullAllDataRowIdData
+            } = internalData;
+            const oldRowid = (0, _util.getRowid)($xeTable, dragRow);
+            const oldRowRest = fullAllDataRowIdData[oldRowid];
+            let dragRowHeight = 0;
+            let rsIndex = -1;
+            if (oldRowRest) {
+              if (animation) {
+                dragRowHeight = (0, _util.getCellRestHeight)(oldRowRest, cellOpts, rowOpts, defaultRowHeight);
+              }
+              rsIndex = oldRowRest.$index;
+            }
+            const dragRangeList = rsIndex > -1 ? tableData.slice(rsIndex) : [];
+            if (animation && dragRowHeight && dragRangeList.length) {
+              const $xeGanttView = internalData.xeGanttView;
+              let wrapperEl = el;
+              if ($xeGantt && $xeGanttView) {
+                const ganttContainerElem = $xeGantt.$refs.refGanttContainerElem;
+                if (ganttContainerElem) {
+                  wrapperEl = ganttContainerElem;
+                }
+              }
+              const dtClss = [];
+              dragRangeList.forEach(row => {
+                const rowid = (0, _util.getRowid)($xeTable, row);
+                dtClss.push(`.vxe-body--row[rowid="${rowid}"]`);
+                if ($xeGantt) {
+                  dtClss.push(`.vxe-gantt-view--body-row[rowid="${rowid}"]`, `.vxe-gantt-view--chart-row[rowid="${rowid}"]`);
+                }
+              });
+              const dtTrList = wrapperEl.querySelectorAll(dtClss.join(','));
+              (0, _anime.moveRowAnimateToTb)(dtTrList, -dragRowHeight);
+            }
+          });
+        });
+      }
+    }
+  },
+  hideCrossTableRowDropClearStatus() {
+    const $xeTable = this;
+    hideDropTip($xeTable);
+  },
+  handleRowDragDragendEvent(evnt) {
+    const $xeTable = this;
+    const props = $xeTable;
+    const reactData = $xeTable;
+    const internalData = $xeTable;
     const {
       treeConfig
     } = props;
@@ -9862,7 +10315,23 @@ const Methods = {
       prevDragRow,
       prevDragPos
     } = internalData;
-    let wrapperEl = $xeTable.$refs.refElem;
+    const rowDragOpts = $xeTable.computeRowDragOpts;
+    const {
+      isCrossTableDrag,
+      isCrossDrag
+    } = rowDragOpts;
+    // 跨表拖拽
+    if (isCrossTableDrag && crossTableDragRowObj) {
+      const {
+        $newTable
+      } = crossTableDragRowObj;
+      if ($newTable && $newTable.xID !== $xeTable.xID) {
+        if (!treeConfig || isCrossDrag) {
+          $newTable.handleCrossTableRowDragInsertEvent(evnt);
+        }
+        return;
+      }
+    }
     if (treeConfig && lazy && prevDragToChild) {
       // 懒加载
       const newRowid = (0, _util.getRowid)($xeTable, prevDragRow);
@@ -9877,20 +10346,8 @@ const Methods = {
     } else {
       $xeTable.handleRowDragSwapEvent(evnt, true, dragRow, prevDragRow, prevDragPos, prevDragToChild);
     }
-    const dtClss = ['.vxe-body--row'];
-    if ($xeGantt) {
-      const ganttContainerElem = $xeGantt.$refs.refGanttContainerElem;
-      if (ganttContainerElem) {
-        wrapperEl = ganttContainerElem;
-      }
-      dtClss.push('.vxe-gantt-view--body-row', '.vxe-gantt-view--chart-row');
-    }
-    hideDropTip($xeTable);
-    clearRowDropOrigin($xeTable);
-    (0, _anime.clearRowAnimate)(wrapperEl, dtClss);
-    internalData.prevDragToChild = false;
-    reactData.dragRow = null;
-    reactData.dragCol = null;
+    clearRowDragData($xeTable);
+    clearCrossTableDragStatus($xeTable);
   },
   handleRowDragDragoverEvent(evnt) {
     const $xeTable = this;
@@ -9917,9 +10374,10 @@ const Methods = {
     const {
       isPeerDrag,
       isCrossDrag,
-      isToChildDrag
+      isToChildDrag,
+      isCrossTableDrag
     } = rowDragOpts;
-    if (!dragRow) {
+    if (!dragRow && !(isCrossTableDrag && (!treeConfig || isCrossDrag) && crossTableDragRowObj)) {
       evnt.preventDefault();
       return;
     }
@@ -9928,18 +10386,40 @@ const Methods = {
     const rowid = trEl.getAttribute('rowid') || '';
     const rest = fullAllDataRowIdData[rowid];
     if (rest) {
+      evnt.preventDefault();
       const row = rest.row;
       const rowid = (0, _util.getRowid)($xeTable, row);
       const rowRest = fullAllDataRowIdData[rowid];
-      evnt.preventDefault();
-      const {
-        dragRow
-      } = reactData;
       const offsetY = evnt.clientY - trEl.getBoundingClientRect().y;
       const dragPos = offsetY < trEl.clientHeight / 2 ? 'top' : 'bottom';
-      internalData.prevDragToChild = !!(treeConfig && transform && isToChildDrag && isControlKey);
+      internalData.prevDragToChild = !!(treeConfig && transform && isCrossDrag && isToChildDrag && isControlKey);
       internalData.prevDragRow = row;
       internalData.prevDragPos = dragPos;
+      // 跨表拖拽
+      if (isCrossTableDrag && (!treeConfig || isCrossDrag) && crossTableDragRowObj) {
+        const {
+          $oldTable,
+          $newTable
+        } = crossTableDragRowObj;
+        if ($oldTable) {
+          const oldTableReactData = $oldTable;
+          if ($oldTable.xID === $xeTable.xID) {
+            if ($newTable) {
+              $newTable.hideCrossTableRowDropClearStatus();
+            }
+            reactData.isCrossDragRow = false;
+            oldTableReactData.isCrossDragRow = false;
+            crossTableDragRowObj.$newTable = null;
+          } else if (!treeConfig || isCrossDrag) {
+            $oldTable.hideCrossTableRowDropClearStatus();
+            oldTableReactData.isCrossDragRow = true;
+            reactData.dragTipText = oldTableReactData.dragTipText;
+            crossTableDragRowObj.$newTable = $xeTable;
+            showDropTip($xeTable, evnt, trEl, null, true, dragPos);
+            return;
+          }
+        }
+      }
       if ($xeTable.eqRow(dragRow, row) || isControlKey && treeConfig && lazy && row[hasChildField] && rowRest && !rowRest.treeLoaded || !isCrossDrag && treeConfig && transform && (isPeerDrag ? dragRow[parentField] !== row[parentField] : rest.level)) {
         showDropTip($xeTable, evnt, trEl, null, false, dragPos);
         return;
@@ -9957,12 +10437,14 @@ const Methods = {
     const $xeTable = this;
     const props = $xeTable;
     const reactData = $xeTable;
+    const crossTableDragRowInfo = (0, _store.getCrossTableDragRowInfo)($xeTable);
     evnt.stopPropagation();
     const {
       dragConfig
     } = props;
     const rowDragOpts = $xeTable.computeRowDragOpts;
     const {
+      isCrossTableDrag,
       trigger,
       dragStartMethod
     } = rowDragOpts;
@@ -9978,10 +10460,19 @@ const Methods = {
       trEl.draggable = false;
       reactData.dragRow = null;
       reactData.dragCol = null;
+      clearCrossTableDragStatus($xeTable);
       hideDropTip($xeTable);
       return;
     }
+    if (isCrossTableDrag) {
+      crossTableDragRowInfo.row = row;
+      crossTableDragRowObj = {
+        $oldTable: $xeTable,
+        $newTable: null
+      };
+    }
     reactData.dragRow = row;
+    reactData.isCrossDragRow = false;
     reactData.dragCol = null;
     trEl.draggable = true;
     updateRowDropOrigin($xeTable, row);
@@ -10327,6 +10818,7 @@ const Methods = {
     internalData.prevDragToChild = false;
     reactData.dragRow = null;
     reactData.dragCol = null;
+    clearCrossTableDragStatus($xeTable);
   },
   handleHeaderCellDragDragoverEvent(evnt) {
     const $xeTable = this;
@@ -10421,11 +10913,13 @@ const Methods = {
       reactData.dragRow = null;
       reactData.dragCol = null;
       hideDropTip($xeTable);
+      clearCrossTableDragStatus($xeTable);
       return;
     }
     reactData.dragCol = column;
     reactData.dragRow = null;
     thEl.draggable = true;
+    clearCrossTableDragStatus($xeTable);
     updateColDropOrigin($xeTable, column);
     updateColDropTipContent($xeTable, thEl);
     $xeTable.dispatchEvent('column-dragstart', params, evnt);
@@ -10435,6 +10929,7 @@ const Methods = {
     const reactData = $xeTable;
     clearColDropOrigin($xeTable);
     hideDropTip($xeTable);
+    clearCrossTableDragStatus($xeTable);
     reactData.dragRow = null;
     reactData.dragCol = null;
   },
@@ -12665,6 +13160,10 @@ const Methods = {
     }
     reactData.footerTableData = footData;
     $xeTable.handleUpdateFooterMerge();
+    $xeTable.dispatchEvent('footer-data-change', {
+      visibleColumn: internalData.visibleColumn,
+      footData
+    }, null);
     return $xeTable.$nextTick();
   },
   /**
@@ -12751,45 +13250,101 @@ const Methods = {
       return updateStyle($xeTable);
     });
   },
-  setMergeFooterItems(merges) {
+  setMergeHeaderCells(merges) {
+    const $xeTable = this;
+    handleHeaderMerge($xeTable, merges);
+    $xeTable.handleUpdateHeaderMerge();
+    return $xeTable.$nextTick().then(() => {
+      return updateStyle($xeTable);
+    });
+  },
+  /**
+   * 移除表头单元格合并 [{row:Row|number, col:ColumnInfo|number}]
+   */
+  removeMergeHeaderCells(merges) {
+    const $xeTable = this;
+    const rest = removeHeaderMerges($xeTable, merges);
+    $xeTable.handleUpdateHeaderMerge();
+    return $xeTable.$nextTick().then(() => {
+      updateStyle($xeTable);
+      return rest;
+    });
+  },
+  /**
+   * 获取所有被合并的表头单元格
+   */
+  getMergeHeaderCells() {
+    const $xeTable = this;
+    const internalData = $xeTable;
+    return internalData.mergeHeaderList.slice(0);
+  },
+  /**
+   * 清除所有表头单元格合并
+   */
+  clearMergeHeaderCells() {
+    const $xeTable = this;
+    const reactData = $xeTable;
+    const internalData = $xeTable;
+    internalData.mergeHeaderList = [];
+    internalData.mergeHeaderMaps = {};
+    internalData.mergeHeaderCellMaps = {};
+    reactData.mergeHeadFlag++;
+    return $xeTable.$nextTick().then(() => {
+      return updateStyle($xeTable);
+    });
+  },
+  setMergeFooterCells(merges) {
     const $xeTable = this;
     const props = $xeTable;
     if (props.footerSpanMethod) {
-      (0, _log.errLog)('vxe.error.errConflicts', ['merge-footer-items', 'footer-span-method']);
+      (0, _log.errLog)('vxe.error.errConflicts', ['merge-footer-cells | merge-footer-items', 'footer-span-method']);
     }
     handleFooterMerge($xeTable, merges);
     $xeTable.handleUpdateFooterMerge();
     return $xeTable.$nextTick().then(() => {
-      $xeTable.updateCellAreas();
       return updateStyle($xeTable);
     });
   },
-  removeMergeFooterItems(merges) {
+  setMergeFooterItems(merges) {
+    const $xeTable = this;
+    // errLog('vxe.error.delFunc', ['setMergeFooterItems', 'setMergeFooterCells'])
+    return $xeTable.setMergeFooterCells(merges);
+  },
+  removeMergeFooterCells(merges) {
     const $xeTable = this;
     const props = $xeTable;
     if (props.footerSpanMethod) {
-      (0, _log.errLog)('vxe.error.errConflicts', ['merge-footer-items', 'footer-span-method']);
+      (0, _log.errLog)('vxe.error.errConflicts', ['merge-footer-cells | merge-footer-items', 'footer-span-method']);
     }
     const rest = removeFooterMerges($xeTable, merges);
     $xeTable.handleUpdateFooterMerge();
     return $xeTable.$nextTick().then(() => {
-      $xeTable.updateCellAreas();
       updateStyle($xeTable);
       return rest;
     });
   },
+  removeMergeFooterItems(merges) {
+    const $xeTable = this;
+    // errLog('vxe.error.delFunc', ['removeMergeFooterItems', 'removeMergeFooterCells'])
+    return $xeTable.removeMergeFooterCells(merges);
+  },
   /**
    * 获取所有被合并的表尾
    */
-  getMergeFooterItems() {
+  getMergeFooterCells() {
     const $xeTable = this;
     const internalData = $xeTable;
     return internalData.mergeFooterList.slice(0);
   },
+  getMergeFooterItems() {
+    const $xeTable = this;
+    // errLog('vxe.error.delFunc', ['getMergeFooterItems', 'getMergeFooterCells'])
+    return $xeTable.getMergeFooterCells();
+  },
   /**
    * 清除所有表尾合并
    */
-  clearMergeFooterItems() {
+  clearMergeFooterCells() {
     const $xeTable = this;
     const reactData = $xeTable;
     const internalData = $xeTable;
@@ -12801,6 +13356,11 @@ const Methods = {
       return updateStyle($xeTable);
     });
   },
+  clearMergeFooterItems() {
+    const $xeTable = this;
+    // errLog('vxe.error.delFunc', ['clearMergeFooterItems', 'clearMergeFooterCells'])
+    return $xeTable.clearMergeFooterCells();
+  },
   handleUpdateAggData() {
     const $xeTable = this;
     const internalData = $xeTable;
@@ -12838,14 +13398,7 @@ const Methods = {
   // 已废弃，使用 dispatchEvent
   emitEvent(type, params, evnt) {
     const $xeTable = this;
-    const $xeGrid = $xeTable.$xeGrid;
-    const $xeGantt = $xeTable.$xeGantt;
-    $xeTable.$emit(type, createEvent(evnt, {
-      $table: $xeTable,
-      $grid: $xeGrid,
-      $gantt: $xeGantt,
-      $event: evnt
-    }));
+    $xeTable.dispatchEvent(type, params, evnt);
   },
   focus() {
     this.isActivated = true;