vxe-table 4.7.76 → 4.7.78

package/lib/index.umd.js

@@ -1794,6 +1794,8 @@ var core_ = __webpack_require__(4345);
 var external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_ = __webpack_require__(8871);
 var external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default = /*#__PURE__*/__webpack_require__.n(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_);
 ;// CONCATENATED MODULE: ./node_modules/dom-zindex/es/index.esm.js
+var winDom = null;
+var bodyEl = null;
 var storeEl = null;
 var storeId = 'z-index-manage';
 var styleEl = null;
@@ -1804,19 +1806,34 @@ var storeData = {
   m: 1000,
   s: 1000
 };
-function isDocument() {
-  return typeof document !== 'undefined';
+function getDocument() {
+  if (!winDom) {
+    if (typeof document !== 'undefined') {
+      winDom = document;
+    }
+  }
+  return winDom;
+}
+function getBody() {
+  if (winDom && !bodyEl) {
+    bodyEl = winDom.body || winDom.getElementsByTagName('body')[0];
+  }
+  return bodyEl;
 }
 function getDomMaxZIndex() {
   var max = 0;
-  if (isDocument()) {
-    var allElem = document.body.getElementsByTagName('*');
-    for (var i = 0; i < allElem.length; i++) {
-      var elem = allElem[i];
-      if (elem && elem.style && elem.nodeType === 1) {
-        var zIndex = elem.style.zIndex;
-        if (zIndex && /^\d+$/.test(zIndex)) {
-          max = Math.max(max, Number(zIndex));
+  var dom = getDocument();
+  if (dom) {
+    var body = getBody();
+    if (body) {
+      var allElem = body.getElementsByTagName('*');
+      for (var i = 0; i < allElem.length; i++) {
+        var elem = allElem[i];
+        if (elem && elem.style && elem.nodeType === 1) {
+          var zIndex = elem.style.zIndex;
+          if (zIndex && /^\d+$/.test(zIndex)) {
+            max = Math.max(max, Number(zIndex));
+          }
         }
       }
     }
@@ -1825,12 +1842,13 @@ function getDomMaxZIndex() {
 }
 function getStyle() {
   if (!styleEl) {
-    if (isDocument()) {
-      styleEl = document.getElementById(styleId);
+    var dom = getDocument();
+    if (dom) {
+      styleEl = dom.getElementById(styleId);
       if (!styleEl) {
-        styleEl = document.createElement('style');
+        styleEl = dom.createElement('style');
         styleEl.id = styleId;
-        document.getElementsByTagName('head')[0].appendChild(styleEl);
+        dom.getElementsByTagName('head')[0].appendChild(styleEl);
       }
     }
   }
@@ -1844,17 +1862,21 @@ function updateVar() {
     styEl.innerHTML = ':root{' + prefixes + 'main' + propKey + ':' + getCurrent() + ';' + prefixes + 'sub' + propKey + ':' + getSubCurrent() + '}';
   }
 }
-function getDom() {
+function getStoreDom() {
   if (!storeEl) {
-    if (isDocument()) {
-      storeEl = document.getElementById(storeId);
+    var dom = getDocument();
+    if (dom) {
+      storeEl = dom.getElementById(storeId);
       if (!storeEl) {
-        storeEl = document.createElement('div');
-        storeEl.id = storeId;
-        storeEl.style.display = 'none';
-        document.body.appendChild(storeEl);
-        setCurrent(storeData.m);
-        setSubCurrent(storeData.s);
+        var body = getBody();
+        if (body) {
+          storeEl = dom.createElement('div');
+          storeEl.id = storeId;
+          storeEl.style.display = 'none';
+          body.appendChild(storeEl);
+          setCurrent(storeData.m);
+          setSubCurrent(storeData.s);
+        }
       }
     }
   }
@@ -1865,12 +1887,12 @@ function createSetHandle(key) {
     if (value) {
       value = Number(value);
       storeData[key] = value;
-      var doc = getDom();
-      if (doc) {
-        if (doc.dataset) {
-          doc.dataset[key] = value + '';
+      var el = getStoreDom();
+      if (el) {
+        if (el.dataset) {
+          el.dataset[key] = value + '';
         } else {
-          doc.setAttribute('data-' + key, value + '');
+          el.setAttribute('data-' + key, value + '');
         }
       }
     }
@@ -1882,9 +1904,9 @@ var setCurrent = createSetHandle(storeMainKey);
 function createGetHandle(key, nextMethod) {
   return function getCurrent(currZindex) {
     var zIndex;
-    var doc = getDom();
-    if (doc) {
-      var domVal = doc.dataset ? doc.dataset[key] : doc.getAttribute('data-' + key);
+    var el = getStoreDom();
+    if (el) {
+      var domVal = el.dataset ? el.dataset[key] : el.getAttribute('data-' + key);
       if (domVal) {
         zIndex = Number(domVal);
       }
@@ -1976,9 +1998,9 @@ function eqEmptyValue(cellValue) {
 ;// CONCATENATED MODULE: ./packages/ui/index.ts
 
 
-const version = "4.7.76";
+const version = "4.7.78";
 core_.VxeUI.version = version;
-core_.VxeUI.tableVersion = "4.7.76";
+core_.VxeUI.tableVersion = "4.7.78";
 core_.VxeUI.setConfig({
   emptyCell: '　',
   table: {
@@ -2360,7 +2382,7 @@ var es_array_push = __webpack_require__(4114);
 const {
   log: log_log
 } = core_.VxeUI;
-const log_version = `table v${"4.7.76"}`;
+const log_version = `table v${"4.7.78"}`;
 const warnLog = log_log.create('warn', log_version);
 const errLog = log_log.create('error', log_version);
 ;// CONCATENATED MODULE: ./packages/table/src/columnInfo.ts
@@ -3000,7 +3022,7 @@ function assembleColumn($xeTable, elem, column, colgroup) {
     staticColumns
   } = reactData;
   const parentElem = elem.parentNode;
-  const parentColumn = colgroup ? colgroup.column : null;
+  const parentColumn = colgroup ? colgroup.columnConfig : null;
   const parentCols = parentColumn ? parentColumn.children : staticColumns;
   if (parentElem && parentCols) {
     parentCols.splice(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().arrayIndexOf(parentElem.children, elem), 0, column);
@@ -3507,11 +3529,11 @@ const Cell = {
     const cellPlaceholder = editRender ? editRender.placeholder : '';
     return [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('span', {
       class: 'vxe-cell--label'
-    }, editRender && eqEmptyValue(cellValue) ? [
+    }, [
     // 如果设置占位符
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('span', {
+    editRender && eqEmptyValue(cellValue) ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('span', {
       class: 'vxe-cell--placeholder'
-    }, formatText(getFuncText(cellPlaceholder), 1))] : formatText(cellValue, 1))];
+    }, formatText(getFuncText(cellPlaceholder), 1)) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('span', formatText(cellValue, 1))])];
   },
   renderTreeCell(params) {
     return Cell.renderTreeIcon(params, Cell.renderDefaultCell(params));
@@ -4442,25 +4464,31 @@ const columnProps = {
     slots
   }) {
     const refElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
-    const $xeTable = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.inject)('$xeTable', {});
-    const parentColgroup = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.inject)('$xeColgroup', null);
-    const column = cell.createColumn($xeTable, props);
-    column.slots = slots;
+    const $xeTable = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.inject)('$xeTable', null);
+    const $xeColgroup = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.inject)('$xeColgroup', null);
+    if (!$xeTable) {
+      return () => (0,external_commonjs_vue_commonjs2_vue_root_Vue_.createCommentVNode)();
+    }
+    const columnConfig = cell.createColumn($xeTable, props);
+    columnConfig.slots = slots;
     const renderVN = () => {
       return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
         ref: refElem
       });
     };
     const $xeColumn = {
-      column,
+      columnConfig,
       renderVN
     };
-    watchColumn($xeTable, props, column);
+    watchColumn($xeTable, props, columnConfig);
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.onMounted)(() => {
-      assembleColumn($xeTable, refElem.value, column, parentColgroup);
+      const elem = refElem.value;
+      if (elem) {
+        assembleColumn($xeTable, elem, columnConfig, $xeColgroup);
+      }
     });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.onUnmounted)(() => {
-      destroyColumn($xeTable, column);
+      destroyColumn($xeTable, columnConfig);
     });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.provide)('$xeColumn', $xeColumn);
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.provide)('$xeGrid', null);
@@ -4497,21 +4525,27 @@ const Column = VxeColumn;
     slots
   }) {
     const refElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
-    const $xeTable = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.inject)('$xeTable', {});
-    const parentColgroup = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.inject)('$xeColgroup', null);
-    const column = cell.createColumn($xeTable, props);
+    const $xeTable = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.inject)('$xeTable', null);
+    const $xeParentColgroup = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.inject)('$xeColgroup', null);
+    if (!$xeTable) {
+      return () => (0,external_commonjs_vue_commonjs2_vue_root_Vue_.createCommentVNode)();
+    }
+    const columnConfig = cell.createColumn($xeTable, props);
     const columnSlots = {};
     if (slots.header) {
       columnSlots.header = slots.header;
     }
-    column.slots = columnSlots;
-    column.children = [];
-    watchColumn($xeTable, props, column);
+    columnConfig.slots = columnSlots;
+    columnConfig.children = [];
+    watchColumn($xeTable, props, columnConfig);
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.onMounted)(() => {
-      assembleColumn($xeTable, refElem.value, column, parentColgroup);
+      const elem = refElem.value;
+      if (elem) {
+        assembleColumn($xeTable, elem, columnConfig, $xeParentColgroup);
+      }
     });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.onUnmounted)(() => {
-      destroyColumn($xeTable, column);
+      destroyColumn($xeTable, columnConfig);
     });
     const renderVN = () => {
       return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
@@ -4519,7 +4553,7 @@ const Column = VxeColumn;
       }, slots.default ? slots.default() : []);
     };
     const $xeColgroup = {
-      column
+      columnConfig
     };
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.provide)('$xeColgroup', $xeColgroup);
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.provide)('$xeGrid', null);
@@ -7391,9 +7425,16 @@ const {
     };
     if (true) {
       (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)(() => {
+        const customOpts = computeCustomOpts.value;
+        const {
+          mode
+        } = customOpts;
         if (!VxeUIModalComponent) {
           errLog('vxe.error.reqComp', ['vxe-modal']);
         }
+        if (!VxeUIDrawerComponent && mode === 'drawer') {
+          errLog('vxe.error.reqComp', ['vxe-drawer']);
+        }
         if (!VxeUIButtonComponent) {
           errLog('vxe.error.reqComp', ['vxe-button']);
         }
@@ -10468,9 +10509,8 @@ const customStorageKey = 'VXE_CUSTOM_STORE';
       if (rows && !external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isArray(rows)) {
         rows = [rows];
       }
-      rows.forEach(row => tablePrivateMethods.handleSelectRow({
-        row
-      }, !!value, isForce));
+      tablePrivateMethods.handleBatchSelectRows(rows, !!value, isForce);
+      tablePrivateMethods.checkSelectionStatus();
       return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
     };
     const handleCheckedAllCheckboxRow = (value, isForce) => {
@@ -10482,7 +10522,6 @@ const customStorageKey = 'VXE_CUSTOM_STORE';
       } = reactData;
       const {
         afterFullData,
-        afterFullRowMaps,
         checkboxReserveRowMap
       } = internalData;
       const treeOpts = computeTreeOpts.value;
@@ -10496,15 +10535,6 @@ const customStorageKey = 'VXE_CUSTOM_STORE';
       } = checkboxOpts;
       const indeterminateField = checkboxOpts.indeterminateField || checkboxOpts.halfField;
       const selectRowMaps = {};
-      // 疑惑！
-      if (!treeConfig) {
-        external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().each(selectCheckboxMaps, (row, rowid) => {
-          if (!afterFullRowMaps[rowid]) {
-            selectRowMaps[rowid] = row;
-          }
-        });
-      }
-      // 疑惑！
       if (checkStrictly) {
         reactData.isAllSelected = value;
       } else {
@@ -11603,7 +11633,13 @@ const customStorageKey = 'VXE_CUSTOM_STORE';
           if (!external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isArray(rows)) {
             rest = [rows];
           }
-          rest.forEach(item => Object.assign(item, record));
+          const rowkey = getRowkey($xeTable);
+          rest.forEach(row => {
+            const rowid = getRowid($xeTable, row);
+            const newRecord = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().clone(Object.assign({}, record), true);
+            external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().set(newRecord, rowkey, rowid);
+            Object.assign(row, newRecord);
+          });
         }
         return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
       },
