vxe-pc-ui 4.15.13 → 4.15.14

package/lib/index.umd.js

@@ -4657,7 +4657,7 @@ function checkDynamic() {
 const {
   log: log_log
 } = VxeUI;
-const uiVersion = `ui v${"4.15.13"}`;
+const uiVersion = `ui v${"4.15.14"}`;
 function createComponentLog(name) {
   const tableVersion = VxeUI.tableVersion ? `table v${VxeUI.tableVersion}` : '';
   const ganttVersion = VxeUI.ganttVersion ? `gantt v${VxeUI.ganttVersion}` : '';
@@ -4675,7 +4675,7 @@ const errLog = log_log.create('error', uiVersion);
 
 
 
-const ui_version = "4.15.13";
+const ui_version = "4.15.14";
 VxeUI.uiVersion = ui_version;
 VxeUI.dynamicApp = dynamicApp;
 function config(options) {
@@ -4850,7 +4850,10 @@ setConfig({
   formView: {},
   icon: {},
   iconPicker: {
-    icons: ['home', 'company', 'comment', 'setting', 'send', 'envelope', 'envelope-open', 'bell', 'search', 'print', 'pc', 'goods', 'chart-line', 'edit', 'delete', 'save', 'folder', 'microphone', 'flag', 'link', 'location', 'sunny', 'rmb', 'usd', 'user', 'add-user', 'add-users', 'star', 'unlock', 'time', 'text', 'feedback', 'calendar', 'association-form', 'cloud-download', 'cloud-upload', 'file', 'subtable', 'chart-bar-x', 'chart-bar-y', 'chart-line', 'chart-pie', 'chart-radar']
+    icons: ['home', 'company', 'comment', 'setting', 'send', 'envelope', 'envelope-open', 'bell', 'search', 'print', 'pc', 'goods', 'chart-line', 'edit', 'delete', 'save', 'folder', 'microphone', 'flag', 'link', 'location', 'sunny', 'rmb', 'usd', 'user', 'add-user', 'add-users', 'star', 'unlock', 'time', 'text', 'feedback', 'calendar', 'association-form', 'cloud-download', 'cloud-upload', 'file', 'subtable', 'chart-bar-x', 'chart-bar-y', 'chart-line', 'chart-pie', 'chart-radar'],
+    popupConfig: {
+      // chunkSize: 4
+    }
   },
   image: {
     draggable: null,
@@ -5644,6 +5647,9 @@ setIcon({
       fixedRight: '冻结在右侧',
       cancelFixed: '取消冻结列'
     },
+    iconPicker: {
+      search: '搜索'
+    },
     datePicker: {
       yearTitle: '{0} 年'
     },
@@ -12887,14 +12893,22 @@ function list_createInternalData() {
       }
     };
     const handleRowClickEvent = (evnt, row) => {
+      const {
+        showRadio,
+        showCheckbox
+      } = props;
       const {
         currentRow
       } = internalData;
+      const radioOpts = computeRadioOpts.value;
+      const checkboxOpts = computeCheckboxOpts.value;
       const rowOpts = computeRowOpts.value;
       const {
         isCurrent
       } = rowOpts;
       let triggerCurrent = false;
+      let triggerRadio = false;
+      let triggerCheckbox = false;
       if (isCurrent) {
         triggerCurrent = true;
         changeCurrentEvent(evnt, row);
@@ -12902,9 +12916,19 @@ function list_createInternalData() {
         internalData.currentRow = null;
         reactData.currRowFlag++;
       }
+      if (showRadio && radioOpts.trigger === 'row') {
+        triggerRadio = true;
+        changeRadioEvent(evnt, row);
+      }
+      if (showCheckbox && checkboxOpts.trigger === 'row') {
+        triggerCheckbox = true;
+        changeCheckboxEvent(evnt, row);
+      }
       dispatchEvent('row-click', {
         row,
-        triggerCurrent
+        triggerCurrent,
+        triggerRadio,
+        triggerCheckbox
       }, evnt);
     };
     const handleRowDblclickEvent = (evnt, row) => {
@@ -18981,7 +19005,9 @@ const Checkbox = VxeCheckbox;
         checked: isChecked,
         onChange: changeEvent
       }), (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('span', {
-        class: 'vxe-checkbox--label'
+        class: ['vxe-checkbox--label', {
+          'is--disabled': isDisabled
+        }]
       }, slots.default ? slots.default({}) : getFuncText(content))]);
     };
     $xeCheckboxButton.renderVN = renderVN;
@@ -19032,6 +19058,10 @@ function group_createInternalData() {
       type: Boolean,
       default: null
     },
+    status: {
+      type: String,
+      default: () => getConfig().checkboxGroup.status
+    },
     max: {
       type: [String, Number],
       default: null
@@ -19194,6 +19224,7 @@ function group_createInternalData() {
     Object.assign($xeCheckboxGroup, checkboxGroupMethods, checkboxGroupPrivateMethods);
     const renderVN = () => {
       const {
+        status,
         options
       } = props;
       const defaultSlot = slots.default;
@@ -19204,6 +19235,7 @@ function group_createInternalData() {
       const isDisabled = computeIsDisabled.value;
       return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
         class: ['vxe-checkbox-group', {
+          [`theme--${status}`]: status,
           'is--readonly': isReadonly,
           'is--disabled': isDisabled
         }]
@@ -32382,6 +32414,28 @@ const Icon = VxeIcon;
 
 
 
+
+
+function icon_picker_createReactData() {
+  return {
+    initialized: false,
+    selectIcon: '',
+    panelIndex: 0,
+    panelStyle: {},
+    panelPlacement: null,
+    visiblePanel: false,
+    isAniVisible: false,
+    isActivated: false,
+    searchValue: '',
+    iconGroups: []
+  };
+}
+function icon_picker_createInternalData() {
+  return {
+    fullList: []
+    // hpTimeout: undefined
+  };
+}
 /* harmony default export */ var icon_picker = (defineVxeComponent({
   name: 'VxeIconPicker',
   props: {
@@ -32410,6 +32464,11 @@ const Icon = VxeIcon;
       type: Boolean,
       default: null
     },
+    filterable: {
+      type: Boolean,
+      default: () => getConfig().iconPicker.filterable
+    },
+    filterConfig: Object,
     icons: Array,
     placement: String,
     popupConfig: Object,
@@ -32432,22 +32491,12 @@ const Icon = VxeIcon;
     const {
       computeSize
     } = useSize(props);
-    const reactData = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.reactive)({
-      initialized: false,
-      selectIcon: `${props.modelValue || ''}`,
-      panelIndex: 0,
-      panelStyle: {},
-      panelPlacement: null,
-      visiblePanel: false,
-      isAniVisible: false,
-      isActivated: false
-    });
-    const internalData = {
-      // hpTimeout: undefined
-    };
+    const reactData = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.reactive)(icon_picker_createReactData());
+    const internalData = icon_picker_createInternalData();
     const refElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const refInput = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const refOptionPanel = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
+    const refInpSearch = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const refMaps = {
       refElem
     };
@@ -32515,6 +32564,23 @@ const Icon = VxeIcon;
       }
       return getI18n('vxe.base.pleaseSelect');
     });
+    const computePanelStyle = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
+      const popupOpts = computePopupOpts.value;
+      const {
+        chunkSize,
+        height,
+        maxHeight
+      } = popupOpts;
+      const stys = {
+        '--vxe-ui-icon-picker-item-width': `${100 / (chunkSize || 4)}%`
+      };
+      if (height) {
+        stys['--vxe-ui-icon-picker-panel-height'] = toCssUnit(height);
+      } else if (maxHeight) {
+        stys['--vxe-ui-icon-picker-panel-max-height'] = toCssUnit(maxHeight);
+      }
+      return stys;
+    });
     const computeIconList = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
       let {
         icons
@@ -32536,13 +32602,12 @@ const Icon = VxeIcon;
         };
       });
     });
