admins-components 9.0.19 → 9.0.21
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.
- package/dist/admins-components.js +31 -31
- package/dist/admins-components31.js +6 -3
- package/dist/admins-components31.js.map +1 -1
- package/dist/admins-components33.js.map +1 -1
- package/dist/admins-components39.js +0 -1
- package/dist/admins-components39.js.map +1 -1
- package/dist/admins-components41.js.map +1 -1
- package/dist/admins-components77.js +28 -22
- package/dist/admins-components77.js.map +1 -1
- package/dist/admins-components78.js +98 -90
- package/dist/admins-components78.js.map +1 -1
- package/dist/admins-components80.js.map +1 -1
- package/dist/admins-components87.js +1 -1
- package/dist/admins-components87.js.map +1 -1
- package/dist/admins-components89.js.map +1 -1
- package/dist/src/components/Modal.vue.d.ts +1 -1
- package/dist/src/components/data-table/DataFilters.vue.d.ts +8 -4
- package/dist/src/index.d.ts +1 -1
- package/dist/src/styles/components/modal.scss_vue_type_style_index_0_src_true_lang.css +1 -1
- package/package.json +1 -1
|
@@ -28,34 +28,34 @@ import { getDefaultPaginator as V } from "./admins-components69.js";
|
|
|
28
28
|
import H from "./admins-components71.js";
|
|
29
29
|
import U from "./admins-components75.js";
|
|
30
30
|
import { debounce as W } from "./admins-components76.js";
|
|
31
|
-
import {
|
|
32
|
-
import
|
|
33
|
-
import
|
|
34
|
-
import { dataListDefaults as
|
|
35
|
-
import
|
|
36
|
-
import { isIpInUrl as
|
|
37
|
-
import { getUrlParam as
|
|
38
|
-
import { getCurrentSite as
|
|
39
|
-
import { vTooltip as
|
|
40
|
-
import { createNativeFetch as
|
|
41
|
-
import { FetchDetails as
|
|
42
|
-
import { useArticleEditorService as
|
|
43
|
-
import { useCurrentUser as
|
|
44
|
-
import { BackendService as
|
|
45
|
-
import { aoeConfig as
|
|
46
|
-
import
|
|
47
|
-
import { apeConfig as
|
|
48
|
-
import { configureImagePickerElement as
|
|
49
|
-
import
|
|
50
|
-
import
|
|
51
|
-
import { configureExternalArticleOfferElement as
|
|
52
|
-
import
|
|
53
|
-
import { configureGalleryImageSelectorElement as
|
|
54
|
-
import
|
|
55
|
-
import
|
|
56
|
-
import
|
|
57
|
-
import { configureInternalArticleOfferElement as
|
|
58
|
-
import
|
|
59
|
-
import { configurePartnerPickerElement as
|
|
60
|
-
import
|
|
61
|
-
export {
|
|
31
|
+
import { filterEmptyValues as G, getDefaultFilters as K, getFilterParams as q } from "./admins-components77.js";
|
|
32
|
+
import J from "./admins-components80.js";
|
|
33
|
+
import Y from "./admins-components83.js";
|
|
34
|
+
import { dataListDefaults as X } from "./admins-components87.js";
|
|
35
|
+
import Z from "./admins-components89.js";
|
|
36
|
+
import { isIpInUrl as Q } from "./admins-components90.js";
|
|
37
|
+
import { getUrlParam as $, joinUrl as ee, removeUrlParam as te, setUrlParam as ne } from "./admins-components91.js";
|
|
38
|
+
import { getCurrentSite as re } from "./admins-components92.js";
|
|
39
|
+
import { vTooltip as ie } from "./admins-components93.js";
|
|
40
|
+
import { createNativeFetch as ae } from "./admins-components94.js";
|
|
41
|
+
import { FetchDetails as oe, FetchError as se, Methods as ce, initRequest as le } from "./admins-components95.js";
|
|
42
|
+
import { useArticleEditorService as ue } from "./admins-components96.js";
|
|
43
|
+
import { useCurrentUser as de } from "./admins-components97.js";
|
|
44
|
+
import { BackendService as fe, useBackendService as pe } from "./admins-components98.js";
|
|
45
|
+
import { aoeConfig as me, configureArticleOfferElement as he } from "./admins-components151.js";
|
|
46
|
+
import ge from "./admins-components153.js";
|
|
47
|
+
import { apeConfig as _e, configureArticlePickerElement as ve } from "./admins-components154.js";
|
|
48
|
+
import { configureImagePickerElement as ye, ipeConfig as be } from "./admins-components155.js";
|
|
49
|
+
import xe from "./admins-components157.js";
|
|
50
|
+
import Se from "./admins-components158.js";
|
|
51
|
+
import { configureExternalArticleOfferElement as Ce, eaoeConfig as we } from "./admins-components159.js";
|
|
52
|
+
import Te from "./admins-components160.js";
|
|
53
|
+
import { configureGalleryImageSelectorElement as Ee, gisConfig as De } from "./admins-components161.js";
|
|
54
|
+
import Oe from "./admins-components162.js";
|
|
55
|
+
import ke from "./admins-components163.js";
|
|
56
|
+
import Ae from "./admins-components164.js";
|
|
57
|
+
import { configureInternalArticleOfferElement as je, iaoeConfig as Me } from "./admins-components165.js";
|
|
58
|
+
import Ne from "./admins-components166.js";
|
|
59
|
+
import { configurePartnerPickerElement as Pe, ppeconfig as Fe } from "./admins-components167.js";
|
|
60
|
+
import Ie from "./admins-components169.js";
|
|
61
|
+
export { ge as ArticleOfferElement, xe as ArticlePickerElement, fe as BackendService, n as Button, o as Calendar, c as Checkbox, h as ConfirmModal, g as CopyToClipboard, R as DataCards, J as DataFilters, Z as DataList, B as DataListOptions, H as DataPaginator, L as DataTable, s as DatePicker, l as DateRangePicker, Se as DateTimePickerElement, d as DropdownMenu, u as DropdownSelect, v as ExternalArticleOffer, Te as ExternalArticleOfferElement, oe as FetchDetails, se as FetchError, Y as FilterTags, U as FiltersHistory, Oe as GalleryImageSelectorElement, p as HeaderComponent, _ as ImagePicker, Ae as ImagePickerDetailsElement, ke as ImagePickerElement, y as InternalArticleOffer, Ne as InternalArticleOfferElement, b as Loader, ce as Methods, m as Modal, Ie as PartnerPickerElement, f as Sidebar, S as ToastNotification, me as aoeConfig, _e as apeConfig, E as booleanToString, r as calendarConfigDefaults, he as configureArticleOfferElement, ve as configureArticlePickerElement, Ce as configureExternalArticleOfferElement, Ee as configureGalleryImageSelectorElement, ye as configureImagePickerElement, je as configureInternalArticleOfferElement, Pe as configurePartnerPickerElement, ae as createNativeFetch, C as dataCardsSettingsDefaults, D as dataListConverters, X as dataListDefaults, w as dataListSettingsDefaults, T as dataTableSettingsDefaults, i as datePickerConfigDefaults, a as dateRangePickerConfigDefaults, W as debounce, z as deepMerge, we as eaoeConfig, O as enumMap, G as filterEmptyValues, k as formatCurrency, e as formatDate, A as formatNumber, re as getCurrentSite, K as getDefaultFilters, V as getDefaultPaginator, q as getFilterParams, $ as getUrlParam, De as gisConfig, Me as iaoeConfig, j as identity, le as initRequest, be as ipeConfig, Q as isIpInUrl, ee as joinUrl, M as listToString, N as localToLocalString, t as parseDate, Fe as ppeconfig, te as removeUrlParam, ne as setUrlParam, P as shortUuid, F as textEllipse, x as toast, ue as useArticleEditorService, pe as useBackendService, de as useCurrentUser, I as utcToLocalString, ie as vTooltip };
|
|
@@ -1,7 +1,10 @@
|
|
|
1
1
|
import { Teleport as e, createBlock as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, defineComponent as a, onMounted as o, onUnmounted as s, openBlock as c, renderSlot as l, toDisplayString as u } from "vue";
|
|
2
2
|
//#region src/components/Modal.vue?vue&type=script&setup=true&lang.ts
|
|
3
|
-
var d = { class: "ac-component" }, f = { class: "c-modal" }, p = {
|
|
3
|
+
var d = { class: "ac-component" }, f = { class: "c-modal" }, p = {
|
|
4
4
|
key: 0,
|
|
5
|
+
class: "c-modal-header"
|
|
6
|
+
}, m = { class: "c-modal-title" }, h = { class: "c-modal-body c-scroll" }, g = {
|
|
7
|
+
key: 1,
|
|
5
8
|
class: "c-modal-footer"
|
|
6
9
|
}, _ = /* @__PURE__ */ a({
|
|
7
10
|
__name: "Modal",
|
|
@@ -23,11 +26,11 @@ var d = { class: "ac-component" }, f = { class: "c-modal" }, p = { class: "c-mod
|
|
|
23
26
|
class: "c-modal-backdrop",
|
|
24
27
|
onMousedown: y
|
|
25
28
|
}, [i("div", f, [
|
|
26
|
-
|
|
29
|
+
a.title ? (c(), r("div", p, [i("h3", m, u(a.title), 1), i("button", {
|
|
27
30
|
type: "button",
|
|
28
31
|
class: "c-modal-close",
|
|
29
32
|
onClick: s[0] ||= (e) => v("close")
|
|
30
|
-
}, [...s[1] ||= [i("i", { class: "
|
|
33
|
+
}, [...s[1] ||= [i("i", { class: "fa-solid fa-xmark" }, null, -1)]])])) : n("", !0),
|
|
31
34
|
i("div", h, [l(o.$slots, "default")]),
|
|
32
35
|
o.$slots.footer ? (c(), r("div", g, [l(o.$slots, "footer")])) : n("", !0)
|
|
33
36
|
])], 32)])]));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"admins-components31.js","names":["$slots"],"sources":["../src/components/Modal.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface ModalProps {\n title
|
|
1
|
+
{"version":3,"file":"admins-components31.js","names":["$slots"],"sources":["../src/components/Modal.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface ModalProps {\n title?: string\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { onMounted, onUnmounted } from 'vue'\n\ndefineProps<ModalProps>()\n\nconst emit = defineEmits<{\n close: []\n}>()\n\nfunction onBackdropClick(e: MouseEvent) {\n if (e.target === e.currentTarget) {\n emit('close')\n }\n}\n\nfunction onKeydown(e: KeyboardEvent) {\n if (e.key === 'Escape') {\n emit('close')\n }\n}\n\nonMounted(() => {\n document.addEventListener('keydown', onKeydown)\n})\n\nonUnmounted(() => {\n document.removeEventListener('keydown', onKeydown)\n})\n</script>\n\n<template>\n <Teleport to=\"body\">\n <div class=\"ac-component\">\n <div class=\"c-modal-backdrop\" @mousedown=\"onBackdropClick\">\n <div class=\"c-modal\">\n <div class=\"c-modal-header\" v-if=\"title\">\n <h3 class=\"c-modal-title\">{{ title }}</h3>\n <button type=\"button\" class=\"c-modal-close\" @click=\"emit('close')\">\n <i class=\"fa-solid fa-xmark\"></i>\n </button>\n </div>\n <div class=\"c-modal-body c-scroll\">\n <slot />\n </div>\n <div v-if=\"$slots.footer\" class=\"c-modal-footer\">\n <slot name=\"footer\" />\n </div>\n </div>\n </div>\n </div>\n </Teleport>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/modal.scss\"></style>\n"],"mappings":";;;;;;;;;;;;;EAWA,IAAM,IAAO;EAIb,SAAS,EAAgB,GAAe;GACtC,AAAI,EAAE,WAAW,EAAE,iBACjB,EAAK,OAAO;EAEhB;EAEA,SAAS,EAAU,GAAkB;GACnC,AAAI,EAAE,QAAQ,YACZ,EAAK,OAAO;EAEhB;SAEA,QAAgB;GACd,SAAS,iBAAiB,WAAW,CAAS;EAChD,CAAC,GAED,QAAkB;GAChB,SAAS,oBAAoB,WAAW,CAAS;EACnD,CAAC,mBAIC,EAmBW,GAAA,EAnBD,IAAG,OAAM,GAAA,CACjB,EAiBM,OAjBN,GAiBM,CAhBJ,EAeM,OAAA;GAfD,OAAM;GAAoB,aAAW;MACxC,EAaM,OAbN,GAaM;GAZ8B,EAAA,SAAA,EAAA,GAAlC,EAKM,OALN,GAKM,CAJJ,EAA0C,MAA1C,GAA0C,EAAb,EAAA,KAAK,GAAA,CAAA,GAClC,EAES,UAAA;IAFD,MAAK;IAAS,OAAM;IAAiB,SAAK,AAAA,EAAA,QAAA,MAAE,EAAI,OAAA;oBACtD,EAAiC,KAAA,EAA9B,OAAM,oBAAmB,GAAA,MAAA,EAAA,CAAA,CAAA,CAAA,CAAA,CAAA,KAAA,EAAA,IAAA,EAAA;GAGhC,EAEM,OAFN,GAEM,CADJ,EAAQ,EAAA,QAAA,SAAA,CAAA,CAAA;GAECA,EAAAA,OAAO,UAAA,EAAA,GAAlB,EAEM,OAFN,GAEM,CADJ,EAAsB,EAAA,QAAA,QAAA,CAAA,CAAA,KAAA,EAAA,IAAA,EAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"admins-components33.js","names":[],"sources":["../src/components/Modal.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface ModalProps {\n title
|
|
1
|
+
{"version":3,"file":"admins-components33.js","names":[],"sources":["../src/components/Modal.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface ModalProps {\n title?: string\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { onMounted, onUnmounted } from 'vue'\n\ndefineProps<ModalProps>()\n\nconst emit = defineEmits<{\n close: []\n}>()\n\nfunction onBackdropClick(e: MouseEvent) {\n if (e.target === e.currentTarget) {\n emit('close')\n }\n}\n\nfunction onKeydown(e: KeyboardEvent) {\n if (e.key === 'Escape') {\n emit('close')\n }\n}\n\nonMounted(() => {\n document.addEventListener('keydown', onKeydown)\n})\n\nonUnmounted(() => {\n document.removeEventListener('keydown', onKeydown)\n})\n</script>\n\n<template>\n <Teleport to=\"body\">\n <div class=\"ac-component\">\n <div class=\"c-modal-backdrop\" @mousedown=\"onBackdropClick\">\n <div class=\"c-modal\">\n <div class=\"c-modal-header\" v-if=\"title\">\n <h3 class=\"c-modal-title\">{{ title }}</h3>\n <button type=\"button\" class=\"c-modal-close\" @click=\"emit('close')\">\n <i class=\"fa-solid fa-xmark\"></i>\n </button>\n </div>\n <div class=\"c-modal-body c-scroll\">\n <slot />\n </div>\n <div v-if=\"$slots.footer\" class=\"c-modal-footer\">\n <slot name=\"footer\" />\n </div>\n </div>\n </div>\n </div>\n </Teleport>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/modal.scss\"></style>\n"],"mappings":""}
|
|
@@ -130,7 +130,6 @@ var y = { class: "ac-component" }, b = { class: "c-image-picker" }, x = { class:
|
|
|
130
130
|
])) : i("", !0)
|
|
131
131
|
], 2), R.value ? (f(), r(t, {
|
|
132
132
|
key: 0,
|
|
133
|
-
title: "Kép keresése",
|
|
134
133
|
onClose: u[3] ||= (e) => R.value = !1
|
|
135
134
|
}, {
|
|
136
135
|
default: _(() => [o("hvg-search-image", {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"admins-components39.js","names":[],"sources":["../src/components/custom/ImagePicker.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface ImagePickerModel {\n id: string\n url: string\n source: string\n title: string\n isAdult: boolean\n}\n\nexport interface ImagePickerProps {\n modelValue?: ImagePickerModel\n details?: boolean\n editable?: boolean\n direction?: 'horizontal' | 'vertical'\n articleEditorUrl: string\n environment: string\n searchImageWidgetUrl: string\n imageBaseUrl: string\n imageViewId: string\n}\n\nconst defaultValue: ImagePickerModel = {\n id: '',\n url: '',\n isAdult: false,\n source: '',\n title: '',\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { computed, onMounted, onUnmounted, ref, watch } from 'vue'\nimport Modal from '@/components/Modal.vue'\nimport Button from '@/components/Button.vue'\n\nconst props = withDefaults(defineProps<ImagePickerProps>(), {\n modelValue: undefined,\n details: false,\n editable: false,\n direction: 'vertical',\n})\n\nconst emit = defineEmits<{\n (e: 'update:modelValue', v: ImagePickerModel): void\n}>()\n\nconst local = ref<ImagePickerModel>(defaultValue)\nconst showImageModal = ref(false)\n\nwatch(\n () => local.value,\n () => {\n emit('update:modelValue', local.value)\n },\n { deep: true },\n)\n\nwatch(\n () => props.modelValue,\n (newValue) => {\n if (newValue) {\n local.value = newValue\n }\n },\n { deep: true, immediate: true },\n)\n\n// Generate unique ID\nconst uniqueId = (() => {\n if (typeof crypto !== 'undefined' && crypto.randomUUID) return crypto.randomUUID()\n return `ip-${Date.now()}-${Math.random().toString(36).slice(2)}`\n})()\n\nconst imageCausationId = `${uniqueId}-image-picker-causation`\n\n// Load external search image widget script\nonMounted(() => {\n // Check if custom element is already registered\n if (!customElements.get('hvg-search-image')) {\n if (!document.querySelector(`script[src=\"${props.searchImageWidgetUrl}\"]`)) {\n const script = document.createElement('script')\n script.type = 'text/javascript'\n script.src = props.searchImageWidgetUrl\n script.async = true\n document.head.appendChild(script)\n }\n }\n})\n\n// Computed properties\nconst hasImage = computed(() => {\n return (\n local.value &&\n ((local.value.url && local.value.url.length > 0) ||\n (local.value.id && local.value.id.length > 0))\n )\n})\n\nconst imageUrl = computed(() => {\n if (!hasImage.value) return undefined\n if (local.value.url && local.value.url.length > 0) return local.value.url\n return `${props.imageBaseUrl}/${props.imageViewId}/${local.value.id}.img`\n})\n\nconst isHorizontal = computed(() => props.direction === 'horizontal')\n\n// Event handlers\nconst selectImage = (event: MouseEvent) => {\n event.preventDefault()\n showImageModal.value = true\n}\n\nconst resetImage = (event: MouseEvent) => {\n event.preventDefault()\n local.value = { ...defaultValue }\n}\n\nconst onImageSelected = (e: CustomEvent) => {\n if (e?.detail?.causationid === imageCausationId) {\n showImageModal.value = false\n\n if (e.detail?.image) {\n local.value = {\n id: e.detail.image.id,\n url: '',\n isAdult: e.detail.image.isAdult,\n source: e.detail.image.source,\n title: e.detail.image.title,\n }\n }\n }\n}\n\n// Event listeners\nonMounted(() => {\n window.addEventListener('image-selected', onImageSelected as EventListener)\n})\n\nonUnmounted(() => {\n window.removeEventListener('image-selected', onImageSelected as EventListener)\n})\n</script>\n\n<template>\n <div class=\"ac-component\">\n <div class=\"c-image-picker\">\n <div\n class=\"c-image-picker__container\"\n :class=\"{ 'c-image-picker__container--horizontal': isHorizontal }\"\n >\n <div class=\"c-image-picker__preview\">\n <img\n v-if=\"hasImage\"\n :src=\"imageUrl\"\n :alt=\"local.title || 'Selected image'\"\n class=\"c-image-picker__img\"\n />\n <p v-else class=\"c-image-picker__placeholder\">Nincs kiválasztott kép</p>\n </div>\n\n <!-- Action Buttons -->\n <div class=\"c-image-picker__buttons\">\n <Button\n type=\"success\"\n label=\"Kép kiválasztása\"\n class=\"nowrap\"\n @click=\"selectImage\"\n icon=\"fa-solid fa-image\"\n ></Button>\n <Button\n type=\"error\"\n label=\"Eltávolítás\"\n class=\"nowrap\"\n @click=\"resetImage\"\n icon=\"fa-solid fa-trash\"\n ></Button>\n </div>\n\n <!-- Details Section -->\n <div v-if=\"details && local.id\" class=\"c-image-picker__details\">\n <!-- Source Input -->\n <div>\n <label for=\"image-source\" class=\"c-label\">Forrás</label>\n <div class=\"c-input-row\">\n <input\n v-model=\"local.source\"\n id=\"image-source\"\n type=\"text\"\n class=\"c-input\"\n placeholder=\"Kép forrása\"\n :disabled=\"!editable\"\n />\n </div>\n </div>\n\n <!-- Title/Alt Text Input -->\n <div>\n <label for=\"image-title\" class=\"c-label\">Cím / Alt szöveg</label>\n <div class=\"c-input-row\">\n <textarea\n v-model=\"local.title\"\n id=\"image-title\"\n class=\"c-input c-image-picker__textarea\"\n placeholder=\"Cím vagy alt szöveg\"\n :disabled=\"!editable\"\n />\n </div>\n </div>\n\n <!-- Adult Content Checkbox -->\n <div class=\"flex-center gap-1\">\n <input\n id=\"image-adult\"\n v-model=\"local.isAdult\"\n type=\"checkbox\"\n class=\"c-checkbox\"\n :checked=\"local.isAdult\"\n :disabled=\"!editable\"\n />\n <label for=\"image-adult\" class=\"c-label\">Felnőtt tartalom</label>\n </div>\n </div>\n </div>\n\n <!-- Image Search Modal Dialog -->\n <Modal v-if=\"showImageModal\"
|
|
1
|
+
{"version":3,"file":"admins-components39.js","names":[],"sources":["../src/components/custom/ImagePicker.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface ImagePickerModel {\n id: string\n url: string\n source: string\n title: string\n isAdult: boolean\n}\n\nexport interface ImagePickerProps {\n modelValue?: ImagePickerModel\n details?: boolean\n editable?: boolean\n direction?: 'horizontal' | 'vertical'\n articleEditorUrl: string\n environment: string\n searchImageWidgetUrl: string\n imageBaseUrl: string\n imageViewId: string\n}\n\nconst defaultValue: ImagePickerModel = {\n id: '',\n url: '',\n isAdult: false,\n source: '',\n title: '',\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { computed, onMounted, onUnmounted, ref, watch } from 'vue'\nimport Modal from '@/components/Modal.vue'\nimport Button from '@/components/Button.vue'\n\nconst props = withDefaults(defineProps<ImagePickerProps>(), {\n modelValue: undefined,\n details: false,\n editable: false,\n direction: 'vertical',\n})\n\nconst emit = defineEmits<{\n (e: 'update:modelValue', v: ImagePickerModel): void\n}>()\n\nconst local = ref<ImagePickerModel>(defaultValue)\nconst showImageModal = ref(false)\n\nwatch(\n () => local.value,\n () => {\n emit('update:modelValue', local.value)\n },\n { deep: true },\n)\n\nwatch(\n () => props.modelValue,\n (newValue) => {\n if (newValue) {\n local.value = newValue\n }\n },\n { deep: true, immediate: true },\n)\n\n// Generate unique ID\nconst uniqueId = (() => {\n if (typeof crypto !== 'undefined' && crypto.randomUUID) return crypto.randomUUID()\n return `ip-${Date.now()}-${Math.random().toString(36).slice(2)}`\n})()\n\nconst imageCausationId = `${uniqueId}-image-picker-causation`\n\n// Load external search image widget script\nonMounted(() => {\n // Check if custom element is already registered\n if (!customElements.get('hvg-search-image')) {\n if (!document.querySelector(`script[src=\"${props.searchImageWidgetUrl}\"]`)) {\n const script = document.createElement('script')\n script.type = 'text/javascript'\n script.src = props.searchImageWidgetUrl\n script.async = true\n document.head.appendChild(script)\n }\n }\n})\n\n// Computed properties\nconst hasImage = computed(() => {\n return (\n local.value &&\n ((local.value.url && local.value.url.length > 0) ||\n (local.value.id && local.value.id.length > 0))\n )\n})\n\nconst imageUrl = computed(() => {\n if (!hasImage.value) return undefined\n if (local.value.url && local.value.url.length > 0) return local.value.url\n return `${props.imageBaseUrl}/${props.imageViewId}/${local.value.id}.img`\n})\n\nconst isHorizontal = computed(() => props.direction === 'horizontal')\n\n// Event handlers\nconst selectImage = (event: MouseEvent) => {\n event.preventDefault()\n showImageModal.value = true\n}\n\nconst resetImage = (event: MouseEvent) => {\n event.preventDefault()\n local.value = { ...defaultValue }\n}\n\nconst onImageSelected = (e: CustomEvent) => {\n if (e?.detail?.causationid === imageCausationId) {\n showImageModal.value = false\n\n if (e.detail?.image) {\n local.value = {\n id: e.detail.image.id,\n url: '',\n isAdult: e.detail.image.isAdult,\n source: e.detail.image.source,\n title: e.detail.image.title,\n }\n }\n }\n}\n\n// Event listeners\nonMounted(() => {\n window.addEventListener('image-selected', onImageSelected as EventListener)\n})\n\nonUnmounted(() => {\n window.removeEventListener('image-selected', onImageSelected as EventListener)\n})\n</script>\n\n<template>\n <div class=\"ac-component\">\n <div class=\"c-image-picker\">\n <div\n class=\"c-image-picker__container\"\n :class=\"{ 'c-image-picker__container--horizontal': isHorizontal }\"\n >\n <div class=\"c-image-picker__preview\">\n <img\n v-if=\"hasImage\"\n :src=\"imageUrl\"\n :alt=\"local.title || 'Selected image'\"\n class=\"c-image-picker__img\"\n />\n <p v-else class=\"c-image-picker__placeholder\">Nincs kiválasztott kép</p>\n </div>\n\n <!-- Action Buttons -->\n <div class=\"c-image-picker__buttons\">\n <Button\n type=\"success\"\n label=\"Kép kiválasztása\"\n class=\"nowrap\"\n @click=\"selectImage\"\n icon=\"fa-solid fa-image\"\n ></Button>\n <Button\n type=\"error\"\n label=\"Eltávolítás\"\n class=\"nowrap\"\n @click=\"resetImage\"\n icon=\"fa-solid fa-trash\"\n ></Button>\n </div>\n\n <!-- Details Section -->\n <div v-if=\"details && local.id\" class=\"c-image-picker__details\">\n <!-- Source Input -->\n <div>\n <label for=\"image-source\" class=\"c-label\">Forrás</label>\n <div class=\"c-input-row\">\n <input\n v-model=\"local.source\"\n id=\"image-source\"\n type=\"text\"\n class=\"c-input\"\n placeholder=\"Kép forrása\"\n :disabled=\"!editable\"\n />\n </div>\n </div>\n\n <!-- Title/Alt Text Input -->\n <div>\n <label for=\"image-title\" class=\"c-label\">Cím / Alt szöveg</label>\n <div class=\"c-input-row\">\n <textarea\n v-model=\"local.title\"\n id=\"image-title\"\n class=\"c-input c-image-picker__textarea\"\n placeholder=\"Cím vagy alt szöveg\"\n :disabled=\"!editable\"\n />\n </div>\n </div>\n\n <!-- Adult Content Checkbox -->\n <div class=\"flex-center gap-1\">\n <input\n id=\"image-adult\"\n v-model=\"local.isAdult\"\n type=\"checkbox\"\n class=\"c-checkbox\"\n :checked=\"local.isAdult\"\n :disabled=\"!editable\"\n />\n <label for=\"image-adult\" class=\"c-label\">Felnőtt tartalom</label>\n </div>\n </div>\n </div>\n\n <!-- Image Search Modal Dialog -->\n <Modal v-if=\"showImageModal\" @close=\"showImageModal = false\">\n <hvg-search-image\n :causationid=\"imageCausationId\"\n :viewid=\"imageViewId\"\n :environment=\"environment\"\n :aeurl=\"articleEditorUrl\"\n selectonly=\"true\"\n />\n </Modal>\n </div>\n </div>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/image-picker.scss\"></style>\n"],"mappings":";;;;;;;;;;;;;;GAqBM,IAAiC;CACrC,IAAI;CACJ,KAAK;CACL,SAAS;CACT,QAAQ;CACR,OAAO;AACT;;;;;;;;;;;;;;;;;;;;;EAQA,IAAM,IAAQ,GAOR,IAAO,GAIP,IAAQ,EAAsB,CAAY,GAC1C,IAAiB,EAAI,EAAK;EAUhC,AARA,QACQ,EAAM,aACN;GACJ,EAAK,qBAAqB,EAAM,KAAK;EACvC,GACA,EAAE,MAAM,GAAK,CACf,GAEA,QACQ,EAAM,aACX,MAAa;GACZ,AAAI,MACF,EAAM,QAAQ;EAElB,GACA;GAAE,MAAM;GAAM,WAAW;EAAK,CAChC;EAQA,IAAM,IAAmB,GAJnB,OAAO,SAAW,OAAe,OAAO,aAAmB,OAAO,WAAW,IAC1E,MAAM,KAAK,IAAI,EAAE,GAAG,KAAK,OAAO,EAAE,SAAS,EAAE,EAAE,MAAM,CAAC,IAG1B;EAGrC,QAAgB;GAEd,IAAI,CAAC,eAAe,IAAI,kBAAkB,KACpC,CAAC,SAAS,cAAc,eAAe,EAAM,qBAAqB,GAAG,GAAG;IAC1E,IAAM,IAAS,SAAS,cAAc,QAAQ;IAI9C,AAHA,EAAO,OAAO,mBACd,EAAO,MAAM,EAAM,sBACnB,EAAO,QAAQ,IACf,SAAS,KAAK,YAAY,CAAM;GAClC;EAEJ,CAAC;EAGD,IAAM,IAAW,QAEb,EAAM,UACJ,EAAM,MAAM,OAAO,EAAM,MAAM,IAAI,SAAS,KAC3C,EAAM,MAAM,MAAM,EAAM,MAAM,GAAG,SAAS,EAEhD,GAEK,IAAW,QAAe;GACzB,MAAS,OAEd,OADI,EAAM,MAAM,OAAO,EAAM,MAAM,IAAI,SAAS,IAAU,EAAM,MAAM,MAC/D,GAAG,EAAM,aAAa,GAAG,EAAM,YAAY,GAAG,EAAM,MAAM,GAAG;EACtE,CAAC,GAEK,IAAe,QAAe,EAAM,cAAc,YAAY,GAG9D,KAAe,MAAsB;GAEzC,AADA,EAAM,eAAe,GACrB,EAAe,QAAQ;EACzB,GAEM,KAAc,MAAsB;GAExC,AADA,EAAM,eAAe,GACrB,EAAM,QAAQ,EAAE,GAAG,EAAa;EAClC,GAEM,KAAmB,MAAmB;GAC1C,AAAI,GAAG,QAAQ,gBAAgB,MAC7B,EAAe,QAAQ,IAEnB,EAAE,QAAQ,UACZ,EAAM,QAAQ;IACZ,IAAI,EAAE,OAAO,MAAM;IACnB,KAAK;IACL,SAAS,EAAE,OAAO,MAAM;IACxB,QAAQ,EAAE,OAAO,MAAM;IACvB,OAAO,EAAE,OAAO,MAAM;GACxB;EAGN;SAGA,QAAgB;GACd,OAAO,iBAAiB,kBAAkB,CAAgC;EAC5E,CAAC,GAED,QAAkB;GAChB,OAAO,oBAAoB,kBAAkB,CAAgC;EAC/E,CAAC,mBAIC,EA2FM,OA3FN,GA2FM,CA1FJ,EAyFM,OAzFN,GAyFM,CAxFJ,EA4EM,OAAA,EA3EJ,OAAK,EAAA,CAAC,6BAA2B,EAAA,yCACkB,EAAA,MAAY,CAAA,CAAA,EAAA,GAAA;GAE/D,EAQM,OARN,GAQM,CANI,EAAA,SAAA,EAAA,GADR,EAKE,OAAA;;IAHC,KAAK,EAAA;IACL,KAAK,EAAA,MAAM,SAAK;IACjB,OAAM;2BAER,EAAwE,KAAxE,GAA8C,wBAAsB,EAAA,CAAA;GAItE,EAeM,OAfN,GAeM,CAdJ,EAMU,GAAA;IALR,MAAK;IACL,OAAM;IACN,OAAM;IACL,SAAO;IACR,MAAK;OAEP,EAMU,GAAA;IALR,MAAK;IACL,OAAM;IACN,OAAM;IACL,SAAO;IACR,MAAK;;GAKE,EAAA,WAAW,EAAA,MAAM,MAAA,EAAA,GAA5B,EA0CM,OA1CN,GA0CM;IAxCJ,EAYM,OAAA,MAAA,CAAA,AAAA,EAAA,OAXJ,EAAwD,SAAA;KAAjD,KAAI;KAAe,OAAM;OAAU,UAAM,EAAA,GAChD,EASM,OATN,GASM,CAAA,EARJ,EAOE,SAAA;8CANS,MAAM,SAAM;KACrB,IAAG;KACH,MAAK;KACL,OAAM;KACN,aAAY;KACX,UAAQ,CAAG,EAAA;yBALH,EAAA,MAAM,MAAM,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA;IAW3B,EAWM,OAAA,MAAA,CAAA,AAAA,EAAA,OAVJ,EAAiE,SAAA;KAA1D,KAAI;KAAc,OAAM;OAAU,oBAAgB,EAAA,GACzD,EAQM,OARN,GAQM,CAAA,EAPJ,EAME,YAAA;8CALS,MAAM,QAAK;KACpB,IAAG;KACH,OAAM;KACN,aAAY;KACX,UAAQ,CAAG,EAAA;yBAJH,EAAA,MAAM,KAAK,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA;IAU1B,EAUM,OAVN,GAUM,CAAA,EATJ,EAOE,SAAA;KANA,IAAG;8CACM,MAAM,UAAO;KACtB,MAAK;KACL,OAAM;KACL,SAAS,EAAA,MAAM;KACf,UAAQ,CAAG,EAAA;yBAJH,EAAA,MAAM,OAAO,CAAA,CAAA,GAAA,AAAA,EAAA,OAMxB,EAAiE,SAAA;KAA1D,KAAI;KAAc,OAAM;OAAU,oBAAgB,EAAA,CAAA,CAAA;;SAMlD,EAAA,SAAA,EAAA,GAAb,EAQQ,GAAA;;GARsB,SAAK,AAAA,EAAA,QAAA,MAAE,EAAA,QAAc;;oBAO/C,CANF,EAME,oBAAA;IALC,aAAa;IACb,QAAQ,EAAA;IACR,aAAa,EAAA;IACb,OAAO,EAAA;IACR,YAAW"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"admins-components41.js","names":[],"sources":["../src/components/custom/ImagePicker.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface ImagePickerModel {\n id: string\n url: string\n source: string\n title: string\n isAdult: boolean\n}\n\nexport interface ImagePickerProps {\n modelValue?: ImagePickerModel\n details?: boolean\n editable?: boolean\n direction?: 'horizontal' | 'vertical'\n articleEditorUrl: string\n environment: string\n searchImageWidgetUrl: string\n imageBaseUrl: string\n imageViewId: string\n}\n\nconst defaultValue: ImagePickerModel = {\n id: '',\n url: '',\n isAdult: false,\n source: '',\n title: '',\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { computed, onMounted, onUnmounted, ref, watch } from 'vue'\nimport Modal from '@/components/Modal.vue'\nimport Button from '@/components/Button.vue'\n\nconst props = withDefaults(defineProps<ImagePickerProps>(), {\n modelValue: undefined,\n details: false,\n editable: false,\n direction: 'vertical',\n})\n\nconst emit = defineEmits<{\n (e: 'update:modelValue', v: ImagePickerModel): void\n}>()\n\nconst local = ref<ImagePickerModel>(defaultValue)\nconst showImageModal = ref(false)\n\nwatch(\n () => local.value,\n () => {\n emit('update:modelValue', local.value)\n },\n { deep: true },\n)\n\nwatch(\n () => props.modelValue,\n (newValue) => {\n if (newValue) {\n local.value = newValue\n }\n },\n { deep: true, immediate: true },\n)\n\n// Generate unique ID\nconst uniqueId = (() => {\n if (typeof crypto !== 'undefined' && crypto.randomUUID) return crypto.randomUUID()\n return `ip-${Date.now()}-${Math.random().toString(36).slice(2)}`\n})()\n\nconst imageCausationId = `${uniqueId}-image-picker-causation`\n\n// Load external search image widget script\nonMounted(() => {\n // Check if custom element is already registered\n if (!customElements.get('hvg-search-image')) {\n if (!document.querySelector(`script[src=\"${props.searchImageWidgetUrl}\"]`)) {\n const script = document.createElement('script')\n script.type = 'text/javascript'\n script.src = props.searchImageWidgetUrl\n script.async = true\n document.head.appendChild(script)\n }\n }\n})\n\n// Computed properties\nconst hasImage = computed(() => {\n return (\n local.value &&\n ((local.value.url && local.value.url.length > 0) ||\n (local.value.id && local.value.id.length > 0))\n )\n})\n\nconst imageUrl = computed(() => {\n if (!hasImage.value) return undefined\n if (local.value.url && local.value.url.length > 0) return local.value.url\n return `${props.imageBaseUrl}/${props.imageViewId}/${local.value.id}.img`\n})\n\nconst isHorizontal = computed(() => props.direction === 'horizontal')\n\n// Event handlers\nconst selectImage = (event: MouseEvent) => {\n event.preventDefault()\n showImageModal.value = true\n}\n\nconst resetImage = (event: MouseEvent) => {\n event.preventDefault()\n local.value = { ...defaultValue }\n}\n\nconst onImageSelected = (e: CustomEvent) => {\n if (e?.detail?.causationid === imageCausationId) {\n showImageModal.value = false\n\n if (e.detail?.image) {\n local.value = {\n id: e.detail.image.id,\n url: '',\n isAdult: e.detail.image.isAdult,\n source: e.detail.image.source,\n title: e.detail.image.title,\n }\n }\n }\n}\n\n// Event listeners\nonMounted(() => {\n window.addEventListener('image-selected', onImageSelected as EventListener)\n})\n\nonUnmounted(() => {\n window.removeEventListener('image-selected', onImageSelected as EventListener)\n})\n</script>\n\n<template>\n <div class=\"ac-component\">\n <div class=\"c-image-picker\">\n <div\n class=\"c-image-picker__container\"\n :class=\"{ 'c-image-picker__container--horizontal': isHorizontal }\"\n >\n <div class=\"c-image-picker__preview\">\n <img\n v-if=\"hasImage\"\n :src=\"imageUrl\"\n :alt=\"local.title || 'Selected image'\"\n class=\"c-image-picker__img\"\n />\n <p v-else class=\"c-image-picker__placeholder\">Nincs kiválasztott kép</p>\n </div>\n\n <!-- Action Buttons -->\n <div class=\"c-image-picker__buttons\">\n <Button\n type=\"success\"\n label=\"Kép kiválasztása\"\n class=\"nowrap\"\n @click=\"selectImage\"\n icon=\"fa-solid fa-image\"\n ></Button>\n <Button\n type=\"error\"\n label=\"Eltávolítás\"\n class=\"nowrap\"\n @click=\"resetImage\"\n icon=\"fa-solid fa-trash\"\n ></Button>\n </div>\n\n <!-- Details Section -->\n <div v-if=\"details && local.id\" class=\"c-image-picker__details\">\n <!-- Source Input -->\n <div>\n <label for=\"image-source\" class=\"c-label\">Forrás</label>\n <div class=\"c-input-row\">\n <input\n v-model=\"local.source\"\n id=\"image-source\"\n type=\"text\"\n class=\"c-input\"\n placeholder=\"Kép forrása\"\n :disabled=\"!editable\"\n />\n </div>\n </div>\n\n <!-- Title/Alt Text Input -->\n <div>\n <label for=\"image-title\" class=\"c-label\">Cím / Alt szöveg</label>\n <div class=\"c-input-row\">\n <textarea\n v-model=\"local.title\"\n id=\"image-title\"\n class=\"c-input c-image-picker__textarea\"\n placeholder=\"Cím vagy alt szöveg\"\n :disabled=\"!editable\"\n />\n </div>\n </div>\n\n <!-- Adult Content Checkbox -->\n <div class=\"flex-center gap-1\">\n <input\n id=\"image-adult\"\n v-model=\"local.isAdult\"\n type=\"checkbox\"\n class=\"c-checkbox\"\n :checked=\"local.isAdult\"\n :disabled=\"!editable\"\n />\n <label for=\"image-adult\" class=\"c-label\">Felnőtt tartalom</label>\n </div>\n </div>\n </div>\n\n <!-- Image Search Modal Dialog -->\n <Modal v-if=\"showImageModal\"
|
|
1
|
+
{"version":3,"file":"admins-components41.js","names":[],"sources":["../src/components/custom/ImagePicker.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface ImagePickerModel {\n id: string\n url: string\n source: string\n title: string\n isAdult: boolean\n}\n\nexport interface ImagePickerProps {\n modelValue?: ImagePickerModel\n details?: boolean\n editable?: boolean\n direction?: 'horizontal' | 'vertical'\n articleEditorUrl: string\n environment: string\n searchImageWidgetUrl: string\n imageBaseUrl: string\n imageViewId: string\n}\n\nconst defaultValue: ImagePickerModel = {\n id: '',\n url: '',\n isAdult: false,\n source: '',\n title: '',\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { computed, onMounted, onUnmounted, ref, watch } from 'vue'\nimport Modal from '@/components/Modal.vue'\nimport Button from '@/components/Button.vue'\n\nconst props = withDefaults(defineProps<ImagePickerProps>(), {\n modelValue: undefined,\n details: false,\n editable: false,\n direction: 'vertical',\n})\n\nconst emit = defineEmits<{\n (e: 'update:modelValue', v: ImagePickerModel): void\n}>()\n\nconst local = ref<ImagePickerModel>(defaultValue)\nconst showImageModal = ref(false)\n\nwatch(\n () => local.value,\n () => {\n emit('update:modelValue', local.value)\n },\n { deep: true },\n)\n\nwatch(\n () => props.modelValue,\n (newValue) => {\n if (newValue) {\n local.value = newValue\n }\n },\n { deep: true, immediate: true },\n)\n\n// Generate unique ID\nconst uniqueId = (() => {\n if (typeof crypto !== 'undefined' && crypto.randomUUID) return crypto.randomUUID()\n return `ip-${Date.now()}-${Math.random().toString(36).slice(2)}`\n})()\n\nconst imageCausationId = `${uniqueId}-image-picker-causation`\n\n// Load external search image widget script\nonMounted(() => {\n // Check if custom element is already registered\n if (!customElements.get('hvg-search-image')) {\n if (!document.querySelector(`script[src=\"${props.searchImageWidgetUrl}\"]`)) {\n const script = document.createElement('script')\n script.type = 'text/javascript'\n script.src = props.searchImageWidgetUrl\n script.async = true\n document.head.appendChild(script)\n }\n }\n})\n\n// Computed properties\nconst hasImage = computed(() => {\n return (\n local.value &&\n ((local.value.url && local.value.url.length > 0) ||\n (local.value.id && local.value.id.length > 0))\n )\n})\n\nconst imageUrl = computed(() => {\n if (!hasImage.value) return undefined\n if (local.value.url && local.value.url.length > 0) return local.value.url\n return `${props.imageBaseUrl}/${props.imageViewId}/${local.value.id}.img`\n})\n\nconst isHorizontal = computed(() => props.direction === 'horizontal')\n\n// Event handlers\nconst selectImage = (event: MouseEvent) => {\n event.preventDefault()\n showImageModal.value = true\n}\n\nconst resetImage = (event: MouseEvent) => {\n event.preventDefault()\n local.value = { ...defaultValue }\n}\n\nconst onImageSelected = (e: CustomEvent) => {\n if (e?.detail?.causationid === imageCausationId) {\n showImageModal.value = false\n\n if (e.detail?.image) {\n local.value = {\n id: e.detail.image.id,\n url: '',\n isAdult: e.detail.image.isAdult,\n source: e.detail.image.source,\n title: e.detail.image.title,\n }\n }\n }\n}\n\n// Event listeners\nonMounted(() => {\n window.addEventListener('image-selected', onImageSelected as EventListener)\n})\n\nonUnmounted(() => {\n window.removeEventListener('image-selected', onImageSelected as EventListener)\n})\n</script>\n\n<template>\n <div class=\"ac-component\">\n <div class=\"c-image-picker\">\n <div\n class=\"c-image-picker__container\"\n :class=\"{ 'c-image-picker__container--horizontal': isHorizontal }\"\n >\n <div class=\"c-image-picker__preview\">\n <img\n v-if=\"hasImage\"\n :src=\"imageUrl\"\n :alt=\"local.title || 'Selected image'\"\n class=\"c-image-picker__img\"\n />\n <p v-else class=\"c-image-picker__placeholder\">Nincs kiválasztott kép</p>\n </div>\n\n <!-- Action Buttons -->\n <div class=\"c-image-picker__buttons\">\n <Button\n type=\"success\"\n label=\"Kép kiválasztása\"\n class=\"nowrap\"\n @click=\"selectImage\"\n icon=\"fa-solid fa-image\"\n ></Button>\n <Button\n type=\"error\"\n label=\"Eltávolítás\"\n class=\"nowrap\"\n @click=\"resetImage\"\n icon=\"fa-solid fa-trash\"\n ></Button>\n </div>\n\n <!-- Details Section -->\n <div v-if=\"details && local.id\" class=\"c-image-picker__details\">\n <!-- Source Input -->\n <div>\n <label for=\"image-source\" class=\"c-label\">Forrás</label>\n <div class=\"c-input-row\">\n <input\n v-model=\"local.source\"\n id=\"image-source\"\n type=\"text\"\n class=\"c-input\"\n placeholder=\"Kép forrása\"\n :disabled=\"!editable\"\n />\n </div>\n </div>\n\n <!-- Title/Alt Text Input -->\n <div>\n <label for=\"image-title\" class=\"c-label\">Cím / Alt szöveg</label>\n <div class=\"c-input-row\">\n <textarea\n v-model=\"local.title\"\n id=\"image-title\"\n class=\"c-input c-image-picker__textarea\"\n placeholder=\"Cím vagy alt szöveg\"\n :disabled=\"!editable\"\n />\n </div>\n </div>\n\n <!-- Adult Content Checkbox -->\n <div class=\"flex-center gap-1\">\n <input\n id=\"image-adult\"\n v-model=\"local.isAdult\"\n type=\"checkbox\"\n class=\"c-checkbox\"\n :checked=\"local.isAdult\"\n :disabled=\"!editable\"\n />\n <label for=\"image-adult\" class=\"c-label\">Felnőtt tartalom</label>\n </div>\n </div>\n </div>\n\n <!-- Image Search Modal Dialog -->\n <Modal v-if=\"showImageModal\" @close=\"showImageModal = false\">\n <hvg-search-image\n :causationid=\"imageCausationId\"\n :viewid=\"imageViewId\"\n :environment=\"environment\"\n :aeurl=\"articleEditorUrl\"\n selectonly=\"true\"\n />\n </Modal>\n </div>\n </div>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/image-picker.scss\"></style>\n"],"mappings":""}
|
|
@@ -1,22 +1,37 @@
|
|
|
1
1
|
import { parseDropdownValue as e } from "./admins-components72.js";
|
|
2
|
-
//#region src/utils/
|
|
2
|
+
//#region src/utils/dataFilters.ts
|
|
3
3
|
function t(e) {
|
|
4
|
-
let t = new URLSearchParams(window.location.search),
|
|
5
|
-
for (let
|
|
6
|
-
if (
|
|
7
|
-
let e = window.location.search ? t.get(
|
|
8
|
-
r
|
|
4
|
+
let t = new URLSearchParams(window.location.search), n = {};
|
|
5
|
+
for (let r of e) {
|
|
6
|
+
if (r.type === "separator") continue;
|
|
7
|
+
let e = window.location.search ? t.get(r.key) : null;
|
|
8
|
+
n[r.key] = e === null ? r.value ?? null : i(r.type, e, r.value);
|
|
9
9
|
}
|
|
10
|
-
return
|
|
10
|
+
return n;
|
|
11
|
+
}
|
|
12
|
+
function n(e) {
|
|
13
|
+
let n = t(e) ?? {}, i = {};
|
|
14
|
+
for (let t of e) {
|
|
15
|
+
if (t.type === "separator") continue;
|
|
16
|
+
let e = n[t.key];
|
|
17
|
+
if (t.transformer) {
|
|
18
|
+
let n = t.transformer(e);
|
|
19
|
+
n && Object.assign(i, n);
|
|
20
|
+
} else i[t.key] = e;
|
|
21
|
+
}
|
|
22
|
+
return r(i);
|
|
23
|
+
}
|
|
24
|
+
function r(e) {
|
|
25
|
+
return Object.fromEntries(Object.entries(e).filter(([e, t]) => t !== null && t !== "" && t !== void 0));
|
|
11
26
|
}
|
|
12
|
-
function
|
|
27
|
+
function i(t, n, r) {
|
|
13
28
|
if (t === "number") {
|
|
14
29
|
let e = Number(n);
|
|
15
|
-
return isNaN(e) ?
|
|
30
|
+
return isNaN(e) ? r ?? null : e;
|
|
16
31
|
}
|
|
17
|
-
return t === "date" || t === "datetime" ? { utc: n } : t === "daterange" || t === "datetimerange" ?
|
|
32
|
+
return t === "date" || t === "datetime" ? { utc: n } : t === "daterange" || t === "datetimerange" ? a(n, r) : t === "dropdown" ? e(n) : t === "checkbox" ? n === "true" : n;
|
|
18
33
|
}
|
|
19
|
-
function
|
|
34
|
+
function a(e, t) {
|
|
20
35
|
try {
|
|
21
36
|
let t = JSON.parse(e);
|
|
22
37
|
return t && typeof t == "object" && "local" in t && t.local && (t.local = new Date(t.local)), t;
|
|
@@ -24,16 +39,7 @@ function r(e, t) {
|
|
|
24
39
|
return t ?? null;
|
|
25
40
|
}
|
|
26
41
|
}
|
|
27
|
-
function
|
|
28
|
-
let t = new URLSearchParams(window.location.search), r = {};
|
|
29
|
-
for (let i of e) {
|
|
30
|
-
if (i.type === "separator") continue;
|
|
31
|
-
let e = t.get(i.key);
|
|
32
|
-
e !== null && (r[i.key] = n(i.type, e, i.value));
|
|
33
|
-
}
|
|
34
|
-
return r;
|
|
35
|
-
}
|
|
36
|
-
function a(e, t) {
|
|
42
|
+
function o(e, t) {
|
|
37
43
|
let n = new URLSearchParams(window.location.search);
|
|
38
44
|
for (let r of e) {
|
|
39
45
|
if (r.type === "separator") continue;
|
|
@@ -44,4 +50,4 @@ function a(e, t) {
|
|
|
44
50
|
window.history.replaceState(null, "", i);
|
|
45
51
|
}
|
|
46
52
|
//#endregion
|
|
47
|
-
export {
|
|
53
|
+
export { r as filterEmptyValues, n as getDefaultFilters, t as getFilterParams, o as writeFilterParams };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"admins-components77.js","names":[],"sources":["../src/utils/
|
|
1
|
+
{"version":3,"file":"admins-components77.js","names":[],"sources":["../src/utils/dataFilters.ts"],"sourcesContent":["import type { FilterItem } from '@/components/data-table/DataFilters.vue'\nimport { parseDropdownValue } from '@/utils/filterDisplay'\n\nexport function getFilterParams(items: FilterItem[]): Record<string, unknown> | null {\n const params = new URLSearchParams(window.location.search)\n const result: Record<string, unknown> = {}\n\n for (const item of items) {\n if (item.type === 'separator') continue\n\n const raw = window.location.search ? params.get(item.key) : null\n result[item.key] =\n raw === null ? (item.value ?? null) : parseFilterValue(item.type, raw, item.value)\n }\n return result\n}\n\nexport function getDefaultFilters(items: FilterItem[]): Record<string, unknown> {\n const raw = getFilterParams(items) ?? {}\n const result: Record<string, unknown> = {}\n\n for (const item of items) {\n if (item.type === 'separator') continue\n const val = raw[item.key]\n\n if (item.transformer) {\n const t = item.transformer(val)\n if (t) Object.assign(result, t)\n } else {\n result[item.key] = val\n }\n }\n\n return filterEmptyValues(result)\n}\n\nexport function filterEmptyValues(filters: Record<string, any>): Record<string, any> {\n return Object.fromEntries(\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n Object.entries(filters).filter(([_, val]) => val !== null && val !== '' && val !== undefined),\n )\n}\n\n\nfunction parseFilterValue(type: FilterItem['type'], raw: string, fallback: unknown): unknown {\n if (type === 'number') {\n const n = Number(raw)\n return isNaN(n) ? (fallback ?? null) : n\n }\n if (type === 'date' || type === 'datetime') {\n return { utc: raw }\n }\n if (type === 'daterange' || type === 'datetimerange') {\n return parseRangeValue(raw, fallback)\n }\n if (type === 'dropdown') {\n return parseDropdownValue(raw)\n }\n if (type === 'checkbox') {\n return raw === 'true'\n }\n\n return raw\n}\n\nfunction parseRangeValue(raw: string, fallback: unknown): unknown {\n try {\n const parsed = JSON.parse(raw)\n if (parsed && typeof parsed === 'object' && 'local' in parsed && parsed.local) {\n parsed.local = new Date(parsed.local)\n }\n return parsed\n } catch {\n return fallback ?? null\n }\n}\n\nexport function writeFilterParams(items: FilterItem[], vals: Record<string, unknown>) {\n const params = new URLSearchParams(window.location.search)\n for (const item of items) {\n if (item.type === 'separator') continue\n const v = vals[item.key]\n if (v === null || v === undefined || v === '') {\n params.delete(item.key)\n } else if (item.type === 'date' || item.type === 'datetime') {\n params.set(item.key, (v as { utc: string }).utc)\n } else if (typeof v === 'object') {\n params.set(item.key, JSON.stringify(v))\n } else {\n params.set(item.key, String(v))\n }\n }\n const qs = params.toString()\n const url = window.location.pathname + (qs ? `?${qs}` : '')\n window.history.replaceState(null, '', url)\n}\n"],"mappings":";;AAGA,SAAgB,EAAgB,GAAqD;CACnF,IAAM,IAAS,IAAI,gBAAgB,OAAO,SAAS,MAAM,GACnD,IAAkC,CAAC;CAEzC,KAAK,IAAM,KAAQ,GAAO;EACxB,IAAI,EAAK,SAAS,aAAa;EAE/B,IAAM,IAAM,OAAO,SAAS,SAAS,EAAO,IAAI,EAAK,GAAG,IAAI;EAC5D,EAAO,EAAK,OACV,MAAQ,OAAQ,EAAK,SAAS,OAAQ,EAAiB,EAAK,MAAM,GAAK,EAAK,KAAK;CACrF;CACA,OAAO;AACT;AAEA,SAAgB,EAAkB,GAA8C;CAC9E,IAAM,IAAM,EAAgB,CAAK,KAAK,CAAC,GACjC,IAAkC,CAAC;CAEzC,KAAK,IAAM,KAAQ,GAAO;EACxB,IAAI,EAAK,SAAS,aAAa;EAC/B,IAAM,IAAM,EAAI,EAAK;EAErB,IAAI,EAAK,aAAa;GACpB,IAAM,IAAI,EAAK,YAAY,CAAG;GAC9B,AAAI,KAAG,OAAO,OAAO,GAAQ,CAAC;EAChC,OACE,EAAO,EAAK,OAAO;CAEvB;CAEA,OAAO,EAAkB,CAAM;AACjC;AAEA,SAAgB,EAAkB,GAAmD;CACnF,OAAO,OAAO,YAEZ,OAAO,QAAQ,CAAO,EAAE,QAAQ,CAAC,GAAG,OAAS,MAAQ,QAAQ,MAAQ,MAAM,MAAQ,KAAA,CAAS,CAC9F;AACF;AAGA,SAAS,EAAiB,GAA0B,GAAa,GAA4B;CAC3F,IAAI,MAAS,UAAU;EACrB,IAAM,IAAI,OAAO,CAAG;EACpB,OAAO,MAAM,CAAC,IAAK,KAAY,OAAQ;CACzC;CAcA,OAbI,MAAS,UAAU,MAAS,aACvB,EAAE,KAAK,EAAI,IAEhB,MAAS,eAAe,MAAS,kBAC5B,EAAgB,GAAK,CAAQ,IAElC,MAAS,aACJ,EAAmB,CAAG,IAE3B,MAAS,aACJ,MAAQ,SAGV;AACT;AAEA,SAAS,EAAgB,GAAa,GAA4B;CAChE,IAAI;EACF,IAAM,IAAS,KAAK,MAAM,CAAG;EAI7B,OAHI,KAAU,OAAO,KAAW,YAAY,WAAW,KAAU,EAAO,UACtE,EAAO,QAAQ,IAAI,KAAK,EAAO,KAAK,IAE/B;CACT,QAAQ;EACN,OAAO,KAAY;CACrB;AACF;AAEA,SAAgB,EAAkB,GAAqB,GAA+B;CACpF,IAAM,IAAS,IAAI,gBAAgB,OAAO,SAAS,MAAM;CACzD,KAAK,IAAM,KAAQ,GAAO;EACxB,IAAI,EAAK,SAAS,aAAa;EAC/B,IAAM,IAAI,EAAK,EAAK;EACpB,AAAI,KAAM,QAA2B,MAAM,KACzC,EAAO,OAAO,EAAK,GAAG,IACb,EAAK,SAAS,UAAU,EAAK,SAAS,aAC/C,EAAO,IAAI,EAAK,KAAM,EAAsB,GAAG,IACtC,OAAO,KAAM,WACtB,EAAO,IAAI,EAAK,KAAK,KAAK,UAAU,CAAC,CAAC,IAEtC,EAAO,IAAI,EAAK,KAAK,OAAO,CAAC,CAAC;CAElC;CACA,IAAM,IAAK,EAAO,SAAS,GACrB,IAAM,OAAO,SAAS,YAAY,IAAK,IAAI,MAAO;CACxD,OAAO,QAAQ,aAAa,MAAM,IAAI,CAAG;AAC3C"}
|
|
@@ -6,31 +6,31 @@ import i from "./admins-components22.js";
|
|
|
6
6
|
import a from "./admins-components27.js";
|
|
7
7
|
import o from "./admins-components75.js";
|
|
8
8
|
import { debounce as s } from "./admins-components76.js";
|
|
9
|
-
import {
|
|
10
|
-
import { Fragment as
|
|
9
|
+
import { filterEmptyValues as c, getFilterParams as l, writeFilterParams as u } from "./admins-components77.js";
|
|
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
|
|
12
|
+
var O = { class: "data-filters" }, k = {
|
|
13
13
|
key: 0,
|
|
14
14
|
class: "data-filters__separator"
|
|
15
|
-
},
|
|
15
|
+
}, A = ["for"], j = [
|
|
16
16
|
"placeholder",
|
|
17
17
|
"value",
|
|
18
18
|
"id",
|
|
19
19
|
"onInput"
|
|
20
|
-
],
|
|
20
|
+
], M = [
|
|
21
21
|
"placeholder",
|
|
22
22
|
"value",
|
|
23
23
|
"id",
|
|
24
24
|
"onInput"
|
|
25
|
-
],
|
|
25
|
+
], N = [
|
|
26
26
|
"placeholder",
|
|
27
27
|
"value",
|
|
28
28
|
"id",
|
|
29
29
|
"onInput"
|
|
30
|
-
],
|
|
30
|
+
], P = { class: "data-filters__footer" }, F = {
|
|
31
31
|
key: 0,
|
|
32
32
|
class: "separator my-3"
|
|
33
|
-
},
|
|
33
|
+
}, I = /* @__PURE__ */ _({
|
|
34
34
|
__name: "DataFilters",
|
|
35
35
|
props: {
|
|
36
36
|
open: {
|
|
@@ -54,71 +54,79 @@ var D = { class: "data-filters" }, O = {
|
|
|
54
54
|
storageKey: {}
|
|
55
55
|
},
|
|
56
56
|
emits: ["close", "change"],
|
|
57
|
-
setup(
|
|
58
|
-
let
|
|
59
|
-
function
|
|
60
|
-
t ?
|
|
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];
|
|
61
61
|
}
|
|
62
|
-
function
|
|
62
|
+
function U(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
|
|
69
|
+
function W(e) {
|
|
70
70
|
return {
|
|
71
71
|
...e.config ?? {},
|
|
72
72
|
...e.fullWidth ? {} : { compact: !0 },
|
|
73
73
|
showTime: e.type === "datetimerange"
|
|
74
74
|
};
|
|
75
75
|
}
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
y(() => {
|
|
82
|
-
if (!L.handleUrl) return;
|
|
83
|
-
let e = c(L.items);
|
|
84
|
-
Object.keys(e).length > 0 && (z.value = {
|
|
85
|
-
...z.value,
|
|
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,
|
|
86
81
|
...e
|
|
87
82
|
});
|
|
88
83
|
});
|
|
89
|
-
function G(e) {
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
function K(e, t) {
|
|
93
|
-
z.value = {
|
|
94
|
-
...z.value,
|
|
84
|
+
function G(e, t) {
|
|
85
|
+
B.value = {
|
|
86
|
+
...B.value,
|
|
95
87
|
[e]: t
|
|
96
|
-
},
|
|
88
|
+
}, R.lazy || (R.handleUrl && u(R.items, B.value), z("change", K()));
|
|
89
|
+
}
|
|
90
|
+
function K() {
|
|
91
|
+
let e = R.items.reduce((e, t) => {
|
|
92
|
+
let n = B.value[t.key];
|
|
93
|
+
return t.transformer ? {
|
|
94
|
+
...e,
|
|
95
|
+
...t.transformer(n) ?? {}
|
|
96
|
+
} : {
|
|
97
|
+
...e,
|
|
98
|
+
[t.key]: n
|
|
99
|
+
};
|
|
100
|
+
}, {});
|
|
101
|
+
return {
|
|
102
|
+
values: c(B.value),
|
|
103
|
+
transformed: c(e)
|
|
104
|
+
};
|
|
97
105
|
}
|
|
98
106
|
let q = s((e, t) => {
|
|
99
|
-
|
|
107
|
+
G(e, t);
|
|
100
108
|
});
|
|
101
109
|
function J() {
|
|
102
|
-
|
|
110
|
+
R.handleUrl && u(R.items, B.value), z("change", K()), z("close");
|
|
103
111
|
}
|
|
104
112
|
function Y() {
|
|
105
|
-
|
|
113
|
+
B.value = {}, R.handleUrl && u(R.items, B.value), z("change", K());
|
|
106
114
|
}
|
|
107
|
-
let X =
|
|
108
|
-
|
|
115
|
+
let X = S(!1);
|
|
116
|
+
E(B, (e) => {
|
|
109
117
|
X.value = Object.values(e).some((e) => e !== null && e !== "" && e !== void 0);
|
|
110
118
|
}, {
|
|
111
119
|
deep: !0,
|
|
112
120
|
immediate: !0
|
|
113
121
|
});
|
|
114
122
|
function Z(e) {
|
|
115
|
-
|
|
116
|
-
...
|
|
123
|
+
B.value = {
|
|
124
|
+
...B.value,
|
|
117
125
|
[e]: null
|
|
118
|
-
},
|
|
126
|
+
}, R.handleUrl && u(R.items, B.value), z("change", K());
|
|
119
127
|
}
|
|
120
128
|
function Q(e) {
|
|
121
|
-
let t =
|
|
129
|
+
let t = V.value[e];
|
|
122
130
|
if (t) {
|
|
123
131
|
if (typeof t.focusAndOpen == "function") {
|
|
124
132
|
t.focusAndOpen();
|
|
@@ -128,93 +136,93 @@ var D = { class: "data-filters" }, O = {
|
|
|
128
136
|
}
|
|
129
137
|
}
|
|
130
138
|
function $(e) {
|
|
131
|
-
let t = { ...
|
|
132
|
-
for (let n of
|
|
133
|
-
|
|
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());
|
|
134
142
|
}
|
|
135
|
-
return
|
|
143
|
+
return I({
|
|
136
144
|
clearFilter: Z,
|
|
137
145
|
focusFilter: Q
|
|
138
|
-
}), (s, c) => (
|
|
139
|
-
open:
|
|
146
|
+
}), (s, c) => (x(), f(a, {
|
|
147
|
+
open: _.open,
|
|
140
148
|
title: "Szűrők",
|
|
141
|
-
position:
|
|
142
|
-
onClose: c[0] ||= (e) =>
|
|
149
|
+
position: _.position,
|
|
150
|
+
onClose: c[0] ||= (e) => z("close")
|
|
143
151
|
}, {
|
|
144
|
-
default:
|
|
145
|
-
|
|
152
|
+
default: D(() => [
|
|
153
|
+
h("div", O, [(x(!0), m(d, null, C(_.items, (e) => (x(), m("div", {
|
|
146
154
|
key: e.key,
|
|
147
|
-
class:
|
|
148
|
-
}, [e.type === "separator" ? (
|
|
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({
|
|
149
157
|
key: 1,
|
|
150
158
|
ref_for: !0,
|
|
151
|
-
ref: (t) =>
|
|
152
|
-
"model-value":
|
|
159
|
+
ref: (t) => H(e.key, t),
|
|
160
|
+
"model-value": B.value[e.key] ?? !1,
|
|
153
161
|
label: e.label ?? e.key,
|
|
154
|
-
"onUpdate:modelValue": (t) =>
|
|
162
|
+
"onUpdate:modelValue": (t) => G(e.key, t)
|
|
155
163
|
}, { ref_for: !0 }, e.config), null, 16, [
|
|
156
164
|
"model-value",
|
|
157
165
|
"label",
|
|
158
166
|
"onUpdate:modelValue"
|
|
159
|
-
])) : (
|
|
167
|
+
])) : (x(), m(d, { key: 2 }, [h("label", {
|
|
160
168
|
class: "c-label",
|
|
161
169
|
for: `df-${e.key}`
|
|
162
|
-
},
|
|
170
|
+
}, w(e.label ?? e.key), 9, A), e.type === "text" ? (x(), m("input", v({
|
|
163
171
|
key: 0,
|
|
164
172
|
type: "text",
|
|
165
173
|
class: "c-input-row",
|
|
166
174
|
placeholder: e.placeholder,
|
|
167
|
-
value:
|
|
175
|
+
value: B.value[e.key] ?? "",
|
|
168
176
|
ref_for: !0,
|
|
169
|
-
ref: (t) =>
|
|
177
|
+
ref: (t) => H(e.key, t),
|
|
170
178
|
id: `df-${e.key}`,
|
|
171
|
-
onInput: (t) =>
|
|
172
|
-
}, { ref_for: !0 }, e.config), null, 16,
|
|
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({
|
|
173
181
|
key: 1,
|
|
174
182
|
class: "c-input-row data-filters__textarea",
|
|
175
183
|
placeholder: e.placeholder,
|
|
176
|
-
value:
|
|
184
|
+
value: B.value[e.key] ?? "",
|
|
177
185
|
ref_for: !0,
|
|
178
|
-
ref: (t) =>
|
|
186
|
+
ref: (t) => H(e.key, t),
|
|
179
187
|
id: `df-${e.key}`
|
|
180
|
-
}, { ref_for: !0 }, e.config, { onInput: (t) =>
|
|
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({
|
|
181
189
|
key: 2,
|
|
182
190
|
type: "number",
|
|
183
191
|
class: "c-input-row",
|
|
184
192
|
placeholder: e.placeholder,
|
|
185
|
-
value:
|
|
193
|
+
value: B.value[e.key] ?? "",
|
|
186
194
|
ref_for: !0,
|
|
187
|
-
ref: (t) =>
|
|
195
|
+
ref: (t) => H(e.key, t),
|
|
188
196
|
id: `df-${e.key}`
|
|
189
|
-
}, { ref_for: !0 }, e.config, { onInput: (t) =>
|
|
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, {
|
|
190
198
|
key: 3,
|
|
191
199
|
ref_for: !0,
|
|
192
|
-
ref: (t) =>
|
|
200
|
+
ref: (t) => H(e.key, t),
|
|
193
201
|
id: `df-${e.key}`,
|
|
194
|
-
"model-value":
|
|
195
|
-
config:
|
|
196
|
-
"onUpdate:modelValue": (t) =>
|
|
202
|
+
"model-value": B.value[e.key] ?? null,
|
|
203
|
+
config: U(e),
|
|
204
|
+
"onUpdate:modelValue": (t) => G(e.key, t)
|
|
197
205
|
}, null, 8, [
|
|
198
206
|
"id",
|
|
199
207
|
"model-value",
|
|
200
208
|
"config",
|
|
201
209
|
"onUpdate:modelValue"
|
|
202
|
-
])) : e.type === "daterange" || e.type === "datetimerange" ? (
|
|
210
|
+
])) : e.type === "daterange" || e.type === "datetimerange" ? (x(), f(r, {
|
|
203
211
|
key: 4,
|
|
204
212
|
ref_for: !0,
|
|
205
|
-
ref: (t) =>
|
|
206
|
-
"model-value":
|
|
207
|
-
config:
|
|
208
|
-
"onUpdate:modelValue": (t) =>
|
|
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)
|
|
209
217
|
}, null, 8, [
|
|
210
218
|
"model-value",
|
|
211
219
|
"config",
|
|
212
220
|
"onUpdate:modelValue"
|
|
213
|
-
])) : e.type === "dropdown" ? (
|
|
221
|
+
])) : e.type === "dropdown" ? (x(), f(i, {
|
|
214
222
|
key: 5,
|
|
215
223
|
ref_for: !0,
|
|
216
|
-
ref: (t) =>
|
|
217
|
-
"model-value":
|
|
224
|
+
ref: (t) => H(e.key, t),
|
|
225
|
+
"model-value": B.value[e.key] ?? null,
|
|
218
226
|
options: e.options ?? [],
|
|
219
227
|
config: {
|
|
220
228
|
...e.config ?? {},
|
|
@@ -222,43 +230,43 @@ var D = { class: "data-filters" }, O = {
|
|
|
222
230
|
clearable: !0,
|
|
223
231
|
filterable: !0
|
|
224
232
|
},
|
|
225
|
-
"onUpdate:modelValue": (t) =>
|
|
233
|
+
"onUpdate:modelValue": (t) => G(e.key, t)
|
|
226
234
|
}, null, 8, [
|
|
227
235
|
"model-value",
|
|
228
236
|
"options",
|
|
229
237
|
"config",
|
|
230
238
|
"onUpdate:modelValue"
|
|
231
|
-
])) :
|
|
232
|
-
|
|
239
|
+
])) : p("", !0)], 64))], 2))), 128))]),
|
|
240
|
+
h("div", P, [g(e, {
|
|
233
241
|
icon: "fa-solid fa-trash-can",
|
|
234
242
|
disabled: !X.value,
|
|
235
243
|
label: "Szűrők törlése",
|
|
236
244
|
"aria-label": "Szűrők törlése",
|
|
237
245
|
size: "small",
|
|
238
246
|
onClick: Y
|
|
239
|
-
}, null, 8, ["disabled"]),
|
|
247
|
+
}, null, 8, ["disabled"]), g(e, {
|
|
240
248
|
label: "Szűrés",
|
|
241
249
|
"aria-label": "Szűrés",
|
|
242
250
|
type: "success",
|
|
243
251
|
onClick: J
|
|
244
252
|
})]),
|
|
245
|
-
|
|
246
|
-
|
|
253
|
+
_.historyEnabled ? (x(), m("hr", F)) : p("", !0),
|
|
254
|
+
_.historyEnabled ? (x(), f(o, {
|
|
247
255
|
key: 1,
|
|
248
|
-
items:
|
|
249
|
-
values:
|
|
250
|
-
"storage-key":
|
|
256
|
+
items: _.items,
|
|
257
|
+
values: B.value,
|
|
258
|
+
"storage-key": _.storageKey,
|
|
251
259
|
onLoad: $,
|
|
252
260
|
onChange: $
|
|
253
261
|
}, null, 8, [
|
|
254
262
|
"items",
|
|
255
263
|
"values",
|
|
256
264
|
"storage-key"
|
|
257
|
-
])) :
|
|
265
|
+
])) : p("", !0)
|
|
258
266
|
]),
|
|
259
267
|
_: 1
|
|
260
268
|
}, 8, ["open", "position"]));
|
|
261
269
|
}
|
|
262
270
|
});
|
|
263
271
|
//#endregion
|
|
264
|
-
export {
|
|
272
|
+
export { I 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'\nimport { getFilterParams } from '@/utils/filterUrlSync'\n\nexport { getFilterParams }\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}\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 { readUrlFilterParams, writeFilterParams } from '@/utils/filterUrlSync'\nimport type { DatePickerConfig, DateRangePickerConfig } from '@/types/datepickers'\nimport type { FilterItemType, PickedDate, PickedUtcRange } from '@/types/types'\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: [filters: Record<string, any>]\n}>()\n\nconst values = ref<Record<string, any>>(getDefaults())\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\nfunction getDefaults(value: any = null): Record<string, any> {\n const defaults: Record<string, any> = {}\n for (const item of props.items) {\n if (item.type === 'separator') continue\n defaults[item.key] = item.value ?? value\n }\n return defaults\n}\n\nonMounted(() => {\n if (!props.handleUrl) return\n const fromUrl = readUrlFilterParams(props.items)\n if (Object.keys(fromUrl).length > 0) {\n values.value = { ...values.value, ...fromUrl }\n }\n})\nfunction filterEmptyValues(filters: Record<string, any>): Record<string, any> {\n return Object.fromEntries(\n Object.entries(filters).filter(([_, val]) => val !== null && val !== '' && val !== undefined),\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', filterEmptyValues(values.value))\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 emit('change', filterEmptyValues(values.value))\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', filterEmptyValues(values.value))\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', filterEmptyValues(values.value))\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', filterEmptyValues(values.value))\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'\nexport { getFilterParams, getDefaultFilters, filterEmptyValues } from '@/utils/dataFilters'\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 { filterEmptyValues, getFilterParams, writeFilterParams } from '@/utils/dataFilters'\nimport type { DatePickerConfig, DateRangePickerConfig } from '@/types/datepickers'\nimport type { FilterItemType, PickedDate, PickedUtcRange } from '@/types/types'\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 +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'\nimport { getFilterParams } from '@/utils/filterUrlSync'\n\nexport { getFilterParams }\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}\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 { readUrlFilterParams, writeFilterParams } from '@/utils/filterUrlSync'\nimport type { DatePickerConfig, DateRangePickerConfig } from '@/types/datepickers'\nimport type { FilterItemType, PickedDate, PickedUtcRange } from '@/types/types'\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: [filters: Record<string, any>]\n}>()\n\nconst values = ref<Record<string, any>>(getDefaults())\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\nfunction getDefaults(value: any = null): Record<string, any> {\n const defaults: Record<string, any> = {}\n for (const item of props.items) {\n if (item.type === 'separator') continue\n defaults[item.key] = item.value ?? value\n }\n return defaults\n}\n\nonMounted(() => {\n if (!props.handleUrl) return\n const fromUrl = readUrlFilterParams(props.items)\n if (Object.keys(fromUrl).length > 0) {\n values.value = { ...values.value, ...fromUrl }\n }\n})\nfunction filterEmptyValues(filters: Record<string, any>): Record<string, any> {\n return Object.fromEntries(\n Object.entries(filters).filter(([_, val]) => val !== null && val !== '' && val !== undefined),\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', filterEmptyValues(values.value))\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 emit('change', filterEmptyValues(values.value))\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', filterEmptyValues(values.value))\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', filterEmptyValues(values.value))\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', filterEmptyValues(values.value))\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'\nexport { getFilterParams, getDefaultFilters, filterEmptyValues } from '@/utils/dataFilters'\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 { filterEmptyValues, getFilterParams, writeFilterParams } from '@/utils/dataFilters'\nimport type { DatePickerConfig, DateRangePickerConfig } from '@/types/datepickers'\nimport type { FilterItemType, PickedDate, PickedUtcRange } from '@/types/types'\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":""}
|
|
@@ -88,7 +88,7 @@ var S = { class: "ac-component" }, C = { class: "flex-center gap-2 mb-3 wrap-on-
|
|
|
88
88
|
}, 300);
|
|
89
89
|
}
|
|
90
90
|
function K(e) {
|
|
91
|
-
B.value = e, k("filter-change", e);
|
|
91
|
+
B.value = e.values, k("filter-change", e.transformed);
|
|
92
92
|
}
|
|
93
93
|
let q = u(() => Object.values(B.value).filter((e) => e != null && e !== "").length), J = u(() => !!O.pagination && (O.items.length > 0 || !O.loading));
|
|
94
94
|
return (a, u) => (b(), p("div", S, [m("div", {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"admins-components87.js","names":[],"sources":["../src/components/data-table/DataList.vue"],"sourcesContent":["<script lang=\"ts\">\nexport { getDefaultPaginator } from '@/components/data-table/DataPaginator.vue'\nexport type { PaginatorSettings } from '@/types/data-list'\n\nexport interface DataListProps {\n config: DataListConfig\n items: Record<string, unknown>[]\n settings?: Partial<DataListSettings>\n id: string\n layoutBreakpoint?: number\n orderable?: boolean\n pagination?: PaginatorSettings\n filters?: FilterItem[]\n historyEnabled?: boolean\n loading?: boolean\n handleUrl?: boolean\n}\n\nexport const dataListDefaults = {\n layoutBreakpoint: 768,\n orderable: true,\n historyEnabled: true,\n loading: false,\n handleUrl: false,\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { ref, computed, onMounted, onBeforeUnmount } from 'vue'\nimport DataTable from '@/components/data-table/DataTable.vue'\nimport DataCards from '@/components/data-table/DataCards.vue'\nimport DataListOptions from '@/components/data-table/DataListOptions.vue'\nimport DataPaginator from '@/components/data-table/DataPaginator.vue'\nimport Button from '@/components/Button.vue'\nimport type {\n DataListConfig,\n DataListSettings,\n PageSettings,\n PaginatorSettings,\n} from '@/types/data-list'\nimport type { FilterValue } from '@/types/data-list'\nimport DataFilters, {\n getFilterParams,\n type FilterItem,\n} from '@/components/data-table/DataFilters.vue'\nimport FilterTags from '@/components/data-table/FilterTags.vue'\nimport DataListGuide from '@/components/data-table/DataListGuide.vue'\n\nconst dataFiltersRef = ref<InstanceType<typeof DataFilters> | null>(null)\n\nconst props = withDefaults(defineProps<DataListProps>(), {\n ...dataListDefaults,\n})\n\nconst emit = defineEmits<{\n 'filter-change': [filters: Record<string, FilterValue>]\n 'selection-change': [selected: unknown[]]\n 'settings-change': [settings: DataListSettings]\n 'pagination-change': [pagination: PageSettings]\n 'sort-change': [sort: { key: string; direction: 'asc' | 'desc' }]\n}>()\n\nconst showOptions = ref(false)\nconst showGuide = ref(false)\nconst resolvedSettings = ref<DataListSettings | null>(null)\nconst isMobile = ref(false)\nconst root = ref<HTMLElement | null>(null)\nconst showFilters = ref(false)\n\nconst hasTextFilter = computed(() =>\n props.filters?.some((item) => item.type === 'text' || item.type === 'textarea'),\n)\n\nconst exactMatchFilterItem: FilterItem = {\n type: 'checkbox',\n key: 'exactMatch',\n label: 'Pontos egyezés',\n fullWidth: true,\n config: {\n labelAlignmentFix: true,\n },\n displayClass: 'highlight-chip',\n}\n\nfunction ensureExactMatchItem(items: FilterItem[]): FilterItem[] {\n if (!hasTextFilter.value) return items\n if (items.some((i) => i.key === 'exactMatch')) return items\n\n return [exactMatchFilterItem, ...items]\n}\n\nconst resolvedFilters = computed<FilterItem[]>(() => ensureExactMatchItem(props.filters ?? []))\n\nconst activeFilters = ref<Record<string, any>>(\n props.filters ? (getFilterParams(resolvedFilters.value) ?? {}) : {},\n)\n\nlet resizeObserver: ResizeObserver | null = null\n\nonMounted(() => {\n resizeObserver = new ResizeObserver((entries) => {\n isMobile.value = (entries[0]?.contentRect.width ?? 0) < props.layoutBreakpoint\n })\n if (root.value) resizeObserver.observe(root.value)\n})\n\nonBeforeUnmount(() => resizeObserver?.disconnect())\n\nconst effectiveLayout = computed<'table' | 'cards'>(() => {\n const layout = resolvedSettings.value?.layout\n if (layout === 'table' || layout === 'cards') return layout\n return isMobile.value ? 'cards' : 'table'\n})\n\nconst internalConfig = computed<DataListConfig>(() => {\n if (!resolvedSettings.value) return props.config\n const order = resolvedSettings.value.columnOrder\n const mapped = props.config.columns.map((c) => ({\n ...c,\n visible: resolvedSettings.value!.columns[c.property] ?? c.visible !== false,\n }))\n if (order?.length) {\n mapped.sort((a, b) => {\n const ai = order.indexOf(a.property)\n const bi = order.indexOf(b.property)\n return (ai === -1 ? 999 : ai) - (bi === -1 ? 999 : bi)\n })\n }\n return { ...props.config, columns: mapped }\n})\n\nfunction onSettingsChange(s: DataListSettings) {\n resolvedSettings.value = s\n emit('settings-change', s)\n}\n\ndefineExpose({\n openOptions: () => (showOptions.value = true),\n closeOptions: () => (showOptions.value = false),\n openFilters: () => (showFilters.value = true),\n closeFilters: () => (showFilters.value = false),\n})\n\nasync function openFilter(key: string) {\n showFilters.value = true\n setTimeout(() => {\n dataFiltersRef.value?.focusFilter(key)\n }, 300)\n}\n\nfunction onFilterChange(values: Record<string, any>) {\n activeFilters.value = values\n emit('filter-change', values)\n}\n\nconst activeFiltersCount = computed(\n () => Object.values(activeFilters.value).filter((v) => v != null && v !== '').length,\n)\n\nconst showPaginator = computed(\n () => !!props.pagination && (props.items.length > 0 || !props.loading),\n)\n</script>\n\n<template>\n <div class=\"ac-component\">\n <div ref=\"root\" class=\"c-data-list\">\n <template v-if=\"resolvedFilters && resolvedFilters.length > 0\">\n <div class=\"flex-center gap-2 mb-3 wrap-on-small\">\n <Button\n label=\"Szűrők megnyitása\"\n icon=\"fa-solid fa-filter\"\n @click=\"showFilters = true\"\n style=\"flex-shrink: 0\"\n :type=\"activeFiltersCount > 0 ? 'info' : 'normal'\"\n :indicator=\"activeFiltersCount > 0 ? activeFiltersCount : undefined\"\n />\n <div class=\"flex-center gap-1\">\n <FilterTags\n :filters=\"activeFilters\"\n :items=\"resolvedFilters\"\n @remove=\"(key: string) => dataFiltersRef?.clearFilter(key)\"\n @openFilter=\"openFilter\"\n />\n </div>\n </div>\n <DataFilters\n ref=\"dataFiltersRef\"\n :open=\"showFilters\"\n :items=\"resolvedFilters\"\n lazy\n :handle-url=\"handleUrl\"\n :storage-key=\"id\"\n @close=\"showFilters = false\"\n @change=\"onFilterChange\"\n />\n </template>\n\n <div class=\"c-data-list__toolbar\">\n <Button\n label=\"Beállítások\"\n icon=\"fa-solid fa-gear\"\n class=\"c-data-list__toolbar__item\"\n size=\"small\"\n @click=\"showOptions = true\"\n />\n <Button\n label=\"Súgó\"\n icon=\"fa-solid fa-question\"\n icon-position=\"right\"\n class=\"c-data-list__toolbar__item ml-auto\"\n label-alignment-fix\n size=\"small\"\n @click=\"showGuide = true\"\n />\n </div>\n <DataListGuide :open=\"showGuide\" @close=\"showGuide = false\" />\n <DataTable\n v-if=\"effectiveLayout === 'table'\"\n :config=\"internalConfig\"\n :loading=\"loading\"\n :items=\"items\"\n :settings=\"resolvedSettings ?? undefined\"\n @filter-change=\"emit('filter-change', $event)\"\n @selection-change=\"emit('selection-change', $event)\"\n @sort-change=\"emit('sort-change', $event)\"\n />\n\n <DataCards\n v-else\n :config=\"internalConfig\"\n :loading=\"loading\"\n :items=\"items\"\n :settings=\"resolvedSettings ?? undefined\"\n @selection-change=\"emit('selection-change', $event)\"\n />\n\n <DataPaginator\n v-if=\"pagination && showPaginator\"\n :settings=\"pagination\"\n :storage-key=\"id\"\n @update:pagination=\"emit('pagination-change', $event)\"\n />\n\n <DataListOptions\n :open=\"showOptions\"\n :columns=\"config.columns\"\n :settings=\"settings ?? {}\"\n :storage-key=\"id\"\n :orderable=\"orderable\"\n @close=\"showOptions = false\"\n @change=\"onSettingsChange\"\n />\n </div>\n </div>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/data-table/data-list.scss\"></style>\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"admins-components87.js","names":[],"sources":["../src/components/data-table/DataList.vue"],"sourcesContent":["<script lang=\"ts\">\nexport { getDefaultPaginator } from '@/components/data-table/DataPaginator.vue'\nexport type { PaginatorSettings } from '@/types/data-list'\n\nexport interface DataListProps {\n config: DataListConfig\n items: Record<string, unknown>[]\n settings?: Partial<DataListSettings>\n id: string\n layoutBreakpoint?: number\n orderable?: boolean\n pagination?: PaginatorSettings\n filters?: FilterItem[]\n historyEnabled?: boolean\n loading?: boolean\n handleUrl?: boolean\n}\n\nexport const dataListDefaults = {\n layoutBreakpoint: 768,\n orderable: true,\n historyEnabled: true,\n loading: false,\n handleUrl: false,\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { ref, computed, onMounted, onBeforeUnmount } from 'vue'\nimport DataTable from '@/components/data-table/DataTable.vue'\nimport DataCards from '@/components/data-table/DataCards.vue'\nimport DataListOptions from '@/components/data-table/DataListOptions.vue'\nimport DataPaginator from '@/components/data-table/DataPaginator.vue'\nimport Button from '@/components/Button.vue'\nimport type {\n DataListConfig,\n DataListSettings,\n PageSettings,\n PaginatorSettings,\n} from '@/types/data-list'\nimport type { FilterValue } from '@/types/data-list'\nimport DataFilters, {\n getFilterParams,\n type FilterItem,\n type FilterResponse,\n} from '@/components/data-table/DataFilters.vue'\nimport FilterTags from '@/components/data-table/FilterTags.vue'\nimport DataListGuide from '@/components/data-table/DataListGuide.vue'\n\nconst dataFiltersRef = ref<InstanceType<typeof DataFilters> | null>(null)\n\nconst props = withDefaults(defineProps<DataListProps>(), {\n ...dataListDefaults,\n})\n\nconst emit = defineEmits<{\n 'filter-change': [filters: Record<string, FilterValue>]\n 'selection-change': [selected: unknown[]]\n 'settings-change': [settings: DataListSettings]\n 'pagination-change': [pagination: PageSettings]\n 'sort-change': [sort: { key: string; direction: 'asc' | 'desc' }]\n}>()\n\nconst showOptions = ref(false)\nconst showGuide = ref(false)\nconst resolvedSettings = ref<DataListSettings | null>(null)\nconst isMobile = ref(false)\nconst root = ref<HTMLElement | null>(null)\nconst showFilters = ref(false)\n\nconst hasTextFilter = computed(() =>\n props.filters?.some((item) => item.type === 'text' || item.type === 'textarea'),\n)\n\nconst exactMatchFilterItem: FilterItem = {\n type: 'checkbox',\n key: 'exactMatch',\n label: 'Pontos egyezés',\n fullWidth: true,\n config: {\n labelAlignmentFix: true,\n },\n displayClass: 'highlight-chip',\n}\n\nfunction ensureExactMatchItem(items: FilterItem[]): FilterItem[] {\n if (!hasTextFilter.value) return items\n if (items.some((i) => i.key === 'exactMatch')) return items\n\n return [exactMatchFilterItem, ...items]\n}\n\nconst resolvedFilters = computed<FilterItem[]>(() => ensureExactMatchItem(props.filters ?? []))\n\nconst activeFilters = ref<Record<string, any>>(\n props.filters ? (getFilterParams(resolvedFilters.value) ?? {}) : {},\n)\n\nlet resizeObserver: ResizeObserver | null = null\n\nonMounted(() => {\n resizeObserver = new ResizeObserver((entries) => {\n isMobile.value = (entries[0]?.contentRect.width ?? 0) < props.layoutBreakpoint\n })\n if (root.value) resizeObserver.observe(root.value)\n})\n\nonBeforeUnmount(() => resizeObserver?.disconnect())\n\nconst effectiveLayout = computed<'table' | 'cards'>(() => {\n const layout = resolvedSettings.value?.layout\n if (layout === 'table' || layout === 'cards') return layout\n return isMobile.value ? 'cards' : 'table'\n})\n\nconst internalConfig = computed<DataListConfig>(() => {\n if (!resolvedSettings.value) return props.config\n const order = resolvedSettings.value.columnOrder\n const mapped = props.config.columns.map((c) => ({\n ...c,\n visible: resolvedSettings.value!.columns[c.property] ?? c.visible !== false,\n }))\n if (order?.length) {\n mapped.sort((a, b) => {\n const ai = order.indexOf(a.property)\n const bi = order.indexOf(b.property)\n return (ai === -1 ? 999 : ai) - (bi === -1 ? 999 : bi)\n })\n }\n return { ...props.config, columns: mapped }\n})\n\nfunction onSettingsChange(s: DataListSettings) {\n resolvedSettings.value = s\n emit('settings-change', s)\n}\n\ndefineExpose({\n openOptions: () => (showOptions.value = true),\n closeOptions: () => (showOptions.value = false),\n openFilters: () => (showFilters.value = true),\n closeFilters: () => (showFilters.value = false),\n})\n\nasync function openFilter(key: string) {\n showFilters.value = true\n setTimeout(() => {\n dataFiltersRef.value?.focusFilter(key)\n }, 300)\n}\n\nfunction onFilterChange(response: FilterResponse) {\n activeFilters.value = response.values\n emit('filter-change', response.transformed)\n}\n\nconst activeFiltersCount = computed(\n () => Object.values(activeFilters.value).filter((v) => v != null && v !== '').length,\n)\n\nconst showPaginator = computed(\n () => !!props.pagination && (props.items.length > 0 || !props.loading),\n)\n</script>\n\n<template>\n <div class=\"ac-component\">\n <div ref=\"root\" class=\"c-data-list\">\n <template v-if=\"resolvedFilters && resolvedFilters.length > 0\">\n <div class=\"flex-center gap-2 mb-3 wrap-on-small\">\n <Button\n label=\"Szűrők megnyitása\"\n icon=\"fa-solid fa-filter\"\n @click=\"showFilters = true\"\n style=\"flex-shrink: 0\"\n :type=\"activeFiltersCount > 0 ? 'info' : 'normal'\"\n :indicator=\"activeFiltersCount > 0 ? activeFiltersCount : undefined\"\n />\n <div class=\"flex-center gap-1\">\n <FilterTags\n :filters=\"activeFilters\"\n :items=\"resolvedFilters\"\n @remove=\"(key: string) => dataFiltersRef?.clearFilter(key)\"\n @openFilter=\"openFilter\"\n />\n </div>\n </div>\n <DataFilters\n ref=\"dataFiltersRef\"\n :open=\"showFilters\"\n :items=\"resolvedFilters\"\n lazy\n :handle-url=\"handleUrl\"\n :storage-key=\"id\"\n @close=\"showFilters = false\"\n @change=\"onFilterChange\"\n />\n </template>\n\n <div class=\"c-data-list__toolbar\">\n <Button\n label=\"Beállítások\"\n icon=\"fa-solid fa-gear\"\n class=\"c-data-list__toolbar__item\"\n size=\"small\"\n @click=\"showOptions = true\"\n />\n <Button\n label=\"Súgó\"\n icon=\"fa-solid fa-question\"\n icon-position=\"right\"\n class=\"c-data-list__toolbar__item ml-auto\"\n label-alignment-fix\n size=\"small\"\n @click=\"showGuide = true\"\n />\n </div>\n <DataListGuide :open=\"showGuide\" @close=\"showGuide = false\" />\n <DataTable\n v-if=\"effectiveLayout === 'table'\"\n :config=\"internalConfig\"\n :loading=\"loading\"\n :items=\"items\"\n :settings=\"resolvedSettings ?? undefined\"\n @filter-change=\"emit('filter-change', $event)\"\n @selection-change=\"emit('selection-change', $event)\"\n @sort-change=\"emit('sort-change', $event)\"\n />\n\n <DataCards\n v-else\n :config=\"internalConfig\"\n :loading=\"loading\"\n :items=\"items\"\n :settings=\"resolvedSettings ?? undefined\"\n @selection-change=\"emit('selection-change', $event)\"\n />\n\n <DataPaginator\n v-if=\"pagination && showPaginator\"\n :settings=\"pagination\"\n :storage-key=\"id\"\n @update:pagination=\"emit('pagination-change', $event)\"\n />\n\n <DataListOptions\n :open=\"showOptions\"\n :columns=\"config.columns\"\n :settings=\"settings ?? {}\"\n :storage-key=\"id\"\n :orderable=\"orderable\"\n @close=\"showOptions = false\"\n @change=\"onSettingsChange\"\n />\n </div>\n </div>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/data-table/data-list.scss\"></style>\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"admins-components89.js","names":[],"sources":["../src/components/data-table/DataList.vue"],"sourcesContent":["<script lang=\"ts\">\nexport { getDefaultPaginator } from '@/components/data-table/DataPaginator.vue'\nexport type { PaginatorSettings } from '@/types/data-list'\n\nexport interface DataListProps {\n config: DataListConfig\n items: Record<string, unknown>[]\n settings?: Partial<DataListSettings>\n id: string\n layoutBreakpoint?: number\n orderable?: boolean\n pagination?: PaginatorSettings\n filters?: FilterItem[]\n historyEnabled?: boolean\n loading?: boolean\n handleUrl?: boolean\n}\n\nexport const dataListDefaults = {\n layoutBreakpoint: 768,\n orderable: true,\n historyEnabled: true,\n loading: false,\n handleUrl: false,\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { ref, computed, onMounted, onBeforeUnmount } from 'vue'\nimport DataTable from '@/components/data-table/DataTable.vue'\nimport DataCards from '@/components/data-table/DataCards.vue'\nimport DataListOptions from '@/components/data-table/DataListOptions.vue'\nimport DataPaginator from '@/components/data-table/DataPaginator.vue'\nimport Button from '@/components/Button.vue'\nimport type {\n DataListConfig,\n DataListSettings,\n PageSettings,\n PaginatorSettings,\n} from '@/types/data-list'\nimport type { FilterValue } from '@/types/data-list'\nimport DataFilters, {\n getFilterParams,\n type FilterItem,\n} from '@/components/data-table/DataFilters.vue'\nimport FilterTags from '@/components/data-table/FilterTags.vue'\nimport DataListGuide from '@/components/data-table/DataListGuide.vue'\n\nconst dataFiltersRef = ref<InstanceType<typeof DataFilters> | null>(null)\n\nconst props = withDefaults(defineProps<DataListProps>(), {\n ...dataListDefaults,\n})\n\nconst emit = defineEmits<{\n 'filter-change': [filters: Record<string, FilterValue>]\n 'selection-change': [selected: unknown[]]\n 'settings-change': [settings: DataListSettings]\n 'pagination-change': [pagination: PageSettings]\n 'sort-change': [sort: { key: string; direction: 'asc' | 'desc' }]\n}>()\n\nconst showOptions = ref(false)\nconst showGuide = ref(false)\nconst resolvedSettings = ref<DataListSettings | null>(null)\nconst isMobile = ref(false)\nconst root = ref<HTMLElement | null>(null)\nconst showFilters = ref(false)\n\nconst hasTextFilter = computed(() =>\n props.filters?.some((item) => item.type === 'text' || item.type === 'textarea'),\n)\n\nconst exactMatchFilterItem: FilterItem = {\n type: 'checkbox',\n key: 'exactMatch',\n label: 'Pontos egyezés',\n fullWidth: true,\n config: {\n labelAlignmentFix: true,\n },\n displayClass: 'highlight-chip',\n}\n\nfunction ensureExactMatchItem(items: FilterItem[]): FilterItem[] {\n if (!hasTextFilter.value) return items\n if (items.some((i) => i.key === 'exactMatch')) return items\n\n return [exactMatchFilterItem, ...items]\n}\n\nconst resolvedFilters = computed<FilterItem[]>(() => ensureExactMatchItem(props.filters ?? []))\n\nconst activeFilters = ref<Record<string, any>>(\n props.filters ? (getFilterParams(resolvedFilters.value) ?? {}) : {},\n)\n\nlet resizeObserver: ResizeObserver | null = null\n\nonMounted(() => {\n resizeObserver = new ResizeObserver((entries) => {\n isMobile.value = (entries[0]?.contentRect.width ?? 0) < props.layoutBreakpoint\n })\n if (root.value) resizeObserver.observe(root.value)\n})\n\nonBeforeUnmount(() => resizeObserver?.disconnect())\n\nconst effectiveLayout = computed<'table' | 'cards'>(() => {\n const layout = resolvedSettings.value?.layout\n if (layout === 'table' || layout === 'cards') return layout\n return isMobile.value ? 'cards' : 'table'\n})\n\nconst internalConfig = computed<DataListConfig>(() => {\n if (!resolvedSettings.value) return props.config\n const order = resolvedSettings.value.columnOrder\n const mapped = props.config.columns.map((c) => ({\n ...c,\n visible: resolvedSettings.value!.columns[c.property] ?? c.visible !== false,\n }))\n if (order?.length) {\n mapped.sort((a, b) => {\n const ai = order.indexOf(a.property)\n const bi = order.indexOf(b.property)\n return (ai === -1 ? 999 : ai) - (bi === -1 ? 999 : bi)\n })\n }\n return { ...props.config, columns: mapped }\n})\n\nfunction onSettingsChange(s: DataListSettings) {\n resolvedSettings.value = s\n emit('settings-change', s)\n}\n\ndefineExpose({\n openOptions: () => (showOptions.value = true),\n closeOptions: () => (showOptions.value = false),\n openFilters: () => (showFilters.value = true),\n closeFilters: () => (showFilters.value = false),\n})\n\nasync function openFilter(key: string) {\n showFilters.value = true\n setTimeout(() => {\n dataFiltersRef.value?.focusFilter(key)\n }, 300)\n}\n\nfunction onFilterChange(
|
|
1
|
+
{"version":3,"file":"admins-components89.js","names":[],"sources":["../src/components/data-table/DataList.vue"],"sourcesContent":["<script lang=\"ts\">\nexport { getDefaultPaginator } from '@/components/data-table/DataPaginator.vue'\nexport type { PaginatorSettings } from '@/types/data-list'\n\nexport interface DataListProps {\n config: DataListConfig\n items: Record<string, unknown>[]\n settings?: Partial<DataListSettings>\n id: string\n layoutBreakpoint?: number\n orderable?: boolean\n pagination?: PaginatorSettings\n filters?: FilterItem[]\n historyEnabled?: boolean\n loading?: boolean\n handleUrl?: boolean\n}\n\nexport const dataListDefaults = {\n layoutBreakpoint: 768,\n orderable: true,\n historyEnabled: true,\n loading: false,\n handleUrl: false,\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { ref, computed, onMounted, onBeforeUnmount } from 'vue'\nimport DataTable from '@/components/data-table/DataTable.vue'\nimport DataCards from '@/components/data-table/DataCards.vue'\nimport DataListOptions from '@/components/data-table/DataListOptions.vue'\nimport DataPaginator from '@/components/data-table/DataPaginator.vue'\nimport Button from '@/components/Button.vue'\nimport type {\n DataListConfig,\n DataListSettings,\n PageSettings,\n PaginatorSettings,\n} from '@/types/data-list'\nimport type { FilterValue } from '@/types/data-list'\nimport DataFilters, {\n getFilterParams,\n type FilterItem,\n type FilterResponse,\n} from '@/components/data-table/DataFilters.vue'\nimport FilterTags from '@/components/data-table/FilterTags.vue'\nimport DataListGuide from '@/components/data-table/DataListGuide.vue'\n\nconst dataFiltersRef = ref<InstanceType<typeof DataFilters> | null>(null)\n\nconst props = withDefaults(defineProps<DataListProps>(), {\n ...dataListDefaults,\n})\n\nconst emit = defineEmits<{\n 'filter-change': [filters: Record<string, FilterValue>]\n 'selection-change': [selected: unknown[]]\n 'settings-change': [settings: DataListSettings]\n 'pagination-change': [pagination: PageSettings]\n 'sort-change': [sort: { key: string; direction: 'asc' | 'desc' }]\n}>()\n\nconst showOptions = ref(false)\nconst showGuide = ref(false)\nconst resolvedSettings = ref<DataListSettings | null>(null)\nconst isMobile = ref(false)\nconst root = ref<HTMLElement | null>(null)\nconst showFilters = ref(false)\n\nconst hasTextFilter = computed(() =>\n props.filters?.some((item) => item.type === 'text' || item.type === 'textarea'),\n)\n\nconst exactMatchFilterItem: FilterItem = {\n type: 'checkbox',\n key: 'exactMatch',\n label: 'Pontos egyezés',\n fullWidth: true,\n config: {\n labelAlignmentFix: true,\n },\n displayClass: 'highlight-chip',\n}\n\nfunction ensureExactMatchItem(items: FilterItem[]): FilterItem[] {\n if (!hasTextFilter.value) return items\n if (items.some((i) => i.key === 'exactMatch')) return items\n\n return [exactMatchFilterItem, ...items]\n}\n\nconst resolvedFilters = computed<FilterItem[]>(() => ensureExactMatchItem(props.filters ?? []))\n\nconst activeFilters = ref<Record<string, any>>(\n props.filters ? (getFilterParams(resolvedFilters.value) ?? {}) : {},\n)\n\nlet resizeObserver: ResizeObserver | null = null\n\nonMounted(() => {\n resizeObserver = new ResizeObserver((entries) => {\n isMobile.value = (entries[0]?.contentRect.width ?? 0) < props.layoutBreakpoint\n })\n if (root.value) resizeObserver.observe(root.value)\n})\n\nonBeforeUnmount(() => resizeObserver?.disconnect())\n\nconst effectiveLayout = computed<'table' | 'cards'>(() => {\n const layout = resolvedSettings.value?.layout\n if (layout === 'table' || layout === 'cards') return layout\n return isMobile.value ? 'cards' : 'table'\n})\n\nconst internalConfig = computed<DataListConfig>(() => {\n if (!resolvedSettings.value) return props.config\n const order = resolvedSettings.value.columnOrder\n const mapped = props.config.columns.map((c) => ({\n ...c,\n visible: resolvedSettings.value!.columns[c.property] ?? c.visible !== false,\n }))\n if (order?.length) {\n mapped.sort((a, b) => {\n const ai = order.indexOf(a.property)\n const bi = order.indexOf(b.property)\n return (ai === -1 ? 999 : ai) - (bi === -1 ? 999 : bi)\n })\n }\n return { ...props.config, columns: mapped }\n})\n\nfunction onSettingsChange(s: DataListSettings) {\n resolvedSettings.value = s\n emit('settings-change', s)\n}\n\ndefineExpose({\n openOptions: () => (showOptions.value = true),\n closeOptions: () => (showOptions.value = false),\n openFilters: () => (showFilters.value = true),\n closeFilters: () => (showFilters.value = false),\n})\n\nasync function openFilter(key: string) {\n showFilters.value = true\n setTimeout(() => {\n dataFiltersRef.value?.focusFilter(key)\n }, 300)\n}\n\nfunction onFilterChange(response: FilterResponse) {\n activeFilters.value = response.values\n emit('filter-change', response.transformed)\n}\n\nconst activeFiltersCount = computed(\n () => Object.values(activeFilters.value).filter((v) => v != null && v !== '').length,\n)\n\nconst showPaginator = computed(\n () => !!props.pagination && (props.items.length > 0 || !props.loading),\n)\n</script>\n\n<template>\n <div class=\"ac-component\">\n <div ref=\"root\" class=\"c-data-list\">\n <template v-if=\"resolvedFilters && resolvedFilters.length > 0\">\n <div class=\"flex-center gap-2 mb-3 wrap-on-small\">\n <Button\n label=\"Szűrők megnyitása\"\n icon=\"fa-solid fa-filter\"\n @click=\"showFilters = true\"\n style=\"flex-shrink: 0\"\n :type=\"activeFiltersCount > 0 ? 'info' : 'normal'\"\n :indicator=\"activeFiltersCount > 0 ? activeFiltersCount : undefined\"\n />\n <div class=\"flex-center gap-1\">\n <FilterTags\n :filters=\"activeFilters\"\n :items=\"resolvedFilters\"\n @remove=\"(key: string) => dataFiltersRef?.clearFilter(key)\"\n @openFilter=\"openFilter\"\n />\n </div>\n </div>\n <DataFilters\n ref=\"dataFiltersRef\"\n :open=\"showFilters\"\n :items=\"resolvedFilters\"\n lazy\n :handle-url=\"handleUrl\"\n :storage-key=\"id\"\n @close=\"showFilters = false\"\n @change=\"onFilterChange\"\n />\n </template>\n\n <div class=\"c-data-list__toolbar\">\n <Button\n label=\"Beállítások\"\n icon=\"fa-solid fa-gear\"\n class=\"c-data-list__toolbar__item\"\n size=\"small\"\n @click=\"showOptions = true\"\n />\n <Button\n label=\"Súgó\"\n icon=\"fa-solid fa-question\"\n icon-position=\"right\"\n class=\"c-data-list__toolbar__item ml-auto\"\n label-alignment-fix\n size=\"small\"\n @click=\"showGuide = true\"\n />\n </div>\n <DataListGuide :open=\"showGuide\" @close=\"showGuide = false\" />\n <DataTable\n v-if=\"effectiveLayout === 'table'\"\n :config=\"internalConfig\"\n :loading=\"loading\"\n :items=\"items\"\n :settings=\"resolvedSettings ?? undefined\"\n @filter-change=\"emit('filter-change', $event)\"\n @selection-change=\"emit('selection-change', $event)\"\n @sort-change=\"emit('sort-change', $event)\"\n />\n\n <DataCards\n v-else\n :config=\"internalConfig\"\n :loading=\"loading\"\n :items=\"items\"\n :settings=\"resolvedSettings ?? undefined\"\n @selection-change=\"emit('selection-change', $event)\"\n />\n\n <DataPaginator\n v-if=\"pagination && showPaginator\"\n :settings=\"pagination\"\n :storage-key=\"id\"\n @update:pagination=\"emit('pagination-change', $event)\"\n />\n\n <DataListOptions\n :open=\"showOptions\"\n :columns=\"config.columns\"\n :settings=\"settings ?? {}\"\n :storage-key=\"id\"\n :orderable=\"orderable\"\n @close=\"showOptions = false\"\n @change=\"onSettingsChange\"\n />\n </div>\n </div>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/data-table/data-list.scss\"></style>\n"],"mappings":""}
|
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
import { SidebarPosition } from '../Sidebar.vue';
|
|
2
2
|
import { FilterItemType } from '../../types/types';
|
|
3
3
|
import { DropdownOption } from '../DropdownSelect.vue';
|
|
4
|
-
|
|
5
|
-
export { getFilterParams };
|
|
4
|
+
export { getFilterParams, getDefaultFilters, filterEmptyValues } from '../../utils/dataFilters';
|
|
6
5
|
export interface FilterItem {
|
|
7
6
|
type: FilterItemType;
|
|
8
7
|
key: string;
|
|
@@ -13,6 +12,11 @@ export interface FilterItem {
|
|
|
13
12
|
fullWidth?: boolean;
|
|
14
13
|
config?: Record<string, any>;
|
|
15
14
|
displayClass?: string;
|
|
15
|
+
transformer?: (value: any) => Record<string, any> | null | undefined;
|
|
16
|
+
}
|
|
17
|
+
export interface FilterResponse {
|
|
18
|
+
values: Record<string, any>;
|
|
19
|
+
transformed: Record<string, any>;
|
|
16
20
|
}
|
|
17
21
|
declare const _default: typeof __VLS_export;
|
|
18
22
|
export default _default;
|
|
@@ -28,7 +32,7 @@ declare const __VLS_export: import('vue').DefineComponent<{
|
|
|
28
32
|
clearFilter: (key: string) => void;
|
|
29
33
|
focusFilter: (key: string) => void;
|
|
30
34
|
}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
|
|
31
|
-
change: (
|
|
35
|
+
change: (response: FilterResponse) => any;
|
|
32
36
|
close: () => any;
|
|
33
37
|
}, string, import('vue').PublicProps, Readonly<{
|
|
34
38
|
open?: boolean;
|
|
@@ -39,7 +43,7 @@ declare const __VLS_export: import('vue').DefineComponent<{
|
|
|
39
43
|
historyEnabled?: boolean;
|
|
40
44
|
storageKey?: string;
|
|
41
45
|
}> & Readonly<{
|
|
42
|
-
onChange?: ((
|
|
46
|
+
onChange?: ((response: FilterResponse) => any) | undefined;
|
|
43
47
|
onClose?: (() => any) | undefined;
|
|
44
48
|
}>, {
|
|
45
49
|
lazy: boolean;
|
package/dist/src/index.d.ts
CHANGED
|
@@ -16,7 +16,7 @@ export { default as InternalArticleOffer } from './components/custom/InternalArt
|
|
|
16
16
|
export { default as Loader } from './components/Loader.vue';
|
|
17
17
|
export { default as ToastNotification } from './components/ToastNotification.vue';
|
|
18
18
|
export { default as DataList, dataListDefaults, getDefaultPaginator, } from './components/data-table/DataList.vue';
|
|
19
|
-
export { getFilterParams } from './components/data-table/DataFilters.vue';
|
|
19
|
+
export { getFilterParams, getDefaultFilters, filterEmptyValues, } from './components/data-table/DataFilters.vue';
|
|
20
20
|
export { default as DataTable } from './components/data-table/DataTable.vue';
|
|
21
21
|
export { default as DataCards } from './components/data-table/DataCards.vue';
|
|
22
22
|
export { default as DataFilters } from './components/data-table/DataFilters.vue';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.ac-component .c-modal-backdrop{z-index:11000;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#0006;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.ac-component .c-modal{background:var(--neutral-0);border-radius:.75rem;flex-direction:column;min-width:20rem;max-width:calc(100dvw - 2rem);max-height:calc(100dvh - 4rem);animation:.15s ease-out c-modal-enter;display:flex;overflow:hidden;box-shadow:0 8px 32px #0000001f}.ac-component .c-modal-header{border-bottom:1px solid var(--neutral-100);justify-content:space-between;align-items:center;padding:1rem 1.25rem;display:flex}.ac-component .c-modal-title{color:var(--neutral-900);margin:0;font-size:1rem;font-weight:600}.ac-component .c-modal-close{width:2rem;height:2rem;color:var(--neutral-600);cursor:pointer;background:0 0;border:none;border-radius:.375rem;justify-content:center;align-items:center;font-size:1.25rem;transition:background-color .15s,color .15s;display:flex}.ac-component .c-modal-close:hover{background:var(--neutral-100);color:var(--neutral-900)}.ac-component .c-modal-close:focus-visible{outline:none;box-shadow:0 0 0 2px #f265221f}.ac-component .c-modal-body{flex:1;padding:1.25rem;overflow-y:auto}.ac-component .c-modal-footer{border-top:1px solid var(--neutral-100);justify-content:flex-end;align-items:center;gap:.5rem;padding:.75rem 1.25rem;display:flex}.ac-component .c-confirm-modal-message{color:var(--neutral-700);margin:0;font-size:.875rem;line-height:1.5}@keyframes c-modal-enter{0%{opacity:0;transform:scale(.95)translateY(-.5rem)}to{opacity:1;transform:scale(1)translateY(0)}}
|
|
1
|
+
.ac-component .c-modal-backdrop{z-index:11000;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#0006;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.ac-component .c-modal{background:var(--neutral-0);border-radius:.75rem;flex-direction:column;min-width:20rem;max-width:calc(100dvw - 2rem);max-height:calc(100dvh - 4rem);animation:.15s ease-out c-modal-enter;display:flex;overflow:hidden;box-shadow:0 8px 32px #0000001f}.ac-component .c-modal-header{border-bottom:1px solid var(--neutral-100);justify-content:space-between;align-items:center;padding:1rem 1.25rem;display:flex}.ac-component .c-modal-title{color:var(--neutral-900);margin:0;font-size:1rem;font-weight:600}.ac-component .c-modal-close{width:2rem;height:2rem;color:var(--neutral-600);cursor:pointer;background:0 0;border:none;border-radius:.375rem;justify-content:center;align-items:center;font-size:1.25rem;transition:background-color .15s,color .15s;display:flex}.ac-component .c-modal-close:hover{background:var(--neutral-100);color:var(--neutral-900)}.ac-component .c-modal-close:focus-visible{outline:none;box-shadow:0 0 0 2px #f265221f}.ac-component .c-modal-body{flex:1;padding:1.25rem;display:flex;overflow-y:auto}.ac-component .c-modal-footer{border-top:1px solid var(--neutral-100);justify-content:flex-end;align-items:center;gap:.5rem;padding:.75rem 1.25rem;display:flex}.ac-component .c-confirm-modal-message{color:var(--neutral-700);margin:0;font-size:.875rem;line-height:1.5}@keyframes c-modal-enter{0%{opacity:0;transform:scale(.95)translateY(-.5rem)}to{opacity:1;transform:scale(1)translateY(0)}}
|