@@ -11629,13 +11665,14 @@ const customStorageKey = 'VXE_CUSTOM_STORE';
           const oRow = tableSourceData[rowIndex];
           if (oRow && row) {
             if (field) {
-              const newValue = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().get(record || row, field);
+              const newValue = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().clone(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().get(record || row, field), true);
               external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().set(row, field, newValue);
               external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().set(oRow, field, newValue);
             } else {
-              const newRecord = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().clone({
-                ...record
-              }, true);
+              const rowkey = getRowkey($xeTable);
+              const rowid = getRowid($xeTable, row);
+              const newRecord = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().clone(Object.assign({}, record), true);
+              external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().set(newRecord, rowkey, rowid);
               external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().destructuring(oRow, Object.assign(row, newRecord));
             }
           }
@@ -12513,6 +12550,9 @@ const customStorageKey = 'VXE_CUSTOM_STORE';
        * @param {Boolean} value 是否选中
        */
       setCheckboxRow(rows, value) {
+        if (rows && !external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isArray(rows)) {
+          rows = [rows];
+        }
         return handleCheckedCheckboxRow(rows, value, true);
       },
       isCheckedByCheckboxRow(row) {
@@ -12549,6 +12589,7 @@ const customStorageKey = 'VXE_CUSTOM_STORE';
         tablePrivateMethods.handleSelectRow({
           row
         }, value, true);
+        tablePrivateMethods.checkSelectionStatus();
         return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
       },
       /**
@@ -14891,6 +14932,72 @@ const customStorageKey = 'VXE_CUSTOM_STORE';
         }
       },
       /**
+       * 多行
+       * 多选，行选中事件
+       * value 选中true 不选false 半选-1
+       */
+      handleBatchSelectRows(rows, value, isForce) {
+        const {
+          treeConfig
+        } = props;
+        const {
+          selectCheckboxMaps
+        } = reactData;
+        const selectRowMaps = Object.assign({}, selectCheckboxMaps);
+        const checkboxOpts = computeCheckboxOpts.value;
+        const {
+          checkField,
+          checkStrictly,
+          checkMethod
+        } = checkboxOpts;
+        if (checkField) {
+          if (treeConfig && !checkStrictly) {
+            rows.forEach(row => {
+              tablePrivateMethods.handleSelectRow({
+                row
+              }, value, isForce);
+            });
+          } else {
+            rows.forEach(row => {
+              if (isForce || !checkMethod || checkMethod({
+                row
+              })) {
+                external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().set(row, checkField, value);
+                handleCheckboxReserveRow(row, value);
+              }
+            });
+          }
+        } else {
+          if (treeConfig && !checkStrictly) {
+            rows.forEach(row => {
+              tablePrivateMethods.handleSelectRow({
+                row
+              }, value, isForce);
+            });
+          } else {
+            rows.forEach(row => {
+              const rowid = getRowid($xeTable, row);
+              if (isForce || !checkMethod || checkMethod({
+                row
+              })) {
+                if (value) {
+                  if (!selectRowMaps[rowid]) {
+                    selectRowMaps[rowid] = row;
+                  }
+                } else {
+                  if (selectRowMaps[rowid]) {
+                    delete selectRowMaps[rowid];
+                  }
+                }
+                handleCheckboxReserveRow(row, value);
+              }
+            });
+          }
+        }
+        reactData.selectCheckboxMaps = selectRowMaps;
+      },
+      /**
+       * 单行
        * 多选，行选中事件
        * value 选中true 不选false 半选-1
        */
