vxe-pc-ui 3.15.15 → 3.15.16

package/es/tree/src/tree.js

@@ -11,10 +11,7 @@ import { moveRowAnimateToTb, clearRowAnimate } from '../../ui/src/anime';
 import VxeLoadingComponent from '../../loading';
 const { warnLog, errLog } = createComponentLog('tree');
 const { menus, getConfig, getI18n, getIcon } = VxeUI;
-// let crossTreeDragNodeObj: {
-//   $oldTree: VxeTreeConstructor & VxeTreePrivateMethods
-//   $newTree: (VxeTreeConstructor & VxeTreePrivateMethods) | null
-// } | null = null
+let crossTreeDragNodeObj = null;
 /**
  * 生成节点的唯一主键
  */
@@ -61,6 +58,11 @@ function handleScrollTo($xeTree, scrollLeft, scrollTop) {
     }
     return $xeTree.$nextTick();
 }
+function handleNodeDragEndClearStatus($xeTree) {
+    clearNodeDragData($xeTree);
+    clearCrossTreeDragStatus($xeTree);
+    $xeTree.recalculate();
+}
 function clearNodeDropOrigin($xeTree) {
     const el = $xeTree.$refs.refElem;
     if (el) {
@@ -81,7 +83,7 @@ function updateNodeDropOrigin($xeTree, node) {
         });
     }
 }
-function updateRowDropTipContent($xeTree, itemEl) {
+function updateNodeDropTipContent($xeTree, itemEl) {
     const reactData = $xeTree.reactData;
     const { dragNode } = reactData;
     const dragOpts = $xeTree.computeDragOpts;
@@ -112,7 +114,7 @@ function hideDropTip($xeTree) {
 }
 function clearCrossTreeDragStatus($xeTree) {
     const crossTreeDragNodeInfo = getCrossTreeDragNodeInfo($xeTree);
-    // crossTreeDragNodeObj = null
+    crossTreeDragNodeObj = null;
     crossTreeDragNodeInfo.node = null;
 }
 function clearDragStatus($xeTree) {
@@ -193,6 +195,7 @@ function handleNodeDragSwapEvent($xeTree, evnt, dragNode, prevDragNode, prevDrag
         status: false
     };
     if (!(el && prevDragNode && dragNode)) {
+        handleNodeDragEndClearStatus($xeTree);
         return Promise.resolve(errRest);
     }
     // 判断是否有拖动
@@ -240,15 +243,13 @@ function handleNodeDragSwapEvent($xeTree, evnt, dragNode, prevDragNode, prevDrag
                     if (isPeerDrag && !isCrossDrag) {
                         if (oldRest.item[parentField] !== newRest.item[parentField]) {
                             // 非同级
-                            clearNodeDragData($xeTree);
-                            clearCrossTreeDragStatus($xeTree);
+                            handleNodeDragEndClearStatus($xeTree);
                             return errRest;
                         }
                     }
                     else {
                         if (!isCrossDrag) {
-                            clearNodeDragData($xeTree);
-                            clearCrossTreeDragStatus($xeTree);
+                            handleNodeDragEndClearStatus($xeTree);
                             return errRest;
                         }
                         if (oldAllMaps[newNodeid]) {
@@ -260,8 +261,7 @@ function handleNodeDragSwapEvent($xeTree, evnt, dragNode, prevDragNode, prevDrag
                                         content: getI18n('vxe.error.treeDragChild')
                                     });
                                 }
-                                clearNodeDragData($xeTree);
-                                clearCrossTreeDragStatus($xeTree);
+                                handleNodeDragEndClearStatus($xeTree);
                                 return errRest;
                             }
                         }
@@ -270,16 +270,14 @@ function handleNodeDragSwapEvent($xeTree, evnt, dragNode, prevDragNode, prevDrag
                 else if (oldLevel) {
                     // 子到根
                     if (!isCrossDrag) {
-                        clearNodeDragData($xeTree);
-                        clearCrossTreeDragStatus($xeTree);
+                        handleNodeDragEndClearStatus($xeTree);
                         return errRest;
                     }
                 }
                 else if (newLevel) {
                     // 根到子
                     if (!isCrossDrag) {
-                        clearNodeDragData($xeTree);
-                        clearCrossTreeDragStatus($xeTree);
+                        handleNodeDragEndClearStatus($xeTree);
                         return errRest;
                     }
                     if (oldAllMaps[newNodeid]) {
@@ -291,8 +289,7 @@ function handleNodeDragSwapEvent($xeTree, evnt, dragNode, prevDragNode, prevDrag
                                     content: getI18n('vxe.error.treeDragChild')
                                 });
                             }
-                            clearNodeDragData($xeTree);
-                            clearCrossTreeDragStatus($xeTree);
+                            handleNodeDragEndClearStatus($xeTree);
                             return errRest;
                         }
                     }
@@ -442,13 +439,11 @@ function handleNodeDragSwapEvent($xeTree, evnt, dragNode, prevDragNode, prevDrag
         }).catch(() => {
             return errRest;
         }).then((rest) => {
-            clearNodeDragData($xeTree);
-            clearCrossTreeDragStatus($xeTree);
+            handleNodeDragEndClearStatus($xeTree);
             return rest;
         });
     }
