@opengis/table 0.0.15 → 0.0.16
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/index.mjs +385 -402
- package/dist/index.umd.js +1 -5
- package/package.json +1 -2
package/dist/index.mjs
CHANGED
|
@@ -1,31 +1,5 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
3
|
-
* vue-router v4.5.1
|
|
4
|
-
* (c) 2025 Eduardo San Martin Morote
|
|
5
|
-
* @license MIT
|
|
6
|
-
*/
|
|
7
|
-
var ue;
|
|
8
|
-
(function(c) {
|
|
9
|
-
c.pop = "pop", c.push = "push";
|
|
10
|
-
})(ue || (ue = {}));
|
|
11
|
-
var ce;
|
|
12
|
-
(function(c) {
|
|
13
|
-
c.back = "back", c.forward = "forward", c.unknown = "";
|
|
14
|
-
})(ce || (ce = {}));
|
|
15
|
-
Symbol(process.env.NODE_ENV !== "production" ? "navigation failure" : "");
|
|
16
|
-
var de;
|
|
17
|
-
(function(c) {
|
|
18
|
-
c[c.aborted = 4] = "aborted", c[c.cancelled = 8] = "cancelled", c[c.duplicated = 16] = "duplicated";
|
|
19
|
-
})(de || (de = {}));
|
|
20
|
-
Symbol(process.env.NODE_ENV !== "production" ? "router view location matched" : "");
|
|
21
|
-
Symbol(process.env.NODE_ENV !== "production" ? "router view depth" : "");
|
|
22
|
-
const Ie = Symbol(process.env.NODE_ENV !== "production" ? "router" : "");
|
|
23
|
-
Symbol(process.env.NODE_ENV !== "production" ? "route location" : "");
|
|
24
|
-
Symbol(process.env.NODE_ENV !== "production" ? "router view location" : "");
|
|
25
|
-
function Ne() {
|
|
26
|
-
return ge(Ie);
|
|
27
|
-
}
|
|
28
|
-
const Re = /* @__PURE__ */ S({
|
|
1
|
+
import { defineComponent as S, computed as f, createElementBlock as u, openBlock as s, toDisplayString as y, normalizeStyle as de, normalizeClass as m, Fragment as B, renderList as R, createElementVNode as d, createTextVNode as L, ref as w, useSlots as ve, watch as z, onMounted as ge, provide as Ce, createCommentVNode as j, createBlock as P, renderSlot as pe, resolveDynamicComponent as J, inject as $e, withDirectives as Te, vShow as Fe } from "vue";
|
|
2
|
+
const Se = /* @__PURE__ */ S({
|
|
29
3
|
name: "NumberFormat",
|
|
30
4
|
__name: "NumberFormat",
|
|
31
5
|
props: {
|
|
@@ -33,13 +7,13 @@ const Re = /* @__PURE__ */ S({
|
|
|
33
7
|
row: {},
|
|
34
8
|
column: {}
|
|
35
9
|
},
|
|
36
|
-
setup(
|
|
37
|
-
const a =
|
|
10
|
+
setup(b) {
|
|
11
|
+
const a = b, e = f(() => a.value === null || a.value === void 0 ? "" : typeof a.value == "number" ? a.value.toFixed(2) : Intl.NumberFormat("uk-UA", {
|
|
38
12
|
maximumFractionDigits: 2
|
|
39
13
|
}).format(Number(a.value)));
|
|
40
|
-
return (
|
|
14
|
+
return (c, r) => (s(), u("span", null, y(e.value), 1));
|
|
41
15
|
}
|
|
42
|
-
}),
|
|
16
|
+
}), De = /* @__PURE__ */ S({
|
|
43
17
|
name: "DateFormat",
|
|
44
18
|
__name: "DateFormat",
|
|
45
19
|
props: {
|
|
@@ -47,8 +21,8 @@ const Re = /* @__PURE__ */ S({
|
|
|
47
21
|
row: {},
|
|
48
22
|
column: {}
|
|
49
23
|
},
|
|
50
|
-
setup(
|
|
51
|
-
const a =
|
|
24
|
+
setup(b) {
|
|
25
|
+
const a = b, e = f(() => {
|
|
52
26
|
if (!a.value) return "";
|
|
53
27
|
try {
|
|
54
28
|
return new Date(a.value).toLocaleDateString();
|
|
@@ -56,9 +30,9 @@ const Re = /* @__PURE__ */ S({
|
|
|
56
30
|
return a.value;
|
|
57
31
|
}
|
|
58
32
|
});
|
|
59
|
-
return (
|
|
33
|
+
return (c, r) => (s(), u("span", null, y(e.value), 1));
|
|
60
34
|
}
|
|
61
|
-
}),
|
|
35
|
+
}), Ae = /* @__PURE__ */ S({
|
|
62
36
|
name: "TextFormat",
|
|
63
37
|
__name: "TextFormat",
|
|
64
38
|
props: {
|
|
@@ -66,11 +40,11 @@ const Re = /* @__PURE__ */ S({
|
|
|
66
40
|
row: {},
|
|
67
41
|
column: {}
|
|
68
42
|
},
|
|
69
|
-
setup(
|
|
70
|
-
const a =
|
|
71
|
-
return (
|
|
43
|
+
setup(b) {
|
|
44
|
+
const a = b, { value: e } = a, c = f(() => Array.isArray(e) ? e.map((r) => r.text || r).join(",") : e?.text || e);
|
|
45
|
+
return (r, o) => (s(), u("span", null, y(c.value), 1));
|
|
72
46
|
}
|
|
73
|
-
}),
|
|
47
|
+
}), Ie = /* @__PURE__ */ S({
|
|
74
48
|
name: "BadgeFormat",
|
|
75
49
|
__name: "BadgeFormat",
|
|
76
50
|
props: {
|
|
@@ -78,38 +52,38 @@ const Re = /* @__PURE__ */ S({
|
|
|
78
52
|
row: {},
|
|
79
53
|
column: {}
|
|
80
54
|
},
|
|
81
|
-
setup(
|
|
82
|
-
const a =
|
|
83
|
-
const
|
|
84
|
-
return
|
|
55
|
+
setup(b) {
|
|
56
|
+
const a = b, e = f(() => {
|
|
57
|
+
const o = String(a.value || "").toLowerCase(), i = "inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium";
|
|
58
|
+
return o.includes("success") || o.includes("active") || o.includes("completed") ? `${i} bg-green-100 text-green-800` : o.includes("error") || o.includes("failed") || o.includes("inactive") ? `${i} bg-red-100 text-red-800` : o.includes("warning") || o.includes("pending") ? `${i} bg-yellow-100 text-yellow-800` : o.includes("info") || o.includes("processing") ? `${i} bg-blue-100 text-blue-800` : a.value?.color && !/^#([0-9a-f]{3}|[0-9a-f]{6})$/i.test(a.value.color) ? `${i} bg-${a.value.color}-100 text-${a.value.color}-800` : `${i} bg-gray-100 text-gray-800`;
|
|
85
59
|
});
|
|
86
|
-
function
|
|
87
|
-
const _ = parseInt(
|
|
88
|
-
return `rgba(${_}, ${
|
|
60
|
+
function c(o, i = 1) {
|
|
61
|
+
const _ = parseInt(o.slice(1, 3), 16), $ = parseInt(o.slice(3, 5), 16), T = parseInt(o.slice(5, 7), 16);
|
|
62
|
+
return `rgba(${_}, ${$}, ${T}, ${i})`;
|
|
89
63
|
}
|
|
90
|
-
const
|
|
91
|
-
const
|
|
64
|
+
const r = f(() => {
|
|
65
|
+
const o = {
|
|
92
66
|
minWidth: "60px",
|
|
93
67
|
textAlign: "center",
|
|
94
68
|
display: "inline-block"
|
|
95
69
|
};
|
|
96
70
|
return /^#([0-9a-f]{3}|[0-9a-f]{6})$/i.test(a.value?.color) ? {
|
|
97
|
-
...
|
|
98
|
-
backgroundColor:
|
|
99
|
-
color:
|
|
100
|
-
} :
|
|
71
|
+
...o,
|
|
72
|
+
backgroundColor: c(a.value.color, 0.1),
|
|
73
|
+
color: c(a.value.color, 0.8)
|
|
74
|
+
} : o;
|
|
101
75
|
});
|
|
102
|
-
return (
|
|
103
|
-
class:
|
|
104
|
-
style:
|
|
105
|
-
},
|
|
76
|
+
return (o, i) => (s(), u("span", {
|
|
77
|
+
class: m(["badge", e.value]),
|
|
78
|
+
style: de(r.value)
|
|
79
|
+
}, y(o.value?.text || o.value), 7));
|
|
106
80
|
}
|
|
107
|
-
}),
|
|
108
|
-
const
|
|
109
|
-
for (const [
|
|
110
|
-
|
|
111
|
-
return
|
|
112
|
-
},
|
|
81
|
+
}), je = (b, a) => {
|
|
82
|
+
const e = b.__vccOpts || b;
|
|
83
|
+
for (const [c, r] of a)
|
|
84
|
+
e[c] = r;
|
|
85
|
+
return e;
|
|
86
|
+
}, Be = /* @__PURE__ */ je(Ie, [["__scopeId", "data-v-28700c64"]]), Re = { class: "flex flex-wrap gap-1" }, ze = /* @__PURE__ */ S({
|
|
113
87
|
name: "ArrayFormat",
|
|
114
88
|
__name: "ArrayFormat",
|
|
115
89
|
props: {
|
|
@@ -117,16 +91,16 @@ const Re = /* @__PURE__ */ S({
|
|
|
117
91
|
row: {},
|
|
118
92
|
column: {}
|
|
119
93
|
},
|
|
120
|
-
setup(
|
|
121
|
-
const a =
|
|
122
|
-
return (
|
|
123
|
-
(
|
|
94
|
+
setup(b) {
|
|
95
|
+
const a = b, e = f(() => a.value ? Array.isArray(a.value) ? a.value : [a.value] : []), c = (r) => r ? typeof r == "object" && r.name ? r.name : typeof r == "string" || typeof r == "number" ? String(r) : JSON.stringify(r) : "";
|
|
96
|
+
return (r, o) => (s(), u("div", Re, [
|
|
97
|
+
(s(!0), u(B, null, R(e.value, (i, _) => (s(), u("span", {
|
|
124
98
|
key: _,
|
|
125
99
|
class: "inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-blue-100 text-blue-800 hover:bg-blue-200 transition-colors"
|
|
126
|
-
},
|
|
100
|
+
}, y(c(i)), 1))), 128))
|
|
127
101
|
]));
|
|
128
102
|
}
|
|
129
|
-
}),
|
|
103
|
+
}), Pe = ["href", "target"], Le = /* @__PURE__ */ S({
|
|
130
104
|
__name: "LinkFormat",
|
|
131
105
|
props: {
|
|
132
106
|
href: { default: "" },
|
|
@@ -136,24 +110,24 @@ const Re = /* @__PURE__ */ S({
|
|
|
136
110
|
row: {},
|
|
137
111
|
column: {}
|
|
138
112
|
},
|
|
139
|
-
setup(
|
|
140
|
-
const a =
|
|
113
|
+
setup(b) {
|
|
114
|
+
const a = b, e = f(() => typeof a.value == "string" || typeof a.value == "number" ? a.value : a.value?.text || a.value?.label || "Link"), c = f(() => a.href ? a.href : typeof a.value == "object" && a.value?.href ? a.value.href : ""), r = f(() => a.target ? a.target : typeof a.value == "object" && a.value?.target ? a.value.target : "_self"), o = f(() => "text-blue-600 hover:text-blue-800 dark:text-blue-400 dark:hover:text-blue-300 underline cursor-pointer"), i = (_) => {
|
|
141
115
|
a.onClick && a.row && (_.preventDefault(), a.onClick(a.row, a.value));
|
|
142
116
|
};
|
|
143
|
-
return (_,
|
|
117
|
+
return (_, $) => c.value ? (s(), u("a", {
|
|
144
118
|
key: 0,
|
|
145
|
-
href:
|
|
146
|
-
target:
|
|
147
|
-
class:
|
|
119
|
+
href: c.value,
|
|
120
|
+
target: r.value,
|
|
121
|
+
class: m(o.value),
|
|
148
122
|
onClick: i
|
|
149
|
-
},
|
|
123
|
+
}, y(e.value), 11, Pe)) : (s(), u("button", {
|
|
150
124
|
key: 1,
|
|
151
125
|
type: "button",
|
|
152
|
-
class:
|
|
126
|
+
class: m(o.value),
|
|
153
127
|
onClick: i
|
|
154
|
-
},
|
|
128
|
+
}, y(e.value), 3));
|
|
155
129
|
}
|
|
156
|
-
}),
|
|
130
|
+
}), Ne = /* @__PURE__ */ S({
|
|
157
131
|
name: "TextFormat",
|
|
158
132
|
__name: "SelectFormat",
|
|
159
133
|
props: {
|
|
@@ -161,19 +135,19 @@ const Re = /* @__PURE__ */ S({
|
|
|
161
135
|
row: {},
|
|
162
136
|
column: {}
|
|
163
137
|
},
|
|
164
|
-
setup(
|
|
165
|
-
const a =
|
|
166
|
-
return (
|
|
138
|
+
setup(b) {
|
|
139
|
+
const a = b, { value: e } = a, c = f(() => Array.isArray(e) ? e.map((r) => r.text || r).filter((r, o) => o < 2).join(", ") + (e.length > 2 ? ` +${e.length - 2}` : "") : e?.text || e);
|
|
140
|
+
return (r, o) => (s(), u("span", null, y(c.value), 1));
|
|
167
141
|
}
|
|
168
|
-
}),
|
|
169
|
-
number:
|
|
170
|
-
date:
|
|
171
|
-
text:
|
|
172
|
-
badge:
|
|
173
|
-
array:
|
|
174
|
-
select:
|
|
175
|
-
link:
|
|
176
|
-
},
|
|
142
|
+
}), ue = {
|
|
143
|
+
number: Se,
|
|
144
|
+
date: De,
|
|
145
|
+
text: Ae,
|
|
146
|
+
badge: Be,
|
|
147
|
+
array: ze,
|
|
148
|
+
select: Ne,
|
|
149
|
+
link: Le
|
|
150
|
+
}, Ve = { class: "flex items-center space-x-4" }, Me = { class: "font-medium" }, Ee = { class: "font-medium" }, He = { class: "font-medium" }, We = { class: "flex items-center space-x-2" }, Ue = ["disabled"], Oe = { class: "flex items-center space-x-1" }, Je = ["onClick"], qe = ["disabled"], fe = /* @__PURE__ */ S({
|
|
177
151
|
name: "Pagination",
|
|
178
152
|
__name: "Pagination",
|
|
179
153
|
props: {
|
|
@@ -184,8 +158,8 @@ const Re = /* @__PURE__ */ S({
|
|
|
184
158
|
size: { default: "medium" }
|
|
185
159
|
},
|
|
186
160
|
emits: ["update:page"],
|
|
187
|
-
setup(
|
|
188
|
-
const
|
|
161
|
+
setup(b, { emit: a }) {
|
|
162
|
+
const e = b, c = f(() => ({
|
|
189
163
|
small: {
|
|
190
164
|
text: "text-xs",
|
|
191
165
|
button: "px-2 h-7 text-xs min-w-[28px] flex items-center justify-center",
|
|
@@ -201,16 +175,16 @@ const Re = /* @__PURE__ */ S({
|
|
|
201
175
|
button: "px-4 h-11 text-base min-w-[44px] flex items-center justify-center",
|
|
202
176
|
icon: "w-5 h-5"
|
|
203
177
|
}
|
|
204
|
-
})[
|
|
205
|
-
const { theme:
|
|
206
|
-
return
|
|
178
|
+
})[e.size]), r = f(() => {
|
|
179
|
+
const { theme: p } = e;
|
|
180
|
+
return p === "dark" ? {
|
|
207
181
|
container: "bg-gray-900 border-gray-700",
|
|
208
182
|
text: "text-gray-300",
|
|
209
183
|
button: "text-gray-300 bg-gray-800 border-gray-600 hover:bg-gray-700",
|
|
210
184
|
buttonDisabled: "text-gray-500 bg-gray-800",
|
|
211
185
|
buttonActive: "bg-blue-600 text-white",
|
|
212
186
|
ellipsis: "text-gray-400"
|
|
213
|
-
} :
|
|
187
|
+
} : p === "light" ? {
|
|
214
188
|
container: "bg-white border-gray-200",
|
|
215
189
|
text: "text-gray-700",
|
|
216
190
|
button: "text-gray-700 bg-white border-gray-300 hover:bg-gray-50",
|
|
@@ -225,122 +199,123 @@ const Re = /* @__PURE__ */ S({
|
|
|
225
199
|
buttonActive: "bg-blue-600 text-white",
|
|
226
200
|
ellipsis: "text-gray-500 dark:text-gray-400"
|
|
227
201
|
};
|
|
228
|
-
}),
|
|
229
|
-
const
|
|
202
|
+
}), o = a, i = f(() => Math.ceil(e.total / e.limit)), _ = f(() => e.total === 0 ? 0 : (e.page - 1) * e.limit + 1), $ = f(() => Math.min(e.page * e.limit, e.total)), T = f(() => {
|
|
203
|
+
const p = [];
|
|
230
204
|
if (i.value <= 7)
|
|
231
|
-
for (let
|
|
232
|
-
|
|
205
|
+
for (let k = 1; k <= i.value; k += 1)
|
|
206
|
+
p.push(k);
|
|
233
207
|
else {
|
|
234
|
-
|
|
235
|
-
const
|
|
236
|
-
for (let
|
|
237
|
-
|
|
238
|
-
|
|
208
|
+
p.push(1), e.page > 4 && p.push("...");
|
|
209
|
+
const k = Math.max(2, e.page - 1), F = Math.min(i.value - 1, e.page + 1);
|
|
210
|
+
for (let A = k; A <= F; A += 1)
|
|
211
|
+
A !== 1 && A !== i.value && p.push(A);
|
|
212
|
+
e.page < i.value - 3 && p.push("..."), i.value > 1 && p.push(i.value);
|
|
239
213
|
}
|
|
240
|
-
return
|
|
241
|
-
}),
|
|
242
|
-
|
|
214
|
+
return p;
|
|
215
|
+
}), D = (p) => {
|
|
216
|
+
p >= 1 && p <= i.value && p !== e.page && o("update:page", p);
|
|
243
217
|
};
|
|
244
|
-
return (
|
|
245
|
-
class:
|
|
218
|
+
return (p, h) => (s(), u("div", {
|
|
219
|
+
class: m(["flex items-center justify-between py-3 border-t", r.value.container])
|
|
246
220
|
}, [
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
class:
|
|
221
|
+
d("div", Ve, [
|
|
222
|
+
d("div", {
|
|
223
|
+
class: m(["flex items-center text-sm", r.value.text, c.value.text])
|
|
250
224
|
}, [
|
|
251
|
-
|
|
252
|
-
h[2] || (h[2] =
|
|
253
|
-
|
|
254
|
-
h[3] || (h[3] =
|
|
255
|
-
|
|
256
|
-
h[4] || (h[4] =
|
|
257
|
-
|
|
258
|
-
h[5] || (h[5] =
|
|
225
|
+
d("span", null, [
|
|
226
|
+
h[2] || (h[2] = L(" Показано ", -1)),
|
|
227
|
+
d("span", Me, y(_.value), 1),
|
|
228
|
+
h[3] || (h[3] = L(" до ", -1)),
|
|
229
|
+
d("span", Ee, y($.value), 1),
|
|
230
|
+
h[4] || (h[4] = L(" з ", -1)),
|
|
231
|
+
d("span", He, y(p.total), 1),
|
|
232
|
+
h[5] || (h[5] = L(" результатів ", -1))
|
|
259
233
|
])
|
|
260
234
|
], 2)
|
|
261
235
|
]),
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
onClick: h[0] || (h[0] = (
|
|
265
|
-
disabled:
|
|
266
|
-
class:
|
|
236
|
+
d("div", We, [
|
|
237
|
+
d("button", {
|
|
238
|
+
onClick: h[0] || (h[0] = (k) => D(p.page - 1)),
|
|
239
|
+
disabled: p.page <= 1,
|
|
240
|
+
class: m([
|
|
267
241
|
"relative font-medium rounded-md",
|
|
268
|
-
|
|
269
|
-
|
|
242
|
+
c.value.button,
|
|
243
|
+
p.page <= 1 ? r.value.buttonDisabled : r.value.button
|
|
270
244
|
])
|
|
271
245
|
}, [
|
|
272
|
-
(
|
|
273
|
-
class:
|
|
246
|
+
(s(), u("svg", {
|
|
247
|
+
class: m(c.value.icon),
|
|
274
248
|
fill: "none",
|
|
275
249
|
stroke: "currentColor",
|
|
276
250
|
viewBox: "0 0 24 24"
|
|
277
251
|
}, h[6] || (h[6] = [
|
|
278
|
-
|
|
252
|
+
d("path", {
|
|
279
253
|
"stroke-linecap": "round",
|
|
280
254
|
"stroke-linejoin": "round",
|
|
281
255
|
"stroke-width": "2",
|
|
282
256
|
d: "M15 19l-7-7 7-7"
|
|
283
257
|
}, null, -1)
|
|
284
258
|
]), 2))
|
|
285
|
-
], 10,
|
|
286
|
-
|
|
287
|
-
(
|
|
288
|
-
|
|
259
|
+
], 10, Ue),
|
|
260
|
+
d("div", Oe, [
|
|
261
|
+
(s(!0), u(B, null, R(T.value, (k) => (s(), u(B, { key: k }, [
|
|
262
|
+
k === "..." ? (s(), u("span", {
|
|
289
263
|
key: 0,
|
|
290
|
-
class:
|
|
291
|
-
}, " ... ", 2)) : (
|
|
264
|
+
class: m(["font-medium", c.value.button, r.value.ellipsis])
|
|
265
|
+
}, " ... ", 2)) : (s(), u("button", {
|
|
292
266
|
key: 1,
|
|
293
|
-
onClick: (
|
|
294
|
-
class:
|
|
267
|
+
onClick: (F) => D(k),
|
|
268
|
+
class: m([
|
|
295
269
|
"relative font-medium rounded-md",
|
|
296
|
-
|
|
297
|
-
|
|
270
|
+
c.value.button,
|
|
271
|
+
k === p.page ? r.value.buttonActive : r.value.button
|
|
298
272
|
])
|
|
299
|
-
},
|
|
273
|
+
}, y(k), 11, Je))
|
|
300
274
|
], 64))), 128))
|
|
301
275
|
]),
|
|
302
|
-
|
|
303
|
-
onClick: h[1] || (h[1] = (
|
|
304
|
-
disabled:
|
|
305
|
-
class:
|
|
276
|
+
d("button", {
|
|
277
|
+
onClick: h[1] || (h[1] = (k) => D(p.page + 1)),
|
|
278
|
+
disabled: p.page >= i.value,
|
|
279
|
+
class: m([
|
|
306
280
|
"relative font-medium rounded-md",
|
|
307
|
-
|
|
308
|
-
|
|
281
|
+
c.value.button,
|
|
282
|
+
p.page >= i.value ? r.value.buttonDisabled : r.value.button
|
|
309
283
|
])
|
|
310
284
|
}, [
|
|
311
|
-
(
|
|
312
|
-
class:
|
|
285
|
+
(s(), u("svg", {
|
|
286
|
+
class: m(c.value.icon),
|
|
313
287
|
fill: "none",
|
|
314
288
|
stroke: "currentColor",
|
|
315
289
|
viewBox: "0 0 24 24"
|
|
316
290
|
}, h[7] || (h[7] = [
|
|
317
|
-
|
|
291
|
+
d("path", {
|
|
318
292
|
"stroke-linecap": "round",
|
|
319
293
|
"stroke-linejoin": "round",
|
|
320
294
|
"stroke-width": "2",
|
|
321
295
|
d: "M9 5l7 7-7 7"
|
|
322
296
|
}, null, -1)
|
|
323
297
|
]), 2))
|
|
324
|
-
], 10,
|
|
298
|
+
], 10, qe)
|
|
325
299
|
])
|
|
326
300
|
], 2));
|
|
327
301
|
}
|
|
328
|
-
}),
|
|
302
|
+
}), Ge = {
|
|
329
303
|
key: 0,
|
|
330
304
|
class: "text-center py-8"
|
|
331
|
-
},
|
|
305
|
+
}, Ke = { class: "inline-flex items-center space-x-2" }, Qe = {
|
|
332
306
|
key: 2,
|
|
333
307
|
class: "overflow-x-auto"
|
|
334
|
-
},
|
|
308
|
+
}, Xe = ["checked", "indeterminate"], Ye = ["onClick"], Ze = { class: "flex items-center justify-between" }, et = {
|
|
335
309
|
key: 0,
|
|
336
310
|
class: "ml-1 text-xs"
|
|
337
|
-
},
|
|
311
|
+
}, tt = { key: 1 }, at = ["onClick"], rt = ["checked", "onChange"], lt = ["onClick"], ce = /* @__PURE__ */ S({
|
|
338
312
|
name: "DataTable",
|
|
339
313
|
__name: "DataTable",
|
|
340
314
|
props: {
|
|
341
315
|
rows: { default: () => [] },
|
|
342
316
|
columns: { default: () => [] },
|
|
343
317
|
api: {},
|
|
318
|
+
router: {},
|
|
344
319
|
tableStyle: { default: "min-width: 50rem" },
|
|
345
320
|
tableClass: { default: "min-w-full divide-y divide-gray-200 dark:divide-gray-700" },
|
|
346
321
|
tableClassWrapper: {},
|
|
@@ -362,58 +337,66 @@ const Re = /* @__PURE__ */ S({
|
|
|
362
337
|
getCellData: { type: Function, default: void 0 }
|
|
363
338
|
},
|
|
364
339
|
emits: ["update:page", "update:selectedRows", "row-click", "sort"],
|
|
365
|
-
setup(
|
|
366
|
-
const
|
|
340
|
+
setup(b, { emit: a }) {
|
|
341
|
+
const e = b, c = a, r = w(e.selectedRows || []), o = w([]), i = w([]), _ = w([]), $ = w(!1), T = w(null), D = w(e.router), p = ve(), h = f(() => p.action);
|
|
342
|
+
function k(t) {
|
|
343
|
+
if (D.value) {
|
|
344
|
+
D.value.push(t);
|
|
345
|
+
return;
|
|
346
|
+
}
|
|
347
|
+
location.href = t;
|
|
348
|
+
}
|
|
349
|
+
const F = f(() => {
|
|
367
350
|
if (e.api)
|
|
368
|
-
return
|
|
369
|
-
if (e.sortable &&
|
|
351
|
+
return i.value;
|
|
352
|
+
if (e.sortable && o.value.length > 0) {
|
|
370
353
|
const t = [...e.rows];
|
|
371
|
-
return t.sort((
|
|
372
|
-
for (const g of
|
|
354
|
+
return t.sort((v, l) => {
|
|
355
|
+
for (const g of o.value) {
|
|
373
356
|
if (!g.direction)
|
|
374
357
|
return 0;
|
|
375
|
-
const n =
|
|
358
|
+
const n = v[g.field], x = l[g.field];
|
|
376
359
|
if (n == null) return 1;
|
|
377
|
-
if (
|
|
378
|
-
let
|
|
379
|
-
typeof n == "string" && typeof
|
|
380
|
-
const
|
|
381
|
-
if (
|
|
360
|
+
if (x == null) return -1;
|
|
361
|
+
let I = 0;
|
|
362
|
+
typeof n == "string" && typeof x == "string" ? I = n.localeCompare(x) : n < x ? I = -1 : n > x ? I = 1 : I = 0;
|
|
363
|
+
const O = g.direction === "desc" ? -I : I;
|
|
364
|
+
if (O !== 0) return O;
|
|
382
365
|
}
|
|
383
366
|
return 0;
|
|
384
367
|
}), t;
|
|
385
368
|
}
|
|
386
369
|
return e.rows;
|
|
387
370
|
});
|
|
388
|
-
|
|
389
|
-
|
|
371
|
+
z(() => e.selectedRows, (t) => {
|
|
372
|
+
r.value = t || [];
|
|
390
373
|
});
|
|
391
|
-
const
|
|
392
|
-
const
|
|
393
|
-
|
|
394
|
-
},
|
|
395
|
-
|
|
396
|
-
},
|
|
374
|
+
const A = (t) => r.value.some((v) => v === t), te = (t) => {
|
|
375
|
+
const v = r.value.findIndex((l) => l === t);
|
|
376
|
+
v > -1 ? r.value.splice(v, 1) : r.value.push(t), c("update:selectedRows", [...r.value]);
|
|
377
|
+
}, q = f(() => F.value.length > 0 && r.value.length === F.value.length), N = f(() => r.value.length > 0 && r.value.length < F.value.length), G = () => {
|
|
378
|
+
q.value ? r.value = [] : r.value = [...F.value], c("update:selectedRows", [...r.value]);
|
|
379
|
+
}, me = (t) => {
|
|
397
380
|
if (!e.sortable) return;
|
|
398
|
-
const
|
|
399
|
-
if (
|
|
400
|
-
const g =
|
|
401
|
-
g.direction === "asc" ? g.direction = "desc" : g.direction === "desc" &&
|
|
381
|
+
const v = o.value.findIndex((g) => g.field === t);
|
|
382
|
+
if (v >= 0) {
|
|
383
|
+
const g = o.value[v];
|
|
384
|
+
g.direction === "asc" ? g.direction = "desc" : g.direction === "desc" && o.value.splice(v, 1);
|
|
402
385
|
} else
|
|
403
|
-
|
|
386
|
+
o.value.unshift({
|
|
404
387
|
field: t,
|
|
405
388
|
direction: "asc"
|
|
406
389
|
});
|
|
407
|
-
const
|
|
390
|
+
const l = o.value.filter((g) => g.direction).map((g) => ({
|
|
408
391
|
name: g.field,
|
|
409
392
|
asc: g.direction === "asc"
|
|
410
393
|
}));
|
|
411
|
-
|
|
412
|
-
},
|
|
413
|
-
const
|
|
414
|
-
if (!
|
|
394
|
+
c("sort", l), e.api && H();
|
|
395
|
+
}, be = (t) => o.value.find((l) => l.field === t)?.direction === "asc", he = (t) => {
|
|
396
|
+
const v = o.value.find((l) => l.field === t);
|
|
397
|
+
if (!v)
|
|
415
398
|
return "↑↓";
|
|
416
|
-
switch (
|
|
399
|
+
switch (v.direction) {
|
|
417
400
|
case "asc":
|
|
418
401
|
return "↑";
|
|
419
402
|
// Up arrow for ascending
|
|
@@ -423,26 +406,26 @@ const Re = /* @__PURE__ */ S({
|
|
|
423
406
|
default:
|
|
424
407
|
return "↕️";
|
|
425
408
|
}
|
|
426
|
-
},
|
|
427
|
-
e.clickable &&
|
|
428
|
-
},
|
|
429
|
-
const
|
|
409
|
+
}, K = (t) => e.sortable && t.sortable !== !1, ye = (t) => {
|
|
410
|
+
e.clickable && c("row-click", t);
|
|
411
|
+
}, V = (t, v) => {
|
|
412
|
+
const l = v[t.name];
|
|
430
413
|
if (e.getCellData || t.getCellData) {
|
|
431
414
|
const g = t.getCellData || e.getCellData;
|
|
432
415
|
if (g) {
|
|
433
416
|
const n = {
|
|
434
417
|
name: t.name,
|
|
435
|
-
row:
|
|
436
|
-
value:
|
|
418
|
+
row: v,
|
|
419
|
+
value: l
|
|
437
420
|
};
|
|
438
421
|
return g(n);
|
|
439
422
|
}
|
|
440
423
|
}
|
|
441
424
|
return ["_data", "_text"].map((g) => {
|
|
442
425
|
const n = `${t.name}${g}`;
|
|
443
|
-
return
|
|
444
|
-
}).find((g) => g) ||
|
|
445
|
-
}, ae = (t) => t.width ? t.width === "w-full" ? "w-full" : typeof t.width == "string" ? t.width : typeof t.width == "number" ? `w-${t.width}` : "" : "", Q = w(e.page), re = w(e.limit), X = w(e.total),
|
|
426
|
+
return v[n] ? v[n] : null;
|
|
427
|
+
}).find((g) => g) || l;
|
|
428
|
+
}, ae = (t) => t.width ? t.width === "w-full" ? "w-full" : typeof t.width == "string" ? t.width : typeof t.width == "number" ? `w-${t.width}` : "" : "", Q = w(e.page), re = w(e.limit), X = w(e.total), M = w(1), Y = w(10), E = w(0), le = f(() => e.api ? M.value : Q.value), ne = f(() => e.api ? Y.value : re.value), oe = f(() => e.api ? E.value : X.value), C = f(() => {
|
|
446
429
|
const { theme: t } = e;
|
|
447
430
|
return t === "dark" ? {
|
|
448
431
|
container: "dark",
|
|
@@ -482,37 +465,37 @@ const Re = /* @__PURE__ */ S({
|
|
|
482
465
|
checkbox: "border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-blue-600 dark:text-blue-400"
|
|
483
466
|
};
|
|
484
467
|
});
|
|
485
|
-
|
|
468
|
+
z(() => e.page, (t) => {
|
|
486
469
|
Q.value = t;
|
|
487
|
-
}),
|
|
470
|
+
}), z(() => e.limit, (t) => {
|
|
488
471
|
re.value = t;
|
|
489
|
-
}),
|
|
472
|
+
}), z(() => e.total, (t) => {
|
|
490
473
|
X.value = t;
|
|
491
474
|
});
|
|
492
|
-
async function
|
|
475
|
+
async function H() {
|
|
493
476
|
if (e.api) {
|
|
494
|
-
|
|
477
|
+
$.value = !0, T.value = null;
|
|
495
478
|
try {
|
|
496
479
|
const t = new URL(e.api, window.location.origin);
|
|
497
|
-
if (t.searchParams.set("page",
|
|
498
|
-
const g =
|
|
480
|
+
if (t.searchParams.set("page", le.value.toString()), t.searchParams.set("limit", ne.value.toString()), o.value.length > 0) {
|
|
481
|
+
const g = o.value.filter((n) => n.direction).map((n) => `${n.field}:${n.direction}`).join(",");
|
|
499
482
|
g && t.searchParams.set("sort", g);
|
|
500
483
|
}
|
|
501
|
-
const
|
|
502
|
-
if (!
|
|
503
|
-
throw new Error(`HTTP error! status: ${
|
|
504
|
-
const
|
|
505
|
-
|
|
484
|
+
const v = await fetch(t.toString());
|
|
485
|
+
if (!v.ok)
|
|
486
|
+
throw new Error(`HTTP error! status: ${v.status}`);
|
|
487
|
+
const l = await v.json();
|
|
488
|
+
l.rows && Array.isArray(l.rows) && (i.value = l.rows), l.columns && Array.isArray(l.columns) && (_.value = l.columns), l.total !== void 0 && (e.api ? E.value = l.total : X.value = l.total);
|
|
506
489
|
} catch (t) {
|
|
507
|
-
|
|
490
|
+
T.value = t instanceof Error ? t.message : "Failed to fetch data", console.error("Error fetching data:", t);
|
|
508
491
|
} finally {
|
|
509
|
-
|
|
492
|
+
$.value = !1;
|
|
510
493
|
}
|
|
511
494
|
}
|
|
512
495
|
}
|
|
513
|
-
const
|
|
514
|
-
e.api ?
|
|
515
|
-
},
|
|
496
|
+
const xe = (t) => {
|
|
497
|
+
e.api ? M.value = t : (Q.value = t, c("update:page", t)), e.api && H();
|
|
498
|
+
}, ke = f(() => e.showPagination && oe.value > 0), W = f(() => ({
|
|
516
499
|
small: {
|
|
517
500
|
header: "px-3 py-2 text-xs",
|
|
518
501
|
cell: "px-3 py-2 text-xs"
|
|
@@ -526,191 +509,191 @@ const Re = /* @__PURE__ */ S({
|
|
|
526
509
|
cell: "px-8 py-6 text-base"
|
|
527
510
|
}
|
|
528
511
|
})[e.size]);
|
|
529
|
-
|
|
530
|
-
e.api && (e.page && (
|
|
531
|
-
}),
|
|
532
|
-
t && (
|
|
512
|
+
ge(() => {
|
|
513
|
+
e.api && (e.page && (M.value = e.page), e.limit && (Y.value = e.limit), e.total && (E.value = e.total), H());
|
|
514
|
+
}), z(() => e.api, (t) => {
|
|
515
|
+
t && (M.value = e.page || 1, Y.value = e.limit || 10, E.value = e.total || 0, H());
|
|
533
516
|
});
|
|
534
|
-
const
|
|
535
|
-
|
|
536
|
-
Z.value.push(t),
|
|
517
|
+
const _e = f(() => e.api ? _.value : e.columns), Z = w([]), U = w({});
|
|
518
|
+
Ce("registerColumn", (t, v) => {
|
|
519
|
+
Z.value.push(t), v && t.slotName && (U.value[t.name] = v);
|
|
537
520
|
});
|
|
538
|
-
const se =
|
|
539
|
-
const t =
|
|
540
|
-
if (
|
|
541
|
-
const g =
|
|
542
|
-
const
|
|
543
|
-
name:
|
|
521
|
+
const se = f(() => {
|
|
522
|
+
const t = _e.value || [], v = [], l = p.default?.();
|
|
523
|
+
if (l) {
|
|
524
|
+
const g = l.filter((n) => n.type?.name === "Column" || n.type === "Column" || n.type && typeof n.type == "object" && n.type.name === "Column").map((n) => {
|
|
525
|
+
const x = n.props || n.componentProps || {}, I = x.field || x.name || "", O = x.header || x.label || "", ie = n.children && n.children.body, ee = {
|
|
526
|
+
name: I,
|
|
544
527
|
// Use field as the name for data access
|
|
545
|
-
ua:
|
|
528
|
+
ua: O,
|
|
546
529
|
// Use header as the display name
|
|
547
|
-
format:
|
|
530
|
+
format: x.format || "text",
|
|
548
531
|
slotName: ie ? "body" : void 0,
|
|
549
|
-
...
|
|
532
|
+
...x
|
|
550
533
|
};
|
|
551
|
-
return ie && ee.name && (
|
|
534
|
+
return ie && ee.name && (U.value[ee.name] = n.children.body), ee;
|
|
552
535
|
});
|
|
553
|
-
|
|
536
|
+
v.push(...g);
|
|
554
537
|
}
|
|
555
|
-
if (Z.value.length > 0 &&
|
|
556
|
-
const g = [], n = new Set(
|
|
557
|
-
return t.forEach((
|
|
558
|
-
n.has(
|
|
559
|
-
}), g.push(...
|
|
538
|
+
if (Z.value.length > 0 && v.push(...Z.value), v.length > 0) {
|
|
539
|
+
const g = [], n = new Set(v.map((x) => x.name));
|
|
540
|
+
return t.forEach((x) => {
|
|
541
|
+
n.has(x.name) || g.push(x);
|
|
542
|
+
}), g.push(...v), console.log("Combined columns:", {
|
|
560
543
|
default: t.length,
|
|
561
|
-
custom:
|
|
544
|
+
custom: v.length,
|
|
562
545
|
combined: g.length
|
|
563
546
|
}), g;
|
|
564
547
|
}
|
|
565
548
|
return t.length > 0 ? (console.log("Using default columns:", t.length), t) : [];
|
|
566
|
-
}),
|
|
567
|
-
return (t,
|
|
568
|
-
class:
|
|
549
|
+
}), we = (t = "text") => ue[t] || ue.text;
|
|
550
|
+
return (t, v) => (s(), u("div", {
|
|
551
|
+
class: m(["w-full", C.value.container])
|
|
569
552
|
}, [
|
|
570
|
-
|
|
571
|
-
|
|
572
|
-
|
|
573
|
-
|
|
574
|
-
class:
|
|
553
|
+
$.value || e.loading ? (s(), u("div", Ge, [
|
|
554
|
+
d("div", Ke, [
|
|
555
|
+
v[0] || (v[0] = d("div", { class: "animate-spin rounded-full h-6 w-6 border-b-2 border-blue-600" }, null, -1)),
|
|
556
|
+
d("span", {
|
|
557
|
+
class: m(C.value.loading)
|
|
575
558
|
}, "Loading...", 2)
|
|
576
559
|
])
|
|
577
|
-
])) :
|
|
560
|
+
])) : T.value ? (s(), u("div", {
|
|
578
561
|
key: 1,
|
|
579
|
-
class:
|
|
580
|
-
},
|
|
581
|
-
|
|
582
|
-
class:
|
|
562
|
+
class: m(["text-center py-8", C.value.error])
|
|
563
|
+
}, y(T.value), 3)) : !e.loading && F.value.length > 0 ? (s(), u("div", Qe, [
|
|
564
|
+
d("div", {
|
|
565
|
+
class: m(t.tableClassWrapper ? t.tableClassWrapper : "relative w-full overflow-auto")
|
|
583
566
|
}, [
|
|
584
|
-
|
|
585
|
-
class:
|
|
586
|
-
style:
|
|
567
|
+
d("table", {
|
|
568
|
+
class: m(t.tableClass),
|
|
569
|
+
style: de(t.tableStyle)
|
|
587
570
|
}, [
|
|
588
|
-
|
|
589
|
-
class:
|
|
571
|
+
d("thead", {
|
|
572
|
+
class: m(C.value.thead)
|
|
590
573
|
}, [
|
|
591
|
-
|
|
592
|
-
t.selectable ? (
|
|
574
|
+
d("tr", null, [
|
|
575
|
+
t.selectable ? (s(), u("th", {
|
|
593
576
|
key: 0,
|
|
594
|
-
class:
|
|
577
|
+
class: m(["text-left font-medium uppercase tracking-wider", C.value.th, W.value.header, e.classTh, "w-12"])
|
|
595
578
|
}, [
|
|
596
|
-
|
|
579
|
+
d("input", {
|
|
597
580
|
type: "checkbox",
|
|
598
|
-
checked:
|
|
599
|
-
indeterminate:
|
|
600
|
-
onChange:
|
|
601
|
-
class:
|
|
602
|
-
}, null, 42,
|
|
603
|
-
], 2)) :
|
|
604
|
-
(
|
|
605
|
-
key:
|
|
606
|
-
class:
|
|
581
|
+
checked: q.value,
|
|
582
|
+
indeterminate: N.value,
|
|
583
|
+
onChange: G,
|
|
584
|
+
class: m(["h-4 w-4 focus:ring-blue-500 rounded", C.value.checkbox])
|
|
585
|
+
}, null, 42, Xe)
|
|
586
|
+
], 2)) : j("", !0),
|
|
587
|
+
(s(!0), u(B, null, R(se.value.filter((l) => !l.hidden), (l) => (s(), u("th", {
|
|
588
|
+
key: l.name,
|
|
589
|
+
class: m([
|
|
607
590
|
"text-left font-medium uppercase tracking-wider",
|
|
608
591
|
C.value.th,
|
|
609
|
-
|
|
592
|
+
W.value.header,
|
|
610
593
|
e.classTh,
|
|
611
|
-
|
|
612
|
-
|
|
613
|
-
ae(
|
|
594
|
+
l.align ? `text-${l.align}` : "",
|
|
595
|
+
K(l) ? ["cursor-pointer", C.value.thHover] : "",
|
|
596
|
+
ae(l)
|
|
614
597
|
]),
|
|
615
|
-
onClick: (g) =>
|
|
598
|
+
onClick: (g) => K(l) ? me(l.name) : void 0
|
|
616
599
|
}, [
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
|
|
620
|
-
|
|
621
|
-
asc:
|
|
600
|
+
d("div", Ze, [
|
|
601
|
+
d("span", null, y(l.ua || l.header || l.name), 1),
|
|
602
|
+
K(l) ? (s(), u("span", et, [
|
|
603
|
+
pe(t.$slots, "sort", {
|
|
604
|
+
asc: be(l.name)
|
|
622
605
|
}, () => [
|
|
623
|
-
|
|
606
|
+
L(y(he(l.name)), 1)
|
|
624
607
|
])
|
|
625
|
-
])) :
|
|
608
|
+
])) : j("", !0)
|
|
626
609
|
])
|
|
627
|
-
], 10,
|
|
628
|
-
h.value ? (
|
|
610
|
+
], 10, Ye))), 128)),
|
|
611
|
+
h.value ? (s(), u("th", tt, "Дії")) : j("", !0)
|
|
629
612
|
])
|
|
630
613
|
], 2),
|
|
631
|
-
|
|
632
|
-
class:
|
|
614
|
+
d("tbody", {
|
|
615
|
+
class: m(C.value.tbody)
|
|
633
616
|
}, [
|
|
634
|
-
(
|
|
617
|
+
(s(!0), u(B, null, R(F.value, (l, g) => (s(), u("tr", {
|
|
635
618
|
key: g,
|
|
636
|
-
class:
|
|
619
|
+
class: m([
|
|
637
620
|
C.value.tr,
|
|
638
621
|
e.classTr,
|
|
639
622
|
e.clickable ? "cursor-pointer" : ""
|
|
640
623
|
]),
|
|
641
|
-
onClick: (n) => e.clickable ?
|
|
624
|
+
onClick: (n) => e.clickable ? ye(l) : void 0
|
|
642
625
|
}, [
|
|
643
|
-
t.selectable ? (
|
|
626
|
+
t.selectable ? (s(), u("td", {
|
|
644
627
|
key: 0,
|
|
645
|
-
class:
|
|
628
|
+
class: m(["whitespace-nowrap", C.value.td, W.value.cell, e.classTd, "w-12"])
|
|
646
629
|
}, [
|
|
647
|
-
|
|
630
|
+
d("input", {
|
|
648
631
|
type: "checkbox",
|
|
649
|
-
checked:
|
|
650
|
-
onChange: (n) =>
|
|
651
|
-
class:
|
|
652
|
-
}, null, 42,
|
|
653
|
-
], 2)) :
|
|
654
|
-
(
|
|
632
|
+
checked: A(l),
|
|
633
|
+
onChange: (n) => te(l),
|
|
634
|
+
class: m(["h-4 w-4 focus:ring-blue-500 rounded", C.value.checkbox])
|
|
635
|
+
}, null, 42, rt)
|
|
636
|
+
], 2)) : j("", !0),
|
|
637
|
+
(s(!0), u(B, null, R(se.value.filter((n) => !n.hidden), (n) => (s(), u("td", {
|
|
655
638
|
key: n.name,
|
|
656
|
-
class:
|
|
639
|
+
class: m([
|
|
657
640
|
"whitespace-nowrap",
|
|
658
641
|
C.value.td,
|
|
659
|
-
|
|
642
|
+
W.value.cell,
|
|
660
643
|
e.classTd,
|
|
661
644
|
n.align ? `text-${n.align}` : "",
|
|
662
645
|
ae(n)
|
|
663
646
|
])
|
|
664
647
|
}, [
|
|
665
|
-
n.action && h.value ? (
|
|
648
|
+
n.action && h.value ? (s(), P(J(h.value), {
|
|
666
649
|
key: 0,
|
|
667
|
-
row:
|
|
668
|
-
value:
|
|
669
|
-
}, null, 8, ["row", "value"])) : n.slotName &&
|
|
650
|
+
row: l,
|
|
651
|
+
value: V(n, l)
|
|
652
|
+
}, null, 8, ["row", "value"])) : n.slotName && U.value[n.name] ? (s(), P(J(U.value[n.name]), {
|
|
670
653
|
key: 1,
|
|
671
|
-
data:
|
|
672
|
-
value:
|
|
673
|
-
row:
|
|
654
|
+
data: l,
|
|
655
|
+
value: V(n, l),
|
|
656
|
+
row: l,
|
|
674
657
|
column: n
|
|
675
|
-
}, null, 8, ["data", "value", "row", "column"])) : n.link ? (
|
|
658
|
+
}, null, 8, ["data", "value", "row", "column"])) : n.link ? (s(), u("a", {
|
|
676
659
|
key: 2,
|
|
677
|
-
class:
|
|
678
|
-
onClick: (
|
|
679
|
-
},
|
|
660
|
+
class: m(t.classLink || "hover:text-blue-900 cursor-pointer text-blue-700 hover:underline"),
|
|
661
|
+
onClick: (x) => k(n.link.replace("{id}", l.id))
|
|
662
|
+
}, y(V(n, l)), 11, lt)) : (s(), P(J(we(n.format)), {
|
|
680
663
|
key: 3,
|
|
681
|
-
value:
|
|
682
|
-
row:
|
|
664
|
+
value: V(n, l),
|
|
665
|
+
row: l,
|
|
683
666
|
column: n,
|
|
684
667
|
href: n.link
|
|
685
668
|
}, null, 8, ["value", "row", "column", "href"]))
|
|
686
669
|
], 2))), 128)),
|
|
687
|
-
|
|
688
|
-
h.value ? (
|
|
670
|
+
d("td", null, [
|
|
671
|
+
h.value ? (s(), P(J(h.value), {
|
|
689
672
|
key: 0,
|
|
690
|
-
row:
|
|
691
|
-
}, null, 8, ["row"])) :
|
|
673
|
+
row: l
|
|
674
|
+
}, null, 8, ["row"])) : j("", !0)
|
|
692
675
|
])
|
|
693
|
-
], 10,
|
|
676
|
+
], 10, at))), 128))
|
|
694
677
|
], 2)
|
|
695
678
|
], 6)
|
|
696
679
|
], 2)
|
|
697
|
-
])) :
|
|
698
|
-
|
|
680
|
+
])) : j("", !0),
|
|
681
|
+
ke.value && !$.value && !e.loading && !T.value ? (s(), P(fe, {
|
|
699
682
|
key: 3,
|
|
700
|
-
page:
|
|
701
|
-
limit:
|
|
702
|
-
total:
|
|
683
|
+
page: le.value,
|
|
684
|
+
limit: ne.value,
|
|
685
|
+
total: oe.value,
|
|
703
686
|
theme: e.theme,
|
|
704
687
|
size: e.size,
|
|
705
|
-
"onUpdate:page":
|
|
706
|
-
}, null, 8, ["page", "limit", "total", "theme", "size"])) :
|
|
707
|
-
|
|
688
|
+
"onUpdate:page": xe
|
|
689
|
+
}, null, 8, ["page", "limit", "total", "theme", "size"])) : j("", !0),
|
|
690
|
+
!$.value && !e.loading && !T.value && F.value.length === 0 ? (s(), u("div", {
|
|
708
691
|
key: 4,
|
|
709
|
-
class:
|
|
710
|
-
}, " Дані відсутні ", 2)) :
|
|
692
|
+
class: m(["text-center py-8", C.value.empty])
|
|
693
|
+
}, " Дані відсутні ", 2)) : j("", !0)
|
|
711
694
|
], 2));
|
|
712
695
|
}
|
|
713
|
-
}),
|
|
696
|
+
}), nt = { style: { display: "none" } }, ot = /* @__PURE__ */ S({
|
|
714
697
|
name: "Column",
|
|
715
698
|
__name: "Column",
|
|
716
699
|
props: {
|
|
@@ -730,135 +713,135 @@ const Re = /* @__PURE__ */ S({
|
|
|
730
713
|
getCellData: { type: Function },
|
|
731
714
|
suffix: {}
|
|
732
715
|
},
|
|
733
|
-
setup(
|
|
734
|
-
const a =
|
|
735
|
-
return
|
|
736
|
-
if (
|
|
716
|
+
setup(b) {
|
|
717
|
+
const a = b, e = ve(), c = $e("registerColumn");
|
|
718
|
+
return ge(() => {
|
|
719
|
+
if (c) {
|
|
737
720
|
const {
|
|
738
|
-
field:
|
|
739
|
-
name:
|
|
721
|
+
field: r,
|
|
722
|
+
name: o,
|
|
740
723
|
header: i,
|
|
741
724
|
label: _,
|
|
742
|
-
format:
|
|
743
|
-
slotName:
|
|
744
|
-
link:
|
|
745
|
-
action:
|
|
725
|
+
format: $,
|
|
726
|
+
slotName: T,
|
|
727
|
+
link: D,
|
|
728
|
+
action: p,
|
|
746
729
|
getCellData: h,
|
|
747
|
-
suffix:
|
|
748
|
-
...
|
|
749
|
-
} = a,
|
|
750
|
-
name:
|
|
730
|
+
suffix: k,
|
|
731
|
+
...F
|
|
732
|
+
} = a, N = {
|
|
733
|
+
name: r || o || "",
|
|
751
734
|
ua: i || _ || "",
|
|
752
|
-
format:
|
|
753
|
-
slotName:
|
|
735
|
+
format: $ || "text",
|
|
736
|
+
slotName: T || (e.body ? "body" : void 0),
|
|
754
737
|
// Use 'body' slot if it exists
|
|
755
|
-
link:
|
|
756
|
-
action:
|
|
738
|
+
link: D,
|
|
739
|
+
action: p,
|
|
757
740
|
getCellData: h,
|
|
758
|
-
suffix:
|
|
759
|
-
...
|
|
741
|
+
suffix: k,
|
|
742
|
+
...F
|
|
760
743
|
};
|
|
761
|
-
console.log("Registering column:",
|
|
762
|
-
const
|
|
763
|
-
|
|
744
|
+
console.log("Registering column:", N);
|
|
745
|
+
const G = e.body;
|
|
746
|
+
c(N, G);
|
|
764
747
|
}
|
|
765
|
-
}), (
|
|
766
|
-
|
|
748
|
+
}), (r, o) => (s(), u("div", nt, [
|
|
749
|
+
pe(r.$slots, "body", { data: {} })
|
|
767
750
|
]));
|
|
768
751
|
}
|
|
769
|
-
}),
|
|
752
|
+
}), st = { class: "mt-4" }, it = { class: "text-sm text-gray-600 dark:text-gray-300" }, ut = /* @__PURE__ */ S({
|
|
770
753
|
__name: "SelectionInfo",
|
|
771
754
|
props: {
|
|
772
755
|
selectedRows: {},
|
|
773
756
|
totalCount: {}
|
|
774
757
|
},
|
|
775
|
-
setup(
|
|
776
|
-
const a =
|
|
777
|
-
return (
|
|
778
|
-
|
|
758
|
+
setup(b) {
|
|
759
|
+
const a = b, e = f(() => a.selectedRows.length);
|
|
760
|
+
return (c, r) => (s(), u("div", st, [
|
|
761
|
+
d("div", it, " Обрано: " + y(e.value) + " з " + y(c.totalCount) + " записів ", 1)
|
|
779
762
|
]));
|
|
780
763
|
}
|
|
781
|
-
}),
|
|
764
|
+
}), ct = { class: "mt-4" }, dt = { class: "border-b border-gray-200 dark:border-gray-700" }, vt = { class: "-mb-px flex space-x-8" }, gt = ["onClick"], pt = { class: "mt-4" }, ft = { class: "bg-gray-900 rounded-lg overflow-hidden" }, mt = { class: "flex items-center justify-between px-4 py-2 bg-gray-800 border-b border-gray-700" }, bt = { class: "text-sm text-gray-300" }, ht = ["onClick"], yt = { class: "p-4 text-sm text-gray-100 overflow-x-auto" }, xt = /* @__PURE__ */ S({
|
|
782
765
|
__name: "CodeTabs",
|
|
783
766
|
props: {
|
|
784
767
|
tabs: {},
|
|
785
768
|
defaultTab: { default: void 0 }
|
|
786
769
|
},
|
|
787
|
-
setup(
|
|
788
|
-
const a =
|
|
770
|
+
setup(b) {
|
|
771
|
+
const a = b, e = w(a.defaultTab || a.tabs[0]?.id || ""), c = async (r) => {
|
|
789
772
|
try {
|
|
790
|
-
await navigator.clipboard.writeText(
|
|
791
|
-
} catch (
|
|
792
|
-
console.error("Помилка копіювання:",
|
|
773
|
+
await navigator.clipboard.writeText(r), console.log("Код скопійовано!");
|
|
774
|
+
} catch (o) {
|
|
775
|
+
console.error("Помилка копіювання:", o);
|
|
793
776
|
}
|
|
794
777
|
};
|
|
795
|
-
return (
|
|
796
|
-
|
|
797
|
-
|
|
798
|
-
(
|
|
778
|
+
return (r, o) => (s(), u("div", ct, [
|
|
779
|
+
d("div", dt, [
|
|
780
|
+
d("nav", vt, [
|
|
781
|
+
(s(!0), u(B, null, R(r.tabs, (i) => (s(), u("button", {
|
|
799
782
|
key: i.id,
|
|
800
|
-
onClick: (_) =>
|
|
801
|
-
class:
|
|
783
|
+
onClick: (_) => e.value = i.id,
|
|
784
|
+
class: m([
|
|
802
785
|
"py-2 px-1 border-b-2 font-medium text-sm transition-colors",
|
|
803
|
-
|
|
786
|
+
e.value === i.id ? "border-blue-500 text-blue-600 dark:text-blue-400" : "border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300 dark:text-gray-400 dark:hover:text-gray-300"
|
|
804
787
|
])
|
|
805
|
-
},
|
|
788
|
+
}, y(i.label), 11, gt))), 128))
|
|
806
789
|
])
|
|
807
790
|
]),
|
|
808
|
-
|
|
809
|
-
(
|
|
791
|
+
d("div", pt, [
|
|
792
|
+
(s(!0), u(B, null, R(r.tabs, (i) => Te((s(), u("div", {
|
|
810
793
|
key: i.id
|
|
811
794
|
}, [
|
|
812
|
-
|
|
813
|
-
|
|
814
|
-
|
|
815
|
-
|
|
816
|
-
onClick: (_) =>
|
|
795
|
+
d("div", ft, [
|
|
796
|
+
d("div", mt, [
|
|
797
|
+
d("span", bt, y(i.label), 1),
|
|
798
|
+
d("button", {
|
|
799
|
+
onClick: (_) => c(i.content),
|
|
817
800
|
class: "text-gray-400 hover:text-white transition-colors",
|
|
818
801
|
title: "Копіювати код"
|
|
819
|
-
},
|
|
820
|
-
|
|
802
|
+
}, o[0] || (o[0] = [
|
|
803
|
+
d("svg", {
|
|
821
804
|
class: "w-4 h-4",
|
|
822
805
|
fill: "none",
|
|
823
806
|
stroke: "currentColor",
|
|
824
807
|
viewBox: "0 0 24 24"
|
|
825
808
|
}, [
|
|
826
|
-
|
|
809
|
+
d("path", {
|
|
827
810
|
"stroke-linecap": "round",
|
|
828
811
|
"stroke-linejoin": "round",
|
|
829
812
|
"stroke-width": "2",
|
|
830
813
|
d: "M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"
|
|
831
814
|
})
|
|
832
815
|
], -1)
|
|
833
|
-
]), 8,
|
|
816
|
+
]), 8, ht)
|
|
834
817
|
]),
|
|
835
|
-
|
|
836
|
-
|
|
818
|
+
d("pre", yt, [
|
|
819
|
+
d("code", null, y(i.content), 1)
|
|
837
820
|
])
|
|
838
821
|
])
|
|
839
822
|
])), [
|
|
840
|
-
[
|
|
823
|
+
[Fe, e.value === i.id]
|
|
841
824
|
])), 128))
|
|
842
825
|
])
|
|
843
826
|
]));
|
|
844
827
|
}
|
|
845
828
|
});
|
|
846
|
-
|
|
847
|
-
a.component("DataTable",
|
|
829
|
+
ce.install = function(a) {
|
|
830
|
+
a.component("DataTable", ce), a.component("Column", ot), a.component("Pagination", fe), a.component("SelectionInfo", ut), a.component("CodeTabs", xt);
|
|
848
831
|
};
|
|
849
832
|
export {
|
|
850
|
-
|
|
851
|
-
|
|
852
|
-
|
|
853
|
-
|
|
854
|
-
|
|
855
|
-
|
|
856
|
-
|
|
857
|
-
|
|
858
|
-
|
|
859
|
-
|
|
860
|
-
|
|
861
|
-
|
|
862
|
-
|
|
863
|
-
|
|
833
|
+
ze as ArrayFormat,
|
|
834
|
+
Be as BadgeFormat,
|
|
835
|
+
xt as CodeTabs,
|
|
836
|
+
ot as Column,
|
|
837
|
+
ce as DataTable,
|
|
838
|
+
De as DateFormat,
|
|
839
|
+
Le as LinkFormat,
|
|
840
|
+
Se as NumberFormat,
|
|
841
|
+
fe as Pagination,
|
|
842
|
+
Ne as SelectFormat,
|
|
843
|
+
ut as SelectionInfo,
|
|
844
|
+
Ae as TextFormat,
|
|
845
|
+
ce as default,
|
|
846
|
+
ue as formatComponents
|
|
864
847
|
};
|