@@ -14904,9 +15011,7 @@ const customStorageKey = 'VXE_CUSTOM_STORE';
           selectCheckboxMaps,
           treeIndeterminateMaps
         } = reactData;
-        const selectRowMaps = {
-          ...selectCheckboxMaps
-        };
+        const selectRowMaps = Object.assign({}, selectCheckboxMaps);
         const {
           afterFullData
         } = internalData;
@@ -14985,9 +15090,10 @@ const customStorageKey = 'VXE_CUSTOM_STORE';
                 parentStatus = selectItems.filter(item => vItemMaps[getRowid($xeTable, item)]).length === vItems.length ? true : selectItems.length || value === -1 ? -1 : false;
               }
               reactData.selectCheckboxMaps = selectRowMaps;
-              return tablePrivateMethods.handleSelectRow({
+              tablePrivateMethods.handleSelectRow({
                 row: matchObj.parent
               }, parentStatus, isForce);
+              return;
             }
           } else {
             if (isForce || !checkMethod || checkMethod({
@@ -15072,9 +15178,10 @@ const customStorageKey = 'VXE_CUSTOM_STORE';
                 parentStatus = selectItems.filter(item => vItemMaps[getRowid($xeTable, item)]).length === vItems.length ? true : selectItems.length || value === -1 ? -1 : false;
               }
               reactData.selectCheckboxMaps = selectRowMaps;
-              return tablePrivateMethods.handleSelectRow({
+              tablePrivateMethods.handleSelectRow({
                 row: matchObj.parent
               }, parentStatus, isForce);
+              return;
             }
           } else {
             if (isForce || !checkMethod || checkMethod({
@@ -15094,7 +15201,6 @@ const customStorageKey = 'VXE_CUSTOM_STORE';
           }
         }
         reactData.selectCheckboxMaps = selectRowMaps;
-        tablePrivateMethods.checkSelectionStatus();
       },
       triggerHeaderTitleEvent(evnt, iconParams, params) {
         const tipContent = iconParams.content || iconParams.message;
@@ -15403,6 +15509,7 @@ const customStorageKey = 'VXE_CUSTOM_STORE';
           tablePrivateMethods.triggerCheckRowEvent(evnt, params, value);
         } else {
           tablePrivateMethods.handleSelectRow(params, value);
+          tablePrivateMethods.checkSelectionStatus();
         }
       },
       triggerCheckRowEvent(evnt, params, value) {
@@ -15442,6 +15549,7 @@ const customStorageKey = 'VXE_CUSTOM_STORE';
           row
         })) {
           tablePrivateMethods.handleSelectRow(params, value);
+          tablePrivateMethods.checkSelectionStatus();
           tableMethods.dispatchEvent('checkbox-change', Object.assign({
             records: tableMethods.getCheckboxRecords(),
             reserves: tableMethods.getCheckboxReserveRecords(),
@@ -16324,9 +16432,7 @@ const customStorageKey = 'VXE_CUSTOM_STORE';
       table_globalEvents.on($xeTable, 'mousewheel', handleGlobalMousewheelEvent);
       table_globalEvents.on($xeTable, 'keydown', handleGlobalKeydownEvent);
       table_globalEvents.on($xeTable, 'resize', handleGlobalResizeEvent);
-      if ($xeTable.handleGlobalContextmenuEvent) {
-        table_globalEvents.on($xeTable, 'contextmenu', $xeTable.handleGlobalContextmenuEvent);
-      }
+      table_globalEvents.on($xeTable, 'contextmenu', $xeTable.handleGlobalContextmenuEvent);
       tablePrivateMethods.preventEvent(null, 'mounted', {
         $table: $xeTable
       });
@@ -16547,7 +16653,7 @@ const customStorageKey = 'VXE_CUSTOM_STORE';
         storeData: reactData.importStore
       }) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_.createCommentVNode)(),
       /**
-       * 导出/导出
+       * 导出
        */
       initStore.export && (props.exportConfig || props.printConfig) ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(export_panel, {
         defaultOptions: reactData.exportParams,
@@ -22469,8 +22575,12 @@ const {
     } = toolbar_useFns.useSize(props);
     const reactData = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.reactive)({
       isRefresh: false,
+      connectFlag: 0,
       columns: []
     });
+    const internalData = {
+      connectTable: null
+    };
     const refElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const refMaps = {
       refElem
@@ -22480,12 +22590,11 @@ const {
       props,
       context,
       reactData,
+      internalData,
       getRefMaps: () => refMaps
     };
     let toolbarMethods = {};
     const $xeGrid = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.inject)('$xeGrid', null);
-    const refTable = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
-    const connectFlag = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)(0);
     const computeRefreshOpts = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
       return Object.assign({}, toolbar_getConfig().toolbar.refresh, props.refresh);
     });
