@scvzerng/element-plus-search-vue2 0.0.2 → 0.0.4

package/dist/ElementPlusSearch.es.js

@@ -1,59 +1,99 @@
-import { get as F, set as P, keyBy as R, isNumber as D, isBoolean as q, isEmpty as k, chain as B, sum as O, isPlainObject as E } from "lodash-unified";
-import { defineComponent as S, ref as u, shallowRef as N, reactive as I, computed as C } from "vue";
-const Le = (r) => ({
-  model: {
-    value: F(r, "value"),
-    callback: (e) => {
-      P(r, "value", e);
-    }
-  }
-}), V = S({
-  name: "SearchTags"
-}), K = /* @__PURE__ */ S({
-  ...V,
+import { isFunction as V, keyBy as M, isNumber as z, isBoolean as P, isEmpty as U, chain as G, sum as W, isPlainObject as X } from "lodash-unified";
+import { defineComponent as D, ref as y, resolveComponent as g, createElementBlock as A, openBlock as f, createVNode as o, createElementVNode as b, withCtx as c, unref as u, Fragment as N, renderList as B, createBlock as w, createTextVNode as L, toDisplayString as F, reactive as H, shallowRef as J, isRef as Q, computed as j, normalizeStyle as Y, normalizeClass as Z, withDirectives as ee, vShow as te, createCommentVNode as q } from "vue";
+import { ArrowLeft as se, ArrowRight as ie, ArrowDown as re, ArrowUp as ne } from "@element-plus/icons-vue";
+import { Setting as le } from "@scvzerng/icons";
+import { watchDebounced as ae } from "@vueuse/core";
+const oe = { class: "tags-scroll-container" }, ce = ["innerHTML"], ue = /* @__PURE__ */ D({
+  name: "SearchTags",
+  __name: "SearchTagsRender",
   props: {
-    tags: null
+    tags: {}
   },
-  setup(r) {
-    const e = r, t = u();
-    return { __sfc: !0, props: e, scrollContainer: t, scrollLeft: () => {
-      t.value.scrollBy({ left: -200, behavior: "smooth" });
-    }, scrollRight: () => {
-      t.value.scrollBy({
+  setup(s) {
+    const e = y(), t = () => {
+      e.value.scrollBy({ left: -200, behavior: "smooth" });
+    }, r = () => {
+      e.value.scrollBy({
         left: 200,
         behavior: "smooth"
       });
-    } };
-  }
-});
-function w(r, e, t, s, i, a, h, o) {
-  var l = typeof r == "function" ? r.options : r;
-  return e && (l.render = e, l.staticRenderFns = t, l._compiled = !0), a && (l._scopeId = "data-v-" + a), {
-    exports: r,
-    options: l
-  };
-}
-var H = function() {
-  var e = this, t = e._self._c, s = e._self._setupProxy;
-  return t("div", { staticClass: "tags-scroll-container" }, [t("el-tag", { staticClass: "scroll-left-bar", attrs: { size: "medium", type: "info" }, on: { click: s.scrollLeft } }, [t("i", { staticClass: "el-icon-arrow-left" })]), t("div", { ref: "scrollContainer", staticClass: "search-tags" }, e._l(e.tags, function(i) {
-    return t("el-tag", { key: i.field, staticClass: "search-tag", attrs: { size: "medium", closable: !i.required, type: i.required ? "primary" : "info" }, on: { close: () => i.clean() } }, [t("span", [e._v(" " + e._s(i.label) + " ")]), e._v("： "), t("span", { domProps: { innerHTML: e._s(i.valueText) } })]);
-  }), 1), t("el-tag", { staticClass: "scroll-right-bar", attrs: { size: "medium", type: "info" }, on: { click: s.scrollRight } }, [t("i", { staticClass: "el-icon-arrow-right" })])], 1);
-}, j = [], z = /* @__PURE__ */ w(
-  K,
-  H,
-  j,
-  !1,
-  null,
-  null
-);
-const M = z.exports;
-var W = Object.defineProperty, G = (r, e, t) => e in r ? W(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t, n = (r, e, t) => G(r, typeof e != "symbol" ? e + "" : e, t);
-const A = 6;
-class U {
+    };
+    return (i, n) => {
+      const p = g("el-icon"), d = g("el-tag");
+      return f(), A("div", oe, [
+        o(d, {
+          type: "info",
+          class: "scroll-left-bar",
+          onClick: t
+        }, {
+          default: c(() => [
+            o(p, null, {
+              default: c(() => [
+                o(u(se))
+              ]),
+              _: 1
+            }),
+            n[0] || (n[0] = b("i", { class: "el-icon-arrow-left" }, null, -1))
+          ]),
+          _: 1
+        }),
+        b("div", {
+          ref_key: "scrollContainer",
+          ref: e,
+          class: "search-tags"
+        }, [
+          (f(!0), A(N, null, B(s.tags, (m) => (f(), w(d, {
+            class: "search-tag",
+            onClose: () => m.clean(),
+            closable: !m.required,
+            type: m.required ? "primary" : "info",
+            key: m.field
+          }, {
+            default: c(() => [
+              b("span", null, F(m.label), 1),
+              n[1] || (n[1] = L("： ", -1)),
+              b("span", {
+                innerHTML: m.valueText
+              }, null, 8, ce)
+            ]),
+            _: 2
+          }, 1032, ["onClose", "closable", "type"]))), 128))
+        ], 512),
+        o(d, {
+          type: "info",
+          class: "scroll-right-bar",
+          onClick: r
+        }, {
+          default: c(() => [
+            o(p, null, {
+              default: c(() => [
+                o(u(ie))
+              ]),
+              _: 1
+            })
+          ]),
+          _: 1
+        })
+      ]);
+    };
+  }
+}), K = 6;
+class de {
+  field;
+  label;
+  value;
+  required;
+  index;
+  visible;
+  disabled;
+  span;
+  initValue;
+  enable;
+  tagFilter;
+  render;
+  transform;
   constructor(e, t) {
-    n(this, "field"), n(this, "label"), n(this, "value"), n(this, "required"), n(this, "index"), n(this, "visible"), n(this, "span"), n(this, "initValue"), n(this, "tagFilter"), n(this, "render"), n(this, "transform");
-    var s, i;
-    this.field = e.field, this.label = e.label, this.value = e.initValue, this.required = e.required, this.initValue = e.initValue, this.index = t, this.visible = (s = e.visible) != null ? s : !0, this.span = (i = e.span) != null ? i : A, this.render = e.render, this.tagFilter = e.tagFilter, this.transform = e.transform;
+    this.field = e.field, this.label = e.label, this.value = e.initValue, this.required = e.required, this.initValue = e.initValue, this.index = t, this.visible = e.visible ?? !0, this.span = e.span ?? K, this.render = e.render, this.tagFilter = e.tagFilter, this.transform = e.transform, this.enable = e.enable ?? !0, this.disabled = e.disabled ?? !1;
   }
   clean() {
     Array.isArray(this.value) ? this.value = [] : this.value = void 0;
@@ -61,14 +101,23 @@ class U {
   reset() {
     this.value = this.initValue;
   }
+  isEnable(e) {
+    return V(this.enable) ? this.enable(e.getSearchObject()) : this.enable;
+  }
+  isDisabled(e) {
+    return V(this.disabled) ? this.disabled(e.getSearchObject()) : this.disabled;
+  }
 }
-var X = Object.defineProperty, J = (r, e, t) => e in r ? X(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t, p = (r, e, t) => J(r, typeof e != "symbol" ? e + "" : e, t);
-class _ {
-  constructor(e, t, s, i) {
-    p(this, "field"), p(this, "span"), p(this, "index"), p(this, "visible"), this.field = e, this.span = t, this.index = s, this.visible = i;
+class x {
+  field;
+  span;
+  index;
+  visible;
+  constructor(e, t, r, i) {
+    this.field = e, this.span = t, this.index = r, this.visible = i;
   }
   static fromSearchItem(e, t) {
-    return new _(
+    return new x(
       e.field,
       e.span,
       t ?? e.index,
@@ -76,18 +125,16 @@ class _ {
     );
   }
   static formSearchConfig(e, t) {
-    var s, i;
-    return new _(
+    return new x(
       e.field,
-      (s = e.span) != null ? s : A,
+      e.span ?? K,
       t ?? e,
-      (i = e.visible) != null ? i : !0
+      e.visible ?? !0
     );
   }
   static fromString(e) {
-    var t;
-    const [s, i, a, h] = e.split("_");
-    return new _(i, Number(a), Number(s), (t = !!h) != null ? t : !0);
+    const [t, r, i, n] = e.split("_");
+    return new x(r, Number(i), Number(t), n === "true");
   }
   toString() {
     return `${this.index}_${this.field}_${this.span}_${this.visible}`;
@@ -96,33 +143,37 @@ class _ {
     this.span = e.span, this.index = e.index, this.visible = e.visible;
   }
 }
-const L = (r) => `searches_layouts_${r}`;
-class Q {
+const O = (s) => `searches_layouts_${s}`;
+class he {
+  id;
+  state;
+  itemLayouts;
+  initialLayouts;
   constructor(e, t) {
-    p(this, "id"), p(this, "state"), p(this, "itemLayouts"), p(this, "initialLayouts"), this.id = e.id, this.initialLayouts = t, this.state = e, this.itemLayouts = R(e.items.map(_.fromSearchItem), (s) => s.field), this.restoreCachedLayouts();
+    this.id = e.id, this.initialLayouts = t, this.state = e, this.itemLayouts = M(e.items.map(x.fromSearchItem), (r) => r.field), this.restoreCachedLayouts();
   }
   /**
    * 恢复自缓存中的布局信息
    * @private
    */
   restoreCachedLayouts() {
-    const e = localStorage.getItem(L(this.id));
+    const e = localStorage.getItem(O(this.id));
     e && e.split(",").forEach((t) => {
-      const s = _.fromString(t), i = this.itemLayouts[s.field];
-      i && i.merge(s);
+      const r = x.fromString(t), i = this.itemLayouts[r.field];
+      i && i.merge(r);
     });
   }
   sync(e, t) {
     if (e.length !== Object.keys(this.itemLayouts).length)
       throw new Error("同步布局字段数量不一致");
-    e.forEach((s, i) => {
-      const a = this.itemLayouts[s];
-      a.index = i, a.visible = t.has(s);
+    e.forEach((r, i) => {
+      const n = this.itemLayouts[r];
+      n.index = i, n.visible = t.has(r);
     });
   }
   persistent() {
     localStorage.setItem(
-      L(this.id),
+      O(this.id),
       Object.values(this.itemLayouts).map((e) => e.toString()).join(",")
     ), this.state.updateTags();
   }
@@ -133,125 +184,132 @@ class Q {
     });
   }
 }
-var Y = Object.defineProperty, Z = (r, e, t) => e in r ? Y(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t, f = (r, e, t) => Z(r, typeof e != "symbol" ? e + "" : e, t);
-const ee = [
+const fe = [
   {
-    isApply(r) {
-      return r.contains("el-radio-group");
+    isApply(s) {
+      return s.contains("el-radio-group");
     },
-    getText(r) {
-      var e, t;
-      return (t = (e = r.querySelector(".is-active")) == null ? void 0 : e.querySelector("input")) == null ? void 0 : t.value;
+    getText(s) {
+      return s.querySelector(".is-active")?.querySelector("input")?.value;
     }
   },
   {
-    isApply(r) {
-      return r.contains("el-checkbox-group");
+    isApply(s) {
+      return s.contains("el-checkbox-group");
     },
-    getText(r) {
-      var e;
-      const t = Array.from((e = r.querySelectorAll(".el-checkbox__input.is-checked")) != null ? e : []).map((s) => {
-        var i;
-        return (i = s.querySelector("input")) == null ? void 0 : i.value;
-      }).filter((s) => s);
-      return t.length === 1 ? t[0] : `${t[0]} 等${t.length}条`;
+    getText(s) {
+      const e = Array.from(s.querySelectorAll(".el-checkbox__input.is-checked") ?? []).map((t) => t.querySelector("input")?.value).filter((t) => t);
+      return e.length === 1 ? e[0] : `${e[0]} 等${e.length}条`;
     }
   },
   {
-    isApply(r) {
-      return r.contains("el-input");
+    isApply(s) {
+      return s.contains("el-input");
     },
-    getText(r, e) {
+    getText(s, e) {
       return e.value;
     }
   },
   {
-    isApply(r) {
-      return r.contains("el-input-number");
+    isApply(s) {
+      return s.contains("el-input-number");
     },
-    getText(r, e) {
+    getText(s, e) {
       return e.value;
     }
   },
   {
-    isApply(r) {
-      return r.contains("el-select");
+    isApply(s) {
+      return s.contains("el-select");
     },
-    getText(r, e) {
-      var t;
-      const s = r.querySelectorAll(".el-select__tags-text");
-      return s.length > 0 ? e.value.length > 1 ? `${s[0].textContent} 等${e.value.length}条` : s[0].textContent : (t = r.querySelector("input")) == null ? void 0 : t.value;
+    getText(s, e) {
+      const t = s.querySelectorAll(".el-select__tags-text");
+      return t.length > 0 ? e.value.length > 1 ? `${t[0].textContent} 等${e.value.length}条` : t[0].textContent : s.querySelector(".el-select__placeholder")?.innerHTML;
     }
   },
   {
-    isApply(r) {
-      return r.contains("el-cascader");
+    isApply(s) {
+      return s.contains("el-cascader");
     },
-    getText(r) {
-      var e;
-      return (e = r.querySelector("input")) == null ? void 0 : e.value;
+    getText(s) {
+      return s.querySelector("input")?.value;
     }
   },
   {
-    isApply(r) {
-      return r.contains("el-switch");
+    isApply(s) {
+      return s.contains("el-switch");
     },
-    getText(r) {
-      return r.querySelector(".is-active").innerHTML;
+    getText(s) {
+      return s.querySelector(".is-active").innerHTML;
     }
   },
   {
-    isApply(r) {
-      return r.contains("el-slider");
+    isApply(s) {
+      return s.contains("el-slider");
     },
-    getText(r, e) {
+    getText(s, e) {
       return e.value;
     }
   },
   {
-    isApply(r) {
-      return r.contains("el-date-editor");
+    isApply(s) {
+      return s.contains("el-date-editor");
     },
-    getText(r, e) {
+    getText(s, e) {
       return e.value ? e.value.join(" ~ ") : e.value;
     }
   }
 ];
-class T {
+class R {
+  id;
+  field;
+  value;
+  label;
+  valueText;
+  required;
+  item;
+  state;
   constructor(e, t) {
-    f(this, "id"), f(this, "field"), f(this, "value"), f(this, "label"), f(this, "valueText"), f(this, "required"), f(this, "item"), f(this, "state");
-    var s;
-    this.id = `#${e.id}-${t.field}`, this.state = e, this.field = t.field, this.value = t.value, this.label = t.label, this.item = t, this.required = (s = t.required) != null ? s : !1, this.updateValueText();
+    this.id = `#${e.id}-${t.field}`, this.state = e, this.field = t.field, this.value = t.value, this.label = t.label, this.item = t, this.required = t.required ?? !1, this.updateValueText();
   }
   static hasValue(e) {
-    return D(e.value) || q(e.value) ? !0 : !k(e.value);
+    return z(e.value) || P(e.value) ? !0 : !U(e.value);
   }
   updateValueText() {
     const e = document.querySelector(this.id);
     if (e.children.length !== 1)
       throw new Error("holder children length is not 1");
-    const t = e.children[0], s = ee.find((i) => i.isApply(t.classList));
-    s && (this.valueText = s.getText(t, this));
+    const t = e.children[0], r = fe.find((i) => i.isApply(t.classList));
+    r && (this.valueText = r.getText(t, this));
   }
   async clean() {
     this.item.clean(), await this.state.doSearch();
   }
 }
-var te = Object.defineProperty, se = (r, e, t) => e in r ? te(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t, m = (r, e, t) => se(r, typeof e != "symbol" ? e + "" : e, t);
-class re {
-  constructor(e, t, s) {
-    this.id = e, m(this, "items"), m(this, "config"), m(this, "searching"), m(this, "tags"), m(this, "searchCallback"), m(this, "sourceSearchable"), this.id = e, this.items = t.map((i, a) => new U(i, a)), this.config = new Q(
-      this,
-      t.map((i, a) => _.formSearchConfig(i, a))
-    ), this.sourceSearchable = t, this.searching = !1, this.searchCallback = s, this.tags = [];
-  }
+class pe {
+  constructor(e, t, r) {
+    this.id = e, this.id = e, this.items = t.map((i, n) => new de(i, n)), this.config = H(
+      new he(
+        this,
+        t.map((i, n) => x.formSearchConfig(i, n))
+      )
+    ), this.sourceSearchable = t, this.searching = !1, this.searchCallback = r, this.tags = [];
+  }
+  items;
+  config;
+  searching;
+  tags;
+  searchCallback;
+  sourceSearchable;
+  _lastSearchObject = { time: 0, data: null };
   updateTags() {
-    this.tags = this.items.filter((e) => e.tagFilter ? e.tagFilter(e.value) : T.hasValue(e)).map((e) => new T(this, e)).sort(
+    this.tags = this.items.filter((e) => e.tagFilter ? e.tagFilter(e.value) : R.hasValue(e)).map((e) => new R(this, e)).sort(
       (e, t) => this.config.itemLayouts[e.field].index - this.config.itemLayouts[t.field].index
     );
   }
   getSearchObject(e) {
-    return $.from(this.items).toCondition(e);
+    const t = Date.now();
+    return this._lastSearchObject.data && t - this._lastSearchObject.time < 50 ? this._lastSearchObject.data : (this._lastSearchObject = { time: t, data: E.from(this.items).toCondition(e) }, this._lastSearchObject.data);
   }
   async doSearch() {
     if (!this.searching)
@@ -264,175 +322,280 @@ class re {
   async reset(e) {
     this.items.forEach((t) => t.reset()), e && await this.doSearch();
   }
-}
-const ie = {
-  functional: !0,
-  props: {
-    search: {
-      type: Object,
-      required: !0
-    }
-  },
-  render(r, e) {
-    const { props: t } = e;
-    return t.search.render(t.search);
+  setSearchValue(e, t) {
+    const r = this.items.find((i) => i.field === e);
+    r && (r.value = t);
   }
-}, ae = () => {
-  const r = N(), e = u(), t = u([]), s = u(!1), i = u(), a = u([]), h = u(300), o = (c) => {
-    r.value = c, t.value = [
+}
+const me = ({ search: s, api: e }) => {
+  const t = s.render(s);
+  return t.props || (t.props = {}), s.isDisabled(e) && (t.props.disabled = !0), t;
+}, ge = () => {
+  const s = J(), e = y(), t = y([]), r = y(!1), i = y(), n = y([]), p = y(300), d = (a) => {
+    s.value = a, t.value = [
       {
         label: "全部",
         id: "all",
-        children: r.value.items.sort(
-          (v, x) => c.config.itemLayouts[v.field].index - c.config.itemLayouts[x.field].index
-        ).map((v) => ({
-          label: v.label,
-          id: v.field
+        children: s.value.items.sort(
+          (h, v) => a.config.itemLayouts[h.field].index - a.config.itemLayouts[v.field].index
+        ).map((h) => ({
+          label: h.label,
+          id: h.field,
+          disabled: !h.isEnable(a)
         }))
       }
-    ], i.value = B(c.config.itemLayouts).pickBy((v) => v.visible).keys().value();
+    ], i.value = G(a.config.itemLayouts).pickBy((h) => h.visible).keys().value();
   };
   return {
     treeRef: e,
-    visible: s,
+    visible: r,
     snapshot: t,
     defaultCheckedKeys: i,
-    drawerWidth: h,
-    updateSnapshot: o,
-    show: (c) => {
-      o(c), s.value = !0;
+    drawerWidth: p,
+    updateSnapshot: d,
+    show: (a) => {
+      d(a), r.value = !0;
     },
     save: () => {
-      r.value.config.sync(
-        t.value[0].children.map((c) => c.id),
+      s.value.config.sync(
+        t.value[0].children.map((a) => a.id),
         new Set(e.value.getCheckedKeys())
-      ), r.value.config.persistent();
+      ), s.value.config.persistent();
     },
     reset: () => {
-      r.value.config.reset(), o(r.value);
+      s.value.config.reset(), d(s.value);
     },
     keepSelection: () => {
-      a.value = e.value.getCheckedKeys();
+      n.value = e.value.getCheckedKeys();
     },
     restoreSelection: () => {
-      e.value.setCheckedKeys(a.value), a.value = [];
+      e.value.setCheckedKeys(n.value), n.value = [];
     },
-    allowDrop: (c, v, x) => x !== "inner"
+    allowDrop: (a, h, v) => v !== "inner",
+    allowDrag: (a) => !a.disabled
   };
-}, ne = /* @__PURE__ */ S({
+}, ve = /* @__PURE__ */ D({
   __name: "SearchSettingsDrawer",
-  setup(r, { expose: e }) {
+  setup(s, { expose: e }) {
     const {
       treeRef: t,
-      visible: s,
+      visible: r,
       snapshot: i,
-      drawerWidth: a,
-      defaultCheckedKeys: h,
-      show: o,
-      allowDrop: l,
-      keepSelection: y,
-      restoreSelection: g,
-      save: d,
-      reset: b
-    } = ae();
+      drawerWidth: n,
+      defaultCheckedKeys: p,
+      show: d,
+      allowDrop: m,
+      allowDrag: T,
+      keepSelection: k,
+      restoreSelection: $,
+      save: S,
+      reset: l
+    } = ge();
     return e({
-      show: o
-    }), { __sfc: !0, treeRef: t, visible: s, snapshot: i, drawerWidth: a, defaultCheckedKeys: h, show: o, allowDrop: l, keepSelection: y, restoreSelection: g, save: d, reset: b };
-  }
-});
-var le = function() {
-  var e = this, t = e._self._c, s = e._self._setupProxy;
-  return t("el-drawer", { attrs: { size: s.drawerWidth, title: "搜索项配置", visible: s.visible }, on: { "update:visible": function(i) {
-    s.visible = i;
-  } } }, [t("div", { staticClass: "setting-container" }, [t("el-tree", { ref: "treeRef", staticClass: "tree", attrs: { "default-expand-all": "", "default-checked-keys": s.defaultCheckedKeys, "node-key": "id", draggable: "", "show-checkbox": "", data: s.snapshot, "allow-drop": s.allowDrop }, on: { "node-drag-start": s.keepSelection, "node-drag-end": s.restoreSelection } }), t("div", { staticClass: "footer" }, [t("el-button", { on: { click: s.reset } }, [e._v("重置")]), t("el-button", { attrs: { type: "primary" }, on: { click: s.save } }, [e._v("保存")])], 1)], 1)]);
-}, oe = [], ce = /* @__PURE__ */ w(
-  ne,
-  le,
-  oe,
-  !1,
-  null,
-  null
-);
-const ue = ce.exports, he = /* @__PURE__ */ S({
+      show: d
+    }), (C, a) => {
+      const h = g("el-tree"), v = g("el-button"), _ = g("el-drawer");
+      return f(), w(_, {
+        class: "search-setting",
+        size: u(n),
+        title: "搜索项配置",
+        modelValue: u(r),
+        "onUpdate:modelValue": a[0] || (a[0] = (I) => Q(r) ? r.value = I : null)
+      }, {
+        footer: c(() => [
+          o(v, { onClick: u(l) }, {
+            default: c(() => [...a[1] || (a[1] = [
+              L("重置", -1)
+            ])]),
+            _: 1
+          }, 8, ["onClick"]),
+          o(v, {
+            type: "primary",
+            onClick: u(S)
+          }, {
+            default: c(() => [...a[2] || (a[2] = [
+              L("保存", -1)
+            ])]),
+            _: 1
+          }, 8, ["onClick"])
+        ]),
+        default: c(() => [
+          o(h, {
+            class: "tree",
+            "default-expand-all": "",
+            "default-checked-keys": u(p),
+            "node-key": "id",
+            ref_key: "treeRef",
+            ref: t,
+            draggable: "",
+            "show-checkbox": "",
+            data: u(i),
+            onNodeDragStart: u(k),
+            onNodeDragEnd: u($),
+            "allow-drop": u(m),
+            "allow-drag": u(T)
+          }, null, 8, ["default-checked-keys", "data", "onNodeDragStart", "onNodeDragEnd", "allow-drop", "allow-drag"])
+        ]),
+        _: 1
+      }, 8, ["size", "modelValue"]);
+    };
+  }
+}), ye = /* @__PURE__ */ D({
   __name: "SettingButton",
   props: {
-    state: null
+    state: {}
   },
-  setup(r) {
-    const e = r, t = u();
-    return { __sfc: !0, props: e, searchSettingDialogRef: t, showSearchLayoutDialog: () => {
+  setup(s) {
+    const e = s, t = y(), r = () => {
       t.value.show(e.state);
-    }, SearchSettingsDrawer: ue };
+    };
+    return (i, n) => {
+      const p = g("el-icon"), d = g("el-button");
+      return f(), w(d, {
+        class: "icon-button",
+        onClick: r
+      }, {
+        default: c(() => [
+          o(p, null, {
+            default: c(() => [
+              o(u(le))
+            ]),
+            _: 1
+          }),
+          o(ve, {
+            ref_key: "searchSettingDialogRef",
+            ref: t
+          }, null, 512)
+        ]),
+        _: 1
+      });
+    };
   }
-});
-var de = function() {
-  var e = this, t = e._self._c, s = e._self._setupProxy;
-  return t("div", { staticStyle: { "margin-right": "10px" } }, [t("el-button", { staticClass: "icon-button", staticStyle: { height: "100%" }, on: { click: s.showSearchLayoutDialog } }, [t("i", { staticClass: "el-icon-s-tools" })]), t(s.SearchSettingsDrawer, { ref: "searchSettingDialogRef" })], 1);
-}, fe = [], pe = /* @__PURE__ */ w(
-  he,
-  de,
-  fe,
-  !1,
-  null,
-  "61aa7563"
-);
-const ve = pe.exports, _e = /* @__PURE__ */ S({
+}), _e = { class: "search-bar-container" }, be = { class: "search-item" }, Se = { class: "search-item-title" }, we = ["id"], xe = { class: "search-bottom" }, ke = { class: "actions" }, $e = /* @__PURE__ */ D({
   __name: "SearchBar",
   props: {
-    searches: null,
-    id: null,
-    onSearch: { type: Function },
+    searches: {},
+    id: {},
+    onSearch: {},
     defaultSpan: { default: 6 },
     maxRows: { default: 2 },
     itemHeight: { default: 67 },
     resetAutoSearch: { type: Boolean, default: !0 }
   },
-  setup(r, { expose: e }) {
-    const t = r, s = I(new re(t.id, t.searches, t.onSearch)), i = u(!1), a = C(() => O(Array.from(Object.values(s.config.itemLayouts)).map((d) => d.span)) / 24 > t.maxRows), h = C(() => [...s.items].sort((d, b) => s.config.itemLayouts[d.field].index - s.config.itemLayouts[b.field].index).filter((d) => s.config.itemLayouts[d.field].visible)), o = C(() => ({
-      height: `${t.itemHeight * t.maxRows}px`,
+  emits: ["change"],
+  setup(s, { expose: e, emit: t }) {
+    const r = s, i = H(new pe(r.id, r.searches, r.onSearch)), n = y(!1), p = j(() => W(Array.from(Object.values(i.config.itemLayouts)).filter((l) => l.visible).map((l) => l.span)) / 24 > r.maxRows), d = y([]), m = t;
+    ae(() => i.items, () => {
+      const S = [...i.items];
+      d.value = S.sort((l, C) => i.config.itemLayouts[l.field].index - i.config.itemLayouts[C.field].index).filter((l) => i.config.itemLayouts[l.field].visible).filter((l) => l.isEnable(i)), m("change", i.getSearchObject(), i);
+    }, { debounce: 100, immediate: !0, deep: !0 });
+    const T = j(() => ({
+      height: `${r.itemHeight * r.maxRows}px`,
       overflow: "hidden"
-    })), l = (g) => s.config.itemLayouts[g.field], y = () => s.items;
+    })), k = (S) => i.config.itemLayouts[S.field];
     return e({
-      getSearchItems: y
-    }), { __sfc: !0, props: t, state: s, expanded: i, isShowSpanIcon: a, sortedItems: h, itemHeightStyle: o, getLayout: l, getSearchItems: y, SearchTagsRender: M, SearchItemRender: ie, SettingButton: ve };
+      getSearchItems: () => i.items
+    }), (S, l) => {
+      const C = g("el-col"), a = g("el-row"), h = g("el-icon"), v = g("el-button");
+      return f(), A("div", _e, [
+        o(a, {
+          class: Z("search"),
+          style: Y(p.value && !n.value ? T.value : {}),
+          gutter: 16
+        }, {
+          default: c(() => [
+            (f(!0), A(N, null, B(d.value, (_) => ee((f(), w(C, {
+              span: k(_).span,
+              key: _.field
+            }, {
+              default: c(() => [
+                b("div", be, [
+                  b("div", Se, F(_.label), 1),
+                  b("div", {
+                    id: `${s.id}-${_.field}`,
+                    class: "search-item-content"
+                  }, [
+                    o(u(me), {
+                      search: _,
+                      api: i
+                    }, null, 8, ["search", "api"])
+                  ], 8, we)
+                ])
+              ]),
+              _: 2
+            }, 1032, ["span"])), [
+              [te, k(_).visible]
+            ])), 128))
+          ]),
+          _: 1
+        }, 8, ["style"]),
+        b("div", xe, [
+          i.tags.length > 0 ? (f(), w(ue, {
+            key: 0,
+            tags: i.tags
+          }, null, 8, ["tags"])) : q("", !0),
+          b("div", ke, [
+            p.value ? (f(), w(v, {
+              key: 0,
+              class: "icon-button",
+              onClick: l[0] || (l[0] = (_) => n.value = !n.value)
+            }, {
+              default: c(() => [
+                o(h, null, {
+                  default: c(() => [
+                    n.value ? (f(), w(u(ne), { key: 1 })) : (f(), w(u(re), { key: 0 }))
+                  ]),
+                  _: 1
+                })
+              ]),
+              _: 1
+            })) : q("", !0),
+            o(ye, { state: i }, null, 8, ["state"]),
+            o(v, {
+              onClick: l[1] || (l[1] = () => i.reset(s.resetAutoSearch))
+            }, {
+              default: c(() => [...l[3] || (l[3] = [
+                L("重 置", -1)
+              ])]),
+              _: 1
+            }),
+            o(v, {
+              type: "primary",
+              loading: i.searching,
+              disabled: i.searching,
+              onClick: l[2] || (l[2] = () => i.doSearch())
+            }, {
+              default: c(() => [...l[4] || (l[4] = [
+                L("搜 索", -1)
+              ])]),
+              _: 1
+            }, 8, ["loading", "disabled"])
+          ])
+        ])
+      ]);
+    };
   }
 });
-var ge = function() {
-  var e = this, t = e._self._c, s = e._self._setupProxy;
-  return t("div", { staticClass: "search-bar-container" }, [t("el-row", { class: "search", style: s.isShowSpanIcon && !s.expanded ? s.itemHeightStyle : {}, attrs: { gutter: 16 } }, e._l(s.sortedItems, function(i) {
-    return t("el-col", { directives: [{ name: "show", rawName: "v-show", value: s.getLayout(i).visible, expression: "getLayout(item).visible" }], key: i.field, attrs: { span: s.getLayout(i).span } }, [t("div", { staticClass: "search-item" }, [t("div", { staticClass: "search-item-title" }, [e._v(e._s(i.label))]), t("div", { staticClass: "search-item-content", attrs: { id: `${e.id}-${i.field}` } }, [t(s.SearchItemRender, { attrs: { search: i } })], 1)])]);
-  }), 1), t("div", { staticClass: "search-bottom" }, [s.state.tags.length > 0 ? t(s.SearchTagsRender, { attrs: { tags: s.state.tags } }) : e._e(), t("div", { staticClass: "actions" }, [s.isShowSpanIcon ? t("el-button", { staticClass: "icon-button", staticStyle: { "margin-right": "10px" }, on: { click: function(i) {
-    s.expanded = !s.expanded;
-  } } }, [t("i", { class: [s.expanded ? "el-icon-arrow-up" : "el-icon-arrow-down"] })]) : e._e(), t(s.SettingButton, { attrs: { state: s.state } }), t("el-button", { on: { click: () => s.state.reset(e.resetAutoSearch) } }, [e._v("重 置")]), t("el-button", { attrs: { type: "primary", loading: s.state.searching, disabled: s.state.searching }, on: { click: () => s.state.doSearch() } }, [e._v("搜 索")])], 1)], 1)], 1);
-}, me = [], ye = /* @__PURE__ */ w(
-  _e,
-  ge,
-  me,
-  !1,
-  null,
-  null
-);
-const Te = ye.exports;
-var Se = Object.defineProperty, be = (r, e, t) => e in r ? Se(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t, we = (r, e, t) => be(r, e + "", t);
-class $ {
+class E {
+  record;
   constructor(e) {
-    we(this, "record"), this.record = e;
+    this.record = e;
   }
   static from(e) {
-    const t = e.filter((s) => s.value === void 0 ? !1 : Array.isArray(s.value) ? s.value.length > 0 : !0).reduce(
-      (s, i) => {
-        const a = i.transform ? i.transform(i.value) : i.value;
+    const t = e.filter((r) => r.value === void 0 ? !1 : Array.isArray(r.value) ? r.value.length > 0 : !0).reduce(
+      (r, i) => {
+        const n = i.transform ? i.transform(i.value) : i.value;
         return {
-          ...s,
-          ...E(a) ? a : { [i.field]: a }
+          ...r,
+          ...X(n) ? n : { [i.field]: n }
         };
       },
       {}
     );
-    return new $(t);
+    return new E(t);
   }
   transform(e, t) {
-    const s = this.record[e], i = t(s);
+    const r = this.record[e], i = t(r);
     return delete this.record[e], this.record = { ...this.record, ...i }, this;
   }
   toCondition(e) {
@@ -440,7 +603,6 @@ class $ {
   }
 }
 export {
-  Te as SearchBar,
-  $ as Searches,
-  Le as vModel
+  $e as SearchBar,
+  E as Searches
 };