+    const computeFilterOpts = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
+      return Object.assign({}, getConfig().iconPicker.filterConfig, props.filterConfig);
+    });
     const computePopupOpts = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
       return Object.assign({}, getConfig().iconPicker.popupConfig, props.popupConfig);
     });
-    const computeIconGroupList = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
-      const iconList = computeIconList.value;
-      return external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().chunk(iconList, 4);
-    });
     const computeSelectIconItem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
       const {
         selectIcon
@@ -32566,6 +32631,9 @@ const Icon = VxeIcon;
       const panelElem = refOptionPanel.value;
       const btnTransfer = computeBtnTransfer.value;
       const popupOpts = computePopupOpts.value;
+      const {
+        width
+      } = popupOpts;
       const handleStyle = () => {
         const ppObj = updatePanelPlacement(targetElem, panelElem, {
           placement: popupOpts.placement || placement,
@@ -32575,6 +32643,12 @@ const Icon = VxeIcon;
         const panelStyle = Object.assign(ppObj.style, {
           zIndex: panelIndex
         });
+        if (width) {
+          Object.assign(panelStyle, {
+            width: toCssUnit(width),
+            minWidth: undefined
+          });
+        }
         reactData.panelStyle = panelStyle;
         reactData.panelPlacement = ppObj.placement;
       };
@@ -32610,6 +32684,39 @@ const Icon = VxeIcon;
         reactData.isAniVisible = false;
       }, 350);
     };
