vxe-table 3.13.5 → 3.13.7

package/lib/index.umd.js

@@ -2220,7 +2220,7 @@ function getClass(property, params) {
 ;// CONCATENATED MODULE: ./packages/ui/index.ts
 
 
-const version = "3.13.5";
+const version = "3.13.7";
 core_.VxeUI.version = version;
 core_.VxeUI.tableVersion = version;
 core_.VxeUI.setConfig({
@@ -2843,7 +2843,7 @@ function isNodeElement(elem) {
 const {
   log: log_log
 } = core_.VxeUI;
-const log_version = `table v${"3.13.5"}`;
+const log_version = `table v${"3.13.7"}`;
 const warnLog = log_log.create('warn', log_version);
 const errLog = log_log.create('error', log_version);
 ;// CONCATENATED MODULE: ./packages/table/src/columnInfo.ts
@@ -5124,10 +5124,11 @@ const setCustomStorageMap = (id, data) => {
   maps._v = version;
   localStorage.setItem(customStorageKey, external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toJSONString(maps));
 };
-const getRecoverRowMaps = (_vm, keyMaps) => {
+const getRecoverRowMaps = ($xeTable, keyMaps) => {
+  const internalData = $xeTable;
   const {
     fullAllDataRowIdData
-  } = _vm;
+  } = internalData;
   const restKeys = {};
   external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().each(keyMaps, (row, rowid) => {
     if (fullAllDataRowIdData[rowid]) {
@@ -5136,10 +5137,11 @@ const getRecoverRowMaps = (_vm, keyMaps) => {
   });
   return restKeys;
 };
-function handleReserveRow(_vm, reserveRowMap) {
+function handleReserveRow($xeTable, reserveRowMap) {
+  const internalData = $xeTable;
   const {
     fullDataRowIdData
-  } = _vm;
+  } = internalData;
   const reserveList = [];
   external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().each(reserveRowMap, (item, rowid) => {
     if (fullDataRowIdData[rowid] && reserveList.indexOf(fullDataRowIdData[rowid].row) === -1) {
@@ -5929,6 +5931,253 @@ function updateStyle($xeTable) {
   }
   return $xeTable.$nextTick();
 }
+function handleRadioReserveRow($xeTable, row) {
+  const internalData = $xeTable;
+  const radioOpts = $xeTable.computeRadioOpts;
+  if (radioOpts.reserve) {
+    internalData.radioReserveRow = row;
+  }
+}
+function handleCheckboxReserveRow($xeTable, row, checked) {
+  const internalData = $xeTable;
+  const {
+    checkboxReserveRowMap
+  } = internalData;
+  const checkboxOpts = $xeTable.computeCheckboxOpts;
+  if (checkboxOpts.reserve) {
+    const rowid = getRowid($xeTable, row);
+    if (checked) {
+      checkboxReserveRowMap[rowid] = row;
+    } else if (checkboxReserveRowMap[rowid]) {
+      delete checkboxReserveRowMap[rowid];
+    }
+  }
+}
+function handleCheckedRadioRow($xeTable, row, isForce) {
+  const reactData = $xeTable;
+  const radioOpts = $xeTable.computeRadioOpts;
+  const {
+    checkMethod
+  } = radioOpts;
+  if (row && (isForce || !checkMethod || checkMethod({
+    row
+  }))) {
+    reactData.selectRadioRow = row;
+    handleRadioReserveRow($xeTable, row);
+  }
+  return $xeTable.$nextTick();
+}
+function handleCheckedCheckboxRow($xeTable, rows, value, isForce) {
+  if (rows && !external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isArray(rows)) {
+    rows = [rows];
+  }
+  $xeTable.handleBatchSelectRows(rows, !!value, isForce);
+  $xeTable.checkSelectionStatus();
+  return $xeTable.$nextTick();
+}
+function handleCheckedAllCheckboxRow($xeTable, checked, isForce) {
+  const props = $xeTable;
+  const reactData = $xeTable;
+  const internalData = $xeTable;
+  const {
+    treeConfig
+  } = props;
+  const {
+    selectCheckboxMaps
+  } = reactData;
+  const {
+    afterFullData,
+    checkboxReserveRowMap
+  } = internalData;
+  const treeOpts = $xeTable.computeTreeOpts;
+  const childrenField = treeOpts.children || treeOpts.childrenField;
+  const checkboxOpts = $xeTable.computeCheckboxOpts;
+  const {
+    checkField,
+    reserve,
+    checkMethod
+  } = checkboxOpts;
+  const indeterminateField = checkboxOpts.indeterminateField || checkboxOpts.halfField;
+  const selectRowMaps = {};
+  /**
+   * 绑定属性方式（高性能，有污染）
+   * 必须在行数据存在对应的属性，否则将不响应
+   */
+  if (checkField) {
+    const checkValFn = row => {
+      if (isForce || !checkMethod || checkMethod({
+        row
+      })) {
+        if (checked) {
+          selectRowMaps[getRowid($xeTable, row)] = row;
+        }
+        external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().set(row, checkField, checked);
+      }
+      if (treeConfig && indeterminateField) {
+        external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().set(row, indeterminateField, false);
+      }
+    };
+    // 如果存在选中方法
+    // 如果方法成立，则更新值，否则忽略该数据
+    if (treeConfig) {
+      external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eachTree(afterFullData, checkValFn, {
+        children: childrenField
+      });
+    } else {
+      afterFullData.forEach(checkValFn);
+    }
+  } else {
+    /**
+       * 默认方式（低性能，无污染）
+       * 无需任何属性，直接绑定
+       */
+    if (treeConfig) {
+      if (checked) {
+        /**
+           * 如果是树勾选
+           * 如果方法成立，则添加到临时集合中
+           */
+        external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eachTree(afterFullData, row => {
+          if (isForce || !checkMethod || checkMethod({
+            row
+          })) {
+            selectRowMaps[getRowid($xeTable, row)] = row;
+          }
+        }, {
+          children: childrenField
+        });
+      } else {
+        /**
+           * 如果是树取消
+           * 如果方法成立，则不添加到临时集合中
+           */
+        if (!isForce && checkMethod) {
+          external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eachTree(afterFullData, row => {
+            const rowid = getRowid($xeTable, row);
+            if (checkMethod({
+              row
+            }) ? 0 : selectCheckboxMaps[rowid]) {
+              selectRowMaps[rowid] = row;
+            }
+          }, {
+            children: childrenField
+          });
+        }
+      }
+    } else {
+      if (checked) {
+        /**
+           * 如果是行勾选
+           * 如果存在选中方法且成立或者本身已勾选，则添加到临时集合中
+           * 如果不存在选中方法，则添加所有数据到临时集合中
+           */
+        if (!isForce && checkMethod) {
+          afterFullData.forEach(row => {
+            const rowid = getRowid($xeTable, row);
+            if (selectCheckboxMaps[rowid] || checkMethod({
+              row
+            })) {
+              selectRowMaps[rowid] = row;
+            }
+          });
+        } else {
+          afterFullData.forEach(row => {
+            selectRowMaps[getRowid($xeTable, row)] = row;
+          });
+        }
+      } else {
+        /**
+           * 如果是行取消
+           * 如果方法成立，则不添加到临时集合中；如果方法不成立则判断当前是否已勾选，如果已被勾选则添加到新集合中
+           * 如果不存在选中方法，无需处理，临时集合默认为空
+           */
+        if (!isForce && checkMethod) {
+          afterFullData.forEach(row => {
+            const rowid = getRowid($xeTable, row);
+            if (checkMethod({
+              row
+            }) ? 0 : selectCheckboxMaps[rowid]) {
+              selectRowMaps[rowid] = row;
+            }
+          });
+        }
+      }
+    }
+  }
+  if (reserve) {
+    if (checked) {
+      external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().each(selectRowMaps, (row, rowid) => {
+        checkboxReserveRowMap[rowid] = row;
+      });
+    } else {
+      afterFullData.forEach(row => handleCheckboxReserveRow($xeTable, row, false));
+    }
+  }
+  reactData.selectCheckboxMaps = checkField ? {} : selectRowMaps;
+  reactData.isAllSelected = checked;
+  reactData.isIndeterminate = false;
+  reactData.treeIndeterminateMaps = {};
+  internalData.treeIndeterminateRowMaps = {};
+  $xeTable.checkSelectionStatus();
+  return $xeTable.$nextTick();
+}
+// 还原展开、选中等相关状态
+function handleReserveStatus($xeTable) {
+  const props = $xeTable;
+  const reactData = $xeTable;
+  const internalData = $xeTable;
+  const {
+    treeConfig
+  } = props;
+  const {
+    expandColumn,
+    currentRow,
+    selectCheckboxMaps,
+    selectRadioRow,
+    rowExpandedMaps,
+    treeExpandedMaps
+  } = reactData;
+  const {
+    fullDataRowIdData,
+    fullAllDataRowIdData,
+    radioReserveRow
+  } = internalData;
+  const expandOpts = $xeTable.computeExpandOpts;
+  const treeOpts = $xeTable.computeTreeOpts;
+  const radioOpts = $xeTable.computeRadioOpts;
+  const checkboxOpts = $xeTable.computeCheckboxOpts;
+  // 单选框
+  if (selectRadioRow && !fullAllDataRowIdData[getRowid($xeTable, selectRadioRow)]) {
+    reactData.selectRadioRow = null; // 刷新单选行状态
+  }
+  // 还原保留选中状态
+  if (radioOpts.reserve && radioReserveRow) {
+    const rowid = getRowid($xeTable, radioReserveRow);
+    if (fullDataRowIdData[rowid]) {
+      handleCheckedRadioRow($xeTable, fullDataRowIdData[rowid].row, true);
+    }
+  }
+  // 复选框
+  reactData.selectCheckboxMaps = getRecoverRowMaps($xeTable, selectCheckboxMaps); // 刷新多选行状态
+  // 还原保留选中状态
+  if (checkboxOpts.reserve) {
+    handleCheckedCheckboxRow($xeTable, handleReserveRow($xeTable, internalData.checkboxReserveRowMap), true, true);
+  }
+  if (currentRow && !fullAllDataRowIdData[getRowid($xeTable, currentRow)]) {
+    reactData.currentRow = null; // 刷新当前行状态
+  }
+  // 行展开
+  reactData.rowExpandedMaps = expandColumn ? getRecoverRowMaps($xeTable, rowExpandedMaps) : {}; // 刷新行展开状态
+  // 还原保留状态
+  if (expandColumn && expandOpts.reserve) {
+    $xeTable.setRowExpand(handleReserveRow($xeTable, internalData.rowExpandedReserveRowMap), true);
+  }
+  // 树展开
+  reactData.treeExpandedMaps = treeConfig ? getRecoverRowMaps($xeTable, treeExpandedMaps) : {}; // 刷新树展开状态
+  if (treeConfig && treeOpts.reserve) {
+    $xeTable.setTreeExpand(handleReserveRow($xeTable, internalData.treeExpandedReserveRowMap), true);
+  }
+}
 function calcVarRowHeightConfig($xeTable, sizeKey, sizeEl) {
   const reactData = $xeTable;
   const {
@@ -7572,7 +7821,7 @@ const Methods = {
           }
         }
       }
-      this.handleReserveStatus();
+      handleReserveStatus($xeTable);
       this.checkSelectionStatus();
       return new Promise(resolve => {
         this.$nextTick().then(() => this.recalculate()).then(() => {
@@ -10076,16 +10325,16 @@ const Methods = {
       actived
     } = editStore;
     const {
-      refTableMenu,
-      filterWrapper,
       customWrapper,
       refValidTooltip
     } = $refs;
+    const tableFilter = $refs.refTableFilter;
+    const tableMenu = $refs.refTableMenu;
     // 筛选
-    if (filterWrapper) {
+    if (tableFilter) {
       if (getEventTargetNode(evnt, $el, 'vxe-cell--filter').flag) {
         // 如果点击了筛选按钮
-      } else if (getEventTargetNode(evnt, filterWrapper.$el).flag) {
+      } else if (getEventTargetNode(evnt, tableFilter.$el).flag) {
         // 如果点击筛选容器
       } else {
         if (!getEventTargetNode(evnt, document.body, 'vxe-table--ignore-clear').flag) {
@@ -10159,7 +10408,7 @@ const Methods = {
         }
       }
     } else if (mouseConfig) {
-      if (!getEventTargetNode(evnt, $el).flag && !($xegrid && getEventTargetNode(evnt, $xegrid.$el).flag) && !(refTableMenu && getEventTargetNode(evnt, refTableMenu.$el).flag) && !($toolbar && getEventTargetNode(evnt, $toolbar.$el).flag)) {
+      if (!getEventTargetNode(evnt, $el).flag && !($xegrid && getEventTargetNode(evnt, $xegrid.$el).flag) && !(tableMenu && getEventTargetNode(evnt, tableMenu.$el).flag) && !($toolbar && getEventTargetNode(evnt, $toolbar.$el).flag)) {
         if (this.clearSelected) {
           this.clearSelected();
         }
@@ -10180,7 +10429,7 @@ const Methods = {
       }
     }
     // 如果配置了快捷菜单且，点击了其他地方则关闭
-    if (ctxMenuStore.visible && refTableMenu && !getEventTargetNode(evnt, refTableMenu.$el).flag) {
+    if (ctxMenuStore.visible && tableMenu && !getEventTargetNode(evnt, tableMenu.$el).flag) {
       this.closeMenu();
     }
     const isActivated = getEventTargetNode(evnt, ($xegrid || this).$el).flag;
@@ -10846,6 +11095,7 @@ const Methods = {
    * 处理默认勾选
    */
   handleDefaultSelectionChecked() {
+    const $xeTable = this;
     const {
       fullDataRowIdData,
       checkboxOpts
@@ -10855,7 +11105,7 @@ const Methods = {
       checkRowKeys
     } = checkboxOpts;
     if (checkAll) {
-      this.handleCheckedAllCheckboxRow(true, true);
+      handleCheckedAllCheckboxRow($xeTable, true, true);
     } else if (checkRowKeys) {
       const defSelection = [];
       checkRowKeys.forEach(rowid => {
@@ -10863,17 +11113,12 @@ const Methods = {
           defSelection.push(fullDataRowIdData[rowid].row);
         }
       });
-      this.handleCheckedCheckboxRow(defSelection, true, true);
+      handleCheckedCheckboxRow($xeTable, defSelection, true, true);
     }
   },
   handleCheckedCheckboxRow(rows, value, isForce) {
     const $xeTable = this;
-    if (rows && !external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isArray(rows)) {
-      rows = [rows];
-    }
-    $xeTable.handleBatchSelectRows(rows, !!value, isForce);
-    $xeTable.checkSelectionStatus();
-    return this.$nextTick();
+    return handleCheckedCheckboxRow($xeTable, rows, value, isForce);
   },
   /**
    * 用于多选行，设置行为选中状态，第二个参数为选中与否
@@ -10885,7 +11130,7 @@ const Methods = {
     if (rows && !external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isArray(rows)) {
       rows = [rows];
     }
-    return $xeTable.handleCheckedCheckboxRow(rows, checked, true);
+    return handleCheckedCheckboxRow($xeTable, rows, checked, true);
   },
   setCheckboxRowKey(keys, checked) {
     const $xeTable = this;
@@ -10903,7 +11148,7 @@ const Methods = {
         rows.push(rowRest.row);
       }
     });
-    return $xeTable.handleCheckedCheckboxRow(rows, checked, true);
+    return handleCheckedCheckboxRow($xeTable, rows, checked, true);
   },
   isCheckedByCheckboxRow(row) {
     const $xeTable = this;
@@ -10999,7 +11244,7 @@ const Methods = {
             if (indeterminateField) {
               external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().set(row, indeterminateField, false);
             }
-            $xeTable.handleCheckboxReserveRow(row, checked);
+            handleCheckboxReserveRow($xeTable, row, checked);
           }
         }, {
           children: transform ? mapChildrenField : childrenField
@@ -11013,7 +11258,7 @@ const Methods = {
             row
           })) {
             external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().set(row, checkField, checked);
-            $xeTable.handleCheckboxReserveRow(row, checked);
+            handleCheckboxReserveRow($xeTable, row, checked);
           }
         });
       }
@@ -11035,7 +11280,7 @@ const Methods = {
               delete selectRowMaps[rowid];
             }
           }
-          $xeTable.handleCheckboxReserveRow(row, checked);
+          handleCheckboxReserveRow($xeTable, row, checked);
         }
       }, {
         children: transform ? mapChildrenField : childrenField
@@ -11058,7 +11303,7 @@ const Methods = {
             delete selectRowMaps[rowid];
           }
         }
-        $xeTable.handleCheckboxReserveRow(row, checked);
+        handleCheckboxReserveRow($xeTable, row, checked);
       }
     });
     reactData.selectCheckboxMaps = selectRowMaps;
@@ -11102,6 +11347,7 @@ const Methods = {
     }
   },
   triggerCheckRowEvent(evnt, params, checked) {
+    const $xeTable = this;
     const {
       checkboxOpts,
       afterFullData
@@ -11126,7 +11372,7 @@ const Methods = {
         if (_rowIndex !== _firstRowIndex) {
           this.setAllCheckboxRow(false);
           const rangeRows = _rowIndex < _firstRowIndex ? afterFullData.slice(_rowIndex, _firstRowIndex + 1) : afterFullData.slice(_firstRowIndex, _rowIndex + 1);
-          this.handleCheckedCheckboxRow(rangeRows, true, false);
+          handleCheckedCheckboxRow($xeTable, rangeRows, true, false);
           this.emitEvent('checkbox-range-select', Object.assign({
             rangeRecords: rangeRows
           }, params), evnt);
@@ -11164,168 +11410,13 @@ const Methods = {
     $xeTable.checkSelectionStatus();
     return $xeTable.$nextTick();
   },
-  handleCheckedAllCheckboxRow(checked, isForce) {
-    const $xeTable = this;
-    const reactData = $xeTable;
-    const {
-      afterFullData,
-      treeConfig,
-      treeOpts,
-      selectCheckboxMaps,
-      checkboxReserveRowMap,
-      checkboxOpts,
-      afterFullRowMaps
-    } = this;
-    const {
-      checkField,
-      reserve,
-      checkStrictly,
-      checkMethod
-    } = checkboxOpts;
-    const indeterminateField = checkboxOpts.indeterminateField || checkboxOpts.halfField;
-    const childrenField = treeOpts.children || treeOpts.childrenField;
-    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) {
-      this.isAllSelected = checked;
-    } else {
-      /**
-       * 绑定属性方式（高性能，有污染）
-       * 必须在行数据存在对应的属性，否则将不响应
-       */
-      if (checkField) {
-        const checkValFn = row => {
-          if (isForce || !checkMethod || checkMethod({
-            row
-          })) {
-            if (checked) {
-              selectRowMaps[getRowid(this, row)] = row;
-            }
-            external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().set(row, checkField, checked);
-          }
-          if (treeConfig && indeterminateField) {
-            external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().set(row, indeterminateField, false);
-          }
-        };
-        // 如果存在选中方法
-        // 如果方法成立，则更新值，否则忽略该数据
-        if (treeConfig) {
-          external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eachTree(afterFullData, checkValFn, {
-            children: childrenField
-          });
-        } else {
-          afterFullData.forEach(checkValFn);
-        }
-      } else {
-        /**
-         * 默认方式（低性能，无污染）
-         * 无需任何属性，直接绑定
-         */
-        if (treeConfig) {
-          if (checked) {
-            /**
-             * 如果是树勾选
-             * 如果方法成立，则添加到临时集合中
-             */
-            external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eachTree(afterFullData, row => {
-              if (isForce || !checkMethod || checkMethod({
-                row
-              })) {
-                selectRowMaps[getRowid(this, row)] = row;
-              }
-            }, {
-              children: childrenField
-            });
-          } else {
-            /**
-             * 如果是树取消
-             * 如果方法成立，则不添加到临时集合中
-             */
-            if (!isForce && checkMethod) {
-              external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eachTree(afterFullData, row => {
-                const rowid = getRowid(this, row);
-                if (checkMethod({
-                  row
-                }) ? 0 : selectCheckboxMaps[rowid]) {
-                  selectRowMaps[rowid] = row;
-                }
-              }, {
-                children: childrenField
-              });
-            }
-          }
-        } else {
-          if (checked) {
-            /**
-             * 如果是行勾选
-             * 如果存在选中方法且成立或者本身已勾选，则添加到临时集合中
-             * 如果不存在选中方法，则添加所有数据到临时集合中
-             */
-            if (!isForce && checkMethod) {
-              afterFullData.forEach(row => {
-                const rowid = getRowid(this, row);
-                if (selectCheckboxMaps[rowid] || checkMethod({
-                  row
-                })) {
-                  selectRowMaps[rowid] = row;
-                }
-              });
-            } else {
-              afterFullData.forEach(row => {
-                selectRowMaps[getRowid(this, row)] = row;
-              });
-            }
-          } else {
-            /**
-             * 如果是行取消
-             * 如果方法成立，则不添加到临时集合中；如果方法不成立则判断当前是否已勾选，如果已被勾选则添加到新集合中
-             * 如果不存在选中方法，无需处理，临时集合默认为空
-             */
-            if (!isForce && checkMethod) {
-              afterFullData.forEach(row => {
-                const rowid = getRowid(this, row);
-                if (checkMethod({
-                  row
-                }) ? 0 : selectCheckboxMaps[rowid]) {
-                  selectRowMaps[rowid] = row;
-                }
-              });
-            }
-          }
-        }
-      }
-      if (reserve) {
-        if (checked) {
-          external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().each(selectRowMaps, (row, rowid) => {
-            checkboxReserveRowMap[rowid] = row;
-          });
-        } else {
-          afterFullData.forEach(row => this.handleCheckboxReserveRow(row, false));
-        }
-      }
-      this.selectCheckboxMaps = checkField ? {} : selectRowMaps;
-    }
-    reactData.isAllSelected = checked;
-    reactData.isIndeterminate = false;
-    this.treeIndeterminateMaps = {};
-    this.treeIndeterminateRowMaps = {};
-    this.checkSelectionStatus();
-    return this.$nextTick();
-  },
   /**
    * 用于多选行，设置所有行的选中状态
    * @param {Boolean} value 是否选中
    */
   setAllCheckboxRow(value) {
-    return this.handleCheckedAllCheckboxRow(value, true);
+    const $xeTable = this;
+    return handleCheckedAllCheckboxRow($xeTable, value, true);
   },
   updateCheckboxStatus() {
     const $xeTable = this;
@@ -11504,57 +11595,6 @@ const Methods = {
     $xeTable.updateCheckboxStatus();
     $xeTable.updateAllCheckboxStatus();
   },
-  // 还原展开、选中等相关状态
-  handleReserveStatus() {
-    const $xeTable = this;
-    const {
-      expandColumn,
-      treeOpts,
-      treeConfig,
-      fullDataRowIdData,
-      fullAllDataRowIdData,
-      currentRow,
-      selectRadioRow,
-      radioReserveRow,
-      radioOpts,
-      checkboxOpts,
-      selectCheckboxMaps,
-      rowExpandedMaps,
-      treeExpandedMaps,
-      expandOpts
-    } = this;
-    // 单选框
-    if (selectRadioRow && !fullAllDataRowIdData[getRowid($xeTable, selectRadioRow)]) {
-      this.selectRadioRow = null; // 刷新单选行状态
-    }
-    // 还原保留选中状态
-    if (radioOpts.reserve && radioReserveRow) {
-      const rowid = getRowid(this, radioReserveRow);
-      if (fullDataRowIdData[rowid]) {
-        this.handleCheckedRadioRow(fullDataRowIdData[rowid].row, true);
-      }
-    }
-    // 复选框
-    this.selectCheckboxMaps = getRecoverRowMaps(this, selectCheckboxMaps); // 刷新多选行状态
-    // 还原保留选中状态
-    if (checkboxOpts.reserve) {
-      this.handleCheckedCheckboxRow(handleReserveRow(this, this.checkboxReserveRowMap), true, true);
-    }
-    if (currentRow && !this.fullAllDataRowIdData[getRowid($xeTable, currentRow)]) {
-      this.currentRow = null; // 刷新当前行状态
-    }
-    // 行展开
-    this.rowExpandedMaps = expandColumn ? getRecoverRowMaps(this, rowExpandedMaps) : []; // 刷新行展开状态
-    // 还原保留状态
-    if (expandColumn && expandOpts.reserve) {
-      this.setRowExpand(handleReserveRow(this, this.rowExpandedReserveRowMap), true);
-    }
-    // 树展开
-    this.treeExpandedMaps = treeConfig ? getRecoverRowMaps(this, treeExpandedMaps) : []; // 刷新树展开状态
-    if (treeConfig && treeOpts.reserve) {
-      this.setTreeExpand(handleReserveRow(this, this.treeExpandedReserveRowMap), true);
-    }
-  },
   /**
    * 获取单选框保留选中的行
    */
@@ -11596,14 +11636,6 @@ const Methods = {
     this.radioReserveRow = null;
     return this.$nextTick();
   },
-  handleRadioReserveRow(row) {
-    const {
-      radioOpts
-    } = this;
-    if (radioOpts.reserve) {
-      this.radioReserveRow = row;
-    }
-  },
   /**
    * 获取复选框保留选中的行
    */
@@ -11666,12 +11698,13 @@ const Methods = {
     }
   },
   handleCheckAllEvent(evnt, value) {
-    this.handleCheckedAllCheckboxRow(value);
+    const $xeTable = this;
+    handleCheckedAllCheckboxRow($xeTable, value);
     if (evnt) {
-      this.emitEvent('checkbox-all', {
-        records: this.getCheckboxRecords(),
-        reserves: this.getCheckboxReserveRecords(),
-        indeterminates: this.getCheckboxIndeterminateRecords(),
+      $xeTable.dispatchEvent('checkbox-all', {
+        records: $xeTable.getCheckboxRecords(),
+        reserves: $xeTable.getCheckboxReserveRecords(),
+        indeterminates: $xeTable.getCheckboxIndeterminateRecords(),
         checked: value
       }, evnt);
     }
@@ -11680,6 +11713,7 @@ const Methods = {
    * 多选，选中所有事件
    */
   triggerCheckAllEvent(evnt, value) {
+    const $xeTable = this;
     const {
       checkboxOpts
     } = this;
@@ -11692,7 +11726,7 @@ const Methods = {
     if (evnt) {
       evnt.stopPropagation();
     }
-    this.handleCheckAllEvent(evnt, value);
+    $xeTable.handleCheckAllEvent(evnt, value);
   },
   /**
    * 多选，切换所有行的选中状态
@@ -11746,6 +11780,7 @@ const Methods = {
    * 处理单选框默认勾选
    */
   handleDefaultRadioChecked() {
+    const $xeTable = this;
     const {
       radioOpts,
       fullDataRowIdData
@@ -11756,7 +11791,7 @@ const Methods = {
     } = radioOpts;
     if (rowid) {
       if (fullDataRowIdData[rowid]) {
-        this.handleCheckedRadioRow(fullDataRowIdData[rowid].row, true);
+        handleCheckedRadioRow($xeTable, fullDataRowIdData[rowid].row, true);
       }
       if (reserve) {
         const rowkey = getRowkey(this);
@@ -11770,6 +11805,7 @@ const Methods = {
    * 单选，行选中事件
    */
   triggerRadioRowEvent(evnt, params) {
+    const $xeTable = this;
     const {
       selectRadioRow: oldValue,
       radioOpts
@@ -11787,7 +11823,7 @@ const Methods = {
     let newValue = row;
     let isChange = oldValue !== newValue;
     if (isChange) {
-      this.handleCheckedRadioRow(newValue);
+      handleCheckedRadioRow($xeTable, newValue);
     } else if (!radioOpts.strict) {
       isChange = oldValue === newValue;
       if (isChange) {
@@ -11886,28 +11922,13 @@ const Methods = {
     }
     return false;
   },
-  handleCheckedRadioRow(row, isForce) {
-    const {
-      radioOpts
-    } = this;
-    const {
-      checkMethod
-    } = radioOpts;
-    if (row && (isForce || !checkMethod || checkMethod({
-      row
-    }))) {
-      this.selectRadioRow = row;
-      this.handleRadioReserveRow(row);
-    }
-    return this.$nextTick();
-  },
   /**
    * 用于单选行，设置某一行为选中状态
    * @param {Row} row 行对象
    */
   setRadioRow(row) {
     const $xeTable = this;
-    return $xeTable.handleCheckedRadioRow(row, true);
+    return handleCheckedRadioRow($xeTable, row, true);
   },
   /**
    * 用于单选行，设置某一行为选中状态
@@ -11921,7 +11942,7 @@ const Methods = {
     } = internalData;
     const rowRest = fullAllDataRowIdData[rowid];
     if (rowRest) {
-      return $xeTable.handleCheckedRadioRow(rowRest.row, true);
+      return handleCheckedRadioRow($xeTable, rowRest.row, true);
     }
     return $xeTable.$nextTick();
   },
@@ -14019,7 +14040,7 @@ const Methods = {
               }
               // 如果当前节点已选中，则展开后子节点也被选中
               if (!checkStrictly && this.isCheckedByCheckboxRow(row)) {
-                this.handleCheckedCheckboxRow(childRows, true);
+                handleCheckedCheckboxRow($xeTable, childRows, true);
               }
               return this.$nextTick().then(() => {
                 if (transform) {
@@ -19357,6 +19378,7 @@ const {
             columns,
             params: defaultOptions.params
           };
+          const hasEmptyData = defaultOptions.mode === 'empty';
           return h('div', {
             class: 'vxe-table-export--panel'
           }, [topSlot ? h('div', {
@@ -19443,7 +19465,8 @@ const {
             class: 'vxe-table-export--panel-option-row'
           }, [h('vxe-checkbox', {
             props: {
-              value: isHeader,
+              value: hasEmptyData || isHeader,
+              disabled: hasEmptyData,
               title: export_panel_getI18n('vxe.export.expHeaderTitle'),
               content: export_panel_getI18n('vxe.export.expOptHeader')
             },
@@ -19466,7 +19489,8 @@ const {
             }
           }), h('vxe-checkbox', {
             props: {
-              value: defaultOptions.original,
+              value: hasEmptyData ? false : defaultOptions.original,
+              disabled: hasEmptyData,
               title: export_panel_getI18n('vxe.export.expOriginalTitle'),
               content: export_panel_getI18n('vxe.export.expOptOriginal')
             },
@@ -19494,7 +19518,7 @@ const {
           }), h('vxe-checkbox', {
             props: {
               value: hasMerge && supportMerge && checkedAll ? defaultOptions.isMerge : false,
-              disabled: !hasMerge || !supportMerge || !checkedAll,
+              disabled: hasEmptyData || !hasMerge || !supportMerge || !checkedAll,
               title: export_panel_getI18n('vxe.export.expMergeTitle'),
               content: export_panel_getI18n('vxe.export.expOptMerge')
             },
@@ -19518,7 +19542,7 @@ const {
           }), h('vxe-checkbox', {
             props: {
               value: hasTree ? defaultOptions.isAllExpand : false,
-              disabled: !hasTree,
+              disabled: hasEmptyData || !hasTree,
               title: export_panel_getI18n('vxe.export.expAllExpandTitle'),
               content: export_panel_getI18n('vxe.export.expOptAllExpand')
             },
@@ -19846,6 +19870,9 @@ const {
      * @param {Object} params 参数
      */
     triggerFilterEvent(evnt, column, params) {
+      const $xeTable = this;
+      const reactData = $xeTable;
+      const internalData = $xeTable;
       const {
         filterStore
       } = this;
@@ -19853,112 +19880,115 @@ const {
         filterStore.visible = false;
       } else {
         const {
-          target: targetElem,
-          pageX
-        } = evnt;
-        const {
-          filters,
-          filterMultiple,
-          filterRender
-        } = column;
-        const compConf = isEnableConf(filterRender) ? mixin_renderer.get(filterRender.name) : null;
-        const filterRecoverMethod = column.filterRecoverMethod || (compConf ? compConf.tableFilterRecoverMethod || compConf.filterRecoverMethod : null);
+          initStore,
+          filterStore
+        } = reactData;
         const {
-          visibleWidth
-        } = getDomNode();
-        Object.assign(filterStore, {
-          args: params,
-          multiple: filterMultiple,
-          options: filters,
-          column,
-          style: null,
-          visible: true
-        });
-        // 复原状态
-        filterStore.options.forEach(option => {
+          elemStore
+        } = internalData;
+        if (filterStore.column === column && filterStore.visible) {
+          filterStore.visible = false;
+        } else {
           const {
-            _checked,
-            checked
-          } = option;
-          option._checked = checked;
-          if (!checked && _checked !== checked) {
-            if (filterRecoverMethod) {
-              filterRecoverMethod({
-                option,
-                column,
-                $table: this
-              });
-            }
-          }
-        });
-        this.checkFilterOptions();
-        this.initStore.filter = true;
-        this.$nextTick(() => {
+            clientY,
+            pageX
+          } = evnt;
+          const el = $xeTable.$refs.refElem;
+          const tableRect = el.getBoundingClientRect();
+          const targetElem = evnt.target;
           const {
-            $refs
-          } = this;
+            visibleWidth
+          } = getDomNode();
           const {
-            refTableHeader,
-            refTableBody,
-            filterWrapper
-          } = $refs;
-          const bodyElem = refTableBody.$el;
-          const headerElem = refTableHeader ? refTableHeader.$el : null;
-          if (!bodyElem) {
-            return;
-          }
-          const filterWrapperElem = filterWrapper.$el;
-          if (!filterWrapperElem) {
-            return;
-          }
-          const filterWidth = filterWrapperElem.offsetWidth;
-          const filterHeight = filterWrapperElem.offsetHeight;
-          const filterHeadElem = filterWrapperElem.querySelector('.vxe-table--filter-header');
-          const filterFootElem = filterWrapperElem.querySelector('.vxe-table--filter-footer');
-          const centerWidth = filterWidth / 2;
-          const minMargin = 10;
-          const maxLeft = bodyElem.clientWidth - filterWidth - minMargin;
-          let left, right;
-          const style = {
-            top: `${targetElem.offsetTop + targetElem.offsetParent.offsetTop + targetElem.offsetHeight}px`
-          };
-          // 判断面板不能大于表格高度
-          let maxHeight = null;
-          const bodyHeight = bodyElem.clientHeight - (headerElem ? headerElem.clientHeight / 2 : 0);
-          if (filterHeight >= bodyHeight) {
-            maxHeight = Math.max(40, bodyHeight - (filterFootElem ? filterFootElem.offsetHeight : 0) - (filterHeadElem ? filterHeadElem.offsetHeight : 0));
-          }
-          if (column.fixed === 'left') {
-            left = targetElem.offsetLeft + targetElem.offsetParent.offsetLeft - centerWidth;
-          } else if (column.fixed === 'right') {
-            right = targetElem.offsetParent.offsetWidth - targetElem.offsetLeft + (targetElem.offsetParent.offsetParent.offsetWidth - targetElem.offsetParent.offsetLeft) - column.renderWidth - centerWidth;
-          } else {
-            left = targetElem.offsetLeft + targetElem.offsetParent.offsetLeft - centerWidth - bodyElem.scrollLeft;
-          }
-          if (left) {
-            const overflowWidth = pageX + filterWidth - centerWidth + minMargin - visibleWidth;
-            if (overflowWidth > 0) {
-              left -= overflowWidth;
+            filters,
+            filterMultiple,
+            filterRender
+          } = column;
+          const compConf = isEnableConf(filterRender) ? mixin_renderer.get(filterRender.name) : null;
+          const frMethod = column.filterRecoverMethod || (compConf ? compConf.tableFilterRecoverMethod || compConf.filterRecoverMethod : null);
+          internalData._currFilterParams = params;
+          Object.assign(filterStore, {
+            multiple: filterMultiple,
+            options: filters,
+            column,
+            style: null
+          });
+          // 复原状态
+          filterStore.options.forEach(option => {
+            const {
+              _checked,
+              checked
+            } = option;
+            option._checked = checked;
+            if (!checked && _checked !== checked) {
+              if (frMethod) {
+                frMethod({
+                  option,
+                  column,
+                  $table: $xeTable
+                });
+              }
             }
-            style.left = `${Math.min(maxLeft, Math.max(minMargin, left))}px`;
-          } else if (right) {
-            const overflowWidth = pageX + filterWidth - centerWidth + minMargin - visibleWidth;
-            if (overflowWidth > 0) {
-              right += overflowWidth;
+          });
+          this.checkFilterOptions();
+          filterStore.visible = true;
+          initStore.filter = true;
+          $xeTable.$nextTick(() => {
+            const headerScrollElem = getRefElem(elemStore['main-header-scroll']);
+            if (!headerScrollElem) {
+              return;
             }
-            style.right = `${Math.max(minMargin, right)}px`;
-          }
-          filterStore.style = style;
-          filterStore.maxHeight = maxHeight;
-        });
+            const tableFilter = $xeTable.$refs.refTableFilter;
+            const filterWrapperElem = tableFilter ? tableFilter.$el : null;
+            if (!filterWrapperElem) {
+              return;
+            }
+            const filterWidth = filterWrapperElem.offsetWidth;
+            const filterHeadElem = filterWrapperElem.querySelector('.vxe-table--filter-header');
+            const filterFootElem = filterWrapperElem.querySelector('.vxe-table--filter-footer');
+            const centerWidth = filterWidth / 2;
+            const minMargin = 10;
+            const maxLeft = el.clientWidth - filterWidth - minMargin;
+            let left, right;
+            const thEl = targetElem.offsetParent;
+            const trEl = thEl.offsetParent;
+            const style = {
+              top: `${targetElem.offsetTop + thEl.offsetTop + targetElem.offsetHeight}px`
+            };
+            // 判断面板不能大于表格高度
+            const maxHeight = Math.max(40, el.clientHeight - (clientY - tableRect.y) - (filterHeadElem ? filterHeadElem.clientHeight : 0) - (filterFootElem ? filterFootElem.clientHeight : 0) - 14);
+            if (column.fixed === 'left') {
+              left = targetElem.offsetLeft + thEl.offsetLeft - centerWidth;
+            } else if (column.fixed === 'right') {
+              right = thEl.offsetWidth - targetElem.offsetLeft + (trEl.offsetWidth - trEl.offsetLeft) - column.renderWidth - centerWidth;
+            } else {
+              left = targetElem.offsetLeft + thEl.offsetLeft - centerWidth - headerScrollElem.scrollLeft;
+            }
+            if (left) {
+              const overflowWidth = pageX + filterWidth - centerWidth + minMargin - visibleWidth;
+              if (overflowWidth > 0) {
+                left -= overflowWidth;
+              }
+              style.left = `${Math.min(maxLeft, Math.max(minMargin, left))}px`;
+            } else if (right) {
+              const overflowWidth = pageX + filterWidth - centerWidth + minMargin - visibleWidth;
+              if (overflowWidth > 0) {
+                right += overflowWidth;
+              }
+              style.right = `${Math.max(minMargin, right)}px`;
+            }
+            filterStore.style = style;
+            filterStore.maxHeight = maxHeight;
+          });
+        }
+        $xeTable.dispatchEvent('filter-visible', {
+          column,
+          field: column.field,
+          property: column.field,
+          filterList: $xeTable.getCheckedFilters(),
+          visible: filterStore.visible
+        }, evnt);
       }
-      this.emitEvent('filter-visible', {
-        column,
-        field: column.field,
-        property: column.field,
-        filterList: this.getCheckedFilters(),
-        visible: filterStore.visible
-      }, evnt);
     },
     handleFilterConfirmFilter(evnt) {
       const $xeTable = this;
@@ -20246,6 +20276,7 @@ const {
       const {
         selected
       } = editStore;
+      const tableFilter = $xeTable.$refs.refTableFilter;
       const layoutList = ['header', 'body', 'footer'];
       if (isEnableConf(menuConfig) || contextMenu) {
         if (ctxMenuStore.visible && $refs.refTableMenu && getEventTargetNode(evnt, $refs.refTableMenu.$el).flag) {
@@ -20331,7 +20362,7 @@ const {
           }
         }
       }
-      if ($refs.filterWrapper && !getEventTargetNode(evnt, $refs.filterWrapper.$el).flag) {
+      if (tableFilter && !getEventTargetNode(evnt, tableFilter.$el).flag) {
         this.closeFilter();
       }
       this.closeMenu();
@@ -22997,7 +23028,7 @@ function handleExportAndPrint($xeTable, options, isPrint) {
     isMerge: hasMerge,
     useStyle: true,
     current: 'current',
-    modes: ['current', 'selected'].concat(proxyOpts.ajax && proxyOpts.ajax.queryAll ? ['all'] : [])
+    modes: (proxyOpts.ajax && proxyOpts.ajax.queryAll ? ['all'] : []).concat(['current', 'selected', 'empty'])
   }, options);
   const types = defOpts.types || external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().keys(exportOpts._typeMaps);
   const modes = defOpts.modes || [];
@@ -23189,7 +23220,7 @@ const convertToRows = originColumns => {
         isMerge: hasMerge,
         useStyle: true,
         current: 'current',
-        modes: ['current', 'selected'].concat(proxyOpts.ajax && proxyOpts.ajax.queryAll ? ['all'] : []),
+        modes: (proxyOpts.ajax && proxyOpts.ajax.queryAll ? ['all'] : []).concat(['current', 'selected', 'empty']),
         download: true,
         type: 'csv'
         // filename: '',
@@ -26937,7 +26968,7 @@ function renderBody(h, $xeTable) {
      */
     initStore.filter ? h(filter_panel, {
       key: 'tf',
-      ref: 'filterWrapper',
+      ref: 'refTableFilter',
       props: {
         filterStore
       }
@@ -30742,7 +30773,7 @@ const Toolbar = VxeToolbar;
       treeNotImp: '树表格不支持导入',
       treeCrossDrag: '只能拖拽第一层级',
       treeDragChild: '父级不能拖拽到自己的子级中',
-      reqPlugin: '可选扩展插件 "{1}" https://vxeui.com/other{0}/#/{1}/install'
+      reqPlugin: '扩展插件未安装 "{1}" https://vxeui.com/other{0}/#/{1}/install'
     },
     table: {
       emptyText: '暂无数据',
@@ -30810,7 +30841,8 @@ const Toolbar = VxeToolbar;
     },
     button: {
       confirm: '确认',
-      cancel: '取消'
+      cancel: '取消',
+      clear: '清除'
     },
     filter: {
       search: '搜索'
@@ -30862,6 +30894,7 @@ const Toolbar = VxeToolbar;
         pdf: 'PDF (*.pdf)'
       },
       modes: {
+        empty: '空数据',
         current: '当前数据（当前页的数据）',
         selected: '选中数据（当前页选中的数据）',
         all: '全量数据（包括所有分页的数据）'