adverich-kun-ui 0.1.318 → 0.1.319
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,77 +1,76 @@
|
|
|
1
|
-
import { mergeModels as W, toRefs as be, useModel as Se, ref as
|
|
2
|
-
import { isMobile as
|
|
1
|
+
import { mergeModels as W, toRefs as be, useModel as Se, ref as v, watch as Q, computed as q, onMounted as Ce, createElementBlock as r, openBlock as l, mergeProps as B, createCommentVNode as u, createElementVNode as V, renderSlot as a, createBlock as b, unref as s, normalizeClass as S, withCtx as j, createVNode as C, withDirectives as G, vModelText as Te, vShow as J, normalizeProps as d, guardReactiveProps as g, Fragment as ke, createSlots as X, renderList as Y, toDisplayString as Fe, isRef as $e, nextTick as Pe } from "vue";
|
|
2
|
+
import { isMobile as m } from "../../../../utils/_platform.js";
|
|
3
3
|
import Z from "../../../KunIcon/src/components/KunIcon.vue.js";
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
import
|
|
8
|
-
import
|
|
9
|
-
import
|
|
10
|
-
import
|
|
11
|
-
import
|
|
12
|
-
import
|
|
13
|
-
import
|
|
14
|
-
import
|
|
15
|
-
import He from "../composables/
|
|
16
|
-
import Ne from "../composables/
|
|
17
|
-
import De from "../composables/KunTableProps.js";
|
|
4
|
+
import Me from "../../../../icons/IconFilter.vue.js";
|
|
5
|
+
import Ae from "../../../../icons/IconSearch.vue.js";
|
|
6
|
+
import Ie from "./KunTableHeaders.vue.js";
|
|
7
|
+
import Re from "./KunTableFooter.vue.js";
|
|
8
|
+
import Ee from "./KunTableRows.vue.js";
|
|
9
|
+
import Be from "./KunTableIterators.vue.js";
|
|
10
|
+
import Ve from "../../../KunBtn/src/components/KunBtn.vue.js";
|
|
11
|
+
import je from "./KunTableFilter.vue.js";
|
|
12
|
+
import xe from "../composables/useExpand.js";
|
|
13
|
+
import ze from "../composables/useOptions.js";
|
|
14
|
+
import De from "../composables/useSelect.js";
|
|
15
|
+
import He from "../composables/useFilter.js";
|
|
16
|
+
import Ne from "../composables/KunTableProps.js";
|
|
18
17
|
const Ke = ["placeholder"], Le = { class: "flex-1 overflow-auto" }, Ue = { key: 0 }, Oe = { key: 5 }, We = {
|
|
19
|
-
key:
|
|
20
|
-
class: "h-full"
|
|
21
|
-
}, Qe = {
|
|
18
|
+
key: 1,
|
|
19
|
+
class: "h-full flex justify-center items-center"
|
|
20
|
+
}, Qe = { class: "text-center text-4xl" }, qe = {
|
|
22
21
|
key: 1,
|
|
23
22
|
class: "sticky bottom-0 z-10 print:hidden"
|
|
24
|
-
},
|
|
23
|
+
}, Ge = "overflow-hidden h-full w-full flex flex-col border border-slate-200 dark:border-slate-800 rounded", Je = "table-auto w-full h-fit text-sm text-left", ps = {
|
|
25
24
|
__name: "KunTable",
|
|
26
|
-
props: /* @__PURE__ */ W(
|
|
25
|
+
props: /* @__PURE__ */ W(Ne(), {
|
|
27
26
|
selectedItems: { type: Array, default: () => [] },
|
|
28
27
|
selectedItemsModifiers: {}
|
|
29
28
|
}),
|
|
30
29
|
emits: /* @__PURE__ */ W(["update:page", "update:itemsPerPage", "update:sortBy", "update:search"], ["update:selectedItems"]),
|
|
31
|
-
setup(
|
|
32
|
-
const
|
|
33
|
-
headers:
|
|
34
|
-
showExpand:
|
|
30
|
+
setup(x, { emit: _ }) {
|
|
31
|
+
const z = _, p = x, T = be(p), ee = Se(x, "selectedItems"), {
|
|
32
|
+
headers: D,
|
|
33
|
+
showExpand: k,
|
|
35
34
|
showSelect: F,
|
|
36
|
-
rowClass:
|
|
35
|
+
rowClass: H,
|
|
37
36
|
hideDefaultFooter: se,
|
|
38
37
|
hideDefaultHeader: oe,
|
|
39
38
|
tableClass: te,
|
|
40
39
|
wrapperClass: le,
|
|
41
40
|
pageOptions: ae,
|
|
42
41
|
items: ne,
|
|
43
|
-
searchable:
|
|
42
|
+
searchable: N,
|
|
44
43
|
debounceTime: re
|
|
45
|
-
} = T, w =
|
|
46
|
-
Q(() =>
|
|
44
|
+
} = T, w = v(p.search);
|
|
45
|
+
Q(() => p.search, (e) => {
|
|
47
46
|
e !== w.value && (w.value = e);
|
|
48
47
|
});
|
|
49
|
-
const { filteredItems: ie, setSearch: ce, modalFilter:
|
|
48
|
+
const { filteredItems: ie, setSearch: ce, modalFilter: y, applyColumnFilters: ue, clearFilters: de, appliedFilters: pe } = He(T, re);
|
|
50
49
|
Q(w, (e) => {
|
|
51
|
-
|
|
50
|
+
z("update:search", e), ce(e);
|
|
52
51
|
});
|
|
53
|
-
const { options:
|
|
52
|
+
const { options: i, paginatedItems: f, updateSort: me } = ze(T, z, ie), { isSelected: $, toggleSelect: P, toggleSelectAll: fe, allSelected: he, someSelected: ge } = De(f, ee), { isExpanded: M, toggleExpand: A } = xe(), h = q(() => ({
|
|
54
53
|
items: f.value,
|
|
55
|
-
headers:
|
|
56
|
-
page:
|
|
57
|
-
itemsPerPage:
|
|
54
|
+
headers: D.value,
|
|
55
|
+
page: i.page,
|
|
56
|
+
itemsPerPage: i.itemsPerPage,
|
|
58
57
|
toggleSelect: P,
|
|
59
|
-
isSelected:
|
|
58
|
+
isSelected: $,
|
|
60
59
|
toggleExpand: A,
|
|
61
60
|
isExpanded: M,
|
|
62
|
-
sortBy:
|
|
63
|
-
hasActions:
|
|
64
|
-
})), we = [
|
|
65
|
-
var t,
|
|
61
|
+
sortBy: i.sortBy,
|
|
62
|
+
hasActions: p.hasActions
|
|
63
|
+
})), we = [Ge, le.value], ye = [Je, te.value], K = q(() => p.headers.map((e) => {
|
|
64
|
+
var t, c;
|
|
66
65
|
const o = { ...e };
|
|
67
66
|
if ((e.columnType === "function" || e.columnType == "objectFunction" || e.columnType == "simpleFunction") && typeof e.columnFunction == "string") {
|
|
68
|
-
const n = (t =
|
|
67
|
+
const n = (t = p.functionMap) == null ? void 0 : t[e.columnFunction];
|
|
69
68
|
typeof n == "function" ? o.columnFunction = n : (console.warn(
|
|
70
69
|
`[KunTable] No se encontró la función "${e.columnFunction}" en functionMap`
|
|
71
70
|
), o.columnFunction = () => "");
|
|
72
71
|
}
|
|
73
72
|
if (e.columnFormat === "function" && typeof e.columnRowText == "string") {
|
|
74
|
-
const n = (
|
|
73
|
+
const n = (c = p.functionMap) == null ? void 0 : c[e.columnRowText];
|
|
75
74
|
typeof n == "function" ? o.columnRowText = n : (console.warn(
|
|
76
75
|
`[KunTable] No se encontró la función "${e.columnRowText}" en functionMap`
|
|
77
76
|
), o.columnRowText = () => "");
|
|
@@ -79,55 +78,55 @@ const Ke = ["placeholder"], Le = { class: "flex-1 overflow-auto" }, Ue = { key:
|
|
|
79
78
|
return o;
|
|
80
79
|
}));
|
|
81
80
|
Ce(() => U());
|
|
82
|
-
const L =
|
|
83
|
-
function
|
|
84
|
-
|
|
81
|
+
const L = v(null), I = v(!0), R = v(!1);
|
|
82
|
+
function ve() {
|
|
83
|
+
m.value && (O(), Pe(() => {
|
|
85
84
|
L.value.focus();
|
|
86
85
|
}));
|
|
87
86
|
}
|
|
88
87
|
function U() {
|
|
89
|
-
|
|
88
|
+
m.value && (E.value = "w-fit", I.value = !1, R.value = !0);
|
|
90
89
|
}
|
|
91
90
|
function O() {
|
|
92
|
-
|
|
91
|
+
m.value && (E.value = "w-full border", R.value = !1, I.value = !0);
|
|
93
92
|
}
|
|
94
|
-
const E =
|
|
95
|
-
return (e, o) => (l(),
|
|
96
|
-
s(
|
|
93
|
+
const E = v("w-full border max-w-sm");
|
|
94
|
+
return (e, o) => (l(), r("div", B({ class: we }, e.$attrs, { style: { "user-select": "text" } }), [
|
|
95
|
+
s(N) || e.filterable || e.$slots.prependSearch || e.$slots.appendSearch ? (l(), r("div", {
|
|
97
96
|
key: 0,
|
|
98
|
-
class:
|
|
97
|
+
class: S(["p-2 bg-slate-200 dark:bg-slate-800 print:hidden", {
|
|
99
98
|
"justify-start flex": e.searchPosition === "start",
|
|
100
99
|
"justify-center flex": e.searchPosition === "center",
|
|
101
100
|
"justify-end flex": e.searchPosition === "end"
|
|
102
101
|
}])
|
|
103
102
|
}, [
|
|
104
103
|
a(e.$slots, "prependSearch"),
|
|
105
|
-
e.filterable && e.filters.length ? (l(),
|
|
104
|
+
e.filterable && e.filters.length ? (l(), b(Ve, {
|
|
106
105
|
key: 0,
|
|
107
106
|
class: "h-fit",
|
|
108
|
-
onClick: o[0] || (o[0] = (t) =>
|
|
107
|
+
onClick: o[0] || (o[0] = (t) => y.value = !0),
|
|
109
108
|
rounded: "rounded-full",
|
|
110
109
|
size: "xs",
|
|
111
110
|
bgColor: "bg-green-200 dark:bg-green-800"
|
|
112
111
|
}, {
|
|
113
|
-
default:
|
|
114
|
-
|
|
112
|
+
default: j(() => [
|
|
113
|
+
C(Z, {
|
|
115
114
|
class: "h-fit",
|
|
116
|
-
icon:
|
|
115
|
+
icon: Me,
|
|
117
116
|
size: "text-lg"
|
|
118
117
|
})
|
|
119
118
|
]),
|
|
120
119
|
_: 1
|
|
121
120
|
})) : u("", !0),
|
|
122
|
-
s(
|
|
121
|
+
s(N) ? (l(), r("div", {
|
|
123
122
|
key: 1,
|
|
124
|
-
class:
|
|
123
|
+
class: S(["rounded flex mx-2", [E.value]])
|
|
125
124
|
}, [
|
|
126
125
|
G(V("input", {
|
|
127
126
|
"onUpdate:modelValue": o[1] || (o[1] = (t) => w.value = t),
|
|
128
127
|
type: "text",
|
|
129
128
|
placeholder: e.searchPlaceholder,
|
|
130
|
-
class:
|
|
129
|
+
class: S(["w-full text-sm", s(m) ? "px-1" : "px-2 py-1"]),
|
|
131
130
|
ref_key: "searchRef",
|
|
132
131
|
ref: L,
|
|
133
132
|
onFocus: O,
|
|
@@ -136,9 +135,9 @@ const Ke = ["placeholder"], Le = { class: "flex-1 overflow-auto" }, Ue = { key:
|
|
|
136
135
|
[Te, w.value],
|
|
137
136
|
[J, I.value]
|
|
138
137
|
]),
|
|
139
|
-
G(
|
|
140
|
-
icon:
|
|
141
|
-
onClick:
|
|
138
|
+
G(C(Z, {
|
|
139
|
+
icon: Ae,
|
|
140
|
+
onClick: ve
|
|
142
141
|
}, null, 512), [
|
|
143
142
|
[J, R.value]
|
|
144
143
|
])
|
|
@@ -146,18 +145,19 @@ const Ke = ["placeholder"], Le = { class: "flex-1 overflow-auto" }, Ue = { key:
|
|
|
146
145
|
a(e.$slots, "appendSearch")
|
|
147
146
|
], 2)) : u("", !0),
|
|
148
147
|
V("div", Le, [
|
|
149
|
-
|
|
150
|
-
|
|
148
|
+
s(f).length ? (l(), r("table", {
|
|
149
|
+
key: 0,
|
|
150
|
+
class: S(ye)
|
|
151
151
|
}, [
|
|
152
|
-
e.$slots.colgroup && !s(
|
|
152
|
+
e.$slots.colgroup && !s(m) ? (l(), r("colgroup", Ue, [
|
|
153
153
|
a(e.$slots, "colgroup", d(g(h.value)))
|
|
154
154
|
])) : u("", !0),
|
|
155
|
-
!s(oe) && !s(
|
|
155
|
+
!s(oe) && !s(m) ? (l(), b(Ie, {
|
|
156
156
|
key: 1,
|
|
157
|
-
headers: s(
|
|
158
|
-
"sort-by": s(
|
|
157
|
+
headers: s(D),
|
|
158
|
+
"sort-by": s(i).sortBy,
|
|
159
159
|
"show-select": s(F),
|
|
160
|
-
"show-expand": s(
|
|
160
|
+
"show-expand": s(k),
|
|
161
161
|
"all-selected": s(he),
|
|
162
162
|
"some-selected": s(ge),
|
|
163
163
|
"thead-class": e.theadClass,
|
|
@@ -169,86 +169,82 @@ const Ke = ["placeholder"], Le = { class: "flex-1 overflow-auto" }, Ue = { key:
|
|
|
169
169
|
onToggleSelectAll: s(fe),
|
|
170
170
|
customHeaders: e.customSlots
|
|
171
171
|
}, null, 8, ["headers", "sort-by", "show-select", "show-expand", "all-selected", "some-selected", "thead-class", "tr-class", "th-class", "has-actions", "action-label", "onSort", "onToggleSelectAll", "customHeaders"])) : a(e.$slots, "thead", d(B({ key: 2 }, h.value))),
|
|
172
|
-
s(
|
|
172
|
+
s(m) ? (l(), b(Be, {
|
|
173
|
+
key: 4,
|
|
174
|
+
items: s(f),
|
|
175
|
+
headers: K.value,
|
|
176
|
+
"row-class": s(H),
|
|
177
|
+
"row-class-condition": e.rowClassCondition,
|
|
178
|
+
"is-selected": s($),
|
|
179
|
+
"is-expanded": s(M),
|
|
180
|
+
"show-select": s(F),
|
|
181
|
+
"show-expand": s(k),
|
|
182
|
+
"has-actions": e.hasActions,
|
|
183
|
+
"action-loading-map": e.actionLoadingMap,
|
|
184
|
+
onToggleExpand: s(A),
|
|
185
|
+
onToggleSelect: s(P),
|
|
186
|
+
customSlots: e.customSlots
|
|
187
|
+
}, X({ _: 2 }, [
|
|
188
|
+
Y(e.$slots, (t, c) => ({
|
|
189
|
+
name: c,
|
|
190
|
+
fn: j((n) => [
|
|
191
|
+
a(e.$slots, c, d(g(n)))
|
|
192
|
+
])
|
|
193
|
+
}))
|
|
194
|
+
]), 1032, ["items", "headers", "row-class", "row-class-condition", "is-selected", "is-expanded", "show-select", "show-expand", "has-actions", "action-loading-map", "onToggleExpand", "onToggleSelect", "customSlots"])) : (l(), r(ke, { key: 3 }, [
|
|
173
195
|
a(e.$slots, "body.prepend", d(g(h.value))),
|
|
174
|
-
|
|
196
|
+
C(Ee, {
|
|
175
197
|
items: s(f),
|
|
176
198
|
headers: K.value,
|
|
177
199
|
"tbody-class": e.tbodyClass,
|
|
178
|
-
"row-class": s(
|
|
200
|
+
"row-class": s(H),
|
|
179
201
|
"row-class-condition": e.rowClassCondition,
|
|
180
202
|
"tr-class": e.trClass,
|
|
181
203
|
"td-class": e.tdClass,
|
|
182
204
|
"selected-class": e.selectedClass,
|
|
183
205
|
"striped-class": e.stripedClass,
|
|
184
|
-
"is-selected": s(
|
|
206
|
+
"is-selected": s($),
|
|
185
207
|
"is-expanded": s(M),
|
|
186
208
|
"show-select": s(F),
|
|
187
|
-
"show-expand": s(
|
|
209
|
+
"show-expand": s(k),
|
|
188
210
|
"has-actions": e.hasActions,
|
|
189
211
|
"action-loading-map": e.actionLoadingMap,
|
|
190
212
|
onToggleExpand: s(A),
|
|
191
213
|
onToggleSelect: s(P),
|
|
192
214
|
customSlots: e.customSlots
|
|
193
215
|
}, X({ _: 2 }, [
|
|
194
|
-
Y(e.$slots, (t,
|
|
195
|
-
name:
|
|
196
|
-
fn:
|
|
197
|
-
a(e.$slots,
|
|
216
|
+
Y(e.$slots, (t, c) => ({
|
|
217
|
+
name: c,
|
|
218
|
+
fn: j((n) => [
|
|
219
|
+
a(e.$slots, c, d(g(n)))
|
|
198
220
|
])
|
|
199
221
|
}))
|
|
200
222
|
]), 1032, ["items", "headers", "tbody-class", "row-class", "row-class-condition", "tr-class", "td-class", "selected-class", "striped-class", "is-selected", "is-expanded", "show-select", "show-expand", "has-actions", "action-loading-map", "onToggleExpand", "onToggleSelect", "customSlots"]),
|
|
201
223
|
a(e.$slots, "body.append", d(g(h.value)))
|
|
202
|
-
], 64))
|
|
203
|
-
|
|
204
|
-
items: s(f),
|
|
205
|
-
headers: K.value,
|
|
206
|
-
"row-class": s(N),
|
|
207
|
-
"row-class-condition": e.rowClassCondition,
|
|
208
|
-
"is-selected": s(k),
|
|
209
|
-
"is-expanded": s(M),
|
|
210
|
-
"show-select": s(F),
|
|
211
|
-
"show-expand": s($),
|
|
212
|
-
"has-actions": e.hasActions,
|
|
213
|
-
"action-loading-map": e.actionLoadingMap,
|
|
214
|
-
onToggleExpand: s(A),
|
|
215
|
-
onToggleSelect: s(P),
|
|
216
|
-
customSlots: e.customSlots
|
|
217
|
-
}, X({ _: 2 }, [
|
|
218
|
-
Y(e.$slots, (t, i) => ({
|
|
219
|
-
name: i,
|
|
220
|
-
fn: z((n) => [
|
|
221
|
-
a(e.$slots, i, d(g(n)))
|
|
222
|
-
])
|
|
223
|
-
}))
|
|
224
|
-
]), 1032, ["items", "headers", "row-class", "row-class-condition", "is-selected", "is-expanded", "show-select", "show-expand", "has-actions", "action-loading-map", "onToggleExpand", "onToggleSelect", "customSlots"])) : u("", !0),
|
|
225
|
-
e.$slots.tfoot ? (l(), c("tfoot", Oe, [
|
|
224
|
+
], 64)),
|
|
225
|
+
e.$slots.tfoot ? (l(), r("tfoot", Oe, [
|
|
226
226
|
a(e.$slots, "tfoot", d(g(h.value)))
|
|
227
227
|
])) : u("", !0)
|
|
228
|
-
]),
|
|
229
|
-
s(f).length ? u("", !0) : (l(),
|
|
230
|
-
|
|
231
|
-
class: "h-full flex justify-center items-center text-center",
|
|
232
|
-
title: e.noDataText,
|
|
233
|
-
titleSize: "text-4xl"
|
|
234
|
-
}, null, 8, ["title"])
|
|
228
|
+
])) : u("", !0),
|
|
229
|
+
s(f).length ? u("", !0) : (l(), r("div", We, [
|
|
230
|
+
V("div", Qe, Fe(e.noDataText), 1)
|
|
235
231
|
]))
|
|
236
232
|
]),
|
|
237
|
-
s(se) ? a(e.$slots, "footer", d(B({ key: 2 }, h.value))) : (l(),
|
|
238
|
-
|
|
233
|
+
s(se) ? a(e.$slots, "footer", d(B({ key: 2 }, h.value))) : (l(), r("div", qe, [
|
|
234
|
+
C(Re, {
|
|
239
235
|
"items-length": s(ne).length,
|
|
240
|
-
"items-per-page": s(
|
|
241
|
-
"current-page": s(
|
|
236
|
+
"items-per-page": s(i).itemsPerPage,
|
|
237
|
+
"current-page": s(i).page,
|
|
242
238
|
"page-options": s(ae),
|
|
243
|
-
"onUpdate:itemsPerPage": o[2] || (o[2] = (t) => s(
|
|
244
|
-
"onUpdate:page": o[3] || (o[3] = (t) => s(
|
|
239
|
+
"onUpdate:itemsPerPage": o[2] || (o[2] = (t) => s(i).itemsPerPage = t),
|
|
240
|
+
"onUpdate:page": o[3] || (o[3] = (t) => s(i).page = t)
|
|
245
241
|
}, null, 8, ["items-length", "items-per-page", "current-page", "page-options"])
|
|
246
242
|
])),
|
|
247
|
-
e.filterable && s(
|
|
243
|
+
e.filterable && s(y) ? (l(), b(je, {
|
|
248
244
|
key: 3,
|
|
249
245
|
filters: e.filters,
|
|
250
|
-
modelValue: s(
|
|
251
|
-
"onUpdate:modelValue": o[4] || (o[4] = (t) =>
|
|
246
|
+
modelValue: s(y),
|
|
247
|
+
"onUpdate:modelValue": o[4] || (o[4] = (t) => $e(y) ? y.value = t : null),
|
|
252
248
|
onApplyFilters: s(ue),
|
|
253
249
|
onClearFilters: s(de),
|
|
254
250
|
activeFilters: s(pe).byColumn
|