@scvzerng/element-plus-search-vue2 0.0.8 → 0.0.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,22 +1,22 @@
1
- import { get as P, set as R, isFunction as T, keyBy as j, isNumber as k, isBoolean as q, isEmpty as E, chain as B, sum as N, isPlainObject as V } from "lodash-unified";
2
- import { defineComponent as w, ref as h, shallowRef as I, reactive as K, computed as O } from "vue";
3
- import { watchDebounced as H } from "@vueuse/core";
4
- const Ae = (r) => ({
1
+ import { get as R, set as j, isFunction as $, keyBy as E, isNumber as k, isBoolean as q, isEmpty as P, chain as N, sum as B, isPlainObject as V } from "lodash-unified";
2
+ import { defineComponent as w, ref as d, shallowRef as I, reactive as H, computed as T } from "vue";
3
+ import { useDebounceFn as K, watchDebounced as M } from "@vueuse/core";
4
+ const Pe = (r) => ({
5
5
  model: {
6
- value: P(r, "value"),
6
+ value: R(r, "value"),
7
7
  callback: (e) => {
8
- R(r, "value", e);
8
+ j(r, "value", e);
9
9
  }
10
10
  }
11
- }), z = w({
11
+ }), W = w({
12
12
  name: "SearchTags"
13
- }), M = /* @__PURE__ */ w({
14
- ...z,
13
+ }), z = /* @__PURE__ */ w({
14
+ ...W,
15
15
  props: {
16
16
  tags: null
17
17
  },
18
18
  setup(r) {
19
- const e = r, t = h();
19
+ const e = r, t = d();
20
20
  return { __sfc: !0, props: e, scrollContainer: t, scrollLeft: () => {
21
21
  t.value.scrollBy({ left: -200, behavior: "smooth" });
22
22
  }, scrollRight: () => {
@@ -27,34 +27,34 @@ const Ae = (r) => ({
27
27
  } };
28
28
  }
29
29
  });
30
- function C(r, e, t, s, i, a, d, o) {
30
+ function C(r, e, t, s, i, a, u, o) {
31
31
  var c = typeof r == "function" ? r.options : r;
32
32
  return e && (c.render = e, c.staticRenderFns = t, c._compiled = !0), a && (c._scopeId = "data-v-" + a), {
33
33
  exports: r,
34
34
  options: c
35
35
  };
36
36
  }
37
- var W = function() {
37
+ var U = function() {
38
38
  var e = this, t = e._self._c, s = e._self._setupProxy;
39
39
  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) {
40
40
  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) } })]);
41
41
  }), 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);
42
- }, G = [], U = /* @__PURE__ */ C(
43
- M,
44
- W,
45
- G,
42
+ }, Y = [], G = /* @__PURE__ */ C(
43
+ z,
44
+ U,
45
+ Y,
46
46
  !1,
47
47
  null,
48
48
  null
49
49
  );