-    clearNodeDragData($xeTree);
-    clearCrossTreeDragStatus($xeTree);
+    handleNodeDragEndClearStatus($xeTree);
     return Promise.resolve(errRest);
 }
 function handleVisibleOrCheckMode(mode, isExistChild, nLevel) {
@@ -471,9 +466,9 @@ function insertTreeNode($xeTree, newRecords, isAppend) {
     const mapChildrenField = $xeTree.computeMapChildrenField;
     const funcName = isAppend ? 'push' : 'unshift';
     newRecords.forEach((item) => {
-        const parentRowId = item[parentField];
+        const parentNodeId = item[parentField];
         const nodeid = $xeTree.getNodeId(item);
-        const matchObj = parentRowId ? XEUtils.findTree(treeFullData, (item) => parentRowId === item[keyField], { children: mapChildrenField }) : null;
+        const matchObj = parentNodeId ? XEUtils.findTree(treeFullData, (item) => parentNodeId === item[keyField], { children: mapChildrenField }) : null;
         const itemRest = getItemCacheObj(item);
         if (matchObj) {
             const { item: parentItem } = matchObj;
@@ -494,7 +489,7 @@ function insertTreeNode($xeTree, newRecords, isAppend) {
             pMapChilds[funcName](item);
         }
         else {
-            if (parentRowId) {
+            if (parentNodeId) {
                 warnLog('vxe.error.unableInsert');
             }
             treeFullData[funcName](item);
@@ -511,7 +506,7 @@ function createInternalData() {
         afterVisibleList: [],
         nodeMaps: {},
         selectCheckboxMaps: {},
-        indeterminateRowMaps: {},
+        indeterminateNodeMaps: {},
         treeExpandedMaps: {},
         treeExpandLazyLoadedMaps: {},
         lastScrollLeft: 0,
@@ -523,8 +518,8 @@ function createInternalData() {
             offsetSize: 0,
             rowHeight: 0
         },
-        removeRowMaps: {},
-        insertRowMaps: {},
+        removeNodeMaps: {},
+        insertNodeMaps: {},
         // prevDragNode: null,
         // prevDragToChild: false,
         // prevDragPos: ''
@@ -546,10 +541,11 @@ function createReactData() {
         treeList: [],
         updateExpandedFlag: 1,
         updateCheckboxFlag: 1,
-        insertRowFlag: 1,
-        removeRowFlag: 1,
+        insertNodeFlag: 1,
+        removeNodeFlag: 1,
         dragNode: null,
-        dragTipText: ''
+        dragTipText: '',
+        isCrossDragNode: false
     };
 }
 export default {
@@ -729,7 +725,7 @@ export default {
             const props = $xeTree;
             return Object.assign({}, getConfig().tree.virtualYConfig, props.virtualYConfig);
         },
-        computeIsRowCurrent() {
+        computeIsNodeCurrent() {
             const $xeTree = this;
             const props = $xeTree;
             const nodeOpts = $xeTree.computeNodeOpts;
@@ -739,7 +735,7 @@ export default {
             }
             return props.isCurrent;
         },
-        computeIsRowHover() {
+        computeIsNodeHover() {
             const $xeTree = this;
             const props = $xeTree;
             const nodeOpts = $xeTree.computeNodeOpts;
@@ -881,8 +877,8 @@ export default {
             const reactData = $xeTree.reactData;
             const internalData = $xeTree.internalData;
             const { updateCheckboxFlag } = reactData;
-            const { indeterminateRowMaps } = internalData;
-            return !!(updateCheckboxFlag && indeterminateRowMaps[nodeid]);
+            const { indeterminateNodeMaps } = internalData;
+            return !!(updateCheckboxFlag && indeterminateNodeMaps[nodeid]);
         },
         isIndeterminateByCheckboxNode(node) {
             const $xeTree = this;
@@ -1224,10 +1220,10 @@ export default {
             const expandMaps = {};
             if (transform) {
                 const fullData = [];
-                XEUtils.eachTree(afterTreeList, (item, index, items, path, parentRow) => {
+                XEUtils.eachTree(afterTreeList, (item, index, items, path, parentNode) => {
                     const nodeid = $xeTree.getNodeId(item);
-                    const parentNodeid = $xeTree.getNodeId(parentRow);
-                    if (!parentRow || (expandMaps[parentNodeid] && treeExpandedMaps[parentNodeid])) {
+                    const parentNodeid = $xeTree.getNodeId(parentNode);
+                    if (!parentNode || (expandMaps[parentNodeid] && treeExpandedMaps[parentNodeid])) {
                         expandMaps[nodeid] = 1;
                         fullData.push(item);
                     }
@@ -1268,6 +1264,7 @@ export default {
         loadData(list) {
             const $xeTree = this;
             const props = $xeTree;
+            const reactData = $xeTree.reactData;
             const internalData = $xeTree.internalData;
             const { expandAll, expandNodeKeys, transform, rootParentValue, rootValues } = props;
             const { initialized, scrollYStore } = internalData;
@@ -1284,6 +1281,10 @@ export default {
                 })
                 : list ? list.slice(0) : [];
             internalData.treeFullData = fullData;
+            internalData.insertNodeMaps = {};
+            reactData.insertNodeFlag++;
+            internalData.removeNodeMaps = {};
+            reactData.removeNodeFlag++;
             Object.assign(scrollYStore, {
                 startIndex: 0,
                 endIndex: 1,
@@ -1524,7 +1525,7 @@ export default {
             const reactData = $xeTree.reactData;
             const internalData = $xeTree.internalData;
             const { transform } = props;
-            const { treeFullData, nodeMaps } = internalData;
+            const { treeFullData, nodeMaps, removeNodeMaps, insertNodeMaps } = internalData;
             const keyField = $xeTree.computeKeyField;
             const parentField = $xeTree.computeParentField;
             const childrenField = $xeTree.computeChildrenField;
@@ -1562,26 +1563,26 @@ export default {
                         const parentMapChilds = parentNode ? parentNode[mapChildrenField] : treeFullData;
                         const parentRest = nodeMaps[$xeTree.getNodeId(parentNode)];
                         const parentLevel = parentRest ? parentRest.level : 0;
-                        treeRecords.forEach((row, i) => {
+                        treeRecords.forEach((item, i) => {
                             if (parentNode) {
-                                if (row[parentField] !== parentNode[keyField]) {
-                                    errLog('vxe.error.errProp', [`${parentField}=${row[parentField]}`, `${parentField}=${parentNode[keyField]}`]);
-                                    row[parentField] = parentNode[keyField];
+                                if (item[parentField] !== parentNode[keyField]) {
+                                    errLog('vxe.error.errProp', [`${parentField}=${item[parentField]}`, `${parentField}=${parentNode[keyField]}`]);
+                                    item[parentField] = parentNode[keyField];
                                 }
                             }
                             else {
-                                if (row[parentField] !== null) {
-                                    if (!XEUtils.eqNull(row[parentField])) {
-                                        errLog('vxe.error.errProp', [`${parentField}=${row[parentField]}`, 'null']);
+                                if (item[parentField] !== null) {
+                                    if (!XEUtils.eqNull(item[parentField])) {
+                                        errLog('vxe.error.errProp', [`${parentField}=${item[parentField]}`, 'null']);
                                     }
-                                    row[parentField] = null;
+                                    item[parentField] = null;
                                 }
                             }
                             let targetIndex = matchMapObj.index + i;
                             if (isInsertNextNode) {
                                 targetIndex = targetIndex + 1;
                             }
-                            parentMapChilds.splice(targetIndex, 0, row);
+                            parentMapChilds.splice(targetIndex, 0, item);
                         });
                         XEUtils.eachTree(treeRecords, (item) => {
                             const nodeid = $xeTree.getNodeId(item);
@@ -1611,7 +1612,22 @@ export default {
                     }
                 }
             }
-            reactData.insertRowFlag++;
+            const handleStatus = (newItem) => {
+                const nodeid = $xeTree.getNodeId(newItem);
+                // 如果是被删除的数据，则还原状态
+                if (removeNodeMaps[nodeid]) {
+                    delete removeNodeMaps[nodeid];
+                    if (insertNodeMaps[nodeid]) {
+                        delete insertNodeMaps[nodeid];
+                    }
+                }
+                else {
+                    insertNodeMaps[nodeid] = newItem;
+                }
+            };
+            XEUtils.eachTree(treeRecords, handleStatus, { children: mapChildrenField });
+            reactData.removeNodeFlag++;
+            reactData.insertNodeFlag++;
             $xeTree.cacheNodeMap();
             $xeTree.handleData(true);
             $xeTree.updateAfterDataIndex();
@@ -1638,13 +1654,66 @@ export default {
             const $xeTree = this;
             return $xeTree.handleInsertNodeAt(records, targetNodeOrNodeid, true);
         },
+        handleInsertChildNodeAt(records, parentNodeOrParentId, targetNodeOrNodeid, isInsertNextNode) {
+            const $xeTree = this;
+            const props = $xeTree;
+            const internalData = $xeTree.internalData;
+            const { transform } = props;
+            const { nodeMaps } = internalData;
+            const keyField = $xeTree.computeKeyField;
+            const parentField = $xeTree.computeParentField;
+            if (!transform) {
+                errLog('vxe.error.reqSupportProp', ['insertChild() | insertChildAt() | insertChildNextAt()', 'transform']);
+                return Promise.resolve({ node: null, nodes: [] });
+            }
+            if (!XEUtils.isArray(records)) {
+                records = [records];
+            }
+            let parentNode = parentNodeOrParentId;
+            if (XEUtils.isString(parentNodeOrParentId) || XEUtils.isNumber(parentNodeOrParentId)) {
+                const nodeRest = nodeMaps[parentNodeOrParentId];
+                if (nodeRest) {
+                    parentNode = nodeRest.item;
+                }
+            }
+            return $xeTree.handleInsertNodeAt(records.map((item) => Object.assign({}, item, { [parentField]: parentNode[keyField] })), targetNodeOrNodeid, isInsertNextNode);
+        },
+        insertChild(records, parentNodeOrParentId) {
+            const $xeTree = this;
+            return $xeTree.handleInsertChildNodeAt(records, parentNodeOrParentId, null);
+        },
+        insertChildAt(records, parentNodeOrParentId, targetNode) {
+            const $xeTree = this;
+            return $xeTree.handleInsertChildNodeAt(records, parentNodeOrParentId, targetNode);
+        },
+        insertChildNextAt(records, parentNodeOrParentId, targetNode) {
+            const $xeTree = this;
+            return $xeTree.handleInsertChildNodeAt(records, parentNodeOrParentId, targetNode, true);
+        },
+        getInsertRecords() {
+            const $xeTree = this;
+            const internalData = $xeTree.internalData;
+            const { insertNodeMaps } = internalData;
+            const insertRecords = [];
+            XEUtils.each(insertNodeMaps, (item) => {
+                insertRecords.push(item);
+            });
+            return insertRecords;
+        },
+        isInsertByNode(node) {
+            const $xeTree = this;
+            const reactData = $xeTree.reactData;
+            const internalData = $xeTree.internalData;
+            const nodeid = $xeTree.getNodeId(node);
+            return !!reactData.insertNodeFlag && !!internalData.insertNodeMaps[nodeid];
+        },
         remove(nodes) {
             const $xeTree = this;
             const props = $xeTree;
             const reactData = $xeTree.reactData;
             const internalData = $xeTree.internalData;
             const { transform } = props;
-            const { treeFullData } = internalData;
+            const { treeFullData, insertNodeMaps, removeNodeMaps } = internalData;
             const childrenField = $xeTree.computeChildrenField;
             const mapChildrenField = $xeTree.computeMapChildrenField;
             if (!transform) {
@@ -1661,6 +1730,13 @@ export default {
             if (!nodes.length) {
                 return Promise.resolve({ node: null, nodes: [] });
             }
+            // 如果是新增，则保存记录
+            nodes.forEach((item) => {
+                if (!$xeTree.isInsertByNode(item)) {
+                    const nodeid = $xeTree.getNodeId(item);
+                    removeNodeMaps[nodeid] = item;
+                }
+            });
             // 从数据源中移除
             if (treeFullData === nodes) {
                 nodes = delList = treeFullData.slice(0);
@@ -1681,8 +1757,15 @@ export default {
                     }
                 });
             }
-            reactData.removeRowFlag++;
-            reactData.insertRowFlag++;
+            // 从新增中移除已删除的数据
+            nodes.forEach((item) => {
+                const nodeid = $xeTree.getNodeId(item);
+                if (insertNodeMaps[nodeid]) {
+                    delete insertNodeMaps[nodeid];
+                }
+            });
+            reactData.removeNodeFlag++;
+            reactData.insertNodeFlag++;
             $xeTree.cacheNodeMap();
             $xeTree.handleData(true);
             $xeTree.updateAfterDataIndex();
@@ -1696,26 +1779,23 @@ export default {
                 return { node: delList.length ? delList[delList.length - 1] : null, nodes: delList };
             });
         },
-        getInsertRecords() {
-            const $xeTree = this;
-            const internalData = $xeTree.internalData;
-            const { insertRowMaps } = internalData;
-            const insertRecords = [];
-            XEUtils.each(insertRowMaps, (row) => {
-                insertRecords.push(row);
-            });
-            return insertRecords;
-        },
         getRemoveRecords() {
             const $xeTree = this;
             const internalData = $xeTree.internalData;
-            const { removeRowMaps } = internalData;
+            const { removeNodeMaps } = internalData;
             const removeRecords = [];
-            XEUtils.each(removeRowMaps, (row) => {
-                removeRecords.push(row);
+            XEUtils.each(removeNodeMaps, (item) => {
+                removeRecords.push(item);
             });
             return removeRecords;
         },
+        isRemoveByNode(node) {
+            const $xeTree = this;
+            const reactData = $xeTree.reactData;
+            const internalData = $xeTree.internalData;
+            const nodeid = $xeTree.getNodeId(node);
+            return !!reactData.removeNodeFlag && !!internalData.removeNodeMaps[nodeid];
+        },
         handleNodeMousedownEvent(evnt, node) {
             const $xeTree = this;
             const props = $xeTree;
@@ -1746,12 +1826,12 @@ export default {
             const { showRadio, showCheckbox, trigger } = props;
             const radioOpts = $xeTree.computeRadioOpts;
             const checkboxOpts = $xeTree.computeCheckboxOpts;
-            const isRowCurrent = $xeTree.computeIsRowCurrent;
+            const isNodeCurrent = $xeTree.computeIsNodeCurrent;
             let triggerCurrent = false;
             let triggerRadio = false;
             let triggerCheckbox = false;
             let triggerExpand = false;
-            if (isRowCurrent) {
+            if (isNodeCurrent) {
                 triggerCurrent = true;
                 $xeTree.changeCurrentEvent(evnt, node);
             }
@@ -1781,12 +1861,12 @@ export default {
             const props = $xeTree;
             const reactData = $xeTree.reactData;
             const { menuConfig } = props;
-            const isRowCurrent = $xeTree.computeIsRowCurrent;
+            const isNodeCurrent = $xeTree.computeIsNodeCurrent;
             const menuOpts = $xeTree.computeMenuOpts;
             if (menuConfig ? isEnableConf(menuOpts) : menuOpts.enabled) {
                 const { options, visibleMethod } = menuOpts;
                 if (!visibleMethod || visibleMethod({ $tree: $xeTree, options, node })) {
-                    if (isRowCurrent) {
+                    if (isNodeCurrent) {
                         $xeTree.changeCurrentEvent(evnt, node);
                     }
                     else if (reactData.currentNode) {
@@ -1846,15 +1926,15 @@ export default {
                             childRecords = [];
                         }
                         if (childRecords) {
-                            return $xeTree.loadChildrenNode(node, childRecords).then(childRows => {
+                            return $xeTree.loadChildrenNode(node, childRecords).then(childNodes => {
                                 const { treeExpandedMaps } = internalData;
-                                if (childRows.length && !treeExpandedMaps[nodeid]) {
+                                if (childNodes.length && !treeExpandedMaps[nodeid]) {
                                     treeExpandedMaps[nodeid] = true;
                                 }
                                 reactData.updateExpandedFlag++;
                                 // 如果当前节点已选中，则展开后子节点也被选中
                                 if (!checkStrictly && $xeTree.isCheckedByCheckboxNodeId(nodeid)) {
-                                    $xeTree.handleCheckedCheckboxNode(childRows, true);
+                                    $xeTree.handleCheckedCheckboxNode(childNodes, true);
                                 }
                                 $xeTree.dispatchEvent('load-success', { node, data: childRecords }, new Event('load-success'));
                                 return $xeTree.$nextTick();
@@ -1967,23 +2047,23 @@ export default {
             const reactData = $xeTree.reactData;
             const internalData = $xeTree.internalData;
             const { transform } = props;
-            const { selectCheckboxMaps, indeterminateRowMaps, afterTreeList } = internalData;
+            const { selectCheckboxMaps, indeterminateNodeMaps, afterTreeList } = internalData;
             const childrenField = $xeTree.computeChildrenField;
             const mapChildrenField = $xeTree.computeMapChildrenField;
             const checkboxOpts = $xeTree.computeCheckboxOpts;
             const { checkStrictly, checkMethod } = checkboxOpts;
             if (!checkStrictly) {
-                const childRowMaps = {};
-                const childRowList = [];
+                const childNodeMaps = {};
+                const childNodeList = [];
                 XEUtils.eachTree(afterTreeList, (node) => {
                     const nodeid = $xeTree.getNodeId(node);
                     const childList = node[childrenField];
-                    if (childList && childList.length && !childRowMaps[nodeid]) {
-                        childRowMaps[nodeid] = 1;
-                        childRowList.unshift([node, nodeid, childList]);
+                    if (childList && childList.length && !childNodeMaps[nodeid]) {
+                        childNodeMaps[nodeid] = 1;
+                        childNodeList.unshift([node, nodeid, childList]);
                     }
                 }, { children: transform ? mapChildrenField : childrenField });
-                childRowList.forEach(vals => {
+                childNodeList.forEach(vals => {
                     const node = vals[0];
                     const nodeid = vals[1];
                     const childList = vals[2];
@@ -1999,7 +2079,7 @@ export default {
                                 if (isSelect) {
                                     sLen++;
                                 }
-                                else if (indeterminateRowMaps[childNodeid]) {
+                                else if (indeterminateNodeMaps[childNodeid]) {
                                     hLen++;
                                 }
                                 vLen++;
@@ -2008,7 +2088,7 @@ export default {
                                 if (isSelect) {
                                     sLen++;
                                 }
-                                else if (indeterminateRowMaps[childNodeid]) {
+                                else if (indeterminateNodeMaps[childNodeid]) {
                                     hLen++;
                                 }
                             }
@@ -2019,7 +2099,7 @@ export default {
                             if (isSelect) {
                                 sLen++;
                             }
-                            else if (indeterminateRowMaps[childNodeid]) {
+                            else if (indeterminateNodeMaps[childNodeid]) {
                                 hLen++;
                             }
                             vLen++;
@@ -2049,8 +2129,8 @@ export default {
                     const halfSelect = !isSelected && (sLen > 0 || hLen > 0);
                     if (isSelected) {
                         selectCheckboxMaps[nodeid] = node;
-                        if (indeterminateRowMaps[nodeid]) {
-                            delete indeterminateRowMaps[nodeid];
+                        if (indeterminateNodeMaps[nodeid]) {
+                            delete indeterminateNodeMaps[nodeid];
                         }
                     }
                     else {
@@ -2058,11 +2138,11 @@ export default {
                             delete selectCheckboxMaps[nodeid];
                         }
                         if (halfSelect) {
-                            indeterminateRowMaps[nodeid] = node;
+                            indeterminateNodeMaps[nodeid] = node;
                         }
                         else {
-                            if (indeterminateRowMaps[nodeid]) {
-                                delete indeterminateRowMaps[nodeid];
+                            if (indeterminateNodeMaps[nodeid]) {
+                                delete indeterminateNodeMaps[nodeid];
                             }
                         }
                     }
@@ -2293,7 +2373,7 @@ export default {
             const $xeTree = this;
             const reactData = $xeTree.reactData;
             const internalData = $xeTree.internalData;
-            internalData.indeterminateRowMaps = {};
+            internalData.indeterminateNodeMaps = {};
             internalData.selectCheckboxMaps = {};
             reactData.updateCheckboxFlag++;
             $xeTree.updateCheckboxStatus();
@@ -2321,7 +2401,7 @@ export default {
                     selectMaps[nodeid] = true;
                 }, { children: transform ? mapChildrenField : childrenField });
             }
-            internalData.indeterminateRowMaps = {};
+            internalData.indeterminateNodeMaps = {};
             internalData.selectCheckboxMaps = selectMaps;
             reactData.updateCheckboxFlag++;
             $xeTree.updateCheckboxStatus();
@@ -2533,10 +2613,10 @@ export default {
             const parentLevel = parentNodeItem ? parentNodeItem.level : 0;
             const parentNodes = parentNodeItem ? parentNodeItem.nodes : [];
             return $xeTree.createNode(childRecords).then((nodeList) => {
-                XEUtils.eachTree(nodeList, (childRow, index, items, path, parent, nodes) => {
-                    const itemNodeId = $xeTree.getNodeId(childRow);
+                XEUtils.eachTree(nodeList, (childNode, index, items, path, parent, nodes) => {
+                    const itemNodeId = $xeTree.getNodeId(childNode);
                     nodeMaps[itemNodeId] = {
-                        item: childRow,
+                        item: childNode,
                         index: -1,
                         $index: -1,
                         _index: -1,
@@ -2579,17 +2659,207 @@ export default {
         /**
            * 处理跨树拖拽完成
            */
-        handleCrossTreeNodeDragFinishEvent() {
+        handleCrossTreeNodeDragFinishEvent(evnt) {
+            const $xeTree = this;
+            const reactData = $xeTree.reactData;
+            const internalData = $xeTree.internalData;
+            const crossTreeDragNodeInfo = getCrossTreeDragNodeInfo($xeTree);
+            const { treeList } = reactData;
+            const { nodeMaps } = internalData;
+            const dragOpts = $xeTree.computeDragOpts;
+            const { animation, isCrossTreeDrag } = dragOpts;
+            const mapChildrenField = $xeTree.computeMapChildrenField;
+            const el = $xeTree.$refs.refElem;
+            if (!el) {
+                return;
+            }
+            if (isCrossTreeDrag && crossTreeDragNodeObj && crossTreeDragNodeInfo) {
+                const { node: dragNode } = crossTreeDragNodeInfo;
+                if (dragNode) {
+                    const dragNodeid = $xeTree.getNodeId(dragNode);
+                    const dragNodeRest = nodeMaps[dragNodeid];
+                    let dragNodeHeight = 0;
+                    let rsIndex = -1;
+                    if (dragNodeRest) {
+                        if (animation) {
+                            const oldItemEl = el.querySelector(`.vxe-tree--node-wrapper[nodeid="${dragNodeid}"]`);
+                            const targetItemEl = oldItemEl;
+                            if (targetItemEl) {
+                                dragNodeHeight = targetItemEl.offsetHeight;
+                            }
+                        }
+                        rsIndex = dragNodeRest.$index;
+                    }
+                    const dragRangeList = rsIndex > -1 && rsIndex < treeList.length - 1 ? treeList.slice(rsIndex + 1) : [];
+                    const dragList = XEUtils.toTreeArray([dragNode], {
+                        updated: true,
+                        children: mapChildrenField
+                    });
+                    $xeTree.remove(dragList).then(() => {
+                        if (animation && dragNodeHeight && dragRangeList.length) {
+                            const wrapperEl = el;
+                            const dtClss = [];
+                            dragRangeList.forEach(item => {
+                                const nodeid = $xeTree.getNodeId(item);
+                                dtClss.push(`.vxe-tree--node-wrapper[nodeid="${nodeid}"]`);
+                            });
+                            const dtTrList = wrapperEl.querySelectorAll(dtClss.join(','));
+                            moveRowAnimateToTb(dtTrList, dragNodeHeight);
+                        }
+                    });
+                    $xeTree.dispatchEvent('node-remove-dragend', {
+                        node: dragNode
+                    }, evnt);
+                    handleNodeDragEndClearStatus($xeTree);
+                }
+            }
         },
         /**
-           * 处理跨树拖至新的空树
-           */
-        handleCrossTreeNodeDragInsertEvent() {
+         * 处理跨树拖至新的空树
+         */
+        handleCrossTreeNodeDragoverEmptyEvent(evnt) {
+            const $xeTree = this;
+            const reactData = $xeTree.reactData;
+            const internalData = $xeTree.internalData;
+            const { treeList } = reactData;
+            const dragOpts = $xeTree.computeDragOpts;
+            const { isCrossTreeDrag } = dragOpts;
+            if (isCrossTreeDrag && crossTreeDragNodeObj && !treeList.length) {
+                const { $oldTree, $newTree } = crossTreeDragNodeObj;
+                if ($oldTree) {
+                    const oldTreeReactData = $oldTree;
+                    if ($oldTree.xID !== $xeTree.xID) {
+                        if ($newTree && $newTree.xID !== $xeTree.xID) {
+                            $newTree.hideCrossTreeNodeDropClearStatus();
+                        }
+                        evnt.preventDefault();
+                        $oldTree.hideCrossTreeNodeDropClearStatus();
+                        crossTreeDragNodeObj.$newTree = $xeTree;
+                        internalData.prevDragNode = null;
+                        reactData.dragTipText = oldTreeReactData.dragTipText;
+                        showDropTip($xeTree, evnt, evnt.currentTarget, true, '');
+                    }
+                }
+            }
         },
         /**
-           * 处理跨树拖插入
-           */
-        handleCrossTreeNodeDragoverEmptyEvent() {
+         * 处理跨树拖插入
+         */
+        handleCrossTreeNodeDragInsertEvent(evnt) {
+            const $xeTree = this;
+            const reactData = $xeTree.reactData;
+            const internalData = $xeTree.internalData;
+            const crossTreeDragNodeInfo = getCrossTreeDragNodeInfo($xeTree);
+            const { prevDragNode, prevDragPos, prevDragToChild } = internalData;
+            const dragOpts = $xeTree.computeDragOpts;
+            const { animation, isSelfToChildDrag, isCrossTreeDrag, dragEndMethod, dragToChildMethod } = dragOpts;
+            const parentField = $xeTree.computeParentField;
+            const mapChildrenField = $xeTree.computeMapChildrenField;
+            const childrenField = $xeTree.computeChildrenField;
+            // 跨表拖拽
+            if (isCrossTreeDrag && crossTreeDragNodeObj && crossTreeDragNodeInfo) {
+                const { node: oldNode } = crossTreeDragNodeInfo;
+                const { $oldTree } = crossTreeDragNodeObj;
+                const el = $xeTree.$refs.refElem;
+                if (!el) {
+                    return;
+                }
+                if ($oldTree && oldNode) {
+                    const dragNode = oldNode;
+                    let dragOffsetIndex = -1;
+                    if (prevDragNode) {
+                        dragOffsetIndex = prevDragPos === 'bottom' ? 1 : 0;
+                    }
+                    const dragParams = {
+                        oldNode: dragNode,
+                        newNode: prevDragNode,
+                        dragNode,
+                        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) {
+                            if ($oldTree) {
+                                if ($oldTree.xID !== $xeTree.xID) {
+                                    $oldTree.handleCrossTreeNodeDragCancelEvent(evnt);
+                                }
+                            }
+                            handleNodeDragEndClearStatus($xeTree);
+                            return errRest;
+                        }
+                        let insertRest = Promise.resolve();
+                        const dragList = XEUtils.toTreeArray([dragNode], {
+                            updated: true,
+                            children: mapChildrenField
+                        });
+                        $oldTree.handleCrossTreeNodeDragFinishEvent(evnt);
+                        if (prevDragNode) {
+                            dragNode[parentField] = prevDragNode[parentField];
+                        }
+                        else {
+                            dragNode[parentField] = null;
+                        }
+                        dragList.forEach(item => {
+                            item[childrenField] = undefined;
+                            item[mapChildrenField] = undefined;
+                        });
+                        if (prevDragNode) {
+                            if (prevDragPos === 'bottom') {
+                                insertRest = $xeTree.insertNextAt(dragList, prevDragNode);
+                            }
+                            else {
+                                insertRest = $xeTree.insertAt(dragList, prevDragNode);
+                            }
+                        }
+                        else {
+                            insertRest = $xeTree.insert(dragList);
+                        }
+                        $xeTree.dispatchEvent('node-insert-dragend', {
+                            oldNode,
+                            newNode: prevDragNode,
+                            dragNode,
+                            dragPos: prevDragPos,
+                            dragToChild: isDragToChildFlag,
+                            offsetIndex: dragOffsetIndex
+                        }, evnt);
+                        clearNodeDragData($xeTree);
+                        insertRest.then(() => {
+                            const { treeList } = reactData;
+                            const { nodeMaps } = internalData;
+                            const oldNodeid = $xeTree.getNodeId(dragNode);
+                            const oldNodeRest = nodeMaps[oldNodeid];
+                            let dragNodeHeight = 0;
+                            let rsIndex = -1;
+                            if (oldNodeRest) {
+                                if (animation) {
+                                    const oldItemEl = el.querySelector(`.vxe-tree--node-wrapper[nodeid="${oldNodeid}"]`);
+                                    const targetItemEl = oldItemEl;
+                                    if (targetItemEl) {
+                                        dragNodeHeight = targetItemEl.offsetHeight;
+                                    }
+                                }
+                                rsIndex = oldNodeRest.$index;
+                            }
+                            const dragRangeList = rsIndex > -1 ? treeList.slice(rsIndex) : [];
+                            if (animation && dragNodeHeight && dragRangeList.length) {
+                                const wrapperEl = el;
+                                const dtClss = [];
+                                dragRangeList.forEach(item => {
+                                    const nodeid = $xeTree.getNodeId(item);
+                                    dtClss.push(`.vxe-tree--node-wrapper[nodeid="${nodeid}"]`);
+                                });
+                                const dtTrList = wrapperEl.querySelectorAll(dtClss.join(','));
+                                moveRowAnimateToTb(dtTrList, -dragNodeHeight);
+                            }
+                        });
+                    });
+                }
+            }
         },
         hideCrossTreeNodeDropClearStatus() {
             const $xeTree = this;
@@ -2598,9 +2868,9 @@ export default {
         getCheckboxIndeterminateNodes() {
             const $xeTree = this;
             const internalData = $xeTree.internalData;
-            const { nodeMaps, indeterminateRowMaps } = internalData;
+            const { nodeMaps, indeterminateNodeMaps } = internalData;
             const list = [];
-            XEUtils.each(indeterminateRowMaps, (item, nodeid) => {
+            XEUtils.each(indeterminateNodeMaps, (item, nodeid) => {
                 const nodeItem = nodeMaps[nodeid];
                 if (nodeItem) {
                     list.push(nodeItem.item);
@@ -2611,10 +2881,11 @@ export default {
         handleNodeDragMousedownEvent(evnt, params) {
             const $xeTree = this;
             const reactData = $xeTree.reactData;
+            const crossTreeDragNodeInfo = getCrossTreeDragNodeInfo($xeTree);
             evnt.stopPropagation();
             const { node } = params;
             const dragConfig = $xeTree.computeDragOpts;
-            const { trigger, dragStartMethod } = dragConfig;
+            const { isCrossTreeDrag, trigger, dragStartMethod } = dragConfig;
             const dragEl = evnt.currentTarget;
             const itemEl = trigger === 'node' ? dragEl : dragEl.parentElement.parentElement;
             clearNodeDropOrigin($xeTree);
@@ -2624,10 +2895,15 @@ export default {
                 hideDropTip($xeTree);
                 return;
             }
+            if (isCrossTreeDrag) {
+                crossTreeDragNodeInfo.node = node;
+                crossTreeDragNodeObj = { $oldTree: $xeTree, $newTree: null };
+            }
             reactData.dragNode = node;
+            reactData.isCrossDragNode = false;
             itemEl.draggable = true;
             updateNodeDropOrigin($xeTree, node);
-            updateRowDropTipContent($xeTree, itemEl);
+            updateNodeDropTipContent($xeTree, itemEl);
             $xeTree.dispatchEvent('node-dragstart', params, evnt);
         },
         handleNodeDragMouseupEvent() {
@@ -2648,6 +2924,18 @@ export default {
             const { dragNode } = reactData;
             const { nodeMaps, prevDragNode, prevDragPos, prevDragToChild } = internalData;
             const hasChildField = $xeTree.computeHasChildField;
+            const dragConfig = $xeTree.computeDragOpts;
+            const { isCrossDrag, isCrossTreeDrag } = dragConfig;
+            // 跨树拖拽
+            if (isCrossTreeDrag && crossTreeDragNodeObj) {
+                const { $newTree } = crossTreeDragNodeObj;
+                if ($newTree && $newTree.xID !== $xeTree.xID) {
+                    if (isCrossDrag) {
+                        $newTree.handleCrossTreeNodeDragInsertEvent(evnt);
+                    }
+                    return;
+                }
+            }
             if (lazy && prevDragToChild) {
                 // 懒加载
                 const newNodeid = $xeTree.getNodeId(prevDragNode);
@@ -2676,7 +2964,7 @@ export default {
             const dragConfig = $xeTree.computeDragOpts;
             const parentField = $xeTree.computeParentField;
             const hasChildField = $xeTree.computeHasChildField;
-            const { isCrossDrag, isPeerDrag, isToChildDrag } = dragConfig;
+            const { isCrossTreeDrag, isCrossDrag, isPeerDrag, isToChildDrag } = dragConfig;
             if (!dragNode && !isCrossDrag) {
                 evnt.preventDefault();
             }
@@ -2692,6 +2980,32 @@ export default {
                 internalData.prevDragToChild = !!(transform && (isCrossDrag && isToChildDrag) && isControlKey);
                 internalData.prevDragNode = node;
                 internalData.prevDragPos = dragPos;
+                // 跨树拖拽
+                if (isCrossTreeDrag && isCrossDrag && crossTreeDragNodeObj) {
+                    const { $oldTree, $newTree } = crossTreeDragNodeObj;
+                    if ($oldTree) {
+                        const oldTreeReactData = $oldTree.reactData;
+                        if ($oldTree.xID === $xeTree.xID) {
+                            if ($newTree) {
+                                $newTree.hideCrossTreeNodeDropClearStatus();
+                            }
+                            reactData.isCrossDragNode = false;
+                            oldTreeReactData.isCrossDragNode = false;
+                            crossTreeDragNodeObj.$newTree = null;
+                        }
+                        else if (isCrossDrag) {
+                            if ($newTree && $newTree.xID !== $xeTree.xID) {
+                                $newTree.hideCrossTreeNodeDropClearStatus();
+                            }
+                            $oldTree.hideCrossTreeNodeDropClearStatus();
+                            oldTreeReactData.isCrossDragNode = true;
+                            reactData.dragTipText = oldTreeReactData.dragTipText;
+                            crossTreeDragNodeObj.$newTree = $xeTree;
+                            showDropTip($xeTree, evnt, itemEl, true, dragPos);
+                            return;
+                        }
+                    }
+                }
                 if ((dragNode && $xeTree.getNodeId(dragNode) === nodeid) ||
                     (isControlKey && lazy && node[hasChildField] && nodeItem && !nodeItem.treeLoaded) ||
                     (!isCrossDrag && transform && (isPeerDrag ? dragNode[parentField] !== node[parentField] : nodeItem.level))) {
@@ -3025,11 +3339,16 @@ export default {
             const radioOpts = $xeTree.computeRadioOpts;
             const checkboxOpts = $xeTree.computeCheckboxOpts;
             const loadingOpts = $xeTree.computeLoadingOpts;
-            const isRowHover = $xeTree.computeIsRowHover;
+            const isNodeHover = $xeTree.computeIsNodeHover;
             const treeStyle = $xeTree.computeTreeStyle;
+            const dragOpts = $xeTree.computeDragOpts;
             const loadingSlot = slots.loading;
             const headerSlot = slots.header;
             const footerSlot = slots.footer;
+            const teOns = {};
+            if (dragOpts.isCrossTreeDrag && !treeList.length) {
+                teOns.dragover = $xeTree.handleCrossTreeNodeDragoverEmptyEvent;
+            }
             return h('div', {
                 ref: 'refElem',
                 class: ['vxe-tree', {
@@ -3037,10 +3356,11 @@ export default {
                         'show--line': showLine,
                         'checkbox--highlight': checkboxOpts.highlight,
                         'radio--highlight': radioOpts.highlight,
-                        'node--hover': isRowHover,
+                        'node--hover': isNodeHover,
                         'node--trigger': trigger === 'node',
                         'is--loading': loading
-                    }]
+                    }],
+                on: teOns
             }, [
                 headerSlot
                     ? h('div', {