admins-components 9.0.61 → 9.0.63
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-components100.js +109 -103
- package/dist/admins-components100.js.map +1 -1
- package/dist/admins-components102.js.map +1 -1
- package/dist/admins-components41.js +14 -11
- package/dist/admins-components41.js.map +1 -1
- package/dist/admins-components42.js.map +1 -1
- package/dist/admins-components61.js +26 -22
- package/dist/admins-components61.js.map +1 -1
- package/dist/admins-components62.js.map +1 -1
- package/dist/admins-components65.js +63 -60
- package/dist/admins-components65.js.map +1 -1
- package/dist/admins-components67.js.map +1 -1
- package/dist/admins-components68.js +35 -32
- package/dist/admins-components68.js.map +1 -1
- package/dist/admins-components70.js.map +1 -1
- package/dist/src/components/data-table/DataCards.vue.d.ts +12 -2
- package/dist/src/components/data-table/DataCell.vue.d.ts +15 -1
- package/dist/src/components/data-table/DataList.vue.d.ts +11 -2
- package/dist/src/components/data-table/DataTable.vue.d.ts +12 -2
- package/package.json +1 -1
|
@@ -8,16 +8,16 @@ import { getDefaultSort as o } from "./admins-components80.js";
|
|
|
8
8
|
import s from "./admins-components82.js";
|
|
9
9
|
import { getDefaultFilters as c } from "./admins-components84.js";
|
|
10
10
|
import l from "./admins-components90.js";
|
|
11
|
-
import
|
|
12
|
-
import
|
|
13
|
-
import { getDefaultSearch as
|
|
14
|
-
import
|
|
15
|
-
import { computed as
|
|
11
|
+
import ee from "./admins-components93.js";
|
|
12
|
+
import te from "./admins-components96.js";
|
|
13
|
+
import { getDefaultSearch as u } from "./admins-components97.js";
|
|
14
|
+
import ne from "./admins-components99.js";
|
|
15
|
+
import { computed as d, createBlock as f, createCommentVNode as p, createElementBlock as m, createElementVNode as h, createSlots as g, createVNode as _, defineComponent as v, guardReactiveProps as y, mergeDefaults as b, mergeProps as x, normalizeProps as S, onBeforeUnmount as C, onMounted as w, openBlock as T, ref as E, renderList as D, renderSlot as O, withCtx as k } from "vue";
|
|
16
16
|
//#region src/components/data-table/DataList.vue?vue&type=script&setup=true&lang.ts
|
|
17
|
-
var
|
|
17
|
+
var re = { class: "ac-component" }, A = { class: "c-data-list__toolbar" }, j = {
|
|
18
18
|
key: 2,
|
|
19
19
|
class: "flex-center gap-1 flex-center-wrap-on-mobile"
|
|
20
|
-
},
|
|
20
|
+
}, M = { class: "flex-center ml-auto nowrap" }, N = {
|
|
21
21
|
layoutBreakpoint: 768,
|
|
22
22
|
orderable: !0,
|
|
23
23
|
loading: !1,
|
|
@@ -25,8 +25,8 @@ var ee = { class: "ac-component" }, D = { class: "c-data-list__toolbar" }, O = {
|
|
|
25
25
|
useFilters: !0,
|
|
26
26
|
handleUrl: !1
|
|
27
27
|
};
|
|
28
|
-
function
|
|
29
|
-
let n = i(t), r = o(), a =
|
|
28
|
+
function P(e, t) {
|
|
29
|
+
let n = i(t), r = o(), a = u(), s = c(e, t, !0);
|
|
30
30
|
return {
|
|
31
31
|
...n,
|
|
32
32
|
...r,
|
|
@@ -34,9 +34,9 @@ function j(e, t) {
|
|
|
34
34
|
...s
|
|
35
35
|
};
|
|
36
36
|
}
|
|
37
|
-
var
|
|
37
|
+
var F = /* @__PURE__ */ v({
|
|
38
38
|
__name: "DataList",
|
|
39
|
-
props: /* @__PURE__ */
|
|
39
|
+
props: /* @__PURE__ */ b({
|
|
40
40
|
config: {},
|
|
41
41
|
items: {},
|
|
42
42
|
settings: {},
|
|
@@ -51,7 +51,7 @@ var M = /* @__PURE__ */ b({
|
|
|
51
51
|
searchConfig: {},
|
|
52
52
|
filterConfig: {}
|
|
53
53
|
}, {
|
|
54
|
-
...
|
|
54
|
+
...N,
|
|
55
55
|
searchConfig: void 0,
|
|
56
56
|
filterConfig: void 0
|
|
57
57
|
}),
|
|
@@ -63,90 +63,90 @@ var M = /* @__PURE__ */ b({
|
|
|
63
63
|
"sort-change",
|
|
64
64
|
"search-change"
|
|
65
65
|
],
|
|
66
|
-
setup(i, { expose:
|
|
67
|
-
let
|
|
68
|
-
function
|
|
69
|
-
let t =
|
|
70
|
-
return t && Object.hasOwn(t, "handleUrl") ? t.handleUrl :
|
|
66
|
+
setup(i, { expose: u, emit: v }) {
|
|
67
|
+
let b = E(null), N = i;
|
|
68
|
+
function P(e) {
|
|
69
|
+
let t = N[e];
|
|
70
|
+
return t && Object.hasOwn(t, "handleUrl") ? t.handleUrl : N.handleUrl;
|
|
71
71
|
}
|
|
72
|
-
let
|
|
73
|
-
...
|
|
74
|
-
handleUrl:
|
|
75
|
-
})),
|
|
76
|
-
...
|
|
77
|
-
handleUrl:
|
|
78
|
-
})),
|
|
72
|
+
let F = d(() => ({
|
|
73
|
+
...N.searchConfig,
|
|
74
|
+
handleUrl: P("searchConfig")
|
|
75
|
+
})), ie = d(() => ({
|
|
76
|
+
...N.filterConfig,
|
|
77
|
+
handleUrl: P("filterConfig")
|
|
78
|
+
})), I = v, L = E(!1), R = E(!1), z = E(null), B = E(!1), V = E(null), H = E(!1), U = E(N.filterConfig?.items ? c(N.filterConfig.items, N.id, !1) : {}), W = null;
|
|
79
79
|
w(() => {
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
}),
|
|
83
|
-
}), C(() =>
|
|
84
|
-
let
|
|
85
|
-
let e =
|
|
86
|
-
return e === "table" || e === "cards" ? e :
|
|
87
|
-
}),
|
|
88
|
-
if (!
|
|
89
|
-
let e =
|
|
80
|
+
W = new ResizeObserver((e) => {
|
|
81
|
+
B.value = (e[0]?.contentRect.width ?? 0) < N.layoutBreakpoint;
|
|
82
|
+
}), V.value && W.observe(V.value);
|
|
83
|
+
}), C(() => W?.disconnect());
|
|
84
|
+
let G = d(() => {
|
|
85
|
+
let e = z.value?.layout;
|
|
86
|
+
return e === "table" || e === "cards" ? e : B.value ? "cards" : "table";
|
|
87
|
+
}), K = d(() => {
|
|
88
|
+
if (!z.value) return N.config;
|
|
89
|
+
let e = z.value.columnOrder, t = N.config.columns.map((e) => ({
|
|
90
90
|
...e,
|
|
91
|
-
visible:
|
|
91
|
+
visible: z.value.columns[e.property] ?? e.visible !== !1
|
|
92
92
|
}));
|
|
93
93
|
return e?.length && t.sort((t, n) => {
|
|
94
94
|
let r = e.indexOf(t.property), i = e.indexOf(n.property);
|
|
95
95
|
return (r === -1 ? 999 : r) - (i === -1 ? 999 : i);
|
|
96
96
|
}), {
|
|
97
|
-
...
|
|
97
|
+
...N.config,
|
|
98
98
|
columns: t
|
|
99
99
|
};
|
|
100
100
|
});
|
|
101
|
-
function
|
|
102
|
-
|
|
101
|
+
function q(e) {
|
|
102
|
+
z.value = e, I("settings-change", e);
|
|
103
103
|
}
|
|
104
|
-
|
|
105
|
-
openOptions: () =>
|
|
106
|
-
closeOptions: () =>
|
|
107
|
-
openFilters: () =>
|
|
108
|
-
closeFilters: () =>
|
|
104
|
+
u({
|
|
105
|
+
openOptions: () => L.value = !0,
|
|
106
|
+
closeOptions: () => L.value = !1,
|
|
107
|
+
openFilters: () => H.value = !0,
|
|
108
|
+
closeFilters: () => H.value = !1
|
|
109
109
|
});
|
|
110
|
-
async function
|
|
111
|
-
|
|
112
|
-
|
|
110
|
+
async function J(e) {
|
|
111
|
+
H.value = !0, setTimeout(() => {
|
|
112
|
+
b.value?.focusFilter(e);
|
|
113
113
|
}, 300);
|
|
114
114
|
}
|
|
115
|
-
function
|
|
116
|
-
|
|
115
|
+
function ae(e) {
|
|
116
|
+
U.value = e.values, I("filter-change", e.transformed);
|
|
117
117
|
}
|
|
118
|
-
let
|
|
119
|
-
|
|
120
|
-
}, Z =
|
|
118
|
+
let Y = d(() => Object.values(U.value).filter((e) => e != null && e !== "").length), X = d(() => !!N.pagination && (N.items.length > 0 || !N.loading)), oe = (e) => {
|
|
119
|
+
I("search-change", e);
|
|
120
|
+
}, Z = d(() => N.config.columns.filter((e) => e.sort).map((e) => ({
|
|
121
121
|
value: e.property,
|
|
122
122
|
label: e.label
|
|
123
|
-
}))), Q = E(
|
|
124
|
-
Q.value = e,
|
|
123
|
+
}))), Q = E(N.handleUrl ? o() : null), $ = (e) => {
|
|
124
|
+
Q.value = e, I("sort-change", e);
|
|
125
125
|
};
|
|
126
|
-
return (o, c) => (T(),
|
|
126
|
+
return (o, c) => (T(), m("div", re, [h("div", {
|
|
127
127
|
ref_key: "root",
|
|
128
|
-
ref:
|
|
128
|
+
ref: V,
|
|
129
129
|
class: "c-data-list"
|
|
130
130
|
}, [
|
|
131
|
-
|
|
132
|
-
i.useSearch ? (T(),
|
|
133
|
-
i.useFilters && i.filterConfig?.items && i.filterConfig.items.length > 0 ? (T(),
|
|
131
|
+
h("div", A, [
|
|
132
|
+
i.useSearch ? (T(), f(ne, x({ key: 0 }, F.value, { onSearchChange: oe }), null, 16)) : p("", !0),
|
|
133
|
+
i.useFilters && i.filterConfig?.items && i.filterConfig.items.length > 0 ? (T(), f(e, {
|
|
134
134
|
key: 1,
|
|
135
135
|
label: "Szűrők",
|
|
136
136
|
icon: "fa-solid fa-filter",
|
|
137
|
-
onClick: c[0] ||= (e) =>
|
|
137
|
+
onClick: c[0] ||= (e) => H.value = !0,
|
|
138
138
|
style: { "flex-shrink": "0" },
|
|
139
|
-
type:
|
|
140
|
-
indicator:
|
|
141
|
-
}, null, 8, ["type", "indicator"])) :
|
|
142
|
-
i.useFilters && i.filterConfig?.items && i.filterConfig.items.length > 0 ? (T(),
|
|
143
|
-
filters:
|
|
139
|
+
type: Y.value > 0 ? "info" : "normal",
|
|
140
|
+
indicator: Y.value > 0 ? Y.value : void 0
|
|
141
|
+
}, null, 8, ["type", "indicator"])) : p("", !0),
|
|
142
|
+
i.useFilters && i.filterConfig?.items && i.filterConfig.items.length > 0 ? (T(), m("div", j, [_(ee, {
|
|
143
|
+
filters: U.value,
|
|
144
144
|
items: i.filterConfig.items,
|
|
145
|
-
onRemove: c[1] ||= (e) =>
|
|
146
|
-
onOpenFilter:
|
|
147
|
-
}, null, 8, ["filters", "items"])])) :
|
|
148
|
-
|
|
149
|
-
Z.value.length > 0 ? (T(),
|
|
145
|
+
onRemove: c[1] ||= (e) => b.value?.clearFilter(e),
|
|
146
|
+
onOpenFilter: J
|
|
147
|
+
}, null, 8, ["filters", "items"])])) : p("", !0),
|
|
148
|
+
h("div", M, [
|
|
149
|
+
Z.value.length > 0 ? (T(), f(s, {
|
|
150
150
|
key: 0,
|
|
151
151
|
modelValue: Q.value,
|
|
152
152
|
"onUpdate:modelValue": c[2] ||= (e) => Q.value = e,
|
|
@@ -157,81 +157,87 @@ var M = /* @__PURE__ */ b({
|
|
|
157
157
|
"modelValue",
|
|
158
158
|
"options",
|
|
159
159
|
"handle-url"
|
|
160
|
-
])) :
|
|
161
|
-
|
|
160
|
+
])) : p("", !0),
|
|
161
|
+
_(e, {
|
|
162
162
|
icon: "fa-solid fa-gear",
|
|
163
163
|
class: "lh-normal settings-btn",
|
|
164
|
-
onClick: c[3] ||= (e) =>
|
|
164
|
+
onClick: c[3] ||= (e) => L.value = !0
|
|
165
165
|
}),
|
|
166
|
-
|
|
166
|
+
_(e, {
|
|
167
167
|
icon: "fa-solid fa-question",
|
|
168
168
|
class: "lh-normal",
|
|
169
|
-
onClick: c[4] ||= (e) =>
|
|
169
|
+
onClick: c[4] ||= (e) => R.value = !0
|
|
170
170
|
})
|
|
171
171
|
])
|
|
172
172
|
]),
|
|
173
|
-
i.useFilters && i.filterConfig?.items && i.filterConfig.items.length > 0 ? (T(),
|
|
173
|
+
i.useFilters && i.filterConfig?.items && i.filterConfig.items.length > 0 ? (T(), f(l, x({
|
|
174
174
|
key: 0,
|
|
175
175
|
ref_key: "dataFiltersRef",
|
|
176
|
-
ref:
|
|
177
|
-
},
|
|
176
|
+
ref: b
|
|
177
|
+
}, ie.value, {
|
|
178
178
|
"storage-key": i.id,
|
|
179
|
-
open:
|
|
180
|
-
onClose: c[5] ||= (e) =>
|
|
181
|
-
onChange:
|
|
182
|
-
}), null, 16, ["storage-key", "open"])) :
|
|
183
|
-
|
|
184
|
-
open:
|
|
185
|
-
onClose: c[6] ||= (e) =>
|
|
179
|
+
open: H.value,
|
|
180
|
+
onClose: c[5] ||= (e) => H.value = !1,
|
|
181
|
+
onChange: ae
|
|
182
|
+
}), null, 16, ["storage-key", "open"])) : p("", !0),
|
|
183
|
+
_(te, {
|
|
184
|
+
open: R.value,
|
|
185
|
+
onClose: c[6] ||= (e) => R.value = !1
|
|
186
186
|
}, null, 8, ["open"]),
|
|
187
|
-
|
|
187
|
+
G.value === "table" ? (T(), f(t, {
|
|
188
188
|
key: 1,
|
|
189
|
-
config:
|
|
189
|
+
config: K.value,
|
|
190
190
|
loading: i.loading,
|
|
191
191
|
items: i.items,
|
|
192
|
-
settings:
|
|
192
|
+
settings: z.value ?? void 0,
|
|
193
193
|
"initial-sort": Q.value,
|
|
194
|
-
onFilterChange: c[7] ||= (e) =>
|
|
195
|
-
onSelectionChange: c[8] ||= (e) =>
|
|
194
|
+
onFilterChange: c[7] ||= (e) => I("filter-change", e),
|
|
195
|
+
onSelectionChange: c[8] ||= (e) => I("selection-change", e),
|
|
196
196
|
onSortChange: $
|
|
197
|
-
},
|
|
197
|
+
}, g({ _: 2 }, [D(K.value.columns, (e) => ({
|
|
198
|
+
name: `cell:${e.property}`,
|
|
199
|
+
fn: k((t) => [O(o.$slots, `cell:${e.property}`, S(y(t)))])
|
|
200
|
+
}))]), 1032, [
|
|
198
201
|
"config",
|
|
199
202
|
"loading",
|
|
200
203
|
"items",
|
|
201
204
|
"settings",
|
|
202
205
|
"initial-sort"
|
|
203
|
-
])) : (T(),
|
|
206
|
+
])) : (T(), f(n, {
|
|
204
207
|
key: 2,
|
|
205
|
-
config:
|
|
208
|
+
config: K.value,
|
|
206
209
|
loading: i.loading,
|
|
207
210
|
items: i.items,
|
|
208
|
-
settings:
|
|
209
|
-
onSelectionChange: c[9] ||= (e) =>
|
|
210
|
-
},
|
|
211
|
+
settings: z.value ?? void 0,
|
|
212
|
+
onSelectionChange: c[9] ||= (e) => I("selection-change", e)
|
|
213
|
+
}, g({ _: 2 }, [D(K.value.columns, (e) => ({
|
|
214
|
+
name: `cell:${e.property}`,
|
|
215
|
+
fn: k((t) => [O(o.$slots, `cell:${e.property}`, S(y(t)))])
|
|
216
|
+
}))]), 1032, [
|
|
211
217
|
"config",
|
|
212
218
|
"loading",
|
|
213
219
|
"items",
|
|
214
220
|
"settings"
|
|
215
221
|
])),
|
|
216
|
-
i.pagination &&
|
|
222
|
+
i.pagination && X.value ? (T(), f(a, {
|
|
217
223
|
key: 3,
|
|
218
224
|
settings: i.pagination,
|
|
219
225
|
"storage-key": i.id,
|
|
220
226
|
"handle-url": i.handleUrl,
|
|
221
|
-
"onUpdate:pagination": c[10] ||= (e) =>
|
|
227
|
+
"onUpdate:pagination": c[10] ||= (e) => I("pagination-change", e)
|
|
222
228
|
}, null, 8, [
|
|
223
229
|
"settings",
|
|
224
230
|
"storage-key",
|
|
225
231
|
"handle-url"
|
|
226
|
-
])) :
|
|
227
|
-
|
|
228
|
-
open:
|
|
232
|
+
])) : p("", !0),
|
|
233
|
+
_(r, {
|
|
234
|
+
open: L.value,
|
|
229
235
|
columns: i.config.columns,
|
|
230
236
|
settings: i.settings ?? {},
|
|
231
237
|
"storage-key": i.id,
|
|
232
238
|
orderable: i.orderable,
|
|
233
|
-
onClose: c[11] ||= (e) =>
|
|
234
|
-
onChange:
|
|
239
|
+
onClose: c[11] ||= (e) => L.value = !1,
|
|
240
|
+
onChange: q
|
|
235
241
|
}, null, 8, [
|
|
236
242
|
"open",
|
|
237
243
|
"columns",
|
|
@@ -243,4 +249,4 @@ var M = /* @__PURE__ */ b({
|
|
|
243
249
|
}
|
|
244
250
|
});
|
|
245
251
|
//#endregion
|
|
246
|
-
export {
|
|
252
|
+
export { N as dataListDefaults, F as default, P as getDefaultFetchData };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"admins-components100.js","names":[],"sources":["../src/components/data-table/DataList.vue"],"sourcesContent":["<script lang=\"ts\">\nexport type { PaginatorSettings } from '@/types/data-list'\nexport type { DataSearchProps } from './DataSearch.vue'\nexport type { DataFiltersProps } from './DataFilters.vue'\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 loading?: boolean\n handleUrl?: boolean\n useSearch?: boolean\n useFilters?: boolean\n searchConfig?: DataSearchProps\n filterConfig?: DataFiltersProps\n}\n\nexport const dataListDefaults = {\n layoutBreakpoint: 768,\n orderable: true,\n loading: false,\n useSearch: true,\n useFilters: true,\n handleUrl: false,\n}\n\nexport function getDefaultFetchData(filters: FilterItem[], storageKey: string) {\n const defaultPaginator = getDefaultPaginator(storageKey)\n const defaultSort = getDefaultSort()\n const defaultSearch = getDefaultSearch()\n const defaultFilters = getDefaultFilters(filters, storageKey, true)\n\n return {\n ...defaultPaginator,\n ...defaultSort,\n ...defaultSearch,\n ...defaultFilters,\n }\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, { getDefaultPaginator } from '@/components/data-table/DataPaginator.vue'\nimport Button from '@/components/Button.vue'\nimport DataSort, { getDefaultSort, type DataSortOption } from '@/components/data-table/DataSort.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 type FilterResponse,\n type DataFiltersProps,\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'\nimport DataSearch, { getDefaultSearch, type DataSearchProps } from './DataSearch.vue'\nimport { getDefaultFilters } from '@/utils/dataFilters.ts'\n\nconst dataFiltersRef = ref<InstanceType<typeof DataFilters> | null>(null)\n\nconst props = withDefaults(defineProps<DataListProps>(), {\n ...dataListDefaults,\n searchConfig: undefined,\n filterConfig: undefined,\n})\n\nfunction resolvedHandleUrl(side: 'searchConfig' | 'filterConfig'): boolean | undefined {\n const sideConfig = props[side]\n if (sideConfig && Object.hasOwn(sideConfig as object, 'handleUrl')) {\n return (sideConfig as { handleUrl?: boolean }).handleUrl\n }\n return props.handleUrl\n}\n\nconst mergedSearchConfig = computed<DataSearchProps>(() => ({\n ...props.searchConfig,\n handleUrl: resolvedHandleUrl('searchConfig'),\n}))\n\nconst mergedFilterConfig = computed<DataFiltersProps>(() => ({\n ...(props.filterConfig as DataFiltersProps),\n handleUrl: resolvedHandleUrl('filterConfig'),\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' } | null]\n 'search-change': [filters: Record<string, string | boolean>]\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 activeFilters = ref<Record<string, unknown>>(\n props.filterConfig?.items ? getDefaultFilters(props.filterConfig.items, props.id, false) : {},\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\nconst searchChange = (value: Record<string, string | boolean>) => {\n emit('search-change', value)\n}\n\nconst sortableColumns = computed<DataSortOption[]>(() =>\n props.config.columns.filter((c) => c.sort).map((c) => ({ value: c.property, label: c.label })),\n)\n\nconst currentSort = ref<{ key: string; direction: 'asc' | 'desc' } | null>(\n props.handleUrl ? getDefaultSort() : null,\n)\n\nconst onSortChange = (sort: { key: string; direction: 'asc' | 'desc' } | null) => {\n currentSort.value = sort\n // DataSort already writes the URL when handleUrl: true; we only emit.\n emit('sort-change', sort)\n}\n</script>\n\n<template>\n <div class=\"ac-component\">\n <div ref=\"root\" class=\"c-data-list\">\n <div class=\"c-data-list__toolbar\">\n <DataSearch v-if=\"useSearch\" v-bind=\"mergedSearchConfig\" @search-change=\"searchChange\" />\n <Button\n v-if=\"useFilters && filterConfig?.items && filterConfig.items.length > 0\"\n label=\"Szűrők\"\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\n class=\"flex-center gap-1 flex-center-wrap-on-mobile\"\n v-if=\"useFilters && filterConfig?.items && filterConfig.items.length > 0\"\n >\n <FilterTags\n :filters=\"activeFilters\"\n :items=\"filterConfig.items\"\n @remove=\"(key: string) => dataFiltersRef?.clearFilter(key)\"\n @openFilter=\"openFilter\"\n />\n </div>\n <div class=\"flex-center ml-auto nowrap\">\n <DataSort\n v-if=\"sortableColumns.length > 0\"\n v-model=\"currentSort\"\n :options=\"sortableColumns\"\n :handle-url=\"handleUrl\"\n @sort-change=\"onSortChange\"\n />\n\n <Button\n icon=\"fa-solid fa-gear\"\n class=\"lh-normal settings-btn\"\n @click=\"showOptions = true\"\n />\n <Button icon=\"fa-solid fa-question\" class=\"lh-normal\" @click=\"showGuide = true\" />\n </div>\n </div>\n <DataFilters\n ref=\"dataFiltersRef\"\n v-if=\"useFilters && filterConfig?.items && filterConfig.items.length > 0\"\n v-bind=\"mergedFilterConfig\"\n :storage-key=\"id\"\n :open=\"showFilters\"\n @close=\"showFilters = false\"\n @change=\"onFilterChange\"\n />\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 :initial-sort=\"currentSort\"\n @filter-change=\"emit('filter-change', $event)\"\n @selection-change=\"emit('selection-change', $event)\"\n @sort-change=\"onSortChange\"\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 :handle-url=\"handleUrl\"\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-components100.js","names":[],"sources":["../src/components/data-table/DataList.vue"],"sourcesContent":["<script lang=\"ts\">\nexport type { PaginatorSettings } from '@/types/data-list'\nexport type { DataSearchProps } from './DataSearch.vue'\nexport type { DataFiltersProps } from './DataFilters.vue'\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 loading?: boolean\n handleUrl?: boolean\n useSearch?: boolean\n useFilters?: boolean\n searchConfig?: DataSearchProps\n filterConfig?: DataFiltersProps\n}\n\nexport const dataListDefaults = {\n layoutBreakpoint: 768,\n orderable: true,\n loading: false,\n useSearch: true,\n useFilters: true,\n handleUrl: false,\n}\n\nexport function getDefaultFetchData(filters: FilterItem[], storageKey: string) {\n const defaultPaginator = getDefaultPaginator(storageKey)\n const defaultSort = getDefaultSort()\n const defaultSearch = getDefaultSearch()\n const defaultFilters = getDefaultFilters(filters, storageKey, true)\n\n return {\n ...defaultPaginator,\n ...defaultSort,\n ...defaultSearch,\n ...defaultFilters,\n }\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, { getDefaultPaginator } from '@/components/data-table/DataPaginator.vue'\nimport Button from '@/components/Button.vue'\nimport DataSort, { getDefaultSort, type DataSortOption } from '@/components/data-table/DataSort.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 type FilterResponse,\n type DataFiltersProps,\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'\nimport DataSearch, { getDefaultSearch, type DataSearchProps } from './DataSearch.vue'\nimport { getDefaultFilters } from '@/utils/dataFilters.ts'\n\nconst dataFiltersRef = ref<InstanceType<typeof DataFilters> | null>(null)\n\nconst props = withDefaults(defineProps<DataListProps>(), {\n ...dataListDefaults,\n searchConfig: undefined,\n filterConfig: undefined,\n})\n\nfunction resolvedHandleUrl(side: 'searchConfig' | 'filterConfig'): boolean | undefined {\n const sideConfig = props[side]\n if (sideConfig && Object.hasOwn(sideConfig as object, 'handleUrl')) {\n return (sideConfig as { handleUrl?: boolean }).handleUrl\n }\n return props.handleUrl\n}\n\nconst mergedSearchConfig = computed<DataSearchProps>(() => ({\n ...props.searchConfig,\n handleUrl: resolvedHandleUrl('searchConfig'),\n}))\n\nconst mergedFilterConfig = computed<DataFiltersProps>(() => ({\n ...(props.filterConfig as DataFiltersProps),\n handleUrl: resolvedHandleUrl('filterConfig'),\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' } | null]\n 'search-change': [filters: Record<string, string | boolean>]\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 activeFilters = ref<Record<string, unknown>>(\n props.filterConfig?.items ? getDefaultFilters(props.filterConfig.items, props.id, false) : {},\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\nconst searchChange = (value: Record<string, string | boolean>) => {\n emit('search-change', value)\n}\n\nconst sortableColumns = computed<DataSortOption[]>(() =>\n props.config.columns.filter((c) => c.sort).map((c) => ({ value: c.property, label: c.label })),\n)\n\nconst currentSort = ref<{ key: string; direction: 'asc' | 'desc' } | null>(\n props.handleUrl ? getDefaultSort() : null,\n)\n\nconst onSortChange = (sort: { key: string; direction: 'asc' | 'desc' } | null) => {\n currentSort.value = sort\n // DataSort already writes the URL when handleUrl: true; we only emit.\n emit('sort-change', sort)\n}\n</script>\n\n<template>\n <div class=\"ac-component\">\n <div ref=\"root\" class=\"c-data-list\">\n <div class=\"c-data-list__toolbar\">\n <DataSearch v-if=\"useSearch\" v-bind=\"mergedSearchConfig\" @search-change=\"searchChange\" />\n <Button\n v-if=\"useFilters && filterConfig?.items && filterConfig.items.length > 0\"\n label=\"Szűrők\"\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\n class=\"flex-center gap-1 flex-center-wrap-on-mobile\"\n v-if=\"useFilters && filterConfig?.items && filterConfig.items.length > 0\"\n >\n <FilterTags\n :filters=\"activeFilters\"\n :items=\"filterConfig.items\"\n @remove=\"(key: string) => dataFiltersRef?.clearFilter(key)\"\n @openFilter=\"openFilter\"\n />\n </div>\n <div class=\"flex-center ml-auto nowrap\">\n <DataSort\n v-if=\"sortableColumns.length > 0\"\n v-model=\"currentSort\"\n :options=\"sortableColumns\"\n :handle-url=\"handleUrl\"\n @sort-change=\"onSortChange\"\n />\n\n <Button\n icon=\"fa-solid fa-gear\"\n class=\"lh-normal settings-btn\"\n @click=\"showOptions = true\"\n />\n <Button icon=\"fa-solid fa-question\" class=\"lh-normal\" @click=\"showGuide = true\" />\n </div>\n </div>\n <DataFilters\n ref=\"dataFiltersRef\"\n v-if=\"useFilters && filterConfig?.items && filterConfig.items.length > 0\"\n v-bind=\"mergedFilterConfig\"\n :storage-key=\"id\"\n :open=\"showFilters\"\n @close=\"showFilters = false\"\n @change=\"onFilterChange\"\n />\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 :initial-sort=\"currentSort\"\n @filter-change=\"emit('filter-change', $event)\"\n @selection-change=\"emit('selection-change', $event)\"\n @sort-change=\"onSortChange\"\n >\n <template\n v-for=\"col in internalConfig.columns\"\n :key=\"col.property\"\n #[`cell:${col.property}`]=\"slotProps\"\n >\n <slot :name=\"`cell:${col.property}`\" v-bind=\"slotProps\" />\n </template>\n </DataTable>\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 <template\n v-for=\"col in internalConfig.columns\"\n :key=\"col.property\"\n #[`cell:${col.property}`]=\"slotProps\"\n >\n <slot :name=\"`cell:${col.property}`\" v-bind=\"slotProps\" />\n </template>\n </DataCards>\n\n <DataPaginator\n v-if=\"pagination && showPaginator\"\n :settings=\"pagination\"\n :storage-key=\"id\"\n :handle-url=\"handleUrl\"\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-components102.js","names":[],"sources":["../src/components/data-table/DataList.vue"],"sourcesContent":["<script lang=\"ts\">\nexport type { PaginatorSettings } from '@/types/data-list'\nexport type { DataSearchProps } from './DataSearch.vue'\nexport type { DataFiltersProps } from './DataFilters.vue'\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 loading?: boolean\n handleUrl?: boolean\n useSearch?: boolean\n useFilters?: boolean\n searchConfig?: DataSearchProps\n filterConfig?: DataFiltersProps\n}\n\nexport const dataListDefaults = {\n layoutBreakpoint: 768,\n orderable: true,\n loading: false,\n useSearch: true,\n useFilters: true,\n handleUrl: false,\n}\n\nexport function getDefaultFetchData(filters: FilterItem[], storageKey: string) {\n const defaultPaginator = getDefaultPaginator(storageKey)\n const defaultSort = getDefaultSort()\n const defaultSearch = getDefaultSearch()\n const defaultFilters = getDefaultFilters(filters, storageKey, true)\n\n return {\n ...defaultPaginator,\n ...defaultSort,\n ...defaultSearch,\n ...defaultFilters,\n }\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, { getDefaultPaginator } from '@/components/data-table/DataPaginator.vue'\nimport Button from '@/components/Button.vue'\nimport DataSort, { getDefaultSort, type DataSortOption } from '@/components/data-table/DataSort.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 type FilterResponse,\n type DataFiltersProps,\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'\nimport DataSearch, { getDefaultSearch, type DataSearchProps } from './DataSearch.vue'\nimport { getDefaultFilters } from '@/utils/dataFilters.ts'\n\nconst dataFiltersRef = ref<InstanceType<typeof DataFilters> | null>(null)\n\nconst props = withDefaults(defineProps<DataListProps>(), {\n ...dataListDefaults,\n searchConfig: undefined,\n filterConfig: undefined,\n})\n\nfunction resolvedHandleUrl(side: 'searchConfig' | 'filterConfig'): boolean | undefined {\n const sideConfig = props[side]\n if (sideConfig && Object.hasOwn(sideConfig as object, 'handleUrl')) {\n return (sideConfig as { handleUrl?: boolean }).handleUrl\n }\n return props.handleUrl\n}\n\nconst mergedSearchConfig = computed<DataSearchProps>(() => ({\n ...props.searchConfig,\n handleUrl: resolvedHandleUrl('searchConfig'),\n}))\n\nconst mergedFilterConfig = computed<DataFiltersProps>(() => ({\n ...(props.filterConfig as DataFiltersProps),\n handleUrl: resolvedHandleUrl('filterConfig'),\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' } | null]\n 'search-change': [filters: Record<string, string | boolean>]\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 activeFilters = ref<Record<string, unknown>>(\n props.filterConfig?.items ? getDefaultFilters(props.filterConfig.items, props.id, false) : {},\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\nconst searchChange = (value: Record<string, string | boolean>) => {\n emit('search-change', value)\n}\n\nconst sortableColumns = computed<DataSortOption[]>(() =>\n props.config.columns.filter((c) => c.sort).map((c) => ({ value: c.property, label: c.label })),\n)\n\nconst currentSort = ref<{ key: string; direction: 'asc' | 'desc' } | null>(\n props.handleUrl ? getDefaultSort() : null,\n)\n\nconst onSortChange = (sort: { key: string; direction: 'asc' | 'desc' } | null) => {\n currentSort.value = sort\n // DataSort already writes the URL when handleUrl: true; we only emit.\n emit('sort-change', sort)\n}\n</script>\n\n<template>\n <div class=\"ac-component\">\n <div ref=\"root\" class=\"c-data-list\">\n <div class=\"c-data-list__toolbar\">\n <DataSearch v-if=\"useSearch\" v-bind=\"mergedSearchConfig\" @search-change=\"searchChange\" />\n <Button\n v-if=\"useFilters && filterConfig?.items && filterConfig.items.length > 0\"\n label=\"Szűrők\"\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\n class=\"flex-center gap-1 flex-center-wrap-on-mobile\"\n v-if=\"useFilters && filterConfig?.items && filterConfig.items.length > 0\"\n >\n <FilterTags\n :filters=\"activeFilters\"\n :items=\"filterConfig.items\"\n @remove=\"(key: string) => dataFiltersRef?.clearFilter(key)\"\n @openFilter=\"openFilter\"\n />\n </div>\n <div class=\"flex-center ml-auto nowrap\">\n <DataSort\n v-if=\"sortableColumns.length > 0\"\n v-model=\"currentSort\"\n :options=\"sortableColumns\"\n :handle-url=\"handleUrl\"\n @sort-change=\"onSortChange\"\n />\n\n <Button\n icon=\"fa-solid fa-gear\"\n class=\"lh-normal settings-btn\"\n @click=\"showOptions = true\"\n />\n <Button icon=\"fa-solid fa-question\" class=\"lh-normal\" @click=\"showGuide = true\" />\n </div>\n </div>\n <DataFilters\n ref=\"dataFiltersRef\"\n v-if=\"useFilters && filterConfig?.items && filterConfig.items.length > 0\"\n v-bind=\"mergedFilterConfig\"\n :storage-key=\"id\"\n :open=\"showFilters\"\n @close=\"showFilters = false\"\n @change=\"onFilterChange\"\n />\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 :initial-sort=\"currentSort\"\n @filter-change=\"emit('filter-change', $event)\"\n @selection-change=\"emit('selection-change', $event)\"\n @sort-change=\"onSortChange\"\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 :handle-url=\"handleUrl\"\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
|
+
{"version":3,"file":"admins-components102.js","names":[],"sources":["../src/components/data-table/DataList.vue"],"sourcesContent":["<script lang=\"ts\">\nexport type { PaginatorSettings } from '@/types/data-list'\nexport type { DataSearchProps } from './DataSearch.vue'\nexport type { DataFiltersProps } from './DataFilters.vue'\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 loading?: boolean\n handleUrl?: boolean\n useSearch?: boolean\n useFilters?: boolean\n searchConfig?: DataSearchProps\n filterConfig?: DataFiltersProps\n}\n\nexport const dataListDefaults = {\n layoutBreakpoint: 768,\n orderable: true,\n loading: false,\n useSearch: true,\n useFilters: true,\n handleUrl: false,\n}\n\nexport function getDefaultFetchData(filters: FilterItem[], storageKey: string) {\n const defaultPaginator = getDefaultPaginator(storageKey)\n const defaultSort = getDefaultSort()\n const defaultSearch = getDefaultSearch()\n const defaultFilters = getDefaultFilters(filters, storageKey, true)\n\n return {\n ...defaultPaginator,\n ...defaultSort,\n ...defaultSearch,\n ...defaultFilters,\n }\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, { getDefaultPaginator } from '@/components/data-table/DataPaginator.vue'\nimport Button from '@/components/Button.vue'\nimport DataSort, { getDefaultSort, type DataSortOption } from '@/components/data-table/DataSort.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 type FilterResponse,\n type DataFiltersProps,\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'\nimport DataSearch, { getDefaultSearch, type DataSearchProps } from './DataSearch.vue'\nimport { getDefaultFilters } from '@/utils/dataFilters.ts'\n\nconst dataFiltersRef = ref<InstanceType<typeof DataFilters> | null>(null)\n\nconst props = withDefaults(defineProps<DataListProps>(), {\n ...dataListDefaults,\n searchConfig: undefined,\n filterConfig: undefined,\n})\n\nfunction resolvedHandleUrl(side: 'searchConfig' | 'filterConfig'): boolean | undefined {\n const sideConfig = props[side]\n if (sideConfig && Object.hasOwn(sideConfig as object, 'handleUrl')) {\n return (sideConfig as { handleUrl?: boolean }).handleUrl\n }\n return props.handleUrl\n}\n\nconst mergedSearchConfig = computed<DataSearchProps>(() => ({\n ...props.searchConfig,\n handleUrl: resolvedHandleUrl('searchConfig'),\n}))\n\nconst mergedFilterConfig = computed<DataFiltersProps>(() => ({\n ...(props.filterConfig as DataFiltersProps),\n handleUrl: resolvedHandleUrl('filterConfig'),\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' } | null]\n 'search-change': [filters: Record<string, string | boolean>]\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 activeFilters = ref<Record<string, unknown>>(\n props.filterConfig?.items ? getDefaultFilters(props.filterConfig.items, props.id, false) : {},\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\nconst searchChange = (value: Record<string, string | boolean>) => {\n emit('search-change', value)\n}\n\nconst sortableColumns = computed<DataSortOption[]>(() =>\n props.config.columns.filter((c) => c.sort).map((c) => ({ value: c.property, label: c.label })),\n)\n\nconst currentSort = ref<{ key: string; direction: 'asc' | 'desc' } | null>(\n props.handleUrl ? getDefaultSort() : null,\n)\n\nconst onSortChange = (sort: { key: string; direction: 'asc' | 'desc' } | null) => {\n currentSort.value = sort\n // DataSort already writes the URL when handleUrl: true; we only emit.\n emit('sort-change', sort)\n}\n</script>\n\n<template>\n <div class=\"ac-component\">\n <div ref=\"root\" class=\"c-data-list\">\n <div class=\"c-data-list__toolbar\">\n <DataSearch v-if=\"useSearch\" v-bind=\"mergedSearchConfig\" @search-change=\"searchChange\" />\n <Button\n v-if=\"useFilters && filterConfig?.items && filterConfig.items.length > 0\"\n label=\"Szűrők\"\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\n class=\"flex-center gap-1 flex-center-wrap-on-mobile\"\n v-if=\"useFilters && filterConfig?.items && filterConfig.items.length > 0\"\n >\n <FilterTags\n :filters=\"activeFilters\"\n :items=\"filterConfig.items\"\n @remove=\"(key: string) => dataFiltersRef?.clearFilter(key)\"\n @openFilter=\"openFilter\"\n />\n </div>\n <div class=\"flex-center ml-auto nowrap\">\n <DataSort\n v-if=\"sortableColumns.length > 0\"\n v-model=\"currentSort\"\n :options=\"sortableColumns\"\n :handle-url=\"handleUrl\"\n @sort-change=\"onSortChange\"\n />\n\n <Button\n icon=\"fa-solid fa-gear\"\n class=\"lh-normal settings-btn\"\n @click=\"showOptions = true\"\n />\n <Button icon=\"fa-solid fa-question\" class=\"lh-normal\" @click=\"showGuide = true\" />\n </div>\n </div>\n <DataFilters\n ref=\"dataFiltersRef\"\n v-if=\"useFilters && filterConfig?.items && filterConfig.items.length > 0\"\n v-bind=\"mergedFilterConfig\"\n :storage-key=\"id\"\n :open=\"showFilters\"\n @close=\"showFilters = false\"\n @change=\"onFilterChange\"\n />\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 :initial-sort=\"currentSort\"\n @filter-change=\"emit('filter-change', $event)\"\n @selection-change=\"emit('selection-change', $event)\"\n @sort-change=\"onSortChange\"\n >\n <template\n v-for=\"col in internalConfig.columns\"\n :key=\"col.property\"\n #[`cell:${col.property}`]=\"slotProps\"\n >\n <slot :name=\"`cell:${col.property}`\" v-bind=\"slotProps\" />\n </template>\n </DataTable>\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 <template\n v-for=\"col in internalConfig.columns\"\n :key=\"col.property\"\n #[`cell:${col.property}`]=\"slotProps\"\n >\n <slot :name=\"`cell:${col.property}`\" v-bind=\"slotProps\" />\n </template>\n </DataCards>\n\n <DataPaginator\n v-if=\"pagination && showPaginator\"\n :settings=\"pagination\"\n :storage-key=\"id\"\n :handle-url=\"handleUrl\"\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,8 @@
|
|
|
1
1
|
import e from "./admins-components6.js";
|
|
2
2
|
import t from "./admins-components40.js";
|
|
3
|
-
import { createBlock as n, createElementVNode as r, createVNode as i, defineComponent as a, openBlock as o,
|
|
3
|
+
import { createBlock as n, createElementVNode as r, createVNode as i, defineComponent as a, openBlock as o, withCtx as s } from "vue";
|
|
4
4
|
//#region src/components/ConfirmModal.vue?vue&type=script&setup=true&lang.ts
|
|
5
|
-
var
|
|
5
|
+
var c = ["innerHTML"], l = /* @__PURE__ */ a({
|
|
6
6
|
__name: "ConfirmModal",
|
|
7
7
|
props: {
|
|
8
8
|
title: {},
|
|
@@ -12,26 +12,29 @@ var l = { class: "c-confirm-modal-message" }, u = /* @__PURE__ */ a({
|
|
|
12
12
|
type: { default: "normal" }
|
|
13
13
|
},
|
|
14
14
|
emits: ["confirm", "cancel"],
|
|
15
|
-
setup(a, { emit:
|
|
16
|
-
let
|
|
17
|
-
return (
|
|
15
|
+
setup(a, { emit: l }) {
|
|
16
|
+
let u = l;
|
|
17
|
+
return (l, d) => (o(), n(t, {
|
|
18
18
|
title: a.title,
|
|
19
|
-
onClose:
|
|
19
|
+
onClose: d[2] ||= (e) => u("cancel")
|
|
20
20
|
}, {
|
|
21
|
-
footer:
|
|
21
|
+
footer: s(() => [i(e, {
|
|
22
22
|
label: a.cancelLabel,
|
|
23
23
|
type: "normal",
|
|
24
24
|
outline: "",
|
|
25
|
-
onClick:
|
|
25
|
+
onClick: d[0] ||= (e) => u("cancel")
|
|
26
26
|
}, null, 8, ["label"]), i(e, {
|
|
27
27
|
label: a.confirmLabel,
|
|
28
28
|
type: a.type,
|
|
29
|
-
onClick:
|
|
29
|
+
onClick: d[1] ||= (e) => u("confirm")
|
|
30
30
|
}, null, 8, ["label", "type"])]),
|
|
31
|
-
default:
|
|
31
|
+
default: s(() => [r("p", {
|
|
32
|
+
class: "c-confirm-modal-message",
|
|
33
|
+
innerHTML: a.message
|
|
34
|
+
}, null, 8, c)]),
|
|
32
35
|
_: 1
|
|
33
36
|
}, 8, ["title"]));
|
|
34
37
|
}
|
|
35
38
|
});
|
|
36
39
|
//#endregion
|
|
37
|
-
export {
|
|
40
|
+
export { l as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"admins-components41.js","names":[],"sources":["../src/components/ConfirmModal.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface ConfirmModalProps {\n title?: string\n message: string\n confirmLabel?: string\n cancelLabel?: string\n type?: ButtonType\n}\n</script>\n\n<script setup lang=\"ts\">\nimport Modal from '@/components/Modal.vue'\nimport Button, { type ButtonType } from '@/components/Button.vue'\n\nwithDefaults(defineProps<ConfirmModalProps>(), {\n confirmLabel: 'Rendben',\n cancelLabel: 'Mégse',\n type: 'normal',\n})\n\nconst emit = defineEmits<{\n confirm: []\n cancel: []\n}>()\n</script>\n\n<template>\n <Modal :title=\"title\" @close=\"emit('cancel')\">\n <p class=\"c-confirm-modal-message\"
|
|
1
|
+
{"version":3,"file":"admins-components41.js","names":[],"sources":["../src/components/ConfirmModal.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface ConfirmModalProps {\n title?: string\n message: string\n confirmLabel?: string\n cancelLabel?: string\n type?: ButtonType\n}\n</script>\n\n<script setup lang=\"ts\">\nimport Modal from '@/components/Modal.vue'\nimport Button, { type ButtonType } from '@/components/Button.vue'\n\nwithDefaults(defineProps<ConfirmModalProps>(), {\n confirmLabel: 'Rendben',\n cancelLabel: 'Mégse',\n type: 'normal',\n})\n\nconst emit = defineEmits<{\n confirm: []\n cancel: []\n}>()\n</script>\n\n<template>\n <Modal :title=\"title\" @close=\"emit('cancel')\">\n <p class=\"c-confirm-modal-message\" v-html=\"message\"></p>\n <template #footer>\n <Button :label=\"cancelLabel\" type=\"normal\" outline @click=\"emit('cancel')\" />\n <Button :label=\"confirmLabel\" :type=\"type\" @click=\"emit('confirm')\" />\n </template>\n </Modal>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;EAoBA,IAAM,IAAO;yBAOX,EAMQ,GAAA;GANA,OAAO,EAAA;GAAQ,SAAK,AAAA,EAAA,QAAA,MAAE,EAAI,QAAA;;GAErB,QAAM,QAC8D,CAA7E,EAA6E,GAAA;IAApE,OAAO,EAAA;IAAa,MAAK;IAAS,SAAA;IAAS,SAAK,AAAA,EAAA,QAAA,MAAE,EAAI,QAAA;2BAC/D,EAAsE,GAAA;IAA7D,OAAO,EAAA;IAAe,MAAM,EAAA;IAAO,SAAK,AAAA,EAAA,QAAA,MAAE,EAAI,SAAA;;oBAHD,CAAxD,EAAwD,KAAA;IAArD,OAAM;IAA0B,WAAQ,EAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"admins-components42.js","names":[],"sources":["../src/components/ConfirmModal.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface ConfirmModalProps {\n title?: string\n message: string\n confirmLabel?: string\n cancelLabel?: string\n type?: ButtonType\n}\n</script>\n\n<script setup lang=\"ts\">\nimport Modal from '@/components/Modal.vue'\nimport Button, { type ButtonType } from '@/components/Button.vue'\n\nwithDefaults(defineProps<ConfirmModalProps>(), {\n confirmLabel: 'Rendben',\n cancelLabel: 'Mégse',\n type: 'normal',\n})\n\nconst emit = defineEmits<{\n confirm: []\n cancel: []\n}>()\n</script>\n\n<template>\n <Modal :title=\"title\" @close=\"emit('cancel')\">\n <p class=\"c-confirm-modal-message\"
|
|
1
|
+
{"version":3,"file":"admins-components42.js","names":[],"sources":["../src/components/ConfirmModal.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface ConfirmModalProps {\n title?: string\n message: string\n confirmLabel?: string\n cancelLabel?: string\n type?: ButtonType\n}\n</script>\n\n<script setup lang=\"ts\">\nimport Modal from '@/components/Modal.vue'\nimport Button, { type ButtonType } from '@/components/Button.vue'\n\nwithDefaults(defineProps<ConfirmModalProps>(), {\n confirmLabel: 'Rendben',\n cancelLabel: 'Mégse',\n type: 'normal',\n})\n\nconst emit = defineEmits<{\n confirm: []\n cancel: []\n}>()\n</script>\n\n<template>\n <Modal :title=\"title\" @close=\"emit('cancel')\">\n <p class=\"c-confirm-modal-message\" v-html=\"message\"></p>\n <template #footer>\n <Button :label=\"cancelLabel\" type=\"normal\" outline @click=\"emit('cancel')\" />\n <Button :label=\"confirmLabel\" :type=\"type\" @click=\"emit('confirm')\" />\n </template>\n </Modal>\n</template>\n"],"mappings":""}
|
|
@@ -2,18 +2,18 @@ import e from "./admins-components25.js";
|
|
|
2
2
|
import t from "./admins-components45.js";
|
|
3
3
|
import { getColumnValue as n } from "./admins-components59.js";
|
|
4
4
|
import { shortUuid as r } from "./admins-components60.js";
|
|
5
|
-
import { computed as i, createBlock as a, createCommentVNode as o, createElementBlock as s, createElementVNode as c, createVNode as l, defineComponent as u, isVNode as d, openBlock as f,
|
|
5
|
+
import { computed as i, createBlock as a, createCommentVNode as o, createElementBlock as s, createElementVNode as c, createVNode as l, defineComponent as u, isVNode as d, openBlock as f, renderSlot as p, resolveDirective as m, resolveDynamicComponent as h, toDisplayString as g, withDirectives as _ } from "vue";
|
|
6
6
|
//#region src/components/data-table/DataCell.vue?vue&type=script&setup=true&lang.ts
|
|
7
|
-
var
|
|
7
|
+
var v = { class: "dc-cell" }, y = {
|
|
8
8
|
key: 0,
|
|
9
9
|
class: "dc-loading"
|
|
10
|
-
},
|
|
10
|
+
}, b = { key: 2 }, x = ["innerHTML"], S = {
|
|
11
11
|
key: 3,
|
|
12
12
|
class: "dc-datetime"
|
|
13
|
-
},
|
|
13
|
+
}, C = { class: "dc-datetime__part" }, w = {
|
|
14
14
|
key: 0,
|
|
15
15
|
class: "dc-datetime__sep"
|
|
16
|
-
},
|
|
16
|
+
}, T = { class: "dc-datetime__part" }, E = { key: 4 }, D = ["innerHTML"], O = /* @__PURE__ */ u({
|
|
17
17
|
__name: "DataCell",
|
|
18
18
|
props: {
|
|
19
19
|
item: {},
|
|
@@ -24,9 +24,9 @@ var _ = { class: "dc-cell" }, v = {
|
|
|
24
24
|
}
|
|
25
25
|
},
|
|
26
26
|
setup(u) {
|
|
27
|
-
let
|
|
28
|
-
if (
|
|
29
|
-
let e =
|
|
27
|
+
let O = u, k = i(() => n(O.item, O.col)), A = i(() => d(k.value)), j = i(() => r()(k.value)), M = i(() => {
|
|
28
|
+
if (O.col.type !== "datetime") return null;
|
|
29
|
+
let e = k.value;
|
|
30
30
|
if (!e) return {
|
|
31
31
|
date: "",
|
|
32
32
|
time: ""
|
|
@@ -41,27 +41,31 @@ var _ = { class: "dc-cell" }, v = {
|
|
|
41
41
|
};
|
|
42
42
|
});
|
|
43
43
|
return (n, r) => {
|
|
44
|
-
let i =
|
|
45
|
-
return f(), s("span",
|
|
44
|
+
let i = m("tooltip");
|
|
45
|
+
return f(), s("span", v, [p(n.$slots, "cell", {
|
|
46
|
+
item: u.item,
|
|
47
|
+
col: u.col,
|
|
48
|
+
value: k.value
|
|
49
|
+
}, () => [u.col.loading?.() ? (f(), s("span", y, [l(e, {
|
|
46
50
|
loading: !0,
|
|
47
51
|
size: "1rem"
|
|
48
|
-
})])) :
|
|
52
|
+
})])) : A.value ? (f(), a(h(k.value), { key: 1 })) : u.col.type === "uuid" ? _((f(), s("span", b, [c("span", { innerHTML: j.value }, null, 8, x), u.copy && k.value ? (f(), a(t, {
|
|
49
53
|
key: 0,
|
|
50
|
-
value:
|
|
51
|
-
}, null, 8, ["value"])) : o("", !0)])), [[i,
|
|
52
|
-
c("span",
|
|
53
|
-
|
|
54
|
-
c("span",
|
|
55
|
-
u.copy &&
|
|
54
|
+
value: k.value
|
|
55
|
+
}, null, 8, ["value"])) : o("", !0)])), [[i, k.value]]) : u.col.type === "datetime" ? (f(), s("span", S, [
|
|
56
|
+
c("span", C, g(M.value?.date), 1),
|
|
57
|
+
M.value?.time ? (f(), s("span", w)) : o("", !0),
|
|
58
|
+
c("span", T, g(M.value?.time), 1),
|
|
59
|
+
u.copy && k.value ? (f(), a(t, {
|
|
56
60
|
key: 1,
|
|
57
|
-
value:
|
|
61
|
+
value: k.value
|
|
58
62
|
}, null, 8, ["value"])) : o("", !0)
|
|
59
|
-
])) : (f(), s("span",
|
|
63
|
+
])) : (f(), s("span", E, [c("span", { innerHTML: k.value }, null, 8, D), u.copy && k.value ? (f(), a(t, {
|
|
60
64
|
key: 0,
|
|
61
|
-
value:
|
|
62
|
-
}, null, 8, ["value"])) : o("", !0)]))]);
|
|
65
|
+
value: k.value
|
|
66
|
+
}, null, 8, ["value"])) : o("", !0)]))])]);
|
|
63
67
|
};
|
|
64
68
|
}
|
|
65
69
|
});
|
|
66
70
|
//#endregion
|
|
67
|
-
export {
|
|
71
|
+
export { O as default };
|