+    const handleData = () => {
+      const {
+        modelValue
+      } = props;
+      const {
+        searchValue
+      } = reactData;
+      const filterOpts = computeFilterOpts.value;
+      const {
+        filterMethod
+      } = filterOpts;
+      const popupOpts = computePopupOpts.value;
+      const {
+        chunkSize
+      } = popupOpts;
+      const iconList = computeIconList.value;
+      let visibleList = iconList;
+      if (searchValue) {
+        const searchTxt = `${searchValue}`.toLowerCase();
+        visibleList = iconList.filter(item => {
+          if (filterMethod) {
+            return filterMethod({
+              option: item,
+              value: modelValue,
+              searchValue: searchTxt,
+              $iconPicker: $xeIconPicker
+            });
+          }
+          return item.title && `${item.title}`.toLowerCase().indexOf(searchTxt) > -1 || item.icon && `${item.icon}`.indexOf(searchTxt) > -1;
+        });
+      }
+      reactData.iconGroups = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().chunk(visibleList, chunkSize || 4);
+    };
     const changeEvent = (evnt, selectValue) => {
       reactData.selectIcon = selectValue;
       if (selectValue !== props.modelValue) {
@@ -32804,19 +32911,30 @@ const Icon = VxeIcon;
       changeEvent(evnt, value);
       hideOptionPanel();
     };
+    const modelSearchEvent = value => {
+      reactData.searchValue = value;
+    };
+    const focusSearchEvent = () => {
+      reactData.isActivated = true;
+    };
+    const handleSearchEvent = () => {
+      handleData();
+    };
+    const triggerSearchEvent = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().debounce(handleSearchEvent, 350, {
+      trailing: true
+    });
     Object.assign($xeIconPicker, iconPickerMethods);
     const renderIconWrapper = () => {
       const {
         showIconTitle
       } = props;
       const {
-        selectIcon
+        selectIcon,
+        iconGroups
       } = reactData;
-      const iconGroupList = computeIconGroupList.value;
-      const isDisabled = computeIsDisabled.value;
       return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
         class: 'vxe-ico-picker--list-wrapper'
-      }, iconGroupList.map(list => {
+      }, iconGroups.map(list => {
         return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
           class: 'vxe-ico-picker--list'
         }, list.map(item => {
@@ -32824,26 +32942,29 @@ const Icon = VxeIcon;
             iconRender
           } = item;
           const compConf = iconRender ? renderer.get(iconRender.name) : null;
-          const oIconMethod = compConf ? compConf.renderIconPickerOptionIcon : null;
+          const iconMethod = compConf ? compConf.renderIconPickerOptionIcon : null;
           return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
             class: ['vxe-ico-picker--item', {
               'is--selected': selectIcon === item.icon
-            }],
+            }]
+          }, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+            class: 'vxe-ico-picker--item-inner',
             onClick(evnt) {
+              const isDisabled = computeIsDisabled.value;
               if (!isDisabled) {
                 handleClickIconEvent(evnt, item);
               }
             }
           }, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
             class: 'vxe-ico-picker--item-icon'
-          }, oIconMethod && iconRender ? vn_getSlotVNs(oIconMethod(iconRender, {
+          }, iconMethod && iconRender ? vn_getSlotVNs(iconMethod(iconRender, {
             $iconPicker: $xeIconPicker,
             option: item
           })) : [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('i', {
             class: item.icon || ''
           })]), showIconTitle ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
             class: 'vxe-ico-picker--item-title'
-          }, `${item.title || ''}`) : renderEmptyElement($xeIconPicker)]);
+          }, `${item.title || ''}`) : renderEmptyElement($xeIconPicker)])]);
         }));
       }));
     };
