@dazzadev/vuetify-datatable 1.0.4 → 1.1.0
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/README.md +39 -2
- package/dist/components/DataTable.vue.d.ts +12 -2
- package/dist/vuetify-datatable.js +205 -183
- package/dist/vuetify-datatable.umd.cjs +1 -1
- package/package.json +4 -4
package/README.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# @dazzadev/vuetify-datatable
|
|
2
2
|
|
|
3
|
-
Reusable server-side DataTable component for Vuetify 3. Includes action buttons (view, edit, delete), configurable icons, and a built-in delete confirmation dialog.
|
|
3
|
+
Reusable server-side DataTable component for Vuetify 3 and 4. Includes action buttons (view, edit, delete), configurable icons, and a built-in delete confirmation dialog.
|
|
4
4
|
|
|
5
5
|
## Installation
|
|
6
6
|
|
|
@@ -44,6 +44,35 @@ import { DataTable } from "@dazzadev/vuetify-datatable";
|
|
|
44
44
|
</template>
|
|
45
45
|
```
|
|
46
46
|
|
|
47
|
+
## Row Selection
|
|
48
|
+
|
|
49
|
+
Set `showSelect` and bind `v-model` to hold the selected keys. **The key comes from `itemValue`**,
|
|
50
|
+
so point it at whatever your bulk endpoint expects — not necessarily `id`.
|
|
51
|
+
|
|
52
|
+
```vue
|
|
53
|
+
<DataTable
|
|
54
|
+
v-model="selected"
|
|
55
|
+
:headers="headers"
|
|
56
|
+
:items="items"
|
|
57
|
+
:totalItems="totalItems"
|
|
58
|
+
item-value="uuid"
|
|
59
|
+
show-select
|
|
60
|
+
@onLoadData="loadData"
|
|
61
|
+
>
|
|
62
|
+
<template #selection-actions="{ count, clear }">
|
|
63
|
+
<div v-if="count" class="d-flex align-center ga-2 pa-2">
|
|
64
|
+
<span>{{ count }} selected</span>
|
|
65
|
+
<v-btn size="small" @click="applyToSelection">Apply</v-btn>
|
|
66
|
+
<v-btn size="small" variant="text" @click="clear">Clear</v-btn>
|
|
67
|
+
</div>
|
|
68
|
+
</template>
|
|
69
|
+
</DataTable>
|
|
70
|
+
```
|
|
71
|
+
|
|
72
|
+
`selectStrategy` decides what the header checkbox does: `page` marks the current page only, `all`
|
|
73
|
+
marks every loaded row, `single` allows one row at a time. With server-side pagination `page` is
|
|
74
|
+
usually what you want — the table only holds the rows it has fetched.
|
|
75
|
+
|
|
47
76
|
## Icon Configuration
|
|
48
77
|
|
|
49
78
|
Icons can be configured at 4 levels of priority (highest to lowest):
|
|
@@ -116,6 +145,9 @@ If no configuration is provided, the component uses Material Design Icons (inclu
|
|
|
116
145
|
| `itemValue` | `string` | `'id'` | Unique item identifier key |
|
|
117
146
|
| `tableClass` | `string` | `'border rounded-md mt-5'` | CSS class for the table |
|
|
118
147
|
| `showExpand` | `boolean` | `false` | Show expandable rows |
|
|
148
|
+
| `showSelect` | `boolean` | `false` | Show a checkbox column for row selection |
|
|
149
|
+
| `selectStrategy` | `'page' \| 'all' \| 'single'` | `'page'` | How the header checkbox selects rows |
|
|
150
|
+
| `modelValue` | `(string \| number)[]` | `[]` | Selected keys, taken from `itemValue`. Use with `v-model` |
|
|
119
151
|
| `showViewButton` | `boolean` | `false` | Show view action button |
|
|
120
152
|
| `showEditButton` | `boolean` | `true` | Show edit action button |
|
|
121
153
|
| `showDeleteButton` | `boolean` | `true` | Show delete action button |
|
|
@@ -141,6 +173,7 @@ If no configuration is provided, the component uses Material Design Icons (inclu
|
|
|
141
173
|
| `editItem` | `T` | Triggered when edit button is clicked |
|
|
142
174
|
| `deleteItem` | `T` | Triggered when delete is confirmed |
|
|
143
175
|
| `viewItem` | `T` | Triggered when view button is clicked |
|
|
176
|
+
| `update:modelValue` | `(string \| number)[]` | Triggered when the selection changes |
|
|
144
177
|
|
|
145
178
|
## Slots
|
|
146
179
|
|
|
@@ -155,11 +188,15 @@ If no configuration is provided, the component uses Material Design Icons (inclu
|
|
|
155
188
|
| `edit-icon` | Custom edit icon |
|
|
156
189
|
| `delete-icon` | Custom delete icon |
|
|
157
190
|
| `item.tfoot` | Table footer content |
|
|
191
|
+
| `selection-actions` | Bar above the table, for bulk actions. Only rendered when `showSelect`. Receives `{ selected, count, clear }` |
|
|
158
192
|
|
|
159
193
|
## Peer Dependencies
|
|
160
194
|
|
|
161
195
|
- `vue` >= 3.3
|
|
162
|
-
- `vuetify`
|
|
196
|
+
- `vuetify` 3.x or 4.x
|
|
197
|
+
|
|
198
|
+
The component only uses the `v-data-table-server` API that is common to both major
|
|
199
|
+
versions, so a single build works with either.
|
|
163
200
|
|
|
164
201
|
## License
|
|
165
202
|
|
|
@@ -5,7 +5,8 @@ declare const _default: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>
|
|
|
5
5
|
readonly onEditItem?: ((...args: any[]) => any) | undefined;
|
|
6
6
|
readonly onDeleteItem?: ((...args: any[]) => any) | undefined;
|
|
7
7
|
readonly onViewItem?: ((...args: any[]) => any) | undefined;
|
|
8
|
-
|
|
8
|
+
readonly "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
|
|
9
|
+
} & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onOnLoadData" | "onEditItem" | "onDeleteItem" | "onViewItem" | "onUpdate:modelValue"> & {
|
|
9
10
|
tableClass?: string;
|
|
10
11
|
headers?: TableHeader[];
|
|
11
12
|
items?: T[];
|
|
@@ -15,6 +16,9 @@ declare const _default: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>
|
|
|
15
16
|
itemsPerPage?: number;
|
|
16
17
|
search?: string;
|
|
17
18
|
showExpand?: boolean;
|
|
19
|
+
showSelect?: boolean;
|
|
20
|
+
selectStrategy?: "page" | "all" | "single";
|
|
21
|
+
modelValue?: (string | number)[];
|
|
18
22
|
showEditButton?: boolean;
|
|
19
23
|
showDeleteButton?: boolean;
|
|
20
24
|
showViewButton?: boolean;
|
|
@@ -49,6 +53,12 @@ declare const _default: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>
|
|
|
49
53
|
columns: any;
|
|
50
54
|
item: any;
|
|
51
55
|
}) => any) | undefined;
|
|
56
|
+
} & {
|
|
57
|
+
'selection-actions'?: (props: {
|
|
58
|
+
selected: (string | number)[];
|
|
59
|
+
count: number;
|
|
60
|
+
clear: () => void;
|
|
61
|
+
}) => any;
|
|
52
62
|
} & {
|
|
53
63
|
'before-actions'?: (props: {
|
|
54
64
|
item: any;
|
|
@@ -66,7 +76,7 @@ declare const _default: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>
|
|
|
66
76
|
} & {
|
|
67
77
|
'item.tfoot'?: (props: {}) => any;
|
|
68
78
|
};
|
|
69
|
-
emit: (event: "onLoadData" | "editItem" | "deleteItem" | "viewItem", ...args: any[]) => void;
|
|
79
|
+
emit: (event: "onLoadData" | "editItem" | "deleteItem" | "viewItem" | "update:modelValue", ...args: any[]) => void;
|
|
70
80
|
}>) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
|
71
81
|
[key: string]: any;
|
|
72
82
|
}> & {
|
|
@@ -1,49 +1,49 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
function
|
|
1
|
+
import { defineComponent as G, computed as I, resolveComponent as w, openBlock as v, createBlock as y, withCtx as n, createVNode as r, createTextVNode as T, toDisplayString as P, renderSlot as b, createCommentVNode as N, inject as te, ref as M, onMounted as oe, watch as j, createElementBlock as ne, Fragment as ae, normalizeClass as le, createSlots as se, createElementVNode as ie, mergeProps as S, resolveDynamicComponent as q, renderList as de } from "vue";
|
|
2
|
+
function ce(e) {
|
|
3
3
|
return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
|
|
4
4
|
}
|
|
5
|
-
var
|
|
5
|
+
var L = { exports: {} }, R;
|
|
6
6
|
function re() {
|
|
7
|
-
if (
|
|
8
|
-
|
|
9
|
-
function e(
|
|
10
|
-
if (typeof
|
|
11
|
-
throw new TypeError(`Expected the first parameter to be a function, got \`${typeof
|
|
7
|
+
if (R) return L.exports;
|
|
8
|
+
R = 1;
|
|
9
|
+
function e(h, l = 100, c = {}) {
|
|
10
|
+
if (typeof h != "function")
|
|
11
|
+
throw new TypeError(`Expected the first parameter to be a function, got \`${typeof h}\`.`);
|
|
12
12
|
if (l < 0)
|
|
13
13
|
throw new RangeError("`wait` must not be negative.");
|
|
14
|
-
const { immediate:
|
|
15
|
-
let
|
|
16
|
-
function
|
|
17
|
-
const
|
|
18
|
-
return
|
|
14
|
+
const { immediate: i } = typeof c == "boolean" ? { immediate: c } : c;
|
|
15
|
+
let f, p, s, B, x;
|
|
16
|
+
function C() {
|
|
17
|
+
const d = f, D = p;
|
|
18
|
+
return f = void 0, p = void 0, x = h.apply(d, D), x;
|
|
19
19
|
}
|
|
20
|
-
function
|
|
21
|
-
const
|
|
22
|
-
|
|
20
|
+
function k() {
|
|
21
|
+
const d = Date.now() - B;
|
|
22
|
+
d < l && d >= 0 ? s = setTimeout(k, l - d) : (s = void 0, i || (x = C()));
|
|
23
23
|
}
|
|
24
|
-
const
|
|
25
|
-
if (
|
|
24
|
+
const u = function(...d) {
|
|
25
|
+
if (f && this !== f && Object.getPrototypeOf(this) === Object.getPrototypeOf(f))
|
|
26
26
|
throw new Error("Debounced method called with different contexts of the same prototype.");
|
|
27
|
-
|
|
28
|
-
const D =
|
|
29
|
-
return
|
|
27
|
+
f = this, p = d, B = Date.now();
|
|
28
|
+
const D = i && !s;
|
|
29
|
+
return s || (s = setTimeout(k, l)), D && (x = C()), x;
|
|
30
30
|
};
|
|
31
|
-
return Object.defineProperty(
|
|
31
|
+
return Object.defineProperty(u, "isPending", {
|
|
32
32
|
get() {
|
|
33
|
-
return
|
|
33
|
+
return s !== void 0;
|
|
34
34
|
}
|
|
35
|
-
}),
|
|
36
|
-
|
|
37
|
-
},
|
|
38
|
-
|
|
39
|
-
},
|
|
40
|
-
|
|
41
|
-
},
|
|
35
|
+
}), u.clear = () => {
|
|
36
|
+
s && (clearTimeout(s), s = void 0);
|
|
37
|
+
}, u.flush = () => {
|
|
38
|
+
s && u.trigger();
|
|
39
|
+
}, u.trigger = () => {
|
|
40
|
+
x = C(), u.clear();
|
|
41
|
+
}, u;
|
|
42
42
|
}
|
|
43
|
-
return
|
|
43
|
+
return L.exports.debounce = e, L.exports = e, L.exports;
|
|
44
44
|
}
|
|
45
|
-
var
|
|
46
|
-
const
|
|
45
|
+
var ue = /* @__PURE__ */ re();
|
|
46
|
+
const me = /* @__PURE__ */ ce(ue), fe = /* @__PURE__ */ G({
|
|
47
47
|
__name: "ConfirmationModal",
|
|
48
48
|
props: {
|
|
49
49
|
show: Boolean,
|
|
@@ -54,65 +54,65 @@ const ue = /* @__PURE__ */ de(ce), me = /* @__PURE__ */ R({
|
|
|
54
54
|
},
|
|
55
55
|
emits: ["close", "confirm"],
|
|
56
56
|
setup(e) {
|
|
57
|
-
const
|
|
58
|
-
get: () =>
|
|
57
|
+
const h = e, l = I({
|
|
58
|
+
get: () => h.show,
|
|
59
59
|
set: () => {
|
|
60
60
|
}
|
|
61
61
|
});
|
|
62
|
-
return (
|
|
63
|
-
const
|
|
64
|
-
return
|
|
62
|
+
return (c, i) => {
|
|
63
|
+
const f = w("v-card-title"), p = w("v-card-text"), s = w("v-spacer"), B = w("v-btn"), x = w("v-card-actions"), C = w("v-card"), k = w("v-dialog");
|
|
64
|
+
return v(), y(k, {
|
|
65
65
|
modelValue: l.value,
|
|
66
|
-
"onUpdate:modelValue":
|
|
66
|
+
"onUpdate:modelValue": i[2] || (i[2] = (u) => l.value = u),
|
|
67
67
|
"max-width": "500px",
|
|
68
68
|
persistent: "",
|
|
69
69
|
"no-click-animation": ""
|
|
70
70
|
}, {
|
|
71
71
|
default: n(() => [
|
|
72
|
-
r(
|
|
72
|
+
r(C, null, {
|
|
73
73
|
default: n(() => [
|
|
74
|
-
r(
|
|
74
|
+
r(f, { class: "text-h5 text-center py-6" }, {
|
|
75
75
|
default: n(() => [
|
|
76
76
|
T(P(e.title), 1)
|
|
77
77
|
]),
|
|
78
78
|
_: 1
|
|
79
79
|
}),
|
|
80
|
-
e.description ? (
|
|
80
|
+
e.description ? (v(), y(p, {
|
|
81
81
|
key: 0,
|
|
82
82
|
class: "text-center px-0 py-0"
|
|
83
83
|
}, {
|
|
84
84
|
default: n(() => [
|
|
85
85
|
T(P(e.description) + " ", 1),
|
|
86
|
-
|
|
86
|
+
b(c.$slots, "description")
|
|
87
87
|
]),
|
|
88
88
|
_: 3
|
|
89
|
-
})) :
|
|
90
|
-
r(
|
|
89
|
+
})) : N("", !0),
|
|
90
|
+
r(x, null, {
|
|
91
91
|
default: n(() => [
|
|
92
|
-
r(
|
|
93
|
-
r(
|
|
92
|
+
r(s),
|
|
93
|
+
r(B, {
|
|
94
94
|
color: "error",
|
|
95
95
|
variant: "flat",
|
|
96
96
|
dark: "",
|
|
97
|
-
onClick:
|
|
97
|
+
onClick: i[0] || (i[0] = (u) => c.$emit("close"))
|
|
98
98
|
}, {
|
|
99
99
|
default: n(() => [
|
|
100
100
|
T(P(e.cancelButtonText), 1)
|
|
101
101
|
]),
|
|
102
102
|
_: 1
|
|
103
103
|
}),
|
|
104
|
-
r(
|
|
104
|
+
r(B, {
|
|
105
105
|
color: "success",
|
|
106
106
|
variant: "flat",
|
|
107
107
|
dark: "",
|
|
108
|
-
onClick:
|
|
108
|
+
onClick: i[1] || (i[1] = (u) => c.$emit("confirm"))
|
|
109
109
|
}, {
|
|
110
110
|
default: n(() => [
|
|
111
111
|
T(P(e.confirmButtonText), 1)
|
|
112
112
|
]),
|
|
113
113
|
_: 1
|
|
114
114
|
}),
|
|
115
|
-
r(
|
|
115
|
+
r(s)
|
|
116
116
|
]),
|
|
117
117
|
_: 1
|
|
118
118
|
})
|
|
@@ -124,15 +124,15 @@ const ue = /* @__PURE__ */ de(ce), me = /* @__PURE__ */ R({
|
|
|
124
124
|
}, 8, ["modelValue"]);
|
|
125
125
|
};
|
|
126
126
|
}
|
|
127
|
-
}),
|
|
128
|
-
function
|
|
127
|
+
}), K = Symbol("DataTableConfig");
|
|
128
|
+
function be(e) {
|
|
129
129
|
return {
|
|
130
|
-
install(
|
|
131
|
-
|
|
130
|
+
install(h) {
|
|
131
|
+
h.provide(K, e);
|
|
132
132
|
}
|
|
133
133
|
};
|
|
134
134
|
}
|
|
135
|
-
const
|
|
135
|
+
const ve = /* @__PURE__ */ G({
|
|
136
136
|
__name: "DataTable",
|
|
137
137
|
props: {
|
|
138
138
|
tableClass: {},
|
|
@@ -144,6 +144,9 @@ const fe = /* @__PURE__ */ R({
|
|
|
144
144
|
itemsPerPage: { default: 10 },
|
|
145
145
|
search: {},
|
|
146
146
|
showExpand: { type: Boolean, default: !1 },
|
|
147
|
+
showSelect: { type: Boolean, default: !1 },
|
|
148
|
+
selectStrategy: { default: "page" },
|
|
149
|
+
modelValue: { default: () => [] },
|
|
147
150
|
showEditButton: { type: Boolean, default: !0 },
|
|
148
151
|
showDeleteButton: { type: Boolean, default: !0 },
|
|
149
152
|
showViewButton: { type: Boolean, default: !1 },
|
|
@@ -161,118 +164,126 @@ const fe = /* @__PURE__ */ R({
|
|
|
161
164
|
disableEdit: {},
|
|
162
165
|
disableDelete: {}
|
|
163
166
|
},
|
|
164
|
-
emits: ["onLoadData", "editItem", "deleteItem", "viewItem"],
|
|
165
|
-
setup(e, { emit:
|
|
166
|
-
const l = e,
|
|
167
|
+
emits: ["onLoadData", "editItem", "deleteItem", "viewItem", "update:modelValue"],
|
|
168
|
+
setup(e, { emit: h }) {
|
|
169
|
+
const l = e, c = h, i = te(K, { icons: {} }), f = I(() => {
|
|
167
170
|
var t;
|
|
168
|
-
return l.viewIcon ?? ((t =
|
|
169
|
-
}),
|
|
171
|
+
return l.viewIcon ?? ((t = i.icons) == null ? void 0 : t.view) ?? "mdi-eye-outline";
|
|
172
|
+
}), p = I(() => {
|
|
170
173
|
var t;
|
|
171
|
-
return l.editIcon ?? ((t =
|
|
172
|
-
}),
|
|
174
|
+
return l.editIcon ?? ((t = i.icons) == null ? void 0 : t.edit) ?? "mdi-pencil-outline";
|
|
175
|
+
}), s = I(() => {
|
|
173
176
|
var t;
|
|
174
|
-
return l.deleteIcon ?? ((t =
|
|
175
|
-
}),
|
|
176
|
-
function
|
|
177
|
+
return l.deleteIcon ?? ((t = i.icons) == null ? void 0 : t.delete) ?? "mdi-trash-can-outline";
|
|
178
|
+
}), B = I(() => i.iconProps ?? {}), x = I(() => l.tableClass ?? i.tableClass ?? "border rounded-md");
|
|
179
|
+
function C(t) {
|
|
177
180
|
return typeof t != "string";
|
|
178
181
|
}
|
|
179
|
-
const
|
|
182
|
+
const k = I({
|
|
183
|
+
get: () => l.modelValue,
|
|
184
|
+
set: (t) => c("update:modelValue", t)
|
|
185
|
+
});
|
|
186
|
+
function u() {
|
|
187
|
+
c("update:modelValue", []);
|
|
188
|
+
}
|
|
189
|
+
const d = M(l.itemsPerPage), D = M([]), O = M(1), A = M(null), z = M(!1), Y = I(() => {
|
|
180
190
|
var t;
|
|
181
191
|
return ((t = l.headers) == null ? void 0 : t.filter(
|
|
182
|
-
(
|
|
192
|
+
(a) => a.key !== "actions" && a.key !== "expanded-row" && a.key !== "data-table-expand"
|
|
183
193
|
)) || [];
|
|
184
194
|
});
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
page:
|
|
188
|
-
itemsPerPage:
|
|
195
|
+
oe(() => {
|
|
196
|
+
E({
|
|
197
|
+
page: O.value,
|
|
198
|
+
itemsPerPage: d.value
|
|
189
199
|
});
|
|
190
200
|
});
|
|
191
|
-
const
|
|
192
|
-
|
|
193
|
-
},
|
|
194
|
-
|
|
195
|
-
}, J = (t) => {
|
|
196
|
-
u("editItem", t);
|
|
201
|
+
const H = (t) => {
|
|
202
|
+
A.value = t, z.value = !0;
|
|
203
|
+
}, J = () => {
|
|
204
|
+
A.value = null, z.value = !1;
|
|
197
205
|
}, Q = (t) => {
|
|
198
|
-
|
|
199
|
-
}, W = () => {
|
|
200
|
-
|
|
201
|
-
},
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
206
|
+
c("editItem", t);
|
|
207
|
+
}, W = (t) => {
|
|
208
|
+
c("viewItem", t);
|
|
209
|
+
}, X = () => {
|
|
210
|
+
c("deleteItem", A.value), z.value = !1;
|
|
211
|
+
}, E = ({ page: t, itemsPerPage: a }) => {
|
|
212
|
+
const V = D.value.map(($) => ({
|
|
213
|
+
column: $.key,
|
|
214
|
+
direction: $.order
|
|
205
215
|
}));
|
|
206
|
-
|
|
216
|
+
c("onLoadData", {
|
|
207
217
|
page: t,
|
|
208
|
-
itemsPerPage:
|
|
218
|
+
itemsPerPage: a,
|
|
209
219
|
search: l.search,
|
|
210
|
-
sortBy:
|
|
220
|
+
sortBy: V
|
|
211
221
|
});
|
|
212
222
|
};
|
|
213
|
-
function
|
|
214
|
-
|
|
223
|
+
function Z() {
|
|
224
|
+
E({
|
|
215
225
|
page: 1,
|
|
216
|
-
itemsPerPage:
|
|
226
|
+
itemsPerPage: d.value
|
|
217
227
|
});
|
|
218
228
|
}
|
|
219
|
-
const
|
|
220
|
-
|
|
221
|
-
};
|
|
222
|
-
return z(
|
|
229
|
+
const _ = me(Z, 400);
|
|
230
|
+
return j(
|
|
223
231
|
() => l.search,
|
|
224
|
-
(t,
|
|
225
|
-
t !==
|
|
232
|
+
(t, a) => {
|
|
233
|
+
t !== a && _();
|
|
226
234
|
}
|
|
227
|
-
),
|
|
228
|
-
t !==
|
|
235
|
+
), j(d, (t, a) => {
|
|
236
|
+
t !== a && E({
|
|
229
237
|
page: 1,
|
|
230
238
|
itemsPerPage: t
|
|
231
239
|
});
|
|
232
|
-
}),
|
|
233
|
-
|
|
240
|
+
}), j(D, () => {
|
|
241
|
+
E({
|
|
234
242
|
page: 1,
|
|
235
|
-
itemsPerPage:
|
|
243
|
+
itemsPerPage: d.value
|
|
236
244
|
});
|
|
237
|
-
}),
|
|
238
|
-
|
|
245
|
+
}), j(O, (t) => {
|
|
246
|
+
E({
|
|
239
247
|
page: t,
|
|
240
|
-
itemsPerPage:
|
|
248
|
+
itemsPerPage: d.value
|
|
241
249
|
});
|
|
242
|
-
}), (t,
|
|
243
|
-
const
|
|
244
|
-
return
|
|
245
|
-
r(
|
|
250
|
+
}), (t, a) => {
|
|
251
|
+
const V = w("v-icon"), $ = w("v-btn"), F = w("v-tooltip"), ee = w("v-data-table-server");
|
|
252
|
+
return v(), ne(ae, null, [
|
|
253
|
+
r(ee, {
|
|
246
254
|
headers: e.headers,
|
|
247
255
|
items: e.items,
|
|
248
256
|
loading: e.loading,
|
|
249
257
|
"items-length": e.totalItems,
|
|
250
|
-
"items-per-page":
|
|
251
|
-
"onUpdate:itemsPerPage":
|
|
258
|
+
"items-per-page": d.value,
|
|
259
|
+
"onUpdate:itemsPerPage": a[0] || (a[0] = (o) => d.value = o),
|
|
252
260
|
search: e.search,
|
|
253
|
-
|
|
254
|
-
"
|
|
255
|
-
|
|
256
|
-
page:
|
|
257
|
-
"onUpdate:page": s[2] || (s[2] = (o) => v.value = o),
|
|
261
|
+
"sort-by": D.value,
|
|
262
|
+
"onUpdate:sortBy": a[1] || (a[1] = (o) => D.value = o),
|
|
263
|
+
page: O.value,
|
|
264
|
+
"onUpdate:page": a[2] || (a[2] = (o) => O.value = o),
|
|
258
265
|
"item-value": e.itemValue,
|
|
259
266
|
"show-expand": e.showExpand,
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
267
|
+
"show-select": e.showSelect,
|
|
268
|
+
"select-strategy": e.selectStrategy,
|
|
269
|
+
modelValue: k.value,
|
|
270
|
+
"onUpdate:modelValue": a[3] || (a[3] = (o) => k.value = o),
|
|
271
|
+
class: le(x.value)
|
|
272
|
+
}, se({
|
|
273
|
+
"item.data-table-expand": n(({ internalItem: o, isExpanded: m, toggleExpand: g }) => [
|
|
274
|
+
b(t.$slots, "item.data-table-expand", {
|
|
264
275
|
internalItem: o,
|
|
265
|
-
isExpanded:
|
|
266
|
-
toggleExpand:
|
|
276
|
+
isExpanded: m,
|
|
277
|
+
toggleExpand: g
|
|
267
278
|
}, () => [
|
|
268
|
-
r(
|
|
269
|
-
onClick: (
|
|
279
|
+
r($, {
|
|
280
|
+
onClick: (U) => g(o),
|
|
270
281
|
rounded: ""
|
|
271
282
|
}, {
|
|
272
283
|
default: n(() => [
|
|
273
|
-
r(
|
|
284
|
+
r(V, null, {
|
|
274
285
|
default: n(() => [
|
|
275
|
-
T(P(
|
|
286
|
+
T(P(m(o) ? "mdi-chevron-up" : "mdi-chevron-down"), 1)
|
|
276
287
|
]),
|
|
277
288
|
_: 2
|
|
278
289
|
}, 1024)
|
|
@@ -281,41 +292,41 @@ const fe = /* @__PURE__ */ R({
|
|
|
281
292
|
}, 1032, ["onClick"])
|
|
282
293
|
])
|
|
283
294
|
]),
|
|
284
|
-
"expanded-row": n(({ columns: o, item:
|
|
285
|
-
|
|
295
|
+
"expanded-row": n(({ columns: o, item: m }) => [
|
|
296
|
+
b(t.$slots, "expanded-row", {
|
|
286
297
|
columns: o,
|
|
287
|
-
item:
|
|
298
|
+
item: m
|
|
288
299
|
})
|
|
289
300
|
]),
|
|
290
301
|
"item.actions": n(({ item: o }) => [
|
|
291
|
-
|
|
292
|
-
e.showViewButton ? (
|
|
302
|
+
b(t.$slots, "before-actions", { item: o }),
|
|
303
|
+
e.showViewButton ? (v(), y(F, {
|
|
293
304
|
key: 0,
|
|
294
305
|
text: e.viewButtonText
|
|
295
306
|
}, {
|
|
296
|
-
activator: n(({ props:
|
|
297
|
-
var
|
|
307
|
+
activator: n(({ props: m }) => {
|
|
308
|
+
var g;
|
|
298
309
|
return [
|
|
299
|
-
r(
|
|
310
|
+
r($, S({
|
|
300
311
|
icon: "",
|
|
301
312
|
flat: "",
|
|
302
|
-
onClick: (
|
|
303
|
-
},
|
|
304
|
-
disabled: (
|
|
313
|
+
onClick: (U) => W(o)
|
|
314
|
+
}, m, {
|
|
315
|
+
disabled: (g = e.disableView) == null ? void 0 : g.call(e, o)
|
|
305
316
|
}), {
|
|
306
317
|
default: n(() => [
|
|
307
|
-
|
|
308
|
-
|
|
318
|
+
b(t.$slots, "view-icon", {}, () => [
|
|
319
|
+
C(f.value) ? (v(), y(q(f.value), S({
|
|
309
320
|
key: 0,
|
|
310
321
|
size: 20,
|
|
311
322
|
class: "text-info"
|
|
312
|
-
},
|
|
323
|
+
}, B.value), null, 16)) : (v(), y(V, {
|
|
313
324
|
key: 1,
|
|
314
325
|
size: "20",
|
|
315
326
|
class: "text-info"
|
|
316
327
|
}, {
|
|
317
328
|
default: n(() => [
|
|
318
|
-
T(P(
|
|
329
|
+
T(P(f.value), 1)
|
|
319
330
|
]),
|
|
320
331
|
_: 1
|
|
321
332
|
}))
|
|
@@ -326,34 +337,34 @@ const fe = /* @__PURE__ */ R({
|
|
|
326
337
|
];
|
|
327
338
|
}),
|
|
328
339
|
_: 2
|
|
329
|
-
}, 1032, ["text"])) :
|
|
330
|
-
e.showEditButton ? (
|
|
340
|
+
}, 1032, ["text"])) : N("", !0),
|
|
341
|
+
e.showEditButton ? (v(), y(F, {
|
|
331
342
|
key: 1,
|
|
332
343
|
text: e.editButtonText
|
|
333
344
|
}, {
|
|
334
|
-
activator: n(({ props:
|
|
335
|
-
var
|
|
345
|
+
activator: n(({ props: m }) => {
|
|
346
|
+
var g;
|
|
336
347
|
return [
|
|
337
|
-
r(
|
|
348
|
+
r($, S({
|
|
338
349
|
icon: "",
|
|
339
350
|
flat: "",
|
|
340
|
-
onClick: (
|
|
341
|
-
},
|
|
342
|
-
disabled: (
|
|
351
|
+
onClick: (U) => Q(o)
|
|
352
|
+
}, m, {
|
|
353
|
+
disabled: (g = e.disableEdit) == null ? void 0 : g.call(e, o)
|
|
343
354
|
}), {
|
|
344
355
|
default: n(() => [
|
|
345
|
-
|
|
346
|
-
|
|
356
|
+
b(t.$slots, "edit-icon", {}, () => [
|
|
357
|
+
C(p.value) ? (v(), y(q(p.value), S({
|
|
347
358
|
key: 0,
|
|
348
359
|
size: 20,
|
|
349
360
|
class: "text-primary"
|
|
350
|
-
},
|
|
361
|
+
}, B.value), null, 16)) : (v(), y(V, {
|
|
351
362
|
key: 1,
|
|
352
363
|
size: "20",
|
|
353
364
|
class: "text-primary"
|
|
354
365
|
}, {
|
|
355
366
|
default: n(() => [
|
|
356
|
-
T(P(
|
|
367
|
+
T(P(p.value), 1)
|
|
357
368
|
]),
|
|
358
369
|
_: 1
|
|
359
370
|
}))
|
|
@@ -364,34 +375,34 @@ const fe = /* @__PURE__ */ R({
|
|
|
364
375
|
];
|
|
365
376
|
}),
|
|
366
377
|
_: 2
|
|
367
|
-
}, 1032, ["text"])) :
|
|
368
|
-
e.showDeleteButton ? (
|
|
378
|
+
}, 1032, ["text"])) : N("", !0),
|
|
379
|
+
e.showDeleteButton ? (v(), y(F, {
|
|
369
380
|
key: 2,
|
|
370
381
|
text: e.deleteButtonText
|
|
371
382
|
}, {
|
|
372
|
-
activator: n(({ props:
|
|
373
|
-
var
|
|
383
|
+
activator: n(({ props: m }) => {
|
|
384
|
+
var g;
|
|
374
385
|
return [
|
|
375
|
-
r(
|
|
386
|
+
r($, S({
|
|
376
387
|
icon: "",
|
|
377
388
|
flat: "",
|
|
378
|
-
onClick: (
|
|
379
|
-
},
|
|
380
|
-
disabled: (
|
|
389
|
+
onClick: (U) => H(o)
|
|
390
|
+
}, m, {
|
|
391
|
+
disabled: (g = e.disableDelete) == null ? void 0 : g.call(e, o)
|
|
381
392
|
}), {
|
|
382
393
|
default: n(() => [
|
|
383
|
-
|
|
384
|
-
|
|
394
|
+
b(t.$slots, "delete-icon", {}, () => [
|
|
395
|
+
C(s.value) ? (v(), y(q(s.value), S({
|
|
385
396
|
key: 0,
|
|
386
397
|
size: 20,
|
|
387
398
|
class: "text-error"
|
|
388
|
-
},
|
|
399
|
+
}, B.value), null, 16)) : (v(), y(V, {
|
|
389
400
|
key: 1,
|
|
390
401
|
size: "20",
|
|
391
402
|
class: "text-error"
|
|
392
403
|
}, {
|
|
393
404
|
default: n(() => [
|
|
394
|
-
T(P(
|
|
405
|
+
T(P(s.value), 1)
|
|
395
406
|
]),
|
|
396
407
|
_: 1
|
|
397
408
|
}))
|
|
@@ -402,45 +413,56 @@ const fe = /* @__PURE__ */ R({
|
|
|
402
413
|
];
|
|
403
414
|
}),
|
|
404
415
|
_: 2
|
|
405
|
-
}, 1032, ["text"])) :
|
|
406
|
-
|
|
416
|
+
}, 1032, ["text"])) : N("", !0),
|
|
417
|
+
b(t.$slots, "after-actions", { item: o })
|
|
407
418
|
]),
|
|
408
419
|
tfoot: n(() => [
|
|
409
420
|
ie("tfoot", null, [
|
|
410
|
-
|
|
421
|
+
b(t.$slots, "item.tfoot")
|
|
411
422
|
])
|
|
412
423
|
]),
|
|
413
424
|
_: 2
|
|
414
425
|
}, [
|
|
415
|
-
|
|
426
|
+
e.showSelect ? {
|
|
427
|
+
name: "top",
|
|
428
|
+
fn: n(() => [
|
|
429
|
+
b(t.$slots, "selection-actions", {
|
|
430
|
+
selected: k.value,
|
|
431
|
+
count: k.value.length,
|
|
432
|
+
clear: u
|
|
433
|
+
})
|
|
434
|
+
]),
|
|
435
|
+
key: "0"
|
|
436
|
+
} : void 0,
|
|
437
|
+
de(Y.value, (o) => ({
|
|
416
438
|
name: `item.${o.key}`,
|
|
417
|
-
fn: n(({ item:
|
|
418
|
-
|
|
419
|
-
T(P(
|
|
439
|
+
fn: n(({ item: m }) => [
|
|
440
|
+
b(t.$slots, `item.${o.key}`, { item: m }, () => [
|
|
441
|
+
T(P(m[o.key]), 1)
|
|
420
442
|
])
|
|
421
443
|
])
|
|
422
444
|
}))
|
|
423
|
-
]), 1032, ["headers", "items", "loading", "items-length", "items-per-page", "search", "sort-by", "page", "item-value", "show-expand", "class"]),
|
|
424
|
-
r(
|
|
425
|
-
show:
|
|
445
|
+
]), 1032, ["headers", "items", "loading", "items-length", "items-per-page", "search", "sort-by", "page", "item-value", "show-expand", "show-select", "select-strategy", "modelValue", "class"]),
|
|
446
|
+
r(fe, {
|
|
447
|
+
show: z.value,
|
|
426
448
|
title: e.deleteModalTitle,
|
|
427
449
|
description: e.deleteModalMessage,
|
|
428
450
|
confirmButtonText: e.deleteModalConfirmButtonText,
|
|
429
451
|
cancelButtonText: e.deleteModalCancelButtonText,
|
|
430
|
-
onClose:
|
|
431
|
-
onConfirm:
|
|
452
|
+
onClose: J,
|
|
453
|
+
onConfirm: X
|
|
432
454
|
}, null, 8, ["show", "title", "description", "confirmButtonText", "cancelButtonText"])
|
|
433
455
|
], 64);
|
|
434
456
|
};
|
|
435
457
|
}
|
|
436
|
-
}),
|
|
458
|
+
}), ye = {
|
|
437
459
|
install(e) {
|
|
438
|
-
e.component("DataTable",
|
|
460
|
+
e.component("DataTable", ve);
|
|
439
461
|
}
|
|
440
462
|
};
|
|
441
463
|
export {
|
|
442
|
-
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
464
|
+
K as DATA_TABLE_CONFIG_KEY,
|
|
465
|
+
ve as DataTable,
|
|
466
|
+
be as createDataTableConfig,
|
|
467
|
+
ye as default
|
|
446
468
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(
|
|
1
|
+
(function(u,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(u=typeof globalThis<"u"?globalThis:u||self,e(u.VuetifyDatatable={},u.Vue))})(this,(function(u,e){"use strict";function O(t){return t&&t.__esModule&&Object.prototype.hasOwnProperty.call(t,"default")?t.default:t}var V={exports:{}},E;function j(){if(E)return V.exports;E=1;function t(C,a=100,d={}){if(typeof C!="function")throw new TypeError(`Expected the first parameter to be a function, got \`${typeof C}\`.`);if(a<0)throw new RangeError("`wait` must not be negative.");const{immediate:r}=typeof d=="boolean"?{immediate:d}:d;let f,x,i,w,g;function h(){const c=f,B=x;return f=void 0,x=void 0,g=C.apply(c,B),g}function y(){const c=Date.now()-w;c<a&&c>=0?i=setTimeout(y,a-c):(i=void 0,r||(g=h()))}const s=function(...c){if(f&&this!==f&&Object.getPrototypeOf(this)===Object.getPrototypeOf(f))throw new Error("Debounced method called with different contexts of the same prototype.");f=this,x=c,w=Date.now();const B=r&&!i;return i||(i=setTimeout(y,a)),B&&(g=h()),g};return Object.defineProperty(s,"isPending",{get(){return i!==void 0}}),s.clear=()=>{i&&(clearTimeout(i),i=void 0)},s.flush=()=>{i&&s.trigger()},s.trigger=()=>{g=h(),s.clear()},s}return V.exports.debounce=t,V.exports=t,V.exports}var A=j();const z=O(A),L=e.defineComponent({__name:"ConfirmationModal",props:{show:Boolean,title:String,description:String,confirmButtonText:String,cancelButtonText:String},emits:["close","confirm"],setup(t){const C=t,a=e.computed({get:()=>C.show,set:()=>{}});return(d,r)=>{const f=e.resolveComponent("v-card-title"),x=e.resolveComponent("v-card-text"),i=e.resolveComponent("v-spacer"),w=e.resolveComponent("v-btn"),g=e.resolveComponent("v-card-actions"),h=e.resolveComponent("v-card"),y=e.resolveComponent("v-dialog");return e.openBlock(),e.createBlock(y,{modelValue:a.value,"onUpdate:modelValue":r[2]||(r[2]=s=>a.value=s),"max-width":"500px",persistent:"","no-click-animation":""},{default:e.withCtx(()=>[e.createVNode(h,null,{default:e.withCtx(()=>[e.createVNode(f,{class:"text-h5 text-center py-6"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.title),1)]),_:1}),t.description?(e.openBlock(),e.createBlock(x,{key:0,class:"text-center px-0 py-0"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.description)+" ",1),e.renderSlot(d.$slots,"description")]),_:3})):e.createCommentVNode("",!0),e.createVNode(g,null,{default:e.withCtx(()=>[e.createVNode(i),e.createVNode(w,{color:"error",variant:"flat",dark:"",onClick:r[0]||(r[0]=s=>d.$emit("close"))},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.cancelButtonText),1)]),_:1}),e.createVNode(w,{color:"success",variant:"flat",dark:"",onClick:r[1]||(r[1]=s=>d.$emit("confirm"))},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.confirmButtonText),1)]),_:1}),e.createVNode(i)]),_:1})]),_:3})]),_:3},8,["modelValue"])}}}),P=Symbol("DataTableConfig");function F(t){return{install(C){C.provide(P,t)}}}const M=e.defineComponent({__name:"DataTable",props:{tableClass:{},headers:{default:()=>[]},items:{default:()=>[]},loading:{type:Boolean,default:!1},itemValue:{default:"id"},totalItems:{default:0},itemsPerPage:{default:10},search:{},showExpand:{type:Boolean,default:!1},showSelect:{type:Boolean,default:!1},selectStrategy:{default:"page"},modelValue:{default:()=>[]},showEditButton:{type:Boolean,default:!0},showDeleteButton:{type:Boolean,default:!0},showViewButton:{type:Boolean,default:!1},viewButtonText:{},deleteButtonText:{},deleteModalTitle:{},deleteModalMessage:{},deleteModalConfirmButtonText:{},deleteModalCancelButtonText:{},editButtonText:{},viewIcon:{},editIcon:{},deleteIcon:{},disableView:{},disableEdit:{},disableDelete:{}},emits:["onLoadData","editItem","deleteItem","viewItem","update:modelValue"],setup(t,{emit:C}){const a=t,d=C,r=e.inject(P,{icons:{}}),f=e.computed(()=>{var o;return a.viewIcon??((o=r.icons)==null?void 0:o.view)??"mdi-eye-outline"}),x=e.computed(()=>{var o;return a.editIcon??((o=r.icons)==null?void 0:o.edit)??"mdi-pencil-outline"}),i=e.computed(()=>{var o;return a.deleteIcon??((o=r.icons)==null?void 0:o.delete)??"mdi-trash-can-outline"}),w=e.computed(()=>r.iconProps??{}),g=e.computed(()=>a.tableClass??r.tableClass??"border rounded-md");function h(o){return typeof o!="string"}const y=e.computed({get:()=>a.modelValue,set:o=>d("update:modelValue",o)});function s(){d("update:modelValue",[])}const c=e.ref(a.itemsPerPage),B=e.ref([]),D=e.ref(1),N=e.ref(null),S=e.ref(!1),U=e.computed(()=>{var o;return((o=a.headers)==null?void 0:o.filter(l=>l.key!=="actions"&&l.key!=="expanded-row"&&l.key!=="data-table-expand"))||[]});e.onMounted(()=>{T({page:D.value,itemsPerPage:c.value})});const R=o=>{N.value=o,S.value=!0},G=()=>{N.value=null,S.value=!1},K=o=>{d("editItem",o)},Y=o=>{d("viewItem",o)},H=()=>{d("deleteItem",N.value),S.value=!1},T=({page:o,itemsPerPage:l})=>{const k=B.value.map(b=>({column:b.key,direction:b.order}));d("onLoadData",{page:o,itemsPerPage:l,search:a.search,sortBy:k})};function J(){T({page:1,itemsPerPage:c.value})}const Q=z(J,400);return e.watch(()=>a.search,(o,l)=>{o!==l&&Q()}),e.watch(c,(o,l)=>{o!==l&&T({page:1,itemsPerPage:o})}),e.watch(B,()=>{T({page:1,itemsPerPage:c.value})}),e.watch(D,o=>{T({page:o,itemsPerPage:c.value})}),(o,l)=>{const k=e.resolveComponent("v-icon"),b=e.resolveComponent("v-btn"),I=e.resolveComponent("v-tooltip"),W=e.resolveComponent("v-data-table-server");return e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createVNode(W,{headers:t.headers,items:t.items,loading:t.loading,"items-length":t.totalItems,"items-per-page":c.value,"onUpdate:itemsPerPage":l[0]||(l[0]=n=>c.value=n),search:t.search,"sort-by":B.value,"onUpdate:sortBy":l[1]||(l[1]=n=>B.value=n),page:D.value,"onUpdate:page":l[2]||(l[2]=n=>D.value=n),"item-value":t.itemValue,"show-expand":t.showExpand,"show-select":t.showSelect,"select-strategy":t.selectStrategy,modelValue:y.value,"onUpdate:modelValue":l[3]||(l[3]=n=>y.value=n),class:e.normalizeClass(g.value)},e.createSlots({"item.data-table-expand":e.withCtx(({internalItem:n,isExpanded:m,toggleExpand:p})=>[e.renderSlot(o.$slots,"item.data-table-expand",{internalItem:n,isExpanded:m,toggleExpand:p},()=>[e.createVNode(b,{onClick:$=>p(n),rounded:""},{default:e.withCtx(()=>[e.createVNode(k,null,{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(m(n)?"mdi-chevron-up":"mdi-chevron-down"),1)]),_:2},1024)]),_:2},1032,["onClick"])])]),"expanded-row":e.withCtx(({columns:n,item:m})=>[e.renderSlot(o.$slots,"expanded-row",{columns:n,item:m})]),"item.actions":e.withCtx(({item:n})=>[e.renderSlot(o.$slots,"before-actions",{item:n}),t.showViewButton?(e.openBlock(),e.createBlock(I,{key:0,text:t.viewButtonText},{activator:e.withCtx(({props:m})=>{var p;return[e.createVNode(b,e.mergeProps({icon:"",flat:"",onClick:$=>Y(n)},m,{disabled:(p=t.disableView)==null?void 0:p.call(t,n)}),{default:e.withCtx(()=>[e.renderSlot(o.$slots,"view-icon",{},()=>[h(f.value)?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(f.value),e.mergeProps({key:0,size:20,class:"text-info"},w.value),null,16)):(e.openBlock(),e.createBlock(k,{key:1,size:"20",class:"text-info"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(f.value),1)]),_:1}))])]),_:3},16,["onClick","disabled"])]}),_:2},1032,["text"])):e.createCommentVNode("",!0),t.showEditButton?(e.openBlock(),e.createBlock(I,{key:1,text:t.editButtonText},{activator:e.withCtx(({props:m})=>{var p;return[e.createVNode(b,e.mergeProps({icon:"",flat:"",onClick:$=>K(n)},m,{disabled:(p=t.disableEdit)==null?void 0:p.call(t,n)}),{default:e.withCtx(()=>[e.renderSlot(o.$slots,"edit-icon",{},()=>[h(x.value)?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(x.value),e.mergeProps({key:0,size:20,class:"text-primary"},w.value),null,16)):(e.openBlock(),e.createBlock(k,{key:1,size:"20",class:"text-primary"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(x.value),1)]),_:1}))])]),_:3},16,["onClick","disabled"])]}),_:2},1032,["text"])):e.createCommentVNode("",!0),t.showDeleteButton?(e.openBlock(),e.createBlock(I,{key:2,text:t.deleteButtonText},{activator:e.withCtx(({props:m})=>{var p;return[e.createVNode(b,e.mergeProps({icon:"",flat:"",onClick:$=>R(n)},m,{disabled:(p=t.disableDelete)==null?void 0:p.call(t,n)}),{default:e.withCtx(()=>[e.renderSlot(o.$slots,"delete-icon",{},()=>[h(i.value)?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(i.value),e.mergeProps({key:0,size:20,class:"text-error"},w.value),null,16)):(e.openBlock(),e.createBlock(k,{key:1,size:"20",class:"text-error"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(i.value),1)]),_:1}))])]),_:3},16,["onClick","disabled"])]}),_:2},1032,["text"])):e.createCommentVNode("",!0),e.renderSlot(o.$slots,"after-actions",{item:n})]),tfoot:e.withCtx(()=>[e.createElementVNode("tfoot",null,[e.renderSlot(o.$slots,"item.tfoot")])]),_:2},[t.showSelect?{name:"top",fn:e.withCtx(()=>[e.renderSlot(o.$slots,"selection-actions",{selected:y.value,count:y.value.length,clear:s})]),key:"0"}:void 0,e.renderList(U.value,n=>({name:`item.${n.key}`,fn:e.withCtx(({item:m})=>[e.renderSlot(o.$slots,`item.${n.key}`,{item:m},()=>[e.createTextVNode(e.toDisplayString(m[n.key]),1)])])}))]),1032,["headers","items","loading","items-length","items-per-page","search","sort-by","page","item-value","show-expand","show-select","select-strategy","modelValue","class"]),e.createVNode(L,{show:S.value,title:t.deleteModalTitle,description:t.deleteModalMessage,confirmButtonText:t.deleteModalConfirmButtonText,cancelButtonText:t.deleteModalCancelButtonText,onClose:G,onConfirm:H},null,8,["show","title","description","confirmButtonText","cancelButtonText"])],64)}}}),q={install(t){t.component("DataTable",M)}};u.DATA_TABLE_CONFIG_KEY=P,u.DataTable=M,u.createDataTableConfig=F,u.default=q,Object.defineProperties(u,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})}));
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@dazzadev/vuetify-datatable",
|
|
3
|
-
"version": "1.0
|
|
4
|
-
"description": "Reusable server-side DataTable component for Vuetify 3",
|
|
3
|
+
"version": "1.1.0",
|
|
4
|
+
"description": "Reusable server-side DataTable component for Vuetify 3 and 4",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/vuetify-datatable.umd.cjs",
|
|
7
7
|
"module": "./dist/vuetify-datatable.js",
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
},
|
|
23
23
|
"peerDependencies": {
|
|
24
24
|
"vue": "^3.3.0",
|
|
25
|
-
"vuetify": "^3.0.0"
|
|
25
|
+
"vuetify": "^3.0.0 || ^4.0.0"
|
|
26
26
|
},
|
|
27
27
|
"dependencies": {
|
|
28
28
|
"debounce": "^2.0.0"
|
|
@@ -35,7 +35,7 @@
|
|
|
35
35
|
"vite-plugin-dts": "^4.0.0",
|
|
36
36
|
"vue": "^3.5.0",
|
|
37
37
|
"vue-tsc": "^2.0.0",
|
|
38
|
-
"vuetify": "^
|
|
38
|
+
"vuetify": "^4.0.0"
|
|
39
39
|
},
|
|
40
40
|
"license": "MIT"
|
|
41
41
|
}
|