admins-components 9.0.23 → 9.0.25

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.
Files changed (38) hide show
  1. package/README.md +15 -65
  2. package/dist/admins-components15.js +17 -23
  3. package/dist/admins-components15.js.map +1 -1
  4. package/dist/admins-components153.js.map +1 -1
  5. package/dist/admins-components157.js +3 -3
  6. package/dist/admins-components157.js.map +1 -1
  7. package/dist/admins-components158.js.map +1 -1
  8. package/dist/admins-components16.js.map +1 -1
  9. package/dist/admins-components160.js.map +1 -1
  10. package/dist/admins-components162.js.map +1 -1
  11. package/dist/admins-components163.js.map +1 -1
  12. package/dist/admins-components164.js.map +1 -1
  13. package/dist/admins-components166.js.map +1 -1
  14. package/dist/admins-components169.js +2 -2
  15. package/dist/admins-components169.js.map +1 -1
  16. package/dist/admins-components20.js +87 -87
  17. package/dist/admins-components20.js.map +1 -1
  18. package/dist/admins-components22.js.map +1 -1
  19. package/dist/admins-components69.js +1 -0
  20. package/dist/admins-components69.js.map +1 -1
  21. package/dist/admins-components71.js.map +1 -1
  22. package/dist/admins-components78.js +93 -89
  23. package/dist/admins-components78.js.map +1 -1
  24. package/dist/admins-components80.js.map +1 -1
  25. package/dist/admins-components87.js +26 -35
  26. package/dist/admins-components87.js.map +1 -1
  27. package/dist/admins-components89.js.map +1 -1
  28. package/dist/main.css +1 -0
  29. package/dist/main.css.map +1 -0
  30. package/dist/src/styles/components/data-table/data-paginator.scss_vue_type_style_index_0_src_true_lang.css +1 -1
  31. package/dist/src/vueformelements/ArticlePickerElement.vue_vue_type_style_index_0_scoped_43c54caa_lang.css +1 -0
  32. package/dist/src/vueformelements/PartnerPickerElement.vue_vue_type_style_index_0_scoped_09bea4ae_lang.css +1 -0
  33. package/package.json +3 -3
  34. package/dist/base.css +0 -1
  35. package/dist/base.css.map +0 -1
  36. package/dist/src/services/articleEditorService_short_try.d.ts +0 -43
  37. package/dist/src/vueformelements/ArticlePickerElement.vue_vue_type_style_index_0_scoped_035d2808_lang.css +0 -1
  38. package/dist/src/vueformelements/PartnerPickerElement.vue_vue_type_style_index_0_scoped_64cb4d6e_lang.css +0 -1
@@ -9,28 +9,28 @@ import { debounce as s } from "./admins-components76.js";
9
9
  import { filterEmptyValues as c, getFilterParams as l, writeFilterParams as u } from "./admins-components77.js";
10
10
  import { Fragment as d, createBlock as f, createCommentVNode as p, createElementBlock as m, createElementVNode as h, createVNode as g, defineComponent as _, mergeProps as v, normalizeClass as y, onMounted as b, openBlock as x, ref as S, renderList as C, toDisplayString as w, unref as T, watch as E, withCtx as D } from "vue";
11
11
  //#region src/components/data-table/DataFilters.vue?vue&type=script&setup=true&lang.ts