@@ -22505,8 +22614,11 @@ const {
       return Object.assign({}, toolbar_getConfig().toolbar.custom, props.custom);
     });
     const computeTableCustomOpts = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
-      const $table = refTable.value;
-      if (connectFlag.value || $table) {
+      const {
+        connectTable
+      } = internalData;
+      const $table = connectTable;
+      if (reactData.connectFlag || $table) {
         if ($table) {
           const {
             computeCustomOpts
@@ -22523,7 +22635,10 @@ const {
       return tableCustomOpts.trigger;
     });
     const checkTable = () => {
-      const $table = refTable.value;
+      const {
+        connectTable
+      } = internalData;
+      const $table = connectTable;
       if ($table) {
         return true;
       }
@@ -22532,7 +22647,10 @@ const {
     const handleClickSettingEvent = ({
       $event
     }) => {
-      const $table = refTable.value;
+      const {
+        connectTable
+      } = internalData;
+      const $table = connectTable;
       if ($table) {
         if ($table.triggerCustomEvent) {
           $table.triggerCustomEvent($event);
@@ -22544,7 +22662,10 @@ const {
     const handleMouseenterSettingEvent = ({
       $event
     }) => {
-      const $table = refTable.value;
+      const {
+        connectTable
+      } = internalData;
+      const $table = connectTable;
       if ($table) {
         $table.customOpenEvent($event);
       } else {
@@ -22554,7 +22675,10 @@ const {
     const handleMouseleaveSettingEvent = ({
       $event
     }) => {
-      const $table = refTable.value;
+      const {
+        connectTable
+      } = internalData;
+      const $table = connectTable;
       if ($table) {
         const {
           customStore
@@ -22603,7 +22727,10 @@ const {
       }
     };
     const btnEvent = (evnt, item) => {
-      const $table = refTable.value;
+      const {
+        connectTable
+      } = internalData;
+      const $table = connectTable;
       const {
         code
       } = item;
@@ -22634,7 +22761,10 @@ const {
       }
     };
     const tolEvent = (evnt, item) => {
-      const $table = refTable.value;
+      const {
+        connectTable
+      } = internalData;
+      const $table = connectTable;
       const {
         code
       } = item;
@@ -22666,7 +22796,10 @@ const {
     };
     const importEvent = () => {
       if (checkTable()) {
-        const $table = refTable.value;
+        const {
+          connectTable
+        } = internalData;
+        const $table = connectTable;
         if ($table) {
           $table.openImport();
         }
@@ -22674,7 +22807,10 @@ const {
     };
     const exportEvent = () => {
       if (checkTable()) {
-        const $table = refTable.value;
+        const {
+          connectTable
+        } = internalData;
+        const $table = connectTable;
         if ($table) {
           $table.openExport();
         }
@@ -22682,12 +22818,29 @@ const {
     };
     const printEvent = () => {
       if (checkTable()) {
-        const $table = refTable.value;
+        const {
+          connectTable
+        } = internalData;
+        const $table = connectTable;
         if ($table) {
           $table.openPrint();
         }
       }
     };
+    const dispatchEvent = (type, params, evnt) => {
+      emit(type, toolbar_createEvent(evnt, {
+        $toolbar: $xeToolbar
+      }, params));
+    };
+    toolbarMethods = {
+      dispatchEvent,
+      syncUpdate(params) {
+        internalData.connectTable = params.$table;
+        reactData.columns = params.collectColumn;
+        reactData.connectFlag++;
+      }
+    };
+    Object.assign($xeToolbar, toolbarMethods);
     const renderDropdowns = (item, isBtn) => {
       const {
         dropdowns
@@ -22724,14 +22877,10 @@ const {
       const {
         buttons
       } = props;
-      const $table = refTable.value;
-      const buttonsSlot = slots.buttons;
-      if (buttonsSlot) {
-        return getSlotVNs(buttonsSlot({
-          $grid: $xeGrid,
-          $table: $table
-        }));
-      }
+      const {
+        connectTable
+      } = internalData;
+      const $table = connectTable;
       const btnVNs = [];
       if (buttons) {
         buttons.forEach(item => {
@@ -22787,14 +22936,10 @@ const {
       const {
         tools
       } = props;
-      const $table = refTable.value;
-      const toolsSlot = slots.tools;
-      if (toolsSlot) {
-        return getSlotVNs(toolsSlot({
-          $grid: $xeGrid,
-          $table: $table
-        }));
-      }
+      const {
+        connectTable
+      } = internalData;
+      const $table = connectTable;
       const btnVNs = [];
       if (tools) {
         tools.forEach((item, tIndex) => {
@@ -22918,47 +23063,6 @@ const {
         ...customBtnOns
       }) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_.createCommentVNode)();
     };
-    toolbarMethods = {
-      dispatchEvent(type, params, evnt) {
-        emit(type, toolbar_createEvent(evnt, {
-          $toolbar: $xeToolbar
-        }, params));
-      },
-      syncUpdate(params) {
-        const {
-          collectColumn
-        } = params;
-        refTable.value = params.$table;
-        reactData.columns = collectColumn;
-        connectFlag.value++;
-      }
-    };
-    Object.assign($xeToolbar, toolbarMethods);
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)(() => {
-      const {
-        refresh
-      } = props;
-      const refreshOpts = computeRefreshOpts.value;
-      const queryMethod = refreshOpts.queryMethod || refreshOpts.query;
-      if (refresh && !$xeGrid && !queryMethod) {
-        warnLog('vxe.error.notFunc', ['queryMethod']);
-      }
-      const customOpts = computeCustomOpts.value;
-      if (true) {
-        if (customOpts.isFooter) {
-          warnLog('vxe.error.delProp', ['toolbar.custom.isFooter', 'table.custom-config.showFooter']);
-        }
-        if (customOpts.showFooter) {
-          warnLog('vxe.error.delProp', ['toolbar.custom.showFooter', 'table.custom-config.showFooter']);
-        }
-        if (customOpts.immediate) {
-          warnLog('vxe.error.delProp', ['toolbar.custom.immediate', 'table.custom-config.immediate']);
-        }
-        if (customOpts.trigger) {
-          warnLog('vxe.error.delProp', ['toolbar.custom.trigger', 'table.custom-config.trigger']);
-        }
-      }
-    });
     const renderVN = () => {
       const {
         perfect,
@@ -22968,7 +23072,13 @@ const {
         custom,
         className
       } = props;
+      const {
+        connectTable
+      } = internalData;
       const vSize = computeSize.value;
+      const toolsSlot = slots.tools;
+      const buttonsSlot = slots.buttons;
+      const $table = connectTable;
       return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
         ref: refElem,
         class: ['vxe-toolbar', className ? external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isFunction(className) ? className({
@@ -22980,22 +23090,51 @@ const {
         }]
       }, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
         class: 'vxe-buttons--wrapper'
-      }, renderBtns()), (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+      }, buttonsSlot ? buttonsSlot({
+        $grid: $xeGrid,
+        $table: $table
+      }) : renderBtns()), (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
         class: 'vxe-tools--wrapper'
-      }, renderRightTools()), (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+      }, toolsSlot ? toolsSlot({
+        $grid: $xeGrid,
+        $table: $table
+      }) : renderRightTools()), (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
         class: 'vxe-tools--operate'
       }, [props.import ? renderToolImport() : (0,external_commonjs_vue_commonjs2_vue_root_Vue_.createCommentVNode)(), props.export ? renderToolExport() : (0,external_commonjs_vue_commonjs2_vue_root_Vue_.createCommentVNode)(), props.print ? renderToolPrint() : (0,external_commonjs_vue_commonjs2_vue_root_Vue_.createCommentVNode)(), refresh ? renderToolRefresh() : (0,external_commonjs_vue_commonjs2_vue_root_Vue_.createCommentVNode)(), zoom && $xeGrid ? renderToolZoom() : (0,external_commonjs_vue_commonjs2_vue_root_Vue_.createCommentVNode)(), custom ? renderToolCustom() : (0,external_commonjs_vue_commonjs2_vue_root_Vue_.createCommentVNode)()])]);
     };
     $xeToolbar.renderVN = renderVN;
-    if (true) {
-      (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)(() => {
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)(() => {
+      const {
+        refresh
+      } = props;
+      const refreshOpts = computeRefreshOpts.value;
+      const queryMethod = refreshOpts.queryMethod || refreshOpts.query;
+      if (refresh && !$xeGrid && !queryMethod) {
+        warnLog('vxe.error.notFunc', ['queryMethod']);
+      }
+      const customOpts = computeCustomOpts.value;
+      if (true) {
+        if (customOpts.isFooter) {
+          warnLog('vxe.error.delProp', ['toolbar.custom.isFooter', 'table.custom-config.showFooter']);
+        }
+        if (customOpts.showFooter) {
+          warnLog('vxe.error.delProp', ['toolbar.custom.showFooter', 'table.custom-config.showFooter']);
+        }
+        if (customOpts.immediate) {
+          warnLog('vxe.error.delProp', ['toolbar.custom.immediate', 'table.custom-config.immediate']);
+        }
+        if (customOpts.trigger) {
+          warnLog('vxe.error.delProp', ['toolbar.custom.trigger', 'table.custom-config.trigger']);
+        }
+      }
+      if (true) {
         if (props.refresh || props.import || props.export || props.print || props.zoom) {
           if (!VxeUIButtonComponent) {
             errLog('vxe.error.reqComp', ['vxe-button']);
           }
         }
-      });
-    }
+      }
+    });
     return $xeToolbar;
   },
   render() {
@@ -23153,28 +23292,6 @@ const gridComponentEmits = [...emits, 'page-change', 'form-submit', 'form-submit
       });
       return rest;
     });
-    const refMaps = {
-      refElem,
-      refTable,
-      refForm,
-      refToolbar,
-      refPager
-    };
-    const computeMaps = {
-      computeProxyOpts,
-      computePagerOpts,
-      computeFormOpts,
-      computeToolbarOpts,
-      computeZoomOpts
-    };
-    const $xeGrid = {
-      xID,
-      props: props,
-      context,
-      reactData,
-      getRefMaps: () => refMaps,
-      getComputeMaps: () => computeMaps
-    };
     const computeTableProps = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
       const {
         seqConfig,
@@ -23214,6 +23331,37 @@ const gridComponentEmits = [...emits, 'page-change', 'form-submit', 'form-submit
       }
       return tableProps;
     });
+    const computeCurrLayout = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
+      const {
+        layouts
+      } = props;
+      if (layouts && layouts.length) {
+        return layouts;
+      }
+      return grid_getConfig().grid.layouts || ['Form', 'Toolbar', 'Top', 'Table', 'Bottom', 'Pager'];
+    });
+    const refMaps = {
+      refElem,
+      refTable,
+      refForm,
+      refToolbar,
+      refPager
+    };
+    const computeMaps = {
+      computeProxyOpts,
+      computePagerOpts,
+      computeFormOpts,
+      computeToolbarOpts,
+      computeZoomOpts
+    };
+    const $xeGrid = {
+      xID,
+      props: props,
+      context,
+      reactData,
+      getRefMaps: () => refMaps,
+      getComputeMaps: () => computeMaps
+    };
     const initToolbar = () => {
       const toolbarOpts = computeToolbarOpts.value;
       if (props.toolbarConfig && isEnableConf(toolbarOpts)) {
@@ -23708,13 +23856,9 @@ const gridComponentEmits = [...emits, 'page-change', 'form-submit', 'form-submit
       }
       return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.createCommentVNode)();
     };
-    const defaultLayouts = ['Form', 'Toolbar', 'Top', 'Table', 'Bottom', 'Pager'];
     const renderLayout = () => {
-      const {
-        layouts
-      } = props;
       const vns = [];
-      const currLayouts = layouts && layouts.length ? layouts : grid_getConfig().grid.layouts || defaultLayouts;
+      const currLayouts = computeCurrLayout.value;
       currLayouts.forEach(name => {
         switch (name) {
           case 'Form':
@@ -23802,12 +23946,20 @@ const gridComponentEmits = [...emits, 'page-change', 'form-submit', 'form-submit
         }
       }
     };
+    const handleGlobalKeydownEvent = evnt => {
+      const zoomOpts = computeZoomOpts.value;
+      const isEsc = grid_globalEvents.hasKey(evnt, grid_GLOBAL_EVENT_KEYS.ESCAPE);
+      if (isEsc && reactData.isZMax && zoomOpts.escRestore !== false) {
+        gridPrivateMethods.triggerZoomEvent(evnt);
+      }
+    };
+    const dispatchEvent = (type, params, evnt) => {
+      emit(type, grid_createEvent(evnt, {
+        $grid: $xeGrid
+      }, params));
+    };
     const gridMethods = {
-      dispatchEvent(type, params, evnt) {
-        emit(type, grid_createEvent(evnt, {
-          $grid: $xeGrid
-        }, params));
-      },
+      dispatchEvent,
       /**
        * 提交指令，支持 code 或 button
        * @param {String/Object} code 字符串或对象
@@ -24420,13 +24572,6 @@ const gridComponentEmits = [...emits, 'page-change', 'form-submit', 'form-submit
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.proxyConfig, () => {
       initProxy();
     });
-    const handleGlobalKeydownEvent = evnt => {
-      const zoomOpts = computeZoomOpts.value;
-      const isEsc = grid_globalEvents.hasKey(evnt, grid_GLOBAL_EVENT_KEYS.ESCAPE);
-      if (isEsc && reactData.isZMax && zoomOpts.escRestore !== false) {
-        gridPrivateMethods.triggerZoomEvent(evnt);
-      }
-    };
     grid_hooks.forEach(options => {
       const {
         setupGrid