@@ -32878,7 +32999,8 @@ const Icon = VxeIcon;
     const renderVN = () => {
       const {
         className,
-        clearable
+        clearable,
+        filterable
       } = props;
       const {
         initialized,
@@ -32892,6 +33014,7 @@ const Icon = VxeIcon;
       const btnTransfer = computeBtnTransfer.value;
       const formReadonly = computeFormReadonly.value;
       const inpPlaceholder = computeInpPlaceholder.value;
+      const panelStyle = computePanelStyle.value;
       const popupOpts = computePopupOpts.value;
       const ppClassName = popupOpts.className || props.popupClassName;
       if (formReadonly) {
@@ -32950,23 +33073,47 @@ const Icon = VxeIcon;
         placement: reactData.panelPlacement,
         style: reactData.panelStyle
       }, [initialized && (visiblePanel || isAniVisible) ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
-        class: 'vxe-ico-picker--panel-wrapper'
-      }, [renderIconWrapper()]) : renderEmptyElement($xeIconPicker)])])]);
+        class: 'vxe-ico-picker--panel-wrapper',
+        style: panelStyle
+      }, [filterable ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+        class: 'vxe-ico-picker--panel-search'
+      }, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(input, {
+        ref: refInpSearch,
+        class: 'vxe-ico-picker-search--input',
+        modelValue: reactData.searchValue,
+        type: 'text',
+        clearable: true,
+        disabled: false,
+        readonly: false,
+        placeholder: getI18n('vxe.iconPicker.search'),
+        prefixIcon: getIcon().INPUT_SEARCH,
+        'onUpdate:modelValue': modelSearchEvent,
+        onFocus: focusSearchEvent,
+        onChange: triggerSearchEvent,
+        onSearch: triggerSearchEvent
+      })]) : renderEmptyElement($xeIconPicker), renderIconWrapper()]) : renderEmptyElement($xeIconPicker)])])]);
     };
+    reactData.selectIcon = `${props.modelValue || ''}`;
+    handleData();
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.modelValue, val => {
       reactData.selectIcon = `${val || ''}`;
     });
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(computeIconList, () => {
+      handleData();
+    });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.onMounted)(() => {
       globalEvents.on($xeIconPicker, 'mousewheel', handleGlobalMousewheelEvent);
       globalEvents.on($xeIconPicker, 'mousedown', handleGlobalMousedownEvent);
       globalEvents.on($xeIconPicker, 'keydown', handleGlobalKeydownEvent);
       globalEvents.on($xeIconPicker, 'blur', handleGlobalBlurEvent);
     });
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.onUnmounted)(() => {
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.onBeforeUnmount)(() => {
       globalEvents.off($xeIconPicker, 'mousewheel');
       globalEvents.off($xeIconPicker, 'mousedown');
       globalEvents.off($xeIconPicker, 'keydown');
       globalEvents.off($xeIconPicker, 'blur');
+      external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().assign(reactData, icon_picker_createReactData());
+      external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().assign(internalData, icon_picker_createInternalData());
     });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.provide)('$xeIconPicker', $xeIconPicker);
     $xeIconPicker.renderVN = renderVN;
@@ -42092,7 +42239,9 @@ const Radio = VxeRadio;
         onChange: changeEvent,
         onClick: clickEvent
       }), (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('span', {
-        class: 'vxe-radio--label'
+        class: ['vxe-radio--label', {
+          'is--disabled': isDisabled
+        }]
       }, defaultSlot ? defaultSlot({}) : getFuncText(content))]);
     };
     $xeRadioButton.renderVN = renderVN;
@@ -42142,6 +42291,10 @@ function src_group_createInternalData() {
       default: null
     },
     type: String,