12
- var O = { class: "data-filters" }, k = {
12
+ var ee = { class: "data-filters" }, te = {
13
13
  key: 0,
14
14
  class: "data-filters__separator"
15
- }, A = ["for"], j = [
15
+ }, O = ["for"], k = [
16
16
  "placeholder",
17
17
  "value",
18
18
  "id",
19
19
  "onInput"
20
- ], M = [
20
+ ], A = ["for"], j = [
21
21
  "placeholder",
22
22
  "value",
23
23
  "id",
24
24
  "onInput"
25
- ], N = [
25
+ ], M = ["for"], N = [
26
26
  "placeholder",
27
27
  "value",
28
28
  "id",
29
29
  "onInput"
30
- ], P = { class: "data-filters__footer" }, F = {
30
+ ], P = ["for"], F = { class: "c-label" }, I = { class: "c-label" }, L = { class: "data-filters__footer" }, R = {
31
31
  key: 0,
32
32
  class: "separator my-3"
33
- }, I = /* @__PURE__ */ _({
33
+ }, z = /* @__PURE__ */ _({
34
34
  __name: "DataFilters",
35
35
  props: {
36
36
  open: {
@@ -54,19 +54,19 @@ var O = { class: "data-filters" }, k = {
54
54
  storageKey: {}
55
55
  },
56
56
  emits: ["close", "change"],
57
- setup(_, { expose: I, emit: L }) {
58
- let R = _, z = L, B = S(l(R.items) ?? {}), V = S({});
59
- function H(e, t) {
60
- t ? V.value[e] = t : delete V.value[e];
57
+ setup(_, { expose: z, emit: B }) {
58
+ let V = _, H = B, U = S(l(V.items) ?? {}), W = S({});
59
+ function G(e, t) {
60
+ t ? W.value[e] = t : delete W.value[e];
61
61
  }
62
- function U(e) {
62
+ function K(e) {
63
63
  return {
64
64
  ...e.config ?? {},
65
65
  showTime: e.type === "datetime",
66
66
  placeholder: e.placeholder ?? (e.type === "datetime" ? "Időpont" : "Dátum")
67
67
  };
68
68
  }
69
- function W(e) {
69
+ function q(e) {
70
70
  return {
71
71
  ...e.config ?? {},
72
72
  ...e.fullWidth ? {} : { compact: !0 },
@@ -74,22 +74,22 @@ var O = { class: "data-filters" }, k = {
74
74
  };
75
75
  }
76
76
  b(() => {
77
- if (!R.handleUrl) return;
78
- let e = l(R.items);
79
- e && Object.keys(e).length > 0 && (B.value = {
80
- ...B.value,
77
+ if (!V.handleUrl) return;
78
+ let e = l(V.items);
79
+ e && Object.keys(e).length > 0 && (U.value = {
80
+ ...U.value,
81
81
  ...e
82
82
  });
83
83
  });
84
- function G(e, t) {
85
- B.value = {
86
- ...B.value,
84
+ function J(e, t) {
85
+ U.value = {
86
+ ...U.value,
87
87
  [e]: t
88
- }, R.lazy || (R.handleUrl && u(R.items, B.value), z("change", K()));
88
+ }, V.lazy || (V.handleUrl && u(V.items, U.value), H("change", Y()));
89
89
  }
90
- function K() {
91
- let e = R.items.reduce((e, t) => {
92
- let n = B.value[t.key];
90
+ function Y() {
91
+ let e = V.items.reduce((e, t) => {
92
+ let n = U.value[t.key];
93
93
  return t.transformer ? {
94
94
  ...e,
95
95
  ...t.transformer(n) ?? {}
@@ -99,34 +99,34 @@ var O = { class: "data-filters" }, k = {
99
99
  };
100
100
  }, {});
101
101
  return {
102
- values: c(B.value),
102
+ values: c(U.value),
103
103
  transformed: c(e)
104
104
  };
105
105
  }
106
- let q = s((e, t) => {
107
- G(e, t);
106
+ let X = s((e, t) => {
107
+ J(e, t);
108
108
  });
109
- function J() {
110
- R.handleUrl && u(R.items, B.value), z("change", K()), z("close");
109
+ function Z() {
110
+ V.handleUrl && u(V.items, U.value), H("change", Y()), H("close");
111
111
  }
112
- function Y() {
113
- B.value = {}, R.handleUrl && u(R.items, B.value), z("change", K());
112
+ function ne() {
113
+ U.value = {}, V.handleUrl && u(V.items, U.value), H("change", Y());
114
114
  }
115
- let X = S(!1);
116
- E(B, (e) => {
117
- X.value = Object.values(e).some((e) => e !== null && e !== "" && e !== void 0);
115
+ let Q = S(!1);
116
+ E(U, (e) => {
117
+ Q.value = Object.values(e).some((e) => e !== null && e !== "" && e !== void 0);
118
118
  }, {
119
119
  deep: !0,
120
120
  immediate: !0
121
121
  });
122
- function Z(e) {
123
- B.value = {
124
- ...B.value,
122
+ function re(e) {
123
+ U.value = {
124
+ ...U.value,
125
125
  [e]: null
126
- }, R.handleUrl && u(R.items, B.value), z("change", K());
126
+ }, V.handleUrl && u(V.items, U.value), H("change", Y());
127
127
  }
128
- function Q(e) {
129
- let t = V.value[e];
128
+ function ie(e) {
129
+ let t = W.value[e];
130
130
  if (t) {
131
131
  if (typeof t.focusAndOpen == "function") {
132
132
  t.focusAndOpen();
@@ -136,93 +136,97 @@ var O = { class: "data-filters" }, k = {
136
136
  }
137
137
  }
138
138
  function $(e) {
139
- let t = { ...B.value };
140
- for (let n of R.items) n.type !== "separator" && n.key in e && (t[n.key] = e[n.key] ?? null);
141
- B.value = t, R.handleUrl && u(R.items, B.value), z("change", K());
139
+ let t = { ...U.value };
140
+ for (let n of V.items) n.type !== "separator" && n.key in e && (t[n.key] = e[n.key] ?? null);
141
+ U.value = t, V.handleUrl && u(V.items, U.value), H("change", Y());
142
142
  }
143
- return I({
144
- clearFilter: Z,
145
- focusFilter: Q
143
+ return z({
144
+ clearFilter: re,
145
+ focusFilter: ie
146
146
  }), (s, c) => (x(), f(a, {
147
147
  open: _.open,
148
148
  title: "Szűrők",
149
149
  position: _.position,
150
- onClose: c[0] ||= (e) => z("close")
150
+ onClose: c[0] ||= (e) => H("close")
151
151
  }, {
152
152
  default: D(() => [
153
- h("div", O, [(x(!0), m(d, null, C(_.items, (e) => (x(), m("div", {
153
+ h("div", ee, [(x(!0), m(d, null, C(_.items, (e) => (x(), m("div", {
154
154
  key: e.key,
155
155
  class: y(["data-filters__field", { "data-filters__field--full": e.fullWidth || e.type === "separator" }])
156
- }, [e.type === "separator" ? (x(), m("hr", k)) : e.type === "checkbox" ? (x(), f(n, v({
156
+ }, [e.type === "separator" ? (x(), m("hr", te)) : e.type === "checkbox" ? (x(), f(n, v({
157
157
  key: 1,
158
158
  ref_for: !0,
159
- ref: (t) => H(e.key, t),
160
- "model-value": B.value[e.key] ?? !1,
159
+ ref: (t) => G(e.key, t),
160
+ "model-value": U.value[e.key] ?? !1,
161
161
  label: e.label ?? e.key,
162
- "onUpdate:modelValue": (t) => G(e.key, t)
162
+ "onUpdate:modelValue": (t) => J(e.key, t)
163
163
  }, { ref_for: !0 }, e.config), null, 16, [
164
164
  "model-value",
165
165
  "label",
166
166
  "onUpdate:modelValue"
167
- ])) : (x(), m(d, { key: 2 }, [h("label", {
167
+ ])) : (x(), m(d, { key: 2 }, [e.type === "text" ? (x(), m(d, { key: 0 }, [h("label", {
168
168
  class: "c-label",
169
169
  for: `df-${e.key}`
170
- }, w(e.label ?? e.key), 9, A), e.type === "text" ? (x(), m("input", v({
170
+ }, w(e.label ?? e.key), 9, O), e.type === "text" ? (x(), m("input", v({
171
171
  key: 0,
172
172
  type: "text",
173
173
  class: "c-input-row",
174
174
  placeholder: e.placeholder,
175
- value: B.value[e.key] ?? "",
175
+ value: U.value[e.key] ?? "",
176
176
  ref_for: !0,
177
- ref: (t) => H(e.key, t),
177
+ ref: (t) => G(e.key, t),
178
178
  id: `df-${e.key}`,
179
- onInput: (t) => T(q)(e.key, t.target.value || null)
180
- }, { ref_for: !0 }, e.config), null, 16, j)) : e.type === "textarea" ? (x(), m("textarea", v({
181
- key: 1,
179
+ onInput: (t) => T(X)(e.key, t.target.value || null)
180
+ }, { ref_for: !0 }, e.config), null, 16, k)) : p("", !0)], 64)) : e.type === "textarea" ? (x(), m(d, { key: 1 }, [h("label", {
181
+ class: "c-label",
182
+ for: `df-${e.key}`
183
+ }, w(e.label ?? e.key), 9, A), h("textarea", v({
182
184
  class: "c-input-row data-filters__textarea",
183
185
  placeholder: e.placeholder,
184
- value: B.value[e.key] ?? "",
186
+ value: U.value[e.key] ?? "",
185
187
  ref_for: !0,
186
- ref: (t) => H(e.key, t),
188
+ ref: (t) => G(e.key, t),
187
189
  id: `df-${e.key}`
188
- }, { ref_for: !0 }, e.config, { onInput: (t) => T(q)(e.key, t.target.value || null) }), null, 16, M)) : e.type === "number" ? (x(), m("input", v({
189
- key: 2,
190
+ }, { ref_for: !0 }, e.config, { onInput: (t) => T(X)(e.key, t.target.value || null) }), null, 16, j)], 64)) : e.type === "number" ? (x(), m(d, { key: 2 }, [h("label", {
191
+ class: "c-label",
192
+ for: `df-${e.key}`
193
+ }, w(e.label ?? e.key), 9, M), h("input", v({
190
194
  type: "number",
191
195
  class: "c-input-row",
192
196
  placeholder: e.placeholder,
193
- value: B.value[e.key] ?? "",
197
+ value: U.value[e.key] ?? "",
194
198
  ref_for: !0,
195
- ref: (t) => H(e.key, t),
199
+ ref: (t) => G(e.key, t),
196
200
  id: `df-${e.key}`
197
- }, { ref_for: !0 }, e.config, { onInput: (t) => T(q)(e.key, t.target.value ? Number(t.target.value) : null) }), null, 16, N)) : e.type === "date" || e.type === "datetime" ? (x(), f(t, {
198
- key: 3,
201
+ }, { ref_for: !0 }, e.config, { onInput: (t) => T(X)(e.key, t.target.value ? Number(t.target.value) : null) }), null, 16, N)], 64)) : e.type === "date" || e.type === "datetime" ? (x(), m(d, { key: 3 }, [h("label", {
202
+ class: "c-label",
203
+ for: `df-${e.key}`
204
+ }, w(e.label ?? e.key), 9, P), g(t, {
199
205
  ref_for: !0,
200
- ref: (t) => H(e.key, t),
206
+ ref: (t) => G(e.key, t),
201
207
  id: `df-${e.key}`,
202
- "model-value": B.value[e.key] ?? null,
203
- config: U(e),
204
- "onUpdate:modelValue": (t) => G(e.key, t)
208
+ "model-value": U.value[e.key] ?? null,
209
+ config: K(e),
210
+ "onUpdate:modelValue": (t) => J(e.key, t)
205
211
  }, null, 8, [
206
212
  "id",
207
213
  "model-value",
208
214
  "config",
209
215
  "onUpdate:modelValue"
210
- ])) : e.type === "daterange" || e.type === "datetimerange" ? (x(), f(r, {
211
- key: 4,
216
+ ])], 64)) : e.type === "daterange" || e.type === "datetimerange" ? (x(), m(d, { key: 4 }, [h("span", F, w(e.label ?? e.key), 1), g(r, {
212
217
  ref_for: !0,
213
- ref: (t) => H(e.key, t),
214
- "model-value": B.value[e.key] ?? null,
215
- config: W(e),
216
- "onUpdate:modelValue": (t) => G(e.key, t)
218
+ ref: (t) => G(e.key, t),
219
+ "model-value": U.value[e.key] ?? null,
220
+ config: q(e),
221
+ "onUpdate:modelValue": (t) => J(e.key, t)
217
222
  }, null, 8, [
218
223
  "model-value",
219
224
  "config",
220
225
  "onUpdate:modelValue"
221
- ])) : e.type === "dropdown" ? (x(), f(i, {
222
- key: 5,
226
+ ])], 64)) : e.type === "dropdown" ? (x(), m(d, { key: 5 }, [h("span", I, w(e.label ?? e.key), 1), g(i, {
223
227
  ref_for: !0,
224
- ref: (t) => H(e.key, t),
225
- "model-value": B.value[e.key] ?? null,
228
+ ref: (t) => G(e.key, t),
229
+ "model-value": U.value[e.key] ?? null,
226
230
  options: e.options ?? [],
227
231
  config: {
228
232
  ...e.config ?? {},
@@ -230,31 +234,31 @@ var O = { class: "data-filters" }, k = {
230
234
  clearable: !0,
231
235
  filterable: !0
232
236
  },
233
- "onUpdate:modelValue": (t) => G(e.key, t)
237
+ "onUpdate:modelValue": (t) => J(e.key, t)
234
238
  }, null, 8, [
235
239
  "model-value",
236
240
  "options",
237
241
  "config",
238
242
  "onUpdate:modelValue"
239
- ])) : p("", !0)], 64))], 2))), 128))]),
240
- h("div", P, [g(e, {
243
+ ])], 64)) : p("", !0)], 64))], 2))), 128))]),
244
+ h("div", L, [g(e, {
241
245
  icon: "fa-solid fa-trash-can",
242
- disabled: !X.value,
246
+ disabled: !Q.value,
243
247
  label: "Szűrők törlése",
244
248
  "aria-label": "Szűrők törlése",
245
249
  size: "small",
246
- onClick: Y
250
+ onClick: ne
247
251
  }, null, 8, ["disabled"]), g(e, {
248
252
  label: "Szűrés",
249
253
  "aria-label": "Szűrés",
250
254
  type: "success",
251
- onClick: J
255
+ onClick: Z
252
256
  })]),
253
- _.historyEnabled ? (x(), m("hr", F)) : p("", !0),
257
+ _.historyEnabled ? (x(), m("hr", R)) : p("", !0),
254
258
  _.historyEnabled ? (x(), f(o, {
255
259
  key: 1,
256
260
  items: _.items,
257
- values: B.value,
261
+ values: U.value,
258
262
  "storage-key": _.storageKey,
259
263
  onLoad: $,
260
264
  onChange: $
@@ -269,4 +273,4 @@ var O = { class: "data-filters" }, k = {
269
273
  }
270
274
  });
271
275
  //#endregion
272
- export { I as default };
276
+ export { z as default };
@@ -1 +1 @@
1
- {"version":3,"file":"admins-components78.js","names":[],"sources":["../src/components/data-table/DataFilters.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { DropdownOption } from '@/components/DropdownSelect.vue'\n\nexport interface FilterItem {\n type: FilterItemType\n key: string\n label?: string\n placeholder?: string\n value?: any\n options?: DropdownOption[]\n fullWidth?: boolean\n config?: Record<string, any>\n displayClass?: string\n transformer?: (value: any) => Record<string, any> | null | undefined\n}\n\nexport interface FilterResponse {\n values: Record<string, any>\n transformed: Record<string, any>\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { ref, watch, onMounted } from 'vue'\nimport Sidebar, { type SidebarPosition } from '@/components/Sidebar.vue'\nimport DatePicker from '@/components/DatePicker.vue'\nimport DateRangePicker from '@/components/DateRangePicker.vue'\nimport DropdownSelect from '@/components/DropdownSelect.vue'\nimport Button from '@/components/Button.vue'\nimport Checkbox from '@/components/Checkbox.vue'\nimport FiltersHistory from '@/components/data-table/FiltersHistory.vue'\nimport { debounce } from '@/utils/debounce'\nimport type { DatePickerConfig, DateRangePickerConfig } from '@/types/datepickers'\nimport type { FilterItemType, PickedDate, PickedUtcRange } from '@/types/types'\nimport { filterEmptyValues, getFilterParams, writeFilterParams } from '@/utils/dataFilters'\n\n\nconst props = withDefaults(\n defineProps<{\n open?: boolean\n items: FilterItem[]\n position?: SidebarPosition\n lazy?: boolean\n handleUrl?: boolean\n historyEnabled?: boolean\n storageKey?: string\n }>(),\n {\n open: false,\n position: 'left',\n lazy: true,\n handleUrl: false,\n historyEnabled: true,\n },\n)\n\nconst emit = defineEmits<{\n close: []\n change: [response: FilterResponse]\n}>()\n\nconst values = ref<Record<string, any>>(getFilterParams(props.items) ?? {})\nconst filterRefs = ref<Record<string, any>>({})\n\nfunction setFilterRef(key: string, el: any) {\n if (el) {\n filterRefs.value[key] = el\n } else {\n delete filterRefs.value[key]\n }\n}\n\nfunction buildDatePickerConfig(item: FilterItem): DatePickerConfig {\n return {\n ...(item.config ?? {}),\n showTime: item.type === 'datetime',\n placeholder: item.placeholder ?? (item.type === 'datetime' ? 'Időpont' : 'Dátum'),\n }\n}\n\nfunction buildDateRangePickerConfig(item: FilterItem): DateRangePickerConfig {\n return {\n ...(item.config ?? {}),\n ...(!item.fullWidth ? { compact: true } : {}),\n showTime: item.type === 'datetimerange',\n }\n}\n\nonMounted(() => {\n if (!props.handleUrl) return\n const fromUrl = getFilterParams(props.items)\n if (fromUrl && Object.keys(fromUrl).length > 0) {\n values.value = { ...values.value, ...fromUrl }\n }\n})\n\nfunction update(key: string, value: any) {\n values.value = { ...values.value, [key]: value }\n\n if (!props.lazy) {\n if (props.handleUrl) writeFilterParams(props.items, values.value)\n emit('change', buildResponseEmit())\n }\n}\n\nfunction buildResponseEmit() {\n const transformedValues = props.items.reduce((acc, item) => {\n const val = values.value[item.key]\n if (item.transformer) {\n return { ...acc, ...(item.transformer(val) ?? {}) }\n }\n return { ...acc, [item.key]: val }\n }, {})\n return {\n values: filterEmptyValues(values.value),\n transformed: filterEmptyValues(transformedValues),\n }\n}\n\nconst debouncedUpdate = debounce((key: string, value: any) => {\n update(key, value)\n})\n\nfunction confirm() {\n if (props.handleUrl) writeFilterParams(props.items, values.value)\n\n emit('change', buildResponseEmit())\n emit('close')\n}\n\n/* function reset() {\n values.value = getDefaults()\n if (props.handleUrl) writeFilterParams(props.items, values.value)\n emit('change', filterEmptyValues(values.value))\n} */\n\nfunction clearAll() {\n values.value = {}\n if (props.handleUrl) writeFilterParams(props.items, values.value)\n\n emit('change', buildResponseEmit())\n}\n\nconst hasActiveFilters = ref(false)\nwatch(\n values,\n (v) => {\n hasActiveFilters.value = Object.values(v).some(\n (val) => val !== null && val !== '' && val !== undefined,\n )\n },\n { deep: true, immediate: true },\n)\n\nfunction clearFilter(key: string) {\n values.value = { ...values.value, [key]: null }\n if (props.handleUrl) writeFilterParams(props.items, values.value)\n emit('change', buildResponseEmit())\n}\n\nfunction focusFilter(key: string) {\n const ref = (filterRefs.value as Record<string, any>)[key]\n if (!ref) return\n\n if (typeof ref.focusAndOpen === 'function') {\n ref.focusAndOpen()\n return\n }\n if (typeof ref.focus === 'function') {\n ref.focus()\n }\n}\n\nfunction onHistoryLoad(loaded: Record<string, any>) {\n const next: Record<string, any> = { ...values.value }\n for (const item of props.items) {\n if (item.type === 'separator') continue\n if (item.key in loaded) {\n next[item.key] = loaded[item.key] ?? null\n }\n }\n values.value = next\n if (props.handleUrl) writeFilterParams(props.items, values.value)\n emit('change', buildResponseEmit())\n}\n\ndefineExpose({ clearFilter, focusFilter })\n</script>\n\n<template>\n <Sidebar :open=\"open\" title=\"Szűrők\" :position=\"position\" @close=\"emit('close')\">\n <div class=\"data-filters\">\n <div\n v-for=\"item in items\"\n :key=\"item.key\"\n class=\"data-filters__field\"\n :class=\"{ 'data-filters__field--full': item.fullWidth || item.type === 'separator' }\"\n >\n <hr v-if=\"item.type === 'separator'\" class=\"data-filters__separator\" />\n <template v-else-if=\"item.type === 'checkbox'\">\n <Checkbox\n :ref=\"(el: any) => setFilterRef(item.key, el)\"\n :model-value=\"(values[item.key] as boolean) ?? false\"\n :label=\"item.label ?? item.key\"\n @update:model-value=\"(val) => update(item.key, val)\"\n v-bind=\"item.config\"\n />\n </template>\n <template v-else>\n <label class=\"c-label\" :for=\"`df-${item.key}`\">{{ item.label ?? item.key }}</label>\n\n <input\n v-if=\"item.type === 'text'\"\n type=\"text\"\n class=\"c-input-row\"\n :placeholder=\"item.placeholder\"\n :value=\"values[item.key] ?? ''\"\n :ref=\"(el: any) => setFilterRef(item.key, el)\"\n :id=\"`df-${item.key}`\"\n @input=\"debouncedUpdate(item.key, ($event.target as HTMLInputElement).value || null)\"\n v-bind=\"item.config\"\n />\n\n <textarea\n v-else-if=\"item.type === 'textarea'\"\n class=\"c-input-row data-filters__textarea\"\n :placeholder=\"item.placeholder\"\n :value=\"values[item.key] ?? ''\"\n :ref=\"(el: any) => setFilterRef(item.key, el)\"\n :id=\"`df-${item.key}`\"\n v-bind=\"item.config\"\n @input=\"debouncedUpdate(item.key, ($event.target as HTMLTextAreaElement).value || null)\"\n />\n\n <input\n v-else-if=\"item.type === 'number'\"\n type=\"number\"\n class=\"c-input-row\"\n :placeholder=\"item.placeholder\"\n :value=\"values[item.key] ?? ''\"\n :ref=\"(el: any) => setFilterRef(item.key, el)\"\n :id=\"`df-${item.key}`\"\n v-bind=\"item.config\"\n @input=\"\n debouncedUpdate(\n item.key,\n ($event.target as HTMLInputElement).value\n ? Number(($event.target as HTMLInputElement).value)\n : null,\n )\n \"\n />\n\n <DatePicker\n v-else-if=\"item.type === 'date' || item.type === 'datetime'\"\n :ref=\"(el: any) => setFilterRef(item.key, el)\"\n :id=\"`df-${item.key}`\"\n :model-value=\"(values[item.key] as PickedDate) ?? null\"\n :config=\"buildDatePickerConfig(item)\"\n @update:model-value=\"update(item.key, $event)\"\n />\n\n <DateRangePicker\n v-else-if=\"item.type === 'daterange' || item.type === 'datetimerange'\"\n :ref=\"(el: any) => setFilterRef(item.key, el)\"\n :model-value=\"(values[item.key] as PickedUtcRange) ?? null\"\n :config=\"buildDateRangePickerConfig(item)\"\n @update:model-value=\"update(item.key, $event)\"\n />\n\n <DropdownSelect\n v-else-if=\"item.type === 'dropdown'\"\n :ref=\"(el: any) => setFilterRef(item.key, el)\"\n :model-value=\"(values[item.key] as string) ?? null\"\n :options=\"item.options ?? []\"\n :config=\"{\n ...(item.config ?? {}),\n placeholder: item.placeholder ?? 'Válassz...',\n clearable: true,\n filterable: true,\n }\"\n @update:model-value=\"update(item.key, $event)\"\n />\n </template>\n </div>\n </div>\n <div class=\"data-filters__footer\">\n <!-- <Button\n icon=\"fa-solid fa-trash-can\"\n :disabled=\"!hasActiveFilters\"\n label=\"Alaphelyzet visszaállítása\"\n size=\"small\"\n @click=\"reset\"\n /> -->\n <Button\n icon=\"fa-solid fa-trash-can\"\n :disabled=\"!hasActiveFilters\"\n label=\"Szűrők törlése\"\n aria-label=\"Szűrők törlése\"\n size=\"small\"\n @click=\"clearAll\"\n />\n <Button label=\"Szűrés\" aria-label=\"Szűrés\" type=\"success\" @click=\"confirm\" />\n </div>\n <hr v-if=\"historyEnabled\" class=\"separator my-3\" />\n <FiltersHistory\n v-if=\"historyEnabled\"\n :items=\"items\"\n :values=\"values\"\n :storage-key=\"storageKey\"\n @load=\"onHistoryLoad\"\n @change=\"onHistoryLoad\"\n />\n </Sidebar>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/data-table/data-filters.scss\"></style>\n"],"mappings":"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"}
1
+ {"version":3,"file":"admins-components78.js","names":[],"sources":["../src/components/data-table/DataFilters.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { DropdownOption } from '@/components/DropdownSelect.vue'\n\nexport interface FilterItem {\n type: FilterItemType\n key: string\n label?: string\n placeholder?: string\n value?: any\n options?: DropdownOption[]\n fullWidth?: boolean\n config?: Record<string, any>\n displayClass?: string\n transformer?: (value: any) => Record<string, any> | null | undefined\n}\n\nexport interface FilterResponse {\n values: Record<string, any>\n transformed: Record<string, any>\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { ref, watch, onMounted } from 'vue'\nimport Sidebar, { type SidebarPosition } from '@/components/Sidebar.vue'\nimport DatePicker from '@/components/DatePicker.vue'\nimport DateRangePicker from '@/components/DateRangePicker.vue'\nimport DropdownSelect from '@/components/DropdownSelect.vue'\nimport Button from '@/components/Button.vue'\nimport Checkbox from '@/components/Checkbox.vue'\nimport FiltersHistory from '@/components/data-table/FiltersHistory.vue'\nimport { debounce } from '@/utils/debounce'\nimport type { DatePickerConfig, DateRangePickerConfig } from '@/types/datepickers'\nimport type { FilterItemType, PickedDate, PickedUtcRange } from '@/types/types'\nimport { filterEmptyValues, getFilterParams, writeFilterParams } from '@/utils/dataFilters'\n\nconst props = withDefaults(\n defineProps<{\n open?: boolean\n items: FilterItem[]\n position?: SidebarPosition\n lazy?: boolean\n handleUrl?: boolean\n historyEnabled?: boolean\n storageKey?: string\n }>(),\n {\n open: false,\n position: 'left',\n lazy: true,\n handleUrl: false,\n historyEnabled: true,\n },\n)\n\nconst emit = defineEmits<{\n close: []\n change: [response: FilterResponse]\n}>()\n\nconst values = ref<Record<string, any>>(getFilterParams(props.items) ?? {})\nconst filterRefs = ref<Record<string, any>>({})\n\nfunction setFilterRef(key: string, el: any) {\n if (el) {\n filterRefs.value[key] = el\n } else {\n delete filterRefs.value[key]\n }\n}\n\nfunction buildDatePickerConfig(item: FilterItem): DatePickerConfig {\n return {\n ...(item.config ?? {}),\n showTime: item.type === 'datetime',\n placeholder: item.placeholder ?? (item.type === 'datetime' ? 'Időpont' : 'Dátum'),\n }\n}\n\nfunction buildDateRangePickerConfig(item: FilterItem): DateRangePickerConfig {\n return {\n ...(item.config ?? {}),\n ...(!item.fullWidth ? { compact: true } : {}),\n showTime: item.type === 'datetimerange',\n }\n}\n\nonMounted(() => {\n if (!props.handleUrl) return\n const fromUrl = getFilterParams(props.items)\n if (fromUrl && Object.keys(fromUrl).length > 0) {\n values.value = { ...values.value, ...fromUrl }\n }\n})\n\nfunction update(key: string, value: any) {\n values.value = { ...values.value, [key]: value }\n\n if (!props.lazy) {\n if (props.handleUrl) writeFilterParams(props.items, values.value)\n emit('change', buildResponseEmit())\n }\n}\n\nfunction buildResponseEmit() {\n const transformedValues = props.items.reduce((acc, item) => {\n const val = values.value[item.key]\n if (item.transformer) {\n return { ...acc, ...(item.transformer(val) ?? {}) }\n }\n return { ...acc, [item.key]: val }\n }, {})\n return {\n values: filterEmptyValues(values.value),\n transformed: filterEmptyValues(transformedValues),\n }\n}\n\nconst debouncedUpdate = debounce((key: string, value: any) => {\n update(key, value)\n})\n\nfunction confirm() {\n if (props.handleUrl) writeFilterParams(props.items, values.value)\n\n emit('change', buildResponseEmit())\n emit('close')\n}\n\n/* function reset() {\n values.value = getDefaults()\n if (props.handleUrl) writeFilterParams(props.items, values.value)\n emit('change', filterEmptyValues(values.value))\n} */\n\nfunction clearAll() {\n values.value = {}\n if (props.handleUrl) writeFilterParams(props.items, values.value)\n\n emit('change', buildResponseEmit())\n}\n\nconst hasActiveFilters = ref(false)\nwatch(\n values,\n (v) => {\n hasActiveFilters.value = Object.values(v).some(\n (val) => val !== null && val !== '' && val !== undefined,\n )\n },\n { deep: true, immediate: true },\n)\n\nfunction clearFilter(key: string) {\n values.value = { ...values.value, [key]: null }\n if (props.handleUrl) writeFilterParams(props.items, values.value)\n emit('change', buildResponseEmit())\n}\n\nfunction focusFilter(key: string) {\n const ref = (filterRefs.value as Record<string, any>)[key]\n if (!ref) return\n\n if (typeof ref.focusAndOpen === 'function') {\n ref.focusAndOpen()\n return\n }\n if (typeof ref.focus === 'function') {\n ref.focus()\n }\n}\n\nfunction onHistoryLoad(loaded: Record<string, any>) {\n const next: Record<string, any> = { ...values.value }\n for (const item of props.items) {\n if (item.type === 'separator') continue\n if (item.key in loaded) {\n next[item.key] = loaded[item.key] ?? null\n }\n }\n values.value = next\n if (props.handleUrl) writeFilterParams(props.items, values.value)\n emit('change', buildResponseEmit())\n}\n\ndefineExpose({ clearFilter, focusFilter })\n</script>\n\n<template>\n <Sidebar :open=\"open\" title=\"Szűrők\" :position=\"position\" @close=\"emit('close')\">\n <div class=\"data-filters\">\n <div\n v-for=\"item in items\"\n :key=\"item.key\"\n class=\"data-filters__field\"\n :class=\"{ 'data-filters__field--full': item.fullWidth || item.type === 'separator' }\"\n >\n <hr v-if=\"item.type === 'separator'\" class=\"data-filters__separator\" />\n <template v-else-if=\"item.type === 'checkbox'\">\n <Checkbox\n :ref=\"(el: any) => setFilterRef(item.key, el)\"\n :model-value=\"(values[item.key] as boolean) ?? false\"\n :label=\"item.label ?? item.key\"\n @update:model-value=\"(val) => update(item.key, val)\"\n v-bind=\"item.config\"\n />\n </template>\n <template v-else>\n <template v-if=\"item.type === 'text'\">\n <label class=\"c-label\" :for=\"`df-${item.key}`\">{{ item.label ?? item.key }}</label>\n <input\n v-if=\"item.type === 'text'\"\n type=\"text\"\n class=\"c-input-row\"\n :placeholder=\"item.placeholder\"\n :value=\"values[item.key] ?? ''\"\n :ref=\"(el: any) => setFilterRef(item.key, el)\"\n :id=\"`df-${item.key}`\"\n @input=\"debouncedUpdate(item.key, ($event.target as HTMLInputElement).value || null)\"\n v-bind=\"item.config\"\n />\n </template>\n <template v-else-if=\"item.type === 'textarea'\">\n <label class=\"c-label\" :for=\"`df-${item.key}`\">{{ item.label ?? item.key }}</label>\n <textarea\n class=\"c-input-row data-filters__textarea\"\n :placeholder=\"item.placeholder\"\n :value=\"values[item.key] ?? ''\"\n :ref=\"(el: any) => setFilterRef(item.key, el)\"\n :id=\"`df-${item.key}`\"\n v-bind=\"item.config\"\n @input=\"\n debouncedUpdate(item.key, ($event.target as HTMLTextAreaElement).value || null)\n \"\n />\n </template>\n <template v-else-if=\"item.type === 'number'\">\n <label class=\"c-label\" :for=\"`df-${item.key}`\">{{ item.label ?? item.key }}</label>\n <input\n type=\"number\"\n class=\"c-input-row\"\n :placeholder=\"item.placeholder\"\n :value=\"values[item.key] ?? ''\"\n :ref=\"(el: any) => setFilterRef(item.key, el)\"\n :id=\"`df-${item.key}`\"\n v-bind=\"item.config\"\n @input=\"\n debouncedUpdate(\n item.key,\n ($event.target as HTMLInputElement).value\n ? Number(($event.target as HTMLInputElement).value)\n : null,\n )\n \"\n />\n </template>\n <template v-else-if=\"item.type === 'date' || item.type === 'datetime'\">\n <label class=\"c-label\" :for=\"`df-${item.key}`\">{{ item.label ?? item.key }}</label>\n <DatePicker\n :ref=\"(el: any) => setFilterRef(item.key, el)\"\n :id=\"`df-${item.key}`\"\n :model-value=\"(values[item.key] as PickedDate) ?? null\"\n :config=\"buildDatePickerConfig(item)\"\n @update:model-value=\"update(item.key, $event)\"\n />\n </template>\n <template v-else-if=\"item.type === 'daterange' || item.type === 'datetimerange'\">\n <span class=\"c-label\">{{ item.label ?? item.key }}</span>\n <DateRangePicker\n :ref=\"(el: any) => setFilterRef(item.key, el)\"\n :model-value=\"(values[item.key] as PickedUtcRange) ?? null\"\n :config=\"buildDateRangePickerConfig(item)\"\n @update:model-value=\"update(item.key, $event)\"\n />\n </template>\n <template v-else-if=\"item.type === 'dropdown'\">\n <span class=\"c-label\">{{ item.label ?? item.key }}</span>\n <DropdownSelect\n :ref=\"(el: any) => setFilterRef(item.key, el)\"\n :model-value=\"(values[item.key] as string) ?? null\"\n :options=\"item.options ?? []\"\n :config=\"{\n ...(item.config ?? {}),\n placeholder: item.placeholder ?? 'Válassz...',\n clearable: true,\n filterable: true,\n }\"\n @update:model-value=\"update(item.key, $event)\"\n />\n </template>\n </template>\n </div>\n </div>\n <div class=\"data-filters__footer\">\n <!-- <Button\n icon=\"fa-solid fa-trash-can\"\n :disabled=\"!hasActiveFilters\"\n label=\"Alaphelyzet visszaállítása\"\n size=\"small\"\n @click=\"reset\"\n /> -->\n <Button\n icon=\"fa-solid fa-trash-can\"\n :disabled=\"!hasActiveFilters\"\n label=\"Szűrők törlése\"\n aria-label=\"Szűrők törlése\"\n size=\"small\"\n @click=\"clearAll\"\n />\n <Button label=\"Szűrés\" aria-label=\"Szűrés\" type=\"success\" @click=\"confirm\" />\n </div>\n <hr v-if=\"historyEnabled\" class=\"separator my-3\" />\n <FiltersHistory\n v-if=\"historyEnabled\"\n :items=\"items\"\n :values=\"values\"\n :storage-key=\"storageKey\"\n @load=\"onHistoryLoad\"\n @change=\"onHistoryLoad\"\n />\n </Sidebar>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/data-table/data-filters.scss\"></style>\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"admins-components80.js","names":[],"sources":["../src/components/data-table/DataFilters.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { DropdownOption } from '@/components/DropdownSelect.vue'\n\nexport interface FilterItem {\n type: FilterItemType\n key: string\n label?: string\n placeholder?: string\n value?: any\n options?: DropdownOption[]\n fullWidth?: boolean\n config?: Record<string, any>\n displayClass?: string\n transformer?: (value: any) => Record<string, any> | null | undefined\n}\n\nexport interface FilterResponse {\n values: Record<string, any>\n transformed: Record<string, any>\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { ref, watch, onMounted } from 'vue'\nimport Sidebar, { type SidebarPosition } from '@/components/Sidebar.vue'\nimport DatePicker from '@/components/DatePicker.vue'\nimport DateRangePicker from '@/components/DateRangePicker.vue'\nimport DropdownSelect from '@/components/DropdownSelect.vue'\nimport Button from '@/components/Button.vue'\nimport Checkbox from '@/components/Checkbox.vue'\nimport FiltersHistory from '@/components/data-table/FiltersHistory.vue'\nimport { debounce } from '@/utils/debounce'\nimport type { DatePickerConfig, DateRangePickerConfig } from '@/types/datepickers'\nimport type { FilterItemType, PickedDate, PickedUtcRange } from '@/types/types'\nimport { filterEmptyValues, getFilterParams, writeFilterParams } from '@/utils/dataFilters'\n\n\nconst props = withDefaults(\n defineProps<{\n open?: boolean\n items: FilterItem[]\n position?: SidebarPosition\n lazy?: boolean\n handleUrl?: boolean\n historyEnabled?: boolean\n storageKey?: string\n }>(),\n {\n open: false,\n position: 'left',\n lazy: true,\n handleUrl: false,\n historyEnabled: true,\n },\n)\n\nconst emit = defineEmits<{\n close: []\n change: [response: FilterResponse]\n}>()\n\nconst values = ref<Record<string, any>>(getFilterParams(props.items) ?? {})\nconst filterRefs = ref<Record<string, any>>({})\n\nfunction setFilterRef(key: string, el: any) {\n if (el) {\n filterRefs.value[key] = el\n } else {\n delete filterRefs.value[key]\n }\n}\n\nfunction buildDatePickerConfig(item: FilterItem): DatePickerConfig {\n return {\n ...(item.config ?? {}),\n showTime: item.type === 'datetime',\n placeholder: item.placeholder ?? (item.type === 'datetime' ? 'Időpont' : 'Dátum'),\n }\n}\n\nfunction buildDateRangePickerConfig(item: FilterItem): DateRangePickerConfig {\n return {\n ...(item.config ?? {}),\n ...(!item.fullWidth ? { compact: true } : {}),\n showTime: item.type === 'datetimerange',\n }\n}\n\nonMounted(() => {\n if (!props.handleUrl) return\n const fromUrl = getFilterParams(props.items)\n if (fromUrl && Object.keys(fromUrl).length > 0) {\n values.value = { ...values.value, ...fromUrl }\n }\n})\n\nfunction update(key: string, value: any) {\n values.value = { ...values.value, [key]: value }\n\n if (!props.lazy) {\n if (props.handleUrl) writeFilterParams(props.items, values.value)\n emit('change', buildResponseEmit())\n }\n}\n\nfunction buildResponseEmit() {\n const transformedValues = props.items.reduce((acc, item) => {\n const val = values.value[item.key]\n if (item.transformer) {\n return { ...acc, ...(item.transformer(val) ?? {}) }\n }\n return { ...acc, [item.key]: val }\n }, {})\n return {\n values: filterEmptyValues(values.value),\n transformed: filterEmptyValues(transformedValues),\n }\n}\n\nconst debouncedUpdate = debounce((key: string, value: any) => {\n update(key, value)\n})\n\nfunction confirm() {\n if (props.handleUrl) writeFilterParams(props.items, values.value)\n\n emit('change', buildResponseEmit())\n emit('close')\n}\n\n/* function reset() {\n values.value = getDefaults()\n if (props.handleUrl) writeFilterParams(props.items, values.value)\n emit('change', filterEmptyValues(values.value))\n} */\n\nfunction clearAll() {\n values.value = {}\n if (props.handleUrl) writeFilterParams(props.items, values.value)\n\n emit('change', buildResponseEmit())\n}\n\nconst hasActiveFilters = ref(false)\nwatch(\n values,\n (v) => {\n hasActiveFilters.value = Object.values(v).some(\n (val) => val !== null && val !== '' && val !== undefined,\n )\n },\n { deep: true, immediate: true },\n)\n\nfunction clearFilter(key: string) {\n values.value = { ...values.value, [key]: null }\n if (props.handleUrl) writeFilterParams(props.items, values.value)\n emit('change', buildResponseEmit())\n}\n\nfunction focusFilter(key: string) {\n const ref = (filterRefs.value as Record<string, any>)[key]\n if (!ref) return\n\n if (typeof ref.focusAndOpen === 'function') {\n ref.focusAndOpen()\n return\n }\n if (typeof ref.focus === 'function') {\n ref.focus()\n }\n}\n\nfunction onHistoryLoad(loaded: Record<string, any>) {\n const next: Record<string, any> = { ...values.value }\n for (const item of props.items) {\n if (item.type === 'separator') continue\n if (item.key in loaded) {\n next[item.key] = loaded[item.key] ?? null\n }\n }\n values.value = next\n if (props.handleUrl) writeFilterParams(props.items, values.value)\n emit('change', buildResponseEmit())\n}\n\ndefineExpose({ clearFilter, focusFilter })\n</script>\n\n<template>\n <Sidebar :open=\"open\" title=\"Szűrők\" :position=\"position\" @close=\"emit('close')\">\n <div class=\"data-filters\">\n <div\n v-for=\"item in items\"\n :key=\"item.key\"\n class=\"data-filters__field\"\n :class=\"{ 'data-filters__field--full': item.fullWidth || item.type === 'separator' }\"\n >\n <hr v-if=\"item.type === 'separator'\" class=\"data-filters__separator\" />\n <template v-else-if=\"item.type === 'checkbox'\">\n <Checkbox\n :ref=\"(el: any) => setFilterRef(item.key, el)\"\n :model-value=\"(values[item.key] as boolean) ?? false\"\n :label=\"item.label ?? item.key\"\n @update:model-value=\"(val) => update(item.key, val)\"\n v-bind=\"item.config\"\n />\n </template>\n <template v-else>\n <label class=\"c-label\" :for=\"`df-${item.key}`\">{{ item.label ?? item.key }}</label>\n\n <input\n v-if=\"item.type === 'text'\"\n type=\"text\"\n class=\"c-input-row\"\n :placeholder=\"item.placeholder\"\n :value=\"values[item.key] ?? ''\"\n :ref=\"(el: any) => setFilterRef(item.key, el)\"\n :id=\"`df-${item.key}`\"\n @input=\"debouncedUpdate(item.key, ($event.target as HTMLInputElement).value || null)\"\n v-bind=\"item.config\"\n />\n\n <textarea\n v-else-if=\"item.type === 'textarea'\"\n class=\"c-input-row data-filters__textarea\"\n :placeholder=\"item.placeholder\"\n :value=\"values[item.key] ?? ''\"\n :ref=\"(el: any) => setFilterRef(item.key, el)\"\n :id=\"`df-${item.key}`\"\n v-bind=\"item.config\"\n @input=\"debouncedUpdate(item.key, ($event.target as HTMLTextAreaElement).value || null)\"\n />\n\n <input\n v-else-if=\"item.type === 'number'\"\n type=\"number\"\n class=\"c-input-row\"\n :placeholder=\"item.placeholder\"\n :value=\"values[item.key] ?? ''\"\n :ref=\"(el: any) => setFilterRef(item.key, el)\"\n :id=\"`df-${item.key}`\"\n v-bind=\"item.config\"\n @input=\"\n debouncedUpdate(\n item.key,\n ($event.target as HTMLInputElement).value\n ? Number(($event.target as HTMLInputElement).value)\n : null,\n )\n \"\n />\n\n <DatePicker\n v-else-if=\"item.type === 'date' || item.type === 'datetime'\"\n :ref=\"(el: any) => setFilterRef(item.key, el)\"\n :id=\"`df-${item.key}`\"\n :model-value=\"(values[item.key] as PickedDate) ?? null\"\n :config=\"buildDatePickerConfig(item)\"\n @update:model-value=\"update(item.key, $event)\"\n />\n\n <DateRangePicker\n v-else-if=\"item.type === 'daterange' || item.type === 'datetimerange'\"\n :ref=\"(el: any) => setFilterRef(item.key, el)\"\n :model-value=\"(values[item.key] as PickedUtcRange) ?? null\"\n :config=\"buildDateRangePickerConfig(item)\"\n @update:model-value=\"update(item.key, $event)\"\n />\n\n <DropdownSelect\n v-else-if=\"item.type === 'dropdown'\"\n :ref=\"(el: any) => setFilterRef(item.key, el)\"\n :model-value=\"(values[item.key] as string) ?? null\"\n :options=\"item.options ?? []\"\n :config=\"{\n ...(item.config ?? {}),\n placeholder: item.placeholder ?? 'Válassz...',\n clearable: true,\n filterable: true,\n }\"\n @update:model-value=\"update(item.key, $event)\"\n />\n </template>\n </div>\n </div>\n <div class=\"data-filters__footer\">\n <!-- <Button\n icon=\"fa-solid fa-trash-can\"\n :disabled=\"!hasActiveFilters\"\n label=\"Alaphelyzet visszaállítása\"\n size=\"small\"\n @click=\"reset\"\n /> -->\n <Button\n icon=\"fa-solid fa-trash-can\"\n :disabled=\"!hasActiveFilters\"\n label=\"Szűrők törlése\"\n aria-label=\"Szűrők törlése\"\n size=\"small\"\n @click=\"clearAll\"\n />\n <Button label=\"Szűrés\" aria-label=\"Szűrés\" type=\"success\" @click=\"confirm\" />\n </div>\n <hr v-if=\"historyEnabled\" class=\"separator my-3\" />\n <FiltersHistory\n v-if=\"historyEnabled\"\n :items=\"items\"\n :values=\"values\"\n :storage-key=\"storageKey\"\n @load=\"onHistoryLoad\"\n @change=\"onHistoryLoad\"\n />\n </Sidebar>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/data-table/data-filters.scss\"></style>\n"],"mappings":""}
1
+ {"version":3,"file":"admins-components80.js","names":[],"sources":["../src/components/data-table/DataFilters.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { DropdownOption } from '@/components/DropdownSelect.vue'\n\nexport interface FilterItem {\n type: FilterItemType\n key: string\n label?: string\n placeholder?: string\n value?: any\n options?: DropdownOption[]\n fullWidth?: boolean\n config?: Record<string, any>\n displayClass?: string\n transformer?: (value: any) => Record<string, any> | null | undefined\n}\n\nexport interface FilterResponse {\n values: Record<string, any>\n transformed: Record<string, any>\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { ref, watch, onMounted } from 'vue'\nimport Sidebar, { type SidebarPosition } from '@/components/Sidebar.vue'\nimport DatePicker from '@/components/DatePicker.vue'\nimport DateRangePicker from '@/components/DateRangePicker.vue'\nimport DropdownSelect from '@/components/DropdownSelect.vue'\nimport Button from '@/components/Button.vue'\nimport Checkbox from '@/components/Checkbox.vue'\nimport FiltersHistory from '@/components/data-table/FiltersHistory.vue'\nimport { debounce } from '@/utils/debounce'\nimport type { DatePickerConfig, DateRangePickerConfig } from '@/types/datepickers'\nimport type { FilterItemType, PickedDate, PickedUtcRange } from '@/types/types'\nimport { filterEmptyValues, getFilterParams, writeFilterParams } from '@/utils/dataFilters'\n\nconst props = withDefaults(\n defineProps<{\n open?: boolean\n items: FilterItem[]\n position?: SidebarPosition\n lazy?: boolean\n handleUrl?: boolean\n historyEnabled?: boolean\n storageKey?: string\n }>(),\n {\n open: false,\n position: 'left',\n lazy: true,\n handleUrl: false,\n historyEnabled: true,\n },\n)\n\nconst emit = defineEmits<{\n close: []\n change: [response: FilterResponse]\n}>()\n\nconst values = ref<Record<string, any>>(getFilterParams(props.items) ?? {})\nconst filterRefs = ref<Record<string, any>>({})\n\nfunction setFilterRef(key: string, el: any) {\n if (el) {\n filterRefs.value[key] = el\n } else {\n delete filterRefs.value[key]\n }\n}\n\nfunction buildDatePickerConfig(item: FilterItem): DatePickerConfig {\n return {\n ...(item.config ?? {}),\n showTime: item.type === 'datetime',\n placeholder: item.placeholder ?? (item.type === 'datetime' ? 'Időpont' : 'Dátum'),\n }\n}\n\nfunction buildDateRangePickerConfig(item: FilterItem): DateRangePickerConfig {\n return {\n ...(item.config ?? {}),\n ...(!item.fullWidth ? { compact: true } : {}),\n showTime: item.type === 'datetimerange',\n }\n}\n\nonMounted(() => {\n if (!props.handleUrl) return\n const fromUrl = getFilterParams(props.items)\n if (fromUrl && Object.keys(fromUrl).length > 0) {\n values.value = { ...values.value, ...fromUrl }\n }\n})\n\nfunction update(key: string, value: any) {\n values.value = { ...values.value, [key]: value }\n\n if (!props.lazy) {\n if (props.handleUrl) writeFilterParams(props.items, values.value)\n emit('change', buildResponseEmit())\n }\n}\n\nfunction buildResponseEmit() {\n const transformedValues = props.items.reduce((acc, item) => {\n const val = values.value[item.key]\n if (item.transformer) {\n return { ...acc, ...(item.transformer(val) ?? {}) }\n }\n return { ...acc, [item.key]: val }\n }, {})\n return {\n values: filterEmptyValues(values.value),\n transformed: filterEmptyValues(transformedValues),\n }\n}\n\nconst debouncedUpdate = debounce((key: string, value: any) => {\n update(key, value)\n})\n\nfunction confirm() {\n if (props.handleUrl) writeFilterParams(props.items, values.value)\n\n emit('change', buildResponseEmit())\n emit('close')\n}\n\n/* function reset() {\n values.value = getDefaults()\n if (props.handleUrl) writeFilterParams(props.items, values.value)\n emit('change', filterEmptyValues(values.value))\n} */\n\nfunction clearAll() {\n values.value = {}\n if (props.handleUrl) writeFilterParams(props.items, values.value)\n\n emit('change', buildResponseEmit())\n}\n\nconst hasActiveFilters = ref(false)\nwatch(\n values,\n (v) => {\n hasActiveFilters.value = Object.values(v).some(\n (val) => val !== null && val !== '' && val !== undefined,\n )\n },\n { deep: true, immediate: true },\n)\n\nfunction clearFilter(key: string) {\n values.value = { ...values.value, [key]: null }\n if (props.handleUrl) writeFilterParams(props.items, values.value)\n emit('change', buildResponseEmit())\n}\n\nfunction focusFilter(key: string) {\n const ref = (filterRefs.value as Record<string, any>)[key]\n if (!ref) return\n\n if (typeof ref.focusAndOpen === 'function') {\n ref.focusAndOpen()\n return\n }\n if (typeof ref.focus === 'function') {\n ref.focus()\n }\n}\n\nfunction onHistoryLoad(loaded: Record<string, any>) {\n const next: Record<string, any> = { ...values.value }\n for (const item of props.items) {\n if (item.type === 'separator') continue\n if (item.key in loaded) {\n next[item.key] = loaded[item.key] ?? null\n }\n }\n values.value = next\n if (props.handleUrl) writeFilterParams(props.items, values.value)\n emit('change', buildResponseEmit())\n}\n\ndefineExpose({ clearFilter, focusFilter })\n</script>\n\n<template>\n <Sidebar :open=\"open\" title=\"Szűrők\" :position=\"position\" @close=\"emit('close')\">\n <div class=\"data-filters\">\n <div\n v-for=\"item in items\"\n :key=\"item.key\"\n class=\"data-filters__field\"\n :class=\"{ 'data-filters__field--full': item.fullWidth || item.type === 'separator' }\"\n >\n <hr v-if=\"item.type === 'separator'\" class=\"data-filters__separator\" />\n <template v-else-if=\"item.type === 'checkbox'\">\n <Checkbox\n :ref=\"(el: any) => setFilterRef(item.key, el)\"\n :model-value=\"(values[item.key] as boolean) ?? false\"\n :label=\"item.label ?? item.key\"\n @update:model-value=\"(val) => update(item.key, val)\"\n v-bind=\"item.config\"\n />\n </template>\n <template v-else>\n <template v-if=\"item.type === 'text'\">\n <label class=\"c-label\" :for=\"`df-${item.key}`\">{{ item.label ?? item.key }}</label>\n <input\n v-if=\"item.type === 'text'\"\n type=\"text\"\n class=\"c-input-row\"\n :placeholder=\"item.placeholder\"\n :value=\"values[item.key] ?? ''\"\n :ref=\"(el: any) => setFilterRef(item.key, el)\"\n :id=\"`df-${item.key}`\"\n @input=\"debouncedUpdate(item.key, ($event.target as HTMLInputElement).value || null)\"\n v-bind=\"item.config\"\n />\n </template>\n <template v-else-if=\"item.type === 'textarea'\">\n <label class=\"c-label\" :for=\"`df-${item.key}`\">{{ item.label ?? item.key }}</label>\n <textarea\n class=\"c-input-row data-filters__textarea\"\n :placeholder=\"item.placeholder\"\n :value=\"values[item.key] ?? ''\"\n :ref=\"(el: any) => setFilterRef(item.key, el)\"\n :id=\"`df-${item.key}`\"\n v-bind=\"item.config\"\n @input=\"\n debouncedUpdate(item.key, ($event.target as HTMLTextAreaElement).value || null)\n \"\n />\n </template>\n <template v-else-if=\"item.type === 'number'\">\n <label class=\"c-label\" :for=\"`df-${item.key}`\">{{ item.label ?? item.key }}</label>\n <input\n type=\"number\"\n class=\"c-input-row\"\n :placeholder=\"item.placeholder\"\n :value=\"values[item.key] ?? ''\"\n :ref=\"(el: any) => setFilterRef(item.key, el)\"\n :id=\"`df-${item.key}`\"\n v-bind=\"item.config\"\n @input=\"\n debouncedUpdate(\n item.key,\n ($event.target as HTMLInputElement).value\n ? Number(($event.target as HTMLInputElement).value)\n : null,\n )\n \"\n />\n </template>\n <template v-else-if=\"item.type === 'date' || item.type === 'datetime'\">\n <label class=\"c-label\" :for=\"`df-${item.key}`\">{{ item.label ?? item.key }}</label>\n <DatePicker\n :ref=\"(el: any) => setFilterRef(item.key, el)\"\n :id=\"`df-${item.key}`\"\n :model-value=\"(values[item.key] as PickedDate) ?? null\"\n :config=\"buildDatePickerConfig(item)\"\n @update:model-value=\"update(item.key, $event)\"\n />\n </template>\n <template v-else-if=\"item.type === 'daterange' || item.type === 'datetimerange'\">\n <span class=\"c-label\">{{ item.label ?? item.key }}</span>\n <DateRangePicker\n :ref=\"(el: any) => setFilterRef(item.key, el)\"\n :model-value=\"(values[item.key] as PickedUtcRange) ?? null\"\n :config=\"buildDateRangePickerConfig(item)\"\n @update:model-value=\"update(item.key, $event)\"\n />\n </template>\n <template v-else-if=\"item.type === 'dropdown'\">\n <span class=\"c-label\">{{ item.label ?? item.key }}</span>\n <DropdownSelect\n :ref=\"(el: any) => setFilterRef(item.key, el)\"\n :model-value=\"(values[item.key] as string) ?? null\"\n :options=\"item.options ?? []\"\n :config=\"{\n ...(item.config ?? {}),\n placeholder: item.placeholder ?? 'Válassz...',\n clearable: true,\n filterable: true,\n }\"\n @update:model-value=\"update(item.key, $event)\"\n />\n </template>\n </template>\n </div>\n </div>\n <div class=\"data-filters__footer\">\n <!-- <Button\n icon=\"fa-solid fa-trash-can\"\n :disabled=\"!hasActiveFilters\"\n label=\"Alaphelyzet visszaállítása\"\n size=\"small\"\n @click=\"reset\"\n /> -->\n <Button\n icon=\"fa-solid fa-trash-can\"\n :disabled=\"!hasActiveFilters\"\n label=\"Szűrők törlése\"\n aria-label=\"Szűrők törlése\"\n size=\"small\"\n @click=\"clearAll\"\n />\n <Button label=\"Szűrés\" aria-label=\"Szűrés\" type=\"success\" @click=\"confirm\" />\n </div>\n <hr v-if=\"historyEnabled\" class=\"separator my-3\" />\n <FiltersHistory\n v-if=\"historyEnabled\"\n :items=\"items\"\n :values=\"values\"\n :storage-key=\"storageKey\"\n @load=\"onHistoryLoad\"\n @change=\"onHistoryLoad\"\n />\n </Sidebar>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/data-table/data-filters.scss\"></style>\n"],"mappings":""}
@@ -38,27 +38,16 @@ var S = { class: "ac-component" }, C = { class: "flex-center gap-2 mb-3 wrap-on-
38
38
  "sort-change"
39
39
  ],
40
40
  setup(g, { expose: _, emit: E }) {
41
- let D = x(null), O = g, k = E, A = x(!1), j = x(!1), M = x(null), N = x(!1), P = x(null), F = x(!1), I = u(() => O.filters?.some((e) => e.type === "text" || e.type === "textarea")), L = {
42
- type: "checkbox",
43
- key: "exactMatch",
44
- label: "Pontos egyezés",
45
- fullWidth: !0,
46
- config: { labelAlignmentFix: !0 },
47
- displayClass: "highlight-chip"
48
- };
49
- function R(e) {
50
- return !I.value || e.some((e) => e.key === "exactMatch") ? e : [L, ...e];
51
- }
52
- let z = u(() => R(O.filters ?? [])), B = x(O.filters ? a(z.value) ?? {} : {}), V = null;
41
+ let D = x(null), O = g, k = E, A = x(!1), j = x(!1), M = x(null), N = x(!1), P = x(null), F = x(!1), I = x(O.filters ? a(O.filters) ?? {} : {}), L = null;
53
42
  y(() => {
54
- V = new ResizeObserver((e) => {
43
+ L = new ResizeObserver((e) => {
55
44
  N.value = (e[0]?.contentRect.width ?? 0) < O.layoutBreakpoint;
56
- }), P.value && V.observe(P.value);
57
- }), v(() => V?.disconnect());
58
- let H = u(() => {
45
+ }), P.value && L.observe(P.value);
46
+ }), v(() => L?.disconnect());
47
+ let R = u(() => {
59
48
  let e = M.value?.layout;
60
49
  return e === "table" || e === "cards" ? e : N.value ? "cards" : "table";
61
- }), U = u(() => {
50
+ }), z = u(() => {
62
51
  if (!M.value) return O.config;
63
52
  let e = M.value.columnOrder, t = O.config.columns.map((e) => ({
64
53
  ...e,
@@ -72,7 +61,7 @@ var S = { class: "ac-component" }, C = { class: "flex-center gap-2 mb-3 wrap-on-
72
61
  columns: t
73
62
  };
74
63
  });
75
- function W(e) {
64
+ function B(e) {
76
65
  M.value = e, k("settings-change", e);
77
66
  }
78
67
  _({
@@ -81,45 +70,47 @@ var S = { class: "ac-component" }, C = { class: "flex-center gap-2 mb-3 wrap-on-
81
70
  openFilters: () => F.value = !0,
82
71
  closeFilters: () => F.value = !1
83
72
  });
84
- async function G(e) {
73
+ async function V(e) {
85
74
  F.value = !0, setTimeout(() => {
86
75
  D.value?.focusFilter(e);
87
76
  }, 300);
88
77
  }
89
- function K(e) {
90
- B.value = e.values, k("filter-change", e.transformed);
78
+ function H(e) {
79
+ I.value = e.values, k("filter-change", e.transformed);
91
80
  }
92
- let q = u(() => Object.values(B.value).filter((e) => e != null && e !== "").length), J = u(() => !!O.pagination && (O.items.length > 0 || !O.loading));
81
+ let U = u(() => Object.values(I.value).filter((e) => e != null && e !== "").length), W = u(() => !!O.pagination && (O.items.length > 0 || !O.loading));
93
82
  return (a, u) => (b(), p("div", S, [m("div", {
94
83
  ref_key: "root",
95
84
  ref: P,
96
85
  class: "c-data-list"
97
86
  }, [
98
- z.value && z.value.length > 0 ? (b(), p(l, { key: 0 }, [m("div", C, [h(e, {
87
+ g.filters && g.filters.length > 0 ? (b(), p(l, { key: 0 }, [m("div", C, [h(e, {
99
88
  label: "Szűrők megnyitása",
100
89
  icon: "fa-solid fa-filter",
101
90
  onClick: u[0] ||= (e) => F.value = !0,
102
91
  style: { "flex-shrink": "0" },
103
- type: q.value > 0 ? "info" : "normal",
104
- indicator: q.value > 0 ? q.value : void 0
92
+ type: U.value > 0 ? "info" : "normal",
93
+ indicator: U.value > 0 ? U.value : void 0
105
94
  }, null, 8, ["type", "indicator"]), m("div", w, [h(s, {
106
- filters: B.value,
107
- items: z.value,
95
+ filters: I.value,
96
+ items: g.filters,
108
97
  onRemove: u[1] ||= (e) => D.value?.clearFilter(e),
109
- onOpenFilter: G
98
+ onOpenFilter: V
110
99
  }, null, 8, ["filters", "items"])])]), h(o, {
111
100
  ref_key: "dataFiltersRef",
112
101
  ref: D,
113
102
  open: F.value,
114
- items: z.value,
103
+ items: g.filters,
104
+ "history-enabled": g.historyEnabled,
115
105
  lazy: "",
116
106
  "handle-url": g.handleUrl,
117
107
  "storage-key": g.id,
118
108
  onClose: u[2] ||= (e) => F.value = !1,
119
- onChange: K
109
+ onChange: H
120
110
  }, null, 8, [
121
111
  "open",
122
112
  "items",
113
+ "history-enabled",
123
114
  "handle-url",
124
115
  "storage-key"
125
116
  ])], 64)) : f("", !0),
@@ -142,9 +133,9 @@ var S = { class: "ac-component" }, C = { class: "flex-center gap-2 mb-3 wrap-on-
142
133
  open: j.value,
143
134
  onClose: u[5] ||= (e) => j.value = !1
144
135
  }, null, 8, ["open"]),
145
- H.value === "table" ? (b(), d(t, {
136
+ R.value === "table" ? (b(), d(t, {
146
137
  key: 1,
147
- config: U.value,
138
+ config: z.value,
148
139
  loading: g.loading,
149
140
  items: g.items,
150
141
  settings: M.value ?? void 0,
@@ -158,7 +149,7 @@ var S = { class: "ac-component" }, C = { class: "flex-center gap-2 mb-3 wrap-on-
158
149
  "settings"
159
150
  ])) : (b(), d(n, {
160
151
  key: 2,
161
- config: U.value,
152
+ config: z.value,
162
153
  loading: g.loading,
163
154
  items: g.items,
164
155
  settings: M.value ?? void 0,
@@ -169,7 +160,7 @@ var S = { class: "ac-component" }, C = { class: "flex-center gap-2 mb-3 wrap-on-
169
160
  "items",
170
161
  "settings"
171
162
  ])),
172
- g.pagination && J.value ? (b(), d(i, {
163
+ g.pagination && W.value ? (b(), d(i, {
173
164
  key: 3,
174
165
  settings: g.pagination,
175
166
  "storage-key": g.id,
@@ -182,7 +173,7 @@ var S = { class: "ac-component" }, C = { class: "flex-center gap-2 mb-3 wrap-on-
182
173
  "storage-key": g.id,
183
174
  orderable: g.orderable,
184
175
  onClose: u[11] ||= (e) => A.value = !1,
185
- onChange: W
176
+ onChange: B
186
177
  }, null, 8, [
187
178
  "open",
188
179
  "columns",