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