+    status: {
+      type: String,
+      default: () => getConfig().radioGroup.status
+    },
     options: Array,
     optionProps: Object,
     strict: {
@@ -42289,7 +42442,8 @@ function src_group_createInternalData() {
     const renderVN = () => {
       const {
         options,
-        type
+        type,
+        status
       } = props;
       const vSize = computeSize.value;
       const defaultSlot = slots.default;
@@ -42299,6 +42453,7 @@ function src_group_createInternalData() {
       const btnComp = type === 'button' ? radio_src_button : src_radio;
       return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
         class: ['vxe-radio-group', {
+          [`theme--${status}`]: status,
           [`size--${vSize}`]: vSize
         }]
       }, defaultSlot ? defaultSlot({}) : options ? options.map(item => {
@@ -48296,6 +48451,21 @@ function calcTreeLine($xeTree, node, prevNode) {
   }
   return (rowHeight || 28) * expandSize - (prevNode ? 1 : 12);
 }
+function getItemCacheObj(item) {
+  return {
+    item,
+    index: -1,
+    $index: -1,
+    _index: -1,
+    items: [],
+    parent: null,
+    nodes: [],
+    level: 0,
+    treeIndex: -1,
+    lineCount: 0,
+    treeLoaded: false
+  };
+}
 ;// ./packages/tree/src/store.ts
 
 // 跨树拖拽
@@ -48324,6 +48494,7 @@ function getCrossTreeDragNodeInfo() {
 
 
 const {
+  warnLog: tree_warnLog,
   errLog: tree_errLog
 } = createComponentLog('tree');
 const {
@@ -48359,6 +48530,8 @@ function tree_createInternalData() {
       offsetSize: 0,
       rowHeight: 0
     },
+    removeRowMaps: {},
+    insertRowMaps: {},
     // prevDragNode: null,
     // prevDragToChild: false,
     // prevDragPos: ''
@@ -48380,14 +48553,13 @@ function tree_createReactData() {
     treeList: [],
     updateExpandedFlag: 1,
     updateCheckboxFlag: 1,
+    insertRowFlag: 1,
+    removeRowFlag: 1,
     dragNode: null,
     dragTipText: ''
   };
 }
-// let crossTreeDragNodeObj: {
-//   $oldTree: VxeTreeConstructor & VxeTreePrivateMethods
-//   $newTree: (VxeTreeConstructor & VxeTreePrivateMethods) | null
-// } | null = null
+let crossTreeDragNodeObj = null;
 /* harmony default export */ var tree = (defineVxeComponent({
   name: 'VxeTree',
   props: {
@@ -48509,7 +48681,7 @@ function tree_createReactData() {
     },
     virtualYConfig: Object
   },
-  emits: ['update:modelValue', 'update:checkNodeKey', 'update:checkNodeKeys', 'node-click', 'node-dblclick', 'current-change', 'radio-change', 'checkbox-change', 'load-success', 'load-error', 'scroll', 'node-dragstart', 'node-dragover', 'node-dragend', 'node-expand', 'node-menu', 'menu-click'],
+  emits: ['update:modelValue', 'update:checkNodeKey', 'update:checkNodeKeys', 'node-click', 'node-dblclick', 'current-change', 'radio-change', 'checkbox-change', 'load-success', 'load-error', 'scroll', 'node-dragstart', 'node-dragover', 'node-dragend', 'node-remove-dragend', 'node-insert-dragend', 'node-expand', 'node-menu', 'menu-click'],
   setup(props, context) {
     const {
       emit,
@@ -49868,6 +50040,177 @@ function tree_createReactData() {
       }
       recalculate();
     };
+    const insertTreeNode = (newRecords, isAppend) => {
+      const {
+        treeFullData,
+        nodeMaps
+      } = internalData;
+      const keyField = computeKeyField.value;
+      const parentField = computeParentField.value;
+      const childrenField = computeChildrenField.value;
+      const mapChildrenField = computeMapChildrenField.value;
+      const funcName = isAppend ? 'push' : 'unshift';
+      newRecords.forEach(item => {
+        const parentRowId = item[parentField];
+        const nodeid = getNodeId(item);
+        const matchObj = parentRowId ? external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().findTree(treeFullData, item => parentRowId === item[keyField], {
+          children: mapChildrenField
+        }) : null;
+        const itemRest = getItemCacheObj(item);
+        if (matchObj) {
+          const {
+            item: parentItem
+          } = matchObj;
+          const parentRest = nodeMaps[getNodeId(parentItem)];
+          const parentLevel = parentRest ? parentRest.level : 0;
+          let pChilds = parentItem[childrenField];
+          let pMapChilds = parentItem[mapChildrenField];
+          if (!external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isArray(pChilds)) {
+            pChilds = parentItem[childrenField] = [];
+          }
+          if (!external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isArray(pMapChilds)) {
+            pMapChilds = parentItem[mapChildrenField] = [];
+          }
+          itemRest.parent = parentItem;
+          itemRest.items = pChilds;
+          itemRest.level = parentLevel;
+          pChilds[funcName](item);
+          pMapChilds[funcName](item);
+        } else {
+          if (parentRowId) {
+            tree_warnLog('vxe.error.unableInsert');
+          }
+          treeFullData[funcName](item);
+        }
+        nodeMaps[nodeid] = itemRest;
+      });
+    };
+    const handleInsertNodeAt = (records, targetNodeOrNodeid, isInsertNextNode) => {
+      const {
+        transform
+      } = props;
+      const {
+        treeFullData,
+        nodeMaps
+      } = internalData;
+      const keyField = computeKeyField.value;
+      const parentField = computeParentField.value;
+      const childrenField = computeChildrenField.value;
+      const mapChildrenField = computeMapChildrenField.value;
+      if (!transform) {
+        tree_errLog('vxe.error.reqSupportProp', ['insert() | insertAt() | insertNextAt()', 'transform']);
+        return Promise.resolve({
+          node: null,
+          nodes: []
+        });
+      }
+      if (!external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isArray(records)) {
+        records = [records];
+      }
+      let targetNode = targetNodeOrNodeid;
+      if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isString(targetNodeOrNodeid) || external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isNumber(targetNodeOrNodeid)) {
+        const nodeRest = nodeMaps[targetNodeOrNodeid];
+        if (nodeRest) {
+          targetNode = nodeRest.item;
+        }
+      }
+      if (!records.length) {
+        return Promise.resolve({
+          node: null,
+          nodes: []
+        });
+      }
+      const newRecords = records.map(record => external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().assign({
+        [mapChildrenField]: [],
+        [childrenField]: []
+      }, record));
+      const treeRecords = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toArrayTree(newRecords, {
+        key: keyField,
+        parentKey: parentField,
+        children: childrenField
+      });
+      if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eqNull(targetNode)) {
+        insertTreeNode(newRecords, false);
+      } else {
+        if (targetNode === -1) {
+          insertTreeNode(newRecords, true);
+        } else {
+          const matchMapObj = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().findTree(treeFullData, item => targetNode[keyField] === item[keyField], {
+            children: mapChildrenField
+          });
+          if (matchMapObj) {
+            const {
+              parent: parentNode
+            } = matchMapObj;
+            const parentMapChilds = parentNode ? parentNode[mapChildrenField] : treeFullData;
+            const parentRest = nodeMaps[getNodeId(parentNode)];
+            const parentLevel = parentRest ? parentRest.level : 0;
+            treeRecords.forEach((row, i) => {
+              if (parentNode) {
+                if (row[parentField] !== parentNode[keyField]) {
+                  tree_errLog('vxe.error.errProp', [`${parentField}=${row[parentField]}`, `${parentField}=${parentNode[keyField]}`]);
+                  row[parentField] = parentNode[keyField];
+                }
+              } else {
+                if (row[parentField] !== null) {
+                  if (!external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eqNull(row[parentField])) {
+                    tree_errLog('vxe.error.errProp', [`${parentField}=${row[parentField]}`, 'null']);
+                  }
+                  row[parentField] = null;
+                }
+              }
+              let targetIndex = matchMapObj.index + i;
+              if (isInsertNextNode) {
+                targetIndex = targetIndex + 1;
+              }
+              parentMapChilds.splice(targetIndex, 0, row);
+            });
+            external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eachTree(treeRecords, item => {
+              const nodeid = getNodeId(item);
+              const nodeRest = getItemCacheObj(item);
+              nodeRest.level = parentLevel;
+              if (item[childrenField]) {
+                item[mapChildrenField] = item[childrenField];
+              }
+              nodeMaps[nodeid] = nodeRest;
+            }, {
+              children: childrenField
+            });
+            // 源
+            if (parentNode) {
+              const matchObj = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().findTree(treeFullData, item => targetNode[keyField] === item[keyField], {
+                children: childrenField
+              });
+              if (matchObj) {
+                const parentChilds = matchObj.items;
+                let targetIndex = matchObj.index;
+                if (isInsertNextNode) {
+                  targetIndex = targetIndex + 1;
+                }
+                parentChilds.splice(targetIndex, 0, ...treeRecords);
+              }
+            }
+          } else {
+            tree_warnLog('vxe.error.unableInsert');
+            insertTreeNode(newRecords, true);
+          }
+        }
+      }
+      reactData.insertRowFlag++;
+      cacheNodeMap();
+      handleData(true);
+      updateAfterDataIndex();
+      updateCheckboxStatus();
+      if (reactData.scrollYLoad) {
+        updateYSpace();
+      }
+      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)().then(() => {
+        return {
+          node: newRecords.length ? newRecords[newRecords.length - 1] : null,
+          nodes: newRecords
+        };
+      });
+    };
     const treeMethods = {
       dispatchEvent,
       getNodeId,
@@ -50349,7 +50692,110 @@ function tree_createReactData() {
         }
         return recalculate();
       },
-      clearScroll
+      clearScroll,
+      insert(records) {
+        return handleInsertNodeAt(records, null);
+      },
+      insertAt(records, targetNodeOrNodeid) {
+        return handleInsertNodeAt(records, targetNodeOrNodeid);
+      },
+      insertNextAt(records, targetNodeOrNodeid) {
+        return handleInsertNodeAt(records, targetNodeOrNodeid, true);
+      },
+      remove(nodes) {
+        const {
+          transform
+        } = props;
+        const {
+          treeFullData
+        } = internalData;
+        const childrenField = computeChildrenField.value;
+        const mapChildrenField = computeMapChildrenField.value;
+        if (!transform) {
+          tree_errLog('vxe.error.reqSupportProp', ['remove()', 'transform']);
+          return Promise.resolve({
+            node: null,
+            nodes: []
+          });
+        }
+        let delList = [];
+        if (!nodes) {
+          nodes = treeFullData;
+        } else if (!external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isArray(nodes)) {
+          nodes = [nodes];
+        }
+        if (!nodes.length) {
+          return Promise.resolve({
+            node: null,
+            nodes: []
+          });
+        }
+        // 从数据源中移除
+        if (treeFullData === nodes) {
+          nodes = delList = treeFullData.slice(0);
+          internalData.treeFullData = [];
+        } else {
+          nodes.forEach(item => {
+            const nodeid = getNodeId(item);
+            const matchMapObj = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().findTree(treeFullData, item => nodeid === getNodeId(item), {
+              children: mapChildrenField
+            });
+            if (matchMapObj) {
+              const rItems = matchMapObj.items.splice(matchMapObj.index, 1);
+              delList.push(rItems[0]);
+            }
+            const matchObj = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().findTree(treeFullData, item => nodeid === getNodeId(item), {
+              children: childrenField
+            });
+            if (matchObj) {
+              const rItems = matchObj.items.splice(matchObj.index, 1);
+              delList.push(rItems[0]);
+            }
+          });
+        }
+        reactData.removeRowFlag++;
+        reactData.insertRowFlag++;
+        cacheNodeMap();
+        handleData(true);
+        updateAfterDataIndex();
+        updateCheckboxStatus();
+        if (reactData.scrollYLoad) {
+          updateYSpace();
+        }
+        return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)().then(() => {
+          return recalculate();
+        }).then(() => {
+          return {
+            node: delList.length ? delList[delList.length - 1] : null,
+            nodes: delList
+          };
+        });
+      },
+      getInsertRecords() {
+        const {
+          insertRowMaps
+        } = internalData;
+        const insertRecords = [];
+        external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().each(insertRowMaps, row => {
+          insertRecords.push(row);
+        });
+        return insertRecords;
+      },
+      getRemoveRecords() {
+        const {
+          removeRowMaps
+        } = internalData;
+        const removeRecords = [];
+        external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().each(removeRowMaps, row => {
+          removeRecords.push(row);
+        });
+        return removeRecords;
+      }
+    };
+    const handleNodeDragEndClearStatus = () => {
+      clearNodeDragData();
+      clearCrossTreeDragStatus();
+      recalculate();
     };
     const clearNodeDropOrigin = () => {
       const el = refElem.value;
@@ -50403,7 +50849,7 @@ function tree_createReactData() {
       }
     };
     const clearCrossTreeDragStatus = () => {
-      // crossTreeDragNodeObj = null
+      crossTreeDragNodeObj = null;
       crossTreeDragNodeInfo.node = null;
     };
     const clearDragStatus = () => {
@@ -50800,6 +51246,23 @@ function tree_createReactData() {
         prevDragToChild
       } = internalData;
       const hasChildField = computeHasChildField.value;
+      const dragConfig = computeDragOpts.value;
+      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 = getNodeId(prevDragNode);
@@ -50886,15 +51349,228 @@ function tree_createReactData() {
       /**
        * 处理跨树拖拽完成
        */
-      handleCrossTreeNodeDragFinishEvent() {},
+      handleCrossTreeNodeDragFinishEvent(evnt) {
+        const {
+          treeList
+        } = reactData;
+        const {
+          nodeMaps
+        } = internalData;
+        const dragOpts = computeDragOpts.value;
+        const {
+          animation,
+          isCrossTreeDrag
+        } = dragOpts;
+        const mapChildrenField = computeMapChildrenField.value;
+        const el = refElem.value;
+        if (!el) {
+          return;
+        }
+        if (isCrossTreeDrag && crossTreeDragNodeObj && crossTreeDragNodeInfo) {
+          const {
+            node: dragNode
+          } = crossTreeDragNodeInfo;
+          if (dragNode) {
+            const dragNodeid = 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 = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().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 = getNodeId(item);
+                  dtClss.push(`.vxe-tree--node-wrapper[nodeid="${nodeid}"]`);
+                });
+                const dtTrList = wrapperEl.querySelectorAll(dtClss.join(','));
+                moveRowAnimateToTb(dtTrList, dragNodeHeight);
+              }
+            });
+            dispatchEvent('node-remove-dragend', {
+              node: dragNode
+            }, evnt);
+            handleNodeDragEndClearStatus();
+          }
+        }
+      },
       /**
        * 处理跨树拖至新的空树
        */
-      handleCrossTreeNodeDragInsertEvent() {},
+      handleCrossTreeNodeDragoverEmptyEvent(evnt) {
+        const {
+          treeList
+        } = reactData;
+        const dragOpts = computeDragOpts.value;
+        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(evnt, evnt.currentTarget, true, '');
+            }
+          }
+        }
+      },
       /**
        * 处理跨树拖插入
        */
-      handleCrossTreeNodeDragoverEmptyEvent() {},
+      handleCrossTreeNodeDragInsertEvent(evnt) {
+        const {
+          prevDragNode,
+          prevDragPos,
+          prevDragToChild
+        } = internalData;
+        const dragOpts = computeDragOpts.value;
+        const {
+          animation,
+          isSelfToChildDrag,
+          isCrossTreeDrag,
+          dragEndMethod,
+          dragToChildMethod
+        } = dragOpts;
+        const parentField = computeParentField.value;
+        const mapChildrenField = computeMapChildrenField.value;
+        const childrenField = computeChildrenField.value;
+        // 跨表拖拽
+        if (isCrossTreeDrag && crossTreeDragNodeObj && crossTreeDragNodeInfo) {
+          const {
+            node: oldNode
+          } = crossTreeDragNodeInfo;
+          const {
+            $oldTree
+          } = crossTreeDragNodeObj;
+          const el = refElem.value;
+          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();
+                return errRest;
+              }
+              let insertRest = Promise.resolve();
+              const dragList = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toTreeArray([dragNode], {
+                updated: true,
+                children: mapChildrenField
+              });
+              $oldTree.handleCrossTreeNodeDragFinishEvent(evnt);
+              if (prevDragNode) {
+                dragNode[parentField] = prevDragNode[parentField];
+              } else {
+                dragNode[parentField] = null;
+              }
+              dragList.forEach(row => {
+                row[childrenField] = undefined;
+                row[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();
+              insertRest.then(() => {
+                const {
+                  treeList
+                } = reactData;
+                const {
+                  nodeMaps
+                } = internalData;
+                const oldNodeid = 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 = getNodeId(item);
+                    dtClss.push(`.vxe-tree--node-wrapper[nodeid="${nodeid}"]`);
+                  });
+                  const dtTrList = wrapperEl.querySelectorAll(dtClss.join(','));
+                  moveRowAnimateToTb(dtTrList, -dragNodeHeight);
+                }
+              });
+            });
+          }
+        }
+      },
       hideCrossTreeNodeDropClearStatus() {
         hideDropTip();
       }
