wkjp-list-page 1.0.29 → 1.0.31

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "wkjp-list-page",
-  "version": "1.0.29",
+  "version": "1.0.31",
   "description": "Vue2 + ElementUI CommonListPage component",
   "main": "src/index.js",
   "module": "src/index.js",

package/src/components/CommonListPage.vue

@@ -122,6 +122,8 @@
       </div>
     </el-form>
 
+    <slot name="table-top"></slot>
+
     <el-table
       ref="listTable"
       :data="innerTableData"
@@ -343,6 +345,12 @@ export default {
   },
   props: {
     filters: { type: Object, required: true },
+    /**
+     * 重置基准：首次传入的默认查询条件（深拷贝后冻结，后续查询怎么改都不影响「重置」）。
+     * 建议传入页面 `data` 里单独保存的一份默认值对象（勿与 `filters` 共用同一引用）。
+     * 未传时：在实例首次初始化时对当时的 `filters` 做一次快照（`v-if` 反复挂载时仍会按每次挂载时的 filters 快照，多 tab 请务必传本项）。
+     */
+    initialFilters: { type: Object, default: null },
     searchOption: { type: Array, default: () => [] },
     columns: { type: Array, default: () => [] },
     /**
@@ -402,7 +410,7 @@ export default {
     showQueryButton: { type: Boolean, default: true },
     /** 主查询按钮文案 */
     queryButtonText: { type: String, default: "查询" },
-    /** 是否显示「重置」按钮（在查询按钮右侧）：将 `filters` 恢复为进入页面时的快照 */
+    /** 是否显示「重置」按钮（在查询按钮右侧）：将 `filters` 恢复为 `initialFilters`（或首次快照） */
     showClearQueryButton: { type: Boolean, default: true },
     clearQueryButtonText: { type: String, default: "重置" },
     /**
@@ -479,9 +487,9 @@ export default {
       columnConfigPanelMaxHeight: null,
       configColumns: [],
       appliedColumns: [],
-      /** 进入页时 filters 的快照，用于「重置」 */
+      /** 重置基准快照（深拷贝后冻结，仅初始化时写入一次） */
       initialFiltersSnapshot: null,
-      initialFiltersCaptured: false
+      resetBaselineLocked: false
     };
   },
   computed: {
@@ -677,10 +685,25 @@ export default {
           this.innerPagination = Object.assign({}, this.innerPagination, v);
         }
       }
+    },
+    initialFilters: {
+      immediate: true,
+      handler(val) {
+        if (this.resetBaselineLocked) return;
+        if (val && typeof val === "object") {
+          this.lockResetBaseline(val);
+        }
+      }
     }
   },
   created() {
-    this.captureInitialFilters();
+    if (!this.resetBaselineLocked) {
+      const baseline =
+        this.initialFilters && typeof this.initialFilters === "object"
+          ? this.initialFilters
+          : this.filters;
+      this.lockResetBaseline(baseline);
+    }
     this.applyInnerPaginationConfig();
     if (this.fetchOnCreated) {
       this.fetchList();
@@ -803,19 +826,43 @@ export default {
     handleQueryClick() {
       this.fetchList({ resetPage: true });
     },
-    captureInitialFilters() {
-      if (this.initialFiltersCaptured || !this.filters) return;
+    /**
+     * 将 baseline 深拷贝为重置基准，仅首次调用生效；之后 filters 怎么变都不更新快照。
+     * @param {Object} baseline 优先使用 `initialFilters`，否则为首次 `filters`
+     */
+    lockResetBaseline(baseline) {
+      if (this.resetBaselineLocked || !this.filters) return;
+      if (!baseline || typeof baseline !== "object") return;
       try {
         const snap = {};
-        Object.keys(this.filters).forEach((key) => {
-          snap[key] = this.cloneFilterValue(this.filters[key]);
+        const keys = {};
+        Object.keys(this.filters).forEach(function (k) {
+          keys[k] = true;
+        });
+        Object.keys(baseline).forEach(function (k) {
+          keys[k] = true;
+        });
+        Object.keys(keys).forEach((key) => {
+          const val = Object.prototype.hasOwnProperty.call(baseline, key)
+            ? baseline[key]
+            : this.filters[key];
+          snap[key] = this.cloneFilterValue(val);
         });
         this.initialFiltersSnapshot = snap;
-        this.initialFiltersCaptured = true;
+        this.resetBaselineLocked = true;
       } catch (e) {
         this.initialFiltersSnapshot = null;
       }
     },
+    /** @deprecated 请使用 lockResetBaseline */
+    captureInitialFilters() {
+      if (this.resetBaselineLocked) return;
+      const baseline =
+        this.initialFilters && typeof this.initialFilters === "object"
+          ? this.initialFilters
+          : this.filters;
+      this.lockResetBaseline(baseline);
+    },
     cloneFilterValue(val) {
       if (val === null || val === undefined) return val;
       if (typeof val !== "object") return val;