50
- const X = U.exports;
50
+ const X = G.exports;
51
51
  var J = Object.defineProperty, Q = (r, e, t) => e in r ? J(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t, l = (r, e, t) => Q(r, typeof e != "symbol" ? e + "" : e, t);
52
52
  const F = 6;
53
- class Y {
53
+ class Z {
54
54
  constructor(e, t) {
55
- l(this, "field"), l(this, "label"), l(this, "value"), l(this, "required"), l(this, "index"), l(this, "visible"), l(this, "disabled"), l(this, "span"), l(this, "initValue"), l(this, "enable"), l(this, "tagFilter"), l(this, "render"), l(this, "transform");
56
- var s, i, a, d;
57
- 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 : F, this.render = e.render, this.tagFilter = e.tagFilter, this.transform = e.transform, this.enable = (a = e.enable) != null ? a : !0, this.disabled = (d = e.disabled) != null ? d : !1;
55
+ l(this, "field"), l(this, "label"), l(this, "value"), l(this, "required"), l(this, "index"), l(this, "visible"), l(this, "disabled"), l(this, "span"), l(this, "initValue"), l(this, "enable"), l(this, "tagFilter"), l(this, "render"), l(this, "transform"), l(this, "onChange");
56
+ var s, i, a, u;
57
+ 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 : F, this.render = e.render, this.tagFilter = e.tagFilter, this.transform = e.transform, this.enable = (a = e.enable) != null ? a : !0, this.disabled = (u = e.disabled) != null ? u : !1, e.onChange && (this.onChange = K((o, c) => e.onChange(o, c), 50));
58
58
  }
59
59
  clean() {
60
60
  Array.isArray(this.value) ? this.value = [] : this.value = void 0;
@@ -63,13 +63,13 @@ class Y {
63
63
  this.value = this.initValue;
64
64
  }
65
65
  isEnable(e) {
66
- return T(this.enable) ? this.enable(e.getSearchObject()) : this.enable;
66
+ return $(this.enable) ? this.enable(e.getSearchObject()) : this.enable;
67
67
  }
68
68
  isDisabled(e) {
69
- return T(this.disabled) ? this.disabled(e.getSearchObject()) : this.disabled;
69
+ return $(this.disabled) ? this.disabled(e.getSearchObject()) : this.disabled;
70
70
  }
71
71
  }
72
- var Z = Object.defineProperty, ee = (r, e, t) => e in r ? Z(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t, p = (r, e, t) => ee(r, typeof e != "symbol" ? e + "" : e, t);
72
+ var ee = Object.defineProperty, te = (r, e, t) => e in r ? ee(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t, p = (r, e, t) => te(r, typeof e != "symbol" ? e + "" : e, t);
73
73
  class g {
74
74
  constructor(e, t, s, i) {
75
75
  p(this, "field"), p(this, "span"), p(this, "index"), p(this, "visible"), this.field = e, this.span = t, this.index = s, this.visible = i;
@@ -102,17 +102,17 @@ class g {
102
102
  this.span = e.span, this.index = e.index, this.visible = e.visible;
103
103
  }
104
104
  }
105
- const D = (r) => `searches_layouts_${r}`;
106
- class te {
105
+ const A = (r) => `searches_layouts_${r}`;
106
+ class se {
107
107
  constructor(e, t) {
108
- p(this, "id"), p(this, "state"), p(this, "itemLayouts"), p(this, "initialLayouts"), this.id = e.id, this.initialLayouts = t, this.state = e, this.itemLayouts = j(e.items.map(g.fromSearchItem), (s) => s.field), this.restoreCachedLayouts();
108
+ p(this, "id"), p(this, "state"), p(this, "itemLayouts"), p(this, "initialLayouts"), this.id = e.id, this.initialLayouts = t, this.state = e, this.itemLayouts = E(e.items.map(g.fromSearchItem), (s) => s.field), this.restoreCachedLayouts();
109
109
  }
110
110
  /**
111
111
  * 恢复自缓存中的布局信息
112
112
  * @private
113
113
  */
114
114
  restoreCachedLayouts() {
115
- const e = localStorage.getItem(D(this.id));
115
+ const e = localStorage.getItem(A(this.id));
116
116
  e && e.split(",").forEach((t) => {
117
117
  const s = g.fromString(t), i = this.itemLayouts[s.field];
118
118
  i && i.merge(s);
@@ -128,7 +128,7 @@ class te {
128
128
  }
129
129
  persistent() {
130
130
  localStorage.setItem(
131
- D(this.id),
131
+ A(this.id),
132
132
  Object.values(this.itemLayouts).map((e) => e.toString()).join(",")
133
133
  ), this.state.updateTags();
134
134
  }
@@ -139,8 +139,8 @@ class te {
139
139
  });
140
140
  }
141
141
  }
142
- var se = Object.defineProperty, re = (r, e, t) => e in r ? se(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t, f = (r, e, t) => re(r, typeof e != "symbol" ? e + "" : e, t);
143
- const ie = [
142
+ var re = Object.defineProperty, ie = (r, e, t) => e in r ? re(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t, f = (r, e, t) => ie(r, typeof e != "symbol" ? e + "" : e, t);
143
+ const ae = [
144
144
  {
145
145
  isApply(r) {
146
146
  return r.contains("el-radio-group");
@@ -223,42 +223,42 @@ const ie = [
223
223
  }
224
224
  }
225
225
  ];
226
- class A {
226
+ class D {
227
227
  constructor(e, t) {
228
228
  f(this, "id"), f(this, "field"), f(this, "value"), f(this, "label"), f(this, "valueText"), f(this, "required"), f(this, "item"), f(this, "state");
229
229
  var s;
230
230
  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();
231
231
  }
232
232
  static hasValue(e) {
233
- return k(e.value) || q(e.value) ? !0 : !E(e.value);
233
+ return k(e.value) || q(e.value) ? !0 : !P(e.value);
234
234
  }
235
235
  updateValueText() {
236
236
  const e = document.querySelector(this.id);
237
237
  if (e.children.length !== 1)
238
238
  throw new Error("holder children length is not 1");
239
- const t = e.children[0], s = ie.find((i) => i.isApply(t.classList));
239
+ const t = e.children[0], s = ae.find((i) => i.isApply(t.classList));
240
240
  s && (this.valueText = s.getText(t, this));
241
241
  }
242
242
  async clean() {
243
243
  this.item.clean(), await this.state.doSearch();
244
244
  }
245
245
  }
246
- var ae = Object.defineProperty, ne = (r, e, t) => e in r ? ae(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t, _ = (r, e, t) => ne(r, typeof e != "symbol" ? e + "" : e, t);
247
- class le {
246
+ var ne = Object.defineProperty, le = (r, e, t) => e in r ? ne(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t, _ = (r, e, t) => le(r, typeof e != "symbol" ? e + "" : e, t);
247
+ class oe {
248
248
  constructor(e, t, s) {
249
- this.id = e, _(this, "items"), _(this, "config"), _(this, "searching"), _(this, "tags"), _(this, "searchCallback"), _(this, "sourceSearchable"), _(this, "_lastSearchObject", { time: 0, data: null }), this.id = e, this.items = t.map((i, a) => new Y(i, a)), this.config = new te(
249
+ this.id = e, _(this, "items"), _(this, "config"), _(this, "searching"), _(this, "tags"), _(this, "searchCallback"), _(this, "sourceSearchable"), _(this, "_lastSearchObject", { time: 0, data: null }), this.id = e, this.items = t.map((i, a) => new Z(i, a)), this.config = new se(
250
250
  this,
251
251
  t.map((i, a) => g.formSearchConfig(i, a))
252
252
  ), this.sourceSearchable = t, this.searching = !1, this.searchCallback = s, this.tags = [];
253
253
  }
254
254
  updateTags() {
255
- this.tags = this.items.filter((e) => e.tagFilter ? e.tagFilter(e.value) : A.hasValue(e)).map((e) => new A(this, e)).sort(
255
+ this.tags = this.items.filter((e) => e.tagFilter ? e.tagFilter(e.value) : D.hasValue(e)).map((e) => new D(this, e)).sort(
256
256
  (e, t) => this.config.itemLayouts[e.field].index - this.config.itemLayouts[t.field].index
257
257
  );
258
258
  }
259
259
  getSearchObject(e) {
260
260
  const t = Date.now();
261
- return this._lastSearchObject.data && t - this._lastSearchObject.time < 50 ? this._lastSearchObject.data : (this._lastSearchObject = { time: t, data: L.from(this.items).toCondition(e) }, this._lastSearchObject.data);
261
+ return this._lastSearchObject.data && t - this._lastSearchObject.time < 50 ? this._lastSearchObject.data : (this._lastSearchObject = { time: t, data: O.from(this.items).toCondition(e) }, this._lastSearchObject.data);
262
262
  }
263
263
  async doSearch() {
264
264
  if (!this.searching)
@@ -271,12 +271,12 @@ class le {
271
271
  async reset(e) {
272
272
  this.items.forEach((t) => t.reset()), e && await this.doSearch();
273
273
  }
274
- setSearchValue(e, t) {
275
- const s = this.items.find((i) => i.field === e);
276
- s && (s.value = t);
274
+ setSearchValue(e, t, s = (i) => !0) {
275
+ const i = this.items.find((a) => a.field === e);
276
+ i && s && s(i.value) && (i.value = t);
277
277
  }
278
278
  }
279
- const oe = {
279
+ const ce = {
280
280
  functional: !0,
281
281
  props: {
282
282
  search: {
@@ -289,30 +289,36 @@ const oe = {
289
289
  },
290
290
  render(r, e) {
291
291
  const { props: t } = e, s = t.search.render(t.search);
292
- return s.componentOptions.propsData || (s.componentOptions.propsData = {}), s.componentOptions.propsData.disabled = t.search.isDisabled(t.api), s;
292
+ if (s.componentOptions.propsData || (s.componentOptions.propsData = {}), s.componentOptions.listeners || (s.componentOptions.listeners = {}), s.componentOptions.listeners.input) {
293
+ const i = s.componentOptions.listeners.input;
294
+ s.componentOptions.listeners.input = (a) => {
295
+ t.search.onChange && t.search.onChange(a, t.api), i(a);
296
+ };
297
+ }
298
+ return s.componentOptions.propsData.disabled = t.search.isDisabled(t.api), s;
293
299
  }
294
- }, ce = () => {
295
- const r = I(), e = h(), t = h([]), s = h(!1), i = h(), a = h([]), d = h(300), o = (n) => {
300
+ }, ue = () => {
301
+ const r = I(), e = d(), t = d([]), s = d(!1), i = d(), a = d([]), u = d(300), o = (n) => {
296
302
  r.value = n, t.value = [
297
303
  {
298
304
  label: "全部",
299
305
  id: "all",
300
306
  children: r.value.items.sort(
301
- (u, $) => n.config.itemLayouts[u.field].index - n.config.itemLayouts[$.field].index
302
- ).map((u) => ({
303
- label: u.label,
304
- id: u.field,
305
- disabled: !u.isEnable(n)
307
+ (h, L) => n.config.itemLayouts[h.field].index - n.config.itemLayouts[L.field].index
308
+ ).map((h) => ({
309
+ label: h.label,
310
+ id: h.field,
311
+ disabled: !h.isEnable(n)
306
312
  }))
307
313
  }
308
- ], i.value = B(n.config.itemLayouts).pickBy((u) => u.visible).keys().value();
314
+ ], i.value = N(n.config.itemLayouts).pickBy((h) => h.visible).keys().value();
309
315
  };
310
316
  return {
311
317
  treeRef: e,
312
318
  visible: s,
313
319
  snapshot: t,
314
320
  defaultCheckedKeys: i,
315
- drawerWidth: d,
321
+ drawerWidth: u,
316
322
  updateSnapshot: o,
317
323
  show: (n) => {
318
324
  o(n), s.value = !0;
@@ -332,10 +338,10 @@ const oe = {
332
338
  restoreSelection: () => {
333
339
  e.value.setCheckedKeys(a.value), a.value = [];
334
340
  },
335
- allowDrop: (n, u, $) => $ !== "inner",
341
+ allowDrop: (n, h, L) => L !== "inner",
336
342
  allowDrag: (n) => !n.disabled
337
343
  };
338
- }, ue = /* @__PURE__ */ w({
344
+ }, he = /* @__PURE__ */ w({
339
345
  __name: "SearchSettingsDrawer",
340
346
  setup(r, { expose: e }) {
341
347
  const {
@@ -343,7 +349,7 @@ const oe = {
343
349
  visible: s,
344
350
  snapshot: i,
345
351
  drawerWidth: a,
346
- defaultCheckedKeys: d,
352
+ defaultCheckedKeys: u,
347
353
  show: o,
348
354
  allowDrop: c,
349
355
  allowDrag: x,
@@ -351,49 +357,49 @@ const oe = {
351
357
  restoreSelection: b,
352
358
  save: y,
353
359
  reset: S
354
- } = ce();
360
+ } = ue();
355
361
  return e({
356
362
  show: o
357
- }), { __sfc: !0, treeRef: t, visible: s, snapshot: i, drawerWidth: a, defaultCheckedKeys: d, show: o, allowDrop: c, allowDrag: x, keepSelection: m, restoreSelection: b, save: y, reset: S };
363
+ }), { __sfc: !0, treeRef: t, visible: s, snapshot: i, drawerWidth: a, defaultCheckedKeys: u, show: o, allowDrop: c, allowDrag: x, keepSelection: m, restoreSelection: b, save: y, reset: S };
358
364
  }
359
365
  });
360
- var he = function() {
366
+ var de = function() {
361
367
  var e = this, t = e._self._c, s = e._self._setupProxy;
362
368
  return t("el-drawer", { attrs: { size: s.drawerWidth, title: "搜索项配置", visible: s.visible }, on: { "update:visible": function(i) {
363
369
  s.visible = i;
364
370
  } } }, [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, "allow-drag": s.allowDrag }, 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)]);
365
- }, de = [], fe = /* @__PURE__ */ C(
366
- ue,
371
+ }, fe = [], pe = /* @__PURE__ */ C(
367
372
  he,
368
373
  de,
374
+ fe,
369
375
  !1,
370
376
  null,
371
377
  null
372
378
  );
373
- const pe = fe.exports, ve = /* @__PURE__ */ w({
379
+ const ve = pe.exports, _e = /* @__PURE__ */ w({
374
380
  __name: "SettingButton",
375
381
  props: {
376
382
  state: null
377
383
  },
378
384
  setup(r) {
379
- const e = r, t = h();
385
+ const e = r, t = d();
380
386
  return { __sfc: !0, props: e, searchSettingDialogRef: t, showSearchLayoutDialog: () => {
381
387
  t.value.show(e.state);
382
- }, SearchSettingsDrawer: pe };
388
+ }, SearchSettingsDrawer: ve };
383
389
  }
384
390
  });
385
- var _e = function() {
391
+ var ge = function() {
386
392
  var e = this, t = e._self._c, s = e._self._setupProxy;
387
393
  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);
388
- }, ge = [], me = /* @__PURE__ */ C(
389
- ve,
394
+ }, me = [], be = /* @__PURE__ */ C(
390
395
  _e,
391
396
  ge,
397
+ me,
392
398
  !1,
393
399
  null,
394
400
  "61aa7563"
395
401
  );
396
- const be = me.exports, ye = /* @__PURE__ */ w({
402
+ const ye = be.exports, Se = /* @__PURE__ */ w({
397
403
  __name: "SearchBar",
398
404
  props: {
399
405
  searches: null,
@@ -406,12 +412,12 @@ const be = me.exports, ye = /* @__PURE__ */ w({
406
412
  },
407
413
  emits: ["change"],
408
414
  setup(r, { expose: e, emit: t }) {
409
- const s = r, i = K(new le(s.id, s.searches, s.onSearch)), a = h(!1), d = O(() => N(Array.from(Object.values(i.config.itemLayouts)).filter((n) => n.visible).map((n) => n.span)) / 24 > s.maxRows), o = h([]);
410
- H(() => [i.items, i.config.itemLayouts], () => {
415
+ const s = r, i = H(new oe(s.id, s.searches, s.onSearch)), a = d(!1), u = T(() => B(Array.from(Object.values(i.config.itemLayouts)).filter((n) => n.visible).map((n) => n.span)) / 24 > s.maxRows), o = d([]);
416
+ M(() => [i.items, i.config.itemLayouts], () => {
411
417
  const v = [...i.items];
412
- o.value = v.sort((n, u) => i.config.itemLayouts[n.field].index - i.config.itemLayouts[u.field].index).filter((n) => i.config.itemLayouts[n.field].visible).filter((n) => n.isEnable(i)), t("change", i.getSearchObject(), i);
418
+ o.value = v.sort((n, h) => i.config.itemLayouts[n.field].index - i.config.itemLayouts[h.field].index).filter((n) => i.config.itemLayouts[n.field].visible).filter((n) => n.isEnable(i)), t("change", i.getSearchObject(), i);
413
419
  }, { debounce: 100, immediate: !0, deep: !0 });
414
- const c = O(() => ({
420
+ const c = T(() => ({
415
421
  height: `${s.itemHeight * s.maxRows}px`,
416
422
  overflow: "hidden"
417
423
  })), x = (v) => i.config.itemLayouts[v.field], m = () => i.items, b = () => i.getSearchObject(), y = (v) => {
@@ -424,27 +430,35 @@ const be = me.exports, ye = /* @__PURE__ */ w({
424
430
  getSearchObject: b,
425
431
  updateSearching: y,
426
432
  updateTags: S
427
- }), { __sfc: !0, props: s, state: i, expanded: a, isShowSpanIcon: d, sortedItems: o, emits: t, itemHeightStyle: c, getLayout: x, getSearchItems: m, getSearchObject: b, updateSearching: y, updateTags: S, SearchTagsRender: X, SearchItemRender: oe, SettingButton: be };
433
+ }), { __sfc: !0, props: s, state: i, expanded: a, isShowSpanIcon: u, sortedItems: o, emits: t, itemHeightStyle: c, getLayout: x, getSearchItems: m, getSearchObject: b, updateSearching: y, updateTags: S, SearchTagsRender: X, SearchItemRender: ce, SettingButton: ye };
428
434
  }
429
435
  });
430
- var Se = function() {
436
+ var we = function() {
431
437
  var e = this, t = e._self._c, s = e._self._setupProxy;
432
438
  return t("div", { staticClass: "search-bar-container" }, [t("el-row", { class: "search", staticStyle: { "flex-wrap": "wrap" }, style: s.isShowSpanIcon && !s.expanded ? s.itemHeightStyle : {}, attrs: { type: "flex", gutter: 16 } }, e._l(s.sortedItems, function(i) {
433
439
  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, api: s.state } })], 1)])]);
434
440
  }), 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) {
435
441
  s.expanded = !s.expanded;
436
442
  } } }, [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", { attrs: { type: "primary", loading: s.state.searching, disabled: s.state.searching }, on: { click: () => s.state.doSearch() } }, [e._v("查 询")]), t("el-button", { on: { click: () => s.state.reset(e.resetAutoSearch) } }, [e._v("重 置")])], 1)], 1)], 1);
437
- }, we = [], xe = /* @__PURE__ */ C(
438
- ye,
443
+ }, xe = [], Ce = /* @__PURE__ */ C(
439
444
  Se,
440
445
  we,
446
+ xe,
441
447
  !1,
442
448
  null,
443
449
  null
444
450
  );
445
- const Fe = xe.exports;
446
- var Ce = Object.defineProperty, $e = (r, e, t) => e in r ? Ce(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t, Le = (r, e, t) => $e(r, e + "", t);
447
- const Pe = (r, e, t) => ({
451
+ const Fe = Ce.exports;
452
+ var Le = Object.defineProperty, Oe = (r, e, t) => e in r ? Le(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t, $e = (r, e, t) => Oe(r, e + "", t);
453
+ const Re = (r) => P(r), je = () => !0, Ee = (r, e) => {
454
+ const t = r.getSearchObject();
455
+ let s = !0;
456
+ for (const [i, a] of Object.entries(e)) {
457
+ const u = t[i];
458
+ s = a(u), s || (s = !1);
459
+ }
460
+ return () => s;
461
+ }, ke = (r, e, t) => ({
448
462
  /**
449
463
  * 数据刷新回调代理
450
464
  *
@@ -470,9 +484,9 @@ const Pe = (r, e, t) => ({
470
484
  await ((s = i.value) == null ? void 0 : s.refresh());
471
485
  }
472
486
  });
473
- class L {
487
+ class O {
474
488
  constructor(e) {
475
- Le(this, "record"), this.record = e;
489
+ $e(this, "record"), this.record = e;
476
490
  }
477
491
  static from(e) {
478
492
  const t = e.filter((s) => s.value === void 0 ? !1 : Array.isArray(s.value) ? s.value.length > 0 : !0).reduce(
@@ -485,7 +499,7 @@ class L {
485
499
  },
486
500
  {}
487
501
  );
488
- return new L(t);
502
+ return new O(t);
489
503
  }
490
504
  transform(e, t) {
491
505
  const s = this.record[e], i = t(s);
@@ -496,8 +510,11 @@ class L {
496
510
  }
497
511
  }
498
512
  export {
513
+ je as APPLY_ALWAYS,
514
+ Re as APPLY_WHEN_NOT_VALUE,
515
+ Ee as APPLY_WITH_MULTIPLE_VALUE,
499
516
  Fe as SearchBar,
500
- L as Searches,
501
- Pe as useSearchProxy,
502
- Ae as vModel
517
+ O as Searches,
518
+ ke as useSearchProxy,
519
+ Pe as vModel
503
520
  };
@@ -1 +1 @@
1
- (function(u,o){typeof exports=="object"&&typeof module<"u"?o(exports,require("lodash-unified"),require("vue"),require("@vueuse/core")):typeof define=="function"&&define.amd?define(["exports","lodash-unified","vue","@vueuse/core"],o):(u=typeof globalThis<"u"?globalThis:u||self,o(u.ElementPlusSearch={},u.lodashUnified,u.vue,u.core))})(this,function(u,o,l,A){"use strict";const F=r=>({model:{value:o.get(r,"value"),callback:e=>{o.set(r,"value",e)}}}),R=l.defineComponent({name:"SearchTags"}),j=l.defineComponent({...R,props:{tags:null},setup(r){const e=r,t=l.ref();return{__sfc:!0,props:e,scrollContainer:t,scrollLeft:()=>{t.value.scrollBy({left:-200,behavior:"smooth"})},scrollRight:()=>{t.value.scrollBy({left:200,behavior:"smooth"})}}}});function C(r,e,t,s,i,a,p,h){var d=typeof r=="function"?r.options:r;return e&&(d.render=e,d.staticRenderFns=t,d._compiled=!0),a&&(d._scopeId="data-v-"+a),{exports:r,options:d}}var q=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)},k=[],E=C(j,q,k,!1,null,null);const B=E.exports;var N=Object.defineProperty,V=(r,e,t)=>e in r?N(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,c=(r,e,t)=>V(r,typeof e!="symbol"?e+"":e,t);const O=6;class I{constructor(e,t){c(this,"field"),c(this,"label"),c(this,"value"),c(this,"required"),c(this,"index"),c(this,"visible"),c(this,"disabled"),c(this,"span"),c(this,"initValue"),c(this,"enable"),c(this,"tagFilter"),c(this,"render"),c(this,"transform");var s,i,a,p;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:O,this.render=e.render,this.tagFilter=e.tagFilter,this.transform=e.transform,this.enable=(a=e.enable)!=null?a:!0,this.disabled=(p=e.disabled)!=null?p:!1}clean(){Array.isArray(this.value)?this.value=[]:this.value=void 0}reset(){this.value=this.initValue}isEnable(e){return o.isFunction(this.enable)?this.enable(e.getSearchObject()):this.enable}isDisabled(e){return o.isFunction(this.disabled)?this.disabled(e.getSearchObject()):this.disabled}}var K=Object.defineProperty,H=(r,e,t)=>e in r?K(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,_=(r,e,t)=>H(r,typeof e!="symbol"?e+"":e,t);class g{constructor(e,t,s,i){_(this,"field"),_(this,"span"),_(this,"index"),_(this,"visible"),this.field=e,this.span=t,this.index=s,this.visible=i}static fromSearchItem(e,t){return new g(e.field,e.span,t??e.index,e.visible)}static formSearchConfig(e,t){var s,i;return new g(e.field,(s=e.span)!=null?s:O,t??e,(i=e.visible)!=null?i:!0)}static fromString(e){const[t,s,i,a]=e.split("_");return new g(s,Number(i),Number(t),a==="true")}toString(){return`${this.index}_${this.field}_${this.span}_${this.visible}`}merge(e){this.span=e.span,this.index=e.index,this.visible=e.visible}}const D=r=>`searches_layouts_${r}`;class M{constructor(e,t){_(this,"id"),_(this,"state"),_(this,"itemLayouts"),_(this,"initialLayouts"),this.id=e.id,this.initialLayouts=t,this.state=e,this.itemLayouts=o.keyBy(e.items.map(g.fromSearchItem),s=>s.field),this.restoreCachedLayouts()}restoreCachedLayouts(){const e=localStorage.getItem(D(this.id));e&&e.split(",").forEach(t=>{const s=g.fromString(t),i=this.itemLayouts[s.field];i&&i.merge(s)})}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)})}persistent(){localStorage.setItem(D(this.id),Object.values(this.itemLayouts).map(e=>e.toString()).join(",")),this.state.updateTags()}reset(){this.initialLayouts.forEach(e=>{const t=this.itemLayouts[e.field];t&&t.merge(e)})}}var z=Object.defineProperty,W=(r,e,t)=>e in r?z(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,v=(r,e,t)=>W(r,typeof e!="symbol"?e+"":e,t);const G=[{isApply(r){return r.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}},{isApply(r){return r.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}条`}},{isApply(r){return r.contains("el-input")},getText(r,e){return e.value}},{isApply(r){return r.contains("el-input-number")},getText(r,e){return e.value}},{isApply(r){return r.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}},{isApply(r){return r.contains("el-cascader")},getText(r){var e;return(e=r.querySelector("input"))==null?void 0:e.value}},{isApply(r){return r.contains("el-switch")},getText(r){return r.querySelector(".is-active").innerHTML}},{isApply(r){return r.contains("el-slider")},getText(r,e){return e.value}},{isApply(r){return r.contains("el-date-editor")},getText(r,e){return e.value?e.value.join(" ~ "):e.value}}];class P{constructor(e,t){v(this,"id"),v(this,"field"),v(this,"value"),v(this,"label"),v(this,"valueText"),v(this,"required"),v(this,"item"),v(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()}static hasValue(e){return o.isNumber(e.value)||o.isBoolean(e.value)?!0:!o.isEmpty(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=G.find(i=>i.isApply(t.classList));s&&(this.valueText=s.getText(t,this))}async clean(){this.item.clean(),await this.state.doSearch()}}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,m=(r,e,t)=>J(r,typeof e!="symbol"?e+"":e,t);class Q{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"),m(this,"_lastSearchObject",{time:0,data:null}),this.id=e,this.items=t.map((i,a)=>new I(i,a)),this.config=new M(this,t.map((i,a)=>g.formSearchConfig(i,a))),this.sourceSearchable=t,this.searching=!1,this.searchCallback=s,this.tags=[]}updateTags(){this.tags=this.items.filter(e=>e.tagFilter?e.tagFilter(e.value):P.hasValue(e)).map(e=>new P(this,e)).sort((e,t)=>this.config.itemLayouts[e.field].index-this.config.itemLayouts[t.field].index)}getSearchObject(e){const t=Date.now();return this._lastSearchObject.data&&t-this._lastSearchObject.time<50?this._lastSearchObject.data:(this._lastSearchObject={time:t,data:$.from(this.items).toCondition(e)},this._lastSearchObject.data)}async doSearch(){if(!this.searching)try{this.searching=!0,await this.searchCallback(this.getSearchObject()),this.updateTags()}finally{this.searching=!1}}async reset(e){this.items.forEach(t=>t.reset()),e&&await this.doSearch()}setSearchValue(e,t){const s=this.items.find(i=>i.field===e);s&&(s.value=t)}}const Y={functional:!0,props:{search:{type:Object,required:!0},api:{type:Object}},render(r,e){const{props:t}=e,s=t.search.render(t.search);return s.componentOptions.propsData||(s.componentOptions.propsData={}),s.componentOptions.propsData.disabled=t.search.isDisabled(t.api),s}},Z=()=>{const r=l.shallowRef(),e=l.ref(),t=l.ref([]),s=l.ref(!1),i=l.ref(),a=l.ref([]),p=l.ref(300),h=n=>{r.value=n,t.value=[{label:"全部",id:"all",children:r.value.items.sort((f,T)=>n.config.itemLayouts[f.field].index-n.config.itemLayouts[T.field].index).map(f=>({label:f.label,id:f.field,disabled:!f.isEnable(n)}))}],i.value=o.chain(n.config.itemLayouts).pickBy(f=>f.visible).keys().value()};return{treeRef:e,visible:s,snapshot:t,defaultCheckedKeys:i,drawerWidth:p,updateSnapshot:h,show:n=>{h(n),s.value=!0},save:()=>{r.value.config.sync(t.value[0].children.map(n=>n.id),new Set(e.value.getCheckedKeys())),r.value.config.persistent()},reset:()=>{r.value.config.reset(),h(r.value)},keepSelection:()=>{a.value=e.value.getCheckedKeys()},restoreSelection:()=>{e.value.setCheckedKeys(a.value),a.value=[]},allowDrop:(n,f,T)=>T!=="inner",allowDrag:n=>!n.disabled}},U=l.defineComponent({__name:"SearchSettingsDrawer",setup(r,{expose:e}){const{treeRef:t,visible:s,snapshot:i,drawerWidth:a,defaultCheckedKeys:p,show:h,allowDrop:d,allowDrag:L,keepSelection:y,restoreSelection:S,save:w,reset:x}=Z();return e({show:h}),{__sfc:!0,treeRef:t,visible:s,snapshot:i,drawerWidth:a,defaultCheckedKeys:p,show:h,allowDrop:d,allowDrag:L,keepSelection:y,restoreSelection:S,save:w,reset:x}}});var ee=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,"allow-drag":s.allowDrag},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)])},te=[],se=C(U,ee,te,!1,null,null);const re=se.exports,ie=l.defineComponent({__name:"SettingButton",props:{state:null},setup(r){const e=r,t=l.ref();return{__sfc:!0,props:e,searchSettingDialogRef:t,showSearchLayoutDialog:()=>{t.value.show(e.state)},SearchSettingsDrawer:re}}});var ae=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)},ne=[],le=C(ie,ae,ne,!1,null,"61aa7563");const oe=le.exports,ce=l.defineComponent({__name:"SearchBar",props:{searches:null,id:null,onSearch:{type:Function},defaultSpan:{default:6},maxRows:{default:2},itemHeight:{default:67},resetAutoSearch:{type:Boolean,default:!0}},emits:["change"],setup(r,{expose:e,emit:t}){const s=r,i=l.reactive(new Q(s.id,s.searches,s.onSearch)),a=l.ref(!1),p=l.computed(()=>o.sum(Array.from(Object.values(i.config.itemLayouts)).filter(n=>n.visible).map(n=>n.span))/24>s.maxRows),h=l.ref([]);A.watchDebounced(()=>[i.items,i.config.itemLayouts],()=>{const b=[...i.items];h.value=b.sort((n,f)=>i.config.itemLayouts[n.field].index-i.config.itemLayouts[f.field].index).filter(n=>i.config.itemLayouts[n.field].visible).filter(n=>n.isEnable(i)),t("change",i.getSearchObject(),i)},{debounce:100,immediate:!0,deep:!0});const d=l.computed(()=>({height:`${s.itemHeight*s.maxRows}px`,overflow:"hidden"})),L=b=>i.config.itemLayouts[b.field],y=()=>i.items,S=()=>i.getSearchObject(),w=b=>{i.searching=b},x=()=>{i.updateTags()};return e({getSearchItems:y,getSearchObject:S,updateSearching:w,updateTags:x}),{__sfc:!0,props:s,state:i,expanded:a,isShowSpanIcon:p,sortedItems:h,emits:t,itemHeightStyle:d,getLayout:L,getSearchItems:y,getSearchObject:S,updateSearching:w,updateTags:x,SearchTagsRender:B,SearchItemRender:Y,SettingButton:oe}}});var ue=function(){var e=this,t=e._self._c,s=e._self._setupProxy;return t("div",{staticClass:"search-bar-container"},[t("el-row",{class:"search",staticStyle:{"flex-wrap":"wrap"},style:s.isShowSpanIcon&&!s.expanded?s.itemHeightStyle:{},attrs:{type:"flex",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,api:s.state}})],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",{attrs:{type:"primary",loading:s.state.searching,disabled:s.state.searching},on:{click:()=>s.state.doSearch()}},[e._v("查 询")]),t("el-button",{on:{click:()=>s.state.reset(e.resetAutoSearch)}},[e._v("重 置")])],1)],1)],1)},he=[],de=C(ce,ue,he,!1,null,null);const fe=de.exports;var pe=Object.defineProperty,_e=(r,e,t)=>e in r?pe(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,ve=(r,e,t)=>_e(r,e+"",t);const ge=(r,e,t)=>({refreshCallback:async s=>{const i=e.value.getSearchObject();try{return e.value.updateSearching(!0),await r(i,s)}finally{e.value.updateSearching(!1),e.value.updateTags()}},searchCallback:async()=>{var s;for(const i of t)await((s=i.value)==null?void 0:s.refresh())}});class ${constructor(e){ve(this,"record"),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;return{...s,...o.isPlainObject(a)?a:{[i.field]:a}}},{});return new $(t)}transform(e,t){const s=this.record[e],i=t(s);return delete this.record[e],this.record={...this.record,...i},this}toCondition(e){return{...this.record,...e}}}u.SearchBar=fe,u.Searches=$,u.useSearchProxy=ge,u.vModel=F,Object.defineProperty(u,Symbol.toStringTag,{value:"Module"})});
1
+ (function(c,o){typeof exports=="object"&&typeof module<"u"?o(exports,require("lodash-unified"),require("vue"),require("@vueuse/core")):typeof define=="function"&&define.amd?define(["exports","lodash-unified","vue","@vueuse/core"],o):(c=typeof globalThis<"u"?globalThis:c||self,o(c.ElementPlusSearch={},c.lodashUnified,c.vue,c.core))})(this,function(c,o,l,P){"use strict";const E=r=>({model:{value:o.get(r,"value"),callback:e=>{o.set(r,"value",e)}}}),F=l.defineComponent({name:"SearchTags"}),j=l.defineComponent({...F,props:{tags:null},setup(r){const e=r,t=l.ref();return{__sfc:!0,props:e,scrollContainer:t,scrollLeft:()=>{t.value.scrollBy({left:-200,behavior:"smooth"})},scrollRight:()=>{t.value.scrollBy({left:200,behavior:"smooth"})}}}});function L(r,e,t,s,i,a,f,h){var d=typeof r=="function"?r.options:r;return e&&(d.render=e,d.staticRenderFns=t,d._compiled=!0),a&&(d._scopeId="data-v-"+a),{exports:r,options:d}}var R=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)},q=[],k=L(j,R,q,!1,null,null);const N=k.exports;var B=Object.defineProperty,V=(r,e,t)=>e in r?B(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,u=(r,e,t)=>V(r,typeof e!="symbol"?e+"":e,t);const A=6;class I{constructor(e,t){u(this,"field"),u(this,"label"),u(this,"value"),u(this,"required"),u(this,"index"),u(this,"visible"),u(this,"disabled"),u(this,"span"),u(this,"initValue"),u(this,"enable"),u(this,"tagFilter"),u(this,"render"),u(this,"transform"),u(this,"onChange");var s,i,a,f;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.enable=(a=e.enable)!=null?a:!0,this.disabled=(f=e.disabled)!=null?f:!1,e.onChange&&(this.onChange=P.useDebounceFn((h,d)=>e.onChange(h,d),50))}clean(){Array.isArray(this.value)?this.value=[]:this.value=void 0}reset(){this.value=this.initValue}isEnable(e){return o.isFunction(this.enable)?this.enable(e.getSearchObject()):this.enable}isDisabled(e){return o.isFunction(this.disabled)?this.disabled(e.getSearchObject()):this.disabled}}var H=Object.defineProperty,M=(r,e,t)=>e in r?H(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,_=(r,e,t)=>M(r,typeof e!="symbol"?e+"":e,t);class g{constructor(e,t,s,i){_(this,"field"),_(this,"span"),_(this,"index"),_(this,"visible"),this.field=e,this.span=t,this.index=s,this.visible=i}static fromSearchItem(e,t){return new g(e.field,e.span,t??e.index,e.visible)}static formSearchConfig(e,t){var s,i;return new g(e.field,(s=e.span)!=null?s:A,t??e,(i=e.visible)!=null?i:!0)}static fromString(e){const[t,s,i,a]=e.split("_");return new g(s,Number(i),Number(t),a==="true")}toString(){return`${this.index}_${this.field}_${this.span}_${this.visible}`}merge(e){this.span=e.span,this.index=e.index,this.visible=e.visible}}const $=r=>`searches_layouts_${r}`;class W{constructor(e,t){_(this,"id"),_(this,"state"),_(this,"itemLayouts"),_(this,"initialLayouts"),this.id=e.id,this.initialLayouts=t,this.state=e,this.itemLayouts=o.keyBy(e.items.map(g.fromSearchItem),s=>s.field),this.restoreCachedLayouts()}restoreCachedLayouts(){const e=localStorage.getItem($(this.id));e&&e.split(",").forEach(t=>{const s=g.fromString(t),i=this.itemLayouts[s.field];i&&i.merge(s)})}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)})}persistent(){localStorage.setItem($(this.id),Object.values(this.itemLayouts).map(e=>e.toString()).join(",")),this.state.updateTags()}reset(){this.initialLayouts.forEach(e=>{const t=this.itemLayouts[e.field];t&&t.merge(e)})}}var K=Object.defineProperty,Y=(r,e,t)=>e in r?K(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,v=(r,e,t)=>Y(r,typeof e!="symbol"?e+"":e,t);const z=[{isApply(r){return r.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}},{isApply(r){return r.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}条`}},{isApply(r){return r.contains("el-input")},getText(r,e){return e.value}},{isApply(r){return r.contains("el-input-number")},getText(r,e){return e.value}},{isApply(r){return r.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}},{isApply(r){return r.contains("el-cascader")},getText(r){var e;return(e=r.querySelector("input"))==null?void 0:e.value}},{isApply(r){return r.contains("el-switch")},getText(r){return r.querySelector(".is-active").innerHTML}},{isApply(r){return r.contains("el-slider")},getText(r,e){return e.value}},{isApply(r){return r.contains("el-date-editor")},getText(r,e){return e.value?e.value.join(" ~ "):e.value}}];class D{constructor(e,t){v(this,"id"),v(this,"field"),v(this,"value"),v(this,"label"),v(this,"valueText"),v(this,"required"),v(this,"item"),v(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()}static hasValue(e){return o.isNumber(e.value)||o.isBoolean(e.value)?!0:!o.isEmpty(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=z.find(i=>i.isApply(t.classList));s&&(this.valueText=s.getText(t,this))}async clean(){this.item.clean(),await this.state.doSearch()}}var G=Object.defineProperty,X=(r,e,t)=>e in r?G(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,m=(r,e,t)=>X(r,typeof e!="symbol"?e+"":e,t);class J{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"),m(this,"_lastSearchObject",{time:0,data:null}),this.id=e,this.items=t.map((i,a)=>new I(i,a)),this.config=new W(this,t.map((i,a)=>g.formSearchConfig(i,a))),this.sourceSearchable=t,this.searching=!1,this.searchCallback=s,this.tags=[]}updateTags(){this.tags=this.items.filter(e=>e.tagFilter?e.tagFilter(e.value):D.hasValue(e)).map(e=>new D(this,e)).sort((e,t)=>this.config.itemLayouts[e.field].index-this.config.itemLayouts[t.field].index)}getSearchObject(e){const t=Date.now();return this._lastSearchObject.data&&t-this._lastSearchObject.time<50?this._lastSearchObject.data:(this._lastSearchObject={time:t,data:x.from(this.items).toCondition(e)},this._lastSearchObject.data)}async doSearch(){if(!this.searching)try{this.searching=!0,await this.searchCallback(this.getSearchObject()),this.updateTags()}finally{this.searching=!1}}async reset(e){this.items.forEach(t=>t.reset()),e&&await this.doSearch()}setSearchValue(e,t,s=i=>!0){const i=this.items.find(a=>a.field===e);i&&s&&s(i.value)&&(i.value=t)}}const Q={functional:!0,props:{search:{type:Object,required:!0},api:{type:Object}},render(r,e){const{props:t}=e,s=t.search.render(t.search);if(s.componentOptions.propsData||(s.componentOptions.propsData={}),s.componentOptions.listeners||(s.componentOptions.listeners={}),s.componentOptions.listeners.input){const i=s.componentOptions.listeners.input;s.componentOptions.listeners.input=a=>{t.search.onChange&&t.search.onChange(a,t.api),i(a)}}return s.componentOptions.propsData.disabled=t.search.isDisabled(t.api),s}},Z=()=>{const r=l.shallowRef(),e=l.ref(),t=l.ref([]),s=l.ref(!1),i=l.ref(),a=l.ref([]),f=l.ref(300),h=n=>{r.value=n,t.value=[{label:"全部",id:"all",children:r.value.items.sort((p,O)=>n.config.itemLayouts[p.field].index-n.config.itemLayouts[O.field].index).map(p=>({label:p.label,id:p.field,disabled:!p.isEnable(n)}))}],i.value=o.chain(n.config.itemLayouts).pickBy(p=>p.visible).keys().value()};return{treeRef:e,visible:s,snapshot:t,defaultCheckedKeys:i,drawerWidth:f,updateSnapshot:h,show:n=>{h(n),s.value=!0},save:()=>{r.value.config.sync(t.value[0].children.map(n=>n.id),new Set(e.value.getCheckedKeys())),r.value.config.persistent()},reset:()=>{r.value.config.reset(),h(r.value)},keepSelection:()=>{a.value=e.value.getCheckedKeys()},restoreSelection:()=>{e.value.setCheckedKeys(a.value),a.value=[]},allowDrop:(n,p,O)=>O!=="inner",allowDrag:n=>!n.disabled}},U=l.defineComponent({__name:"SearchSettingsDrawer",setup(r,{expose:e}){const{treeRef:t,visible:s,snapshot:i,drawerWidth:a,defaultCheckedKeys:f,show:h,allowDrop:d,allowDrag:T,keepSelection:y,restoreSelection:S,save:w,reset:C}=Z();return e({show:h}),{__sfc:!0,treeRef:t,visible:s,snapshot:i,drawerWidth:a,defaultCheckedKeys:f,show:h,allowDrop:d,allowDrag:T,keepSelection:y,restoreSelection:S,save:w,reset:C}}});var ee=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,"allow-drag":s.allowDrag},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)])},te=[],se=L(U,ee,te,!1,null,null);const re=se.exports,ie=l.defineComponent({__name:"SettingButton",props:{state:null},setup(r){const e=r,t=l.ref();return{__sfc:!0,props:e,searchSettingDialogRef:t,showSearchLayoutDialog:()=>{t.value.show(e.state)},SearchSettingsDrawer:re}}});var ae=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)},ne=[],le=L(ie,ae,ne,!1,null,"61aa7563");const oe=le.exports,ce=l.defineComponent({__name:"SearchBar",props:{searches:null,id:null,onSearch:{type:Function},defaultSpan:{default:6},maxRows:{default:2},itemHeight:{default:67},resetAutoSearch:{type:Boolean,default:!0}},emits:["change"],setup(r,{expose:e,emit:t}){const s=r,i=l.reactive(new J(s.id,s.searches,s.onSearch)),a=l.ref(!1),f=l.computed(()=>o.sum(Array.from(Object.values(i.config.itemLayouts)).filter(n=>n.visible).map(n=>n.span))/24>s.maxRows),h=l.ref([]);P.watchDebounced(()=>[i.items,i.config.itemLayouts],()=>{const b=[...i.items];h.value=b.sort((n,p)=>i.config.itemLayouts[n.field].index-i.config.itemLayouts[p.field].index).filter(n=>i.config.itemLayouts[n.field].visible).filter(n=>n.isEnable(i)),t("change",i.getSearchObject(),i)},{debounce:100,immediate:!0,deep:!0});const d=l.computed(()=>({height:`${s.itemHeight*s.maxRows}px`,overflow:"hidden"})),T=b=>i.config.itemLayouts[b.field],y=()=>i.items,S=()=>i.getSearchObject(),w=b=>{i.searching=b},C=()=>{i.updateTags()};return e({getSearchItems:y,getSearchObject:S,updateSearching:w,updateTags:C}),{__sfc:!0,props:s,state:i,expanded:a,isShowSpanIcon:f,sortedItems:h,emits:t,itemHeightStyle:d,getLayout:T,getSearchItems:y,getSearchObject:S,updateSearching:w,updateTags:C,SearchTagsRender:N,SearchItemRender:Q,SettingButton:oe}}});var ue=function(){var e=this,t=e._self._c,s=e._self._setupProxy;return t("div",{staticClass:"search-bar-container"},[t("el-row",{class:"search",staticStyle:{"flex-wrap":"wrap"},style:s.isShowSpanIcon&&!s.expanded?s.itemHeightStyle:{},attrs:{type:"flex",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,api:s.state}})],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",{attrs:{type:"primary",loading:s.state.searching,disabled:s.state.searching},on:{click:()=>s.state.doSearch()}},[e._v("查 询")]),t("el-button",{on:{click:()=>s.state.reset(e.resetAutoSearch)}},[e._v("重 置")])],1)],1)],1)},he=[],de=L(ce,ue,he,!1,null,null);const fe=de.exports;var pe=Object.defineProperty,_e=(r,e,t)=>e in r?pe(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,ve=(r,e,t)=>_e(r,e+"",t);const ge=r=>o.isEmpty(r),me=()=>!0,be=(r,e)=>{const t=r.getSearchObject();let s=!0;for(const[i,a]of Object.entries(e)){const f=t[i];s=a(f),s||(s=!1)}return()=>s},ye=(r,e,t)=>({refreshCallback:async s=>{const i=e.value.getSearchObject();try{return e.value.updateSearching(!0),await r(i,s)}finally{e.value.updateSearching(!1),e.value.updateTags()}},searchCallback:async()=>{var s;for(const i of t)await((s=i.value)==null?void 0:s.refresh())}});class x{constructor(e){ve(this,"record"),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;return{...s,...o.isPlainObject(a)?a:{[i.field]:a}}},{});return new x(t)}transform(e,t){const s=this.record[e],i=t(s);return delete this.record[e],this.record={...this.record,...i},this}toCondition(e){return{...this.record,...e}}}c.APPLY_ALWAYS=me,c.APPLY_WHEN_NOT_VALUE=ge,c.APPLY_WITH_MULTIPLE_VALUE=be,c.SearchBar=fe,c.Searches=x,c.useSearchProxy=ye,c.vModel=E,Object.defineProperty(c,Symbol.toStringTag,{value:"Module"})});
@@ -29,6 +29,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
29
29
  tagFilter?: ((value: any) => boolean) | undefined;
30
30
  render: import("./model/SearchItem").SearchItemRender;
31
31
  transform?: import("./index.js").TransformCallback<any> | undefined;
32
+ onChange?: ((value: any, api: SearchBarState) => void) | undefined;
32
33
  clean: () => void;
33
34
  reset: () => void;
34
35
  isEnable: (state: SearchBarState) => boolean;
@@ -2,6 +2,7 @@ import { SearchItem } from './model/SearchItem';
2
2
  import { SearchConfig } from './model/SearchConfig';
3
3
  import { SearchTag } from './model/SearchTag';
4
4
  import { Searchable } from './types/Searchable';
5
+ import { SearchValueApply } from './index';
5
6
  export declare class SearchBarState {
6
7
  id: string;
7
8
  items: SearchItem[];
@@ -16,5 +17,5 @@ export declare class SearchBarState {
16
17
  getSearchObject<T>(ext?: any): T;
17
18
  doSearch(): Promise<void>;
18
19
  reset(search?: boolean): Promise<void>;
19
- setSearchValue(field: string, value: any): void;
20
+ setSearchValue<T>(field: string, value?: T, isApply?: SearchValueApply<T>): void;
20
21
  }
@@ -3,11 +3,17 @@ import { SearchValueLike } from './types/SearchValueLike';
3
3
  export * from "./helper/vModel";
4
4
  export * from "./types/Searchable";
5
5
  import { Ref } from 'vue';
6
+ import { SearchBarState } from './SearchBarState';
6
7
  export * from './types/Searchable';
7
8
  export { default as SearchBar } from './SearchBar.vue';
8
9
  export interface RefreshInstance<SEARCH_OBJECT> {
9
10
  refresh: (searchObject?: SEARCH_OBJECT) => void | Promise<void>;
10
11
  }
12
+ export declare const APPLY_WHEN_NOT_VALUE: SearchValueApply<any>;
13
+ export declare const APPLY_ALWAYS: SearchValueApply<any>;
14
+ export type SearchValueApply<T> = (value?: T) => boolean;
15
+ export type SearchMultipleValueApply = Record<string, SearchValueApply<any>>;
16
+ export declare const APPLY_WITH_MULTIPLE_VALUE: (api: SearchBarState, config: SearchMultipleValueApply) => SearchValueApply<any>;
11
17
  export declare const useSearchProxy: <C_PARAM, SEARCH_OBJECT, VALUE>(callback: (searchObject: SEARCH_OBJECT, params: C_PARAM) => VALUE, instance: Ref<SearchBarInstance<SEARCH_OBJECT>>, refreshInstance: Ref<RefreshInstance<SEARCH_OBJECT>>[]) => {
12
18
  /**
13
19
  * 数据刷新回调代理
@@ -18,6 +18,7 @@ export declare class SearchItem {
18
18
  tagFilter?: (value: any) => boolean;
19
19
  render: SearchItemRender;
20
20
  transform?: TransformCallback<any>;
21
+ onChange?: (value: any, api: SearchBarState) => void;
21
22
  constructor(searchable: Searchable, index: number);
22
23
  clean(): void;
23
24
  reset(): void;
@@ -30,7 +30,7 @@ export interface Searchable {
30
30
  /**
31
31
  * 搜索项是否启用
32
32
  */
33
- enable: boolean | PredicateCallback;
33
+ enable?: boolean | PredicateCallback;
34
34
  span?: number;
35
35
  /**
36
36
  * 渲染器
@@ -39,4 +39,5 @@ export interface Searchable {
39
39
  render: (value: SearchItem) => VNode | undefined;
40
40
  transform?: TransformCallback<any>;
41
41
  tagFilter?: (value: any) => boolean;
42
+ onChange?: (value: any, api: SearchBarState) => void;
42
43
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@scvzerng/element-plus-search-vue2",
3
- "version": "0.0.8",
3
+ "version": "0.0.9",
4
4
  "type": "module",
5
5
  "private": false,
6
6
  "scripts": {