@@ -51234,9 +51910,14 @@ function tree_createReactData() {
       const loadingOpts = computeLoadingOpts.value;
       const isRowHover = computeIsRowHover.value;
       const treeStyle = computeTreeStyle.value;
+      const dragOpts = computeDragOpts.value;
       const loadingSlot = slots.loading;
       const headerSlot = slots.header;
       const footerSlot = slots.footer;
+      const teOns = {};
+      if (dragOpts.isCrossTreeDrag && !treeList.length) {
+        teOns.onDragover = $xeTree.handleCrossTreeNodeDragInsertEvent;
+      }
       return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
         ref: refElem,
         class: ['vxe-tree', {
@@ -51247,7 +51928,8 @@ function tree_createReactData() {
           'node--hover': isRowHover,
           'node--trigger': trigger === 'node',
           'is--loading': loading
-        }]
+        }],
+        ...teOns
       }, [headerSlot ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
         ref: refHeaderWrapperElem,
         class: 'vxe-tree--header-wrapper'
@@ -51351,8 +52033,8 @@ function tree_createReactData() {
       if (drag && !transform) {
         tree_errLog('vxe.error.notSupportProp', ['drag', 'transform=false', 'transform=true']);
       }
-      if (dragOpts.isCrossTreeDrag) {
-        tree_errLog('vxe.error.notProp', ['drag-config.isCrossTreeDrag']);
+      if (dragOpts.isCrossTreeDrag && !dragOpts.isCrossDrag) {
+        tree_errLog('vxe.error.reqSupportProp', ['drag-config.isCrossTreeDrag', 'drag-config.isCrossDrag']);
       }
       // if (valueField) {
       //   errLog('vxe.error.delProp', ['value-field', 'value-field'])