admins-components 9.0.12 → 9.0.14
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/admins-components100.js.map +1 -0
- package/dist/admins-components101.js.map +1 -0
- package/dist/admins-components102.js.map +1 -0
- package/dist/admins-components103.js.map +1 -0
- package/dist/admins-components104.js.map +1 -0
- package/dist/admins-components105.js.map +1 -0
- package/dist/admins-components106.js.map +1 -0
- package/dist/admins-components107.js.map +1 -0
- package/dist/admins-components108.js.map +1 -0
- package/dist/admins-components109.js.map +1 -0
- package/dist/admins-components11.js.map +1 -0
- package/dist/admins-components110.js.map +1 -0
- package/dist/admins-components111.js.map +1 -0
- package/dist/admins-components112.js.map +1 -0
- package/dist/admins-components113.js.map +1 -0
- package/dist/admins-components114.js.map +1 -0
- package/dist/admins-components115.js.map +1 -0
- package/dist/admins-components116.js.map +1 -0
- package/dist/admins-components117.js.map +1 -0
- package/dist/admins-components118.js.map +1 -0
- package/dist/admins-components119.js.map +1 -0
- package/dist/admins-components12.js.map +1 -0
- package/dist/admins-components120.js.map +1 -0
- package/dist/admins-components121.js.map +1 -0
- package/dist/admins-components122.js.map +1 -0
- package/dist/admins-components123.js.map +1 -0
- package/dist/admins-components124.js.map +1 -0
- package/dist/admins-components125.js.map +1 -0
- package/dist/admins-components126.js.map +1 -0
- package/dist/admins-components127.js.map +1 -0
- package/dist/admins-components128.js.map +1 -0
- package/dist/admins-components129.js.map +1 -0
- package/dist/admins-components13.js +65 -65
- package/dist/admins-components13.js.map +1 -0
- package/dist/admins-components130.js.map +1 -0
- package/dist/admins-components131.js.map +1 -0
- package/dist/admins-components132.js.map +1 -0
- package/dist/admins-components133.js.map +1 -0
- package/dist/admins-components134.js.map +1 -0
- package/dist/admins-components135.js.map +1 -0
- package/dist/admins-components136.js.map +1 -0
- package/dist/admins-components137.js.map +1 -0
- package/dist/admins-components138.js.map +1 -0
- package/dist/admins-components139.js.map +1 -0
- package/dist/admins-components14.js.map +1 -0
- package/dist/admins-components140.js.map +1 -0
- package/dist/admins-components141.js.map +1 -0
- package/dist/admins-components142.js.map +1 -0
- package/dist/admins-components143.js.map +1 -0
- package/dist/admins-components144.js.map +1 -0
- package/dist/admins-components145.js.map +1 -0
- package/dist/admins-components146.js.map +1 -0
- package/dist/admins-components147.js.map +1 -0
- package/dist/admins-components148.js.map +1 -0
- package/dist/admins-components149.js.map +1 -0
- package/dist/admins-components15.js +1 -1
- package/dist/admins-components15.js.map +1 -0
- package/dist/admins-components150.js.map +1 -0
- package/dist/admins-components151.js.map +1 -0
- package/dist/admins-components153.js.map +1 -0
- package/dist/admins-components154.js.map +1 -0
- package/dist/admins-components155.js.map +1 -0
- package/dist/admins-components157.js.map +1 -0
- package/dist/admins-components158.js.map +1 -0
- package/dist/admins-components159.js.map +1 -0
- package/dist/admins-components16.js.map +1 -0
- package/dist/admins-components160.js.map +1 -0
- package/dist/admins-components161.js.map +1 -0
- package/dist/admins-components162.js.map +1 -0
- package/dist/admins-components163.js.map +1 -0
- package/dist/admins-components164.js.map +1 -0
- package/dist/admins-components165.js.map +1 -0
- package/dist/admins-components166.js.map +1 -0
- package/dist/admins-components167.js.map +1 -0
- package/dist/admins-components169.js.map +1 -0
- package/dist/admins-components17.js.map +1 -0
- package/dist/admins-components18.js +57 -57
- package/dist/admins-components18.js.map +1 -0
- package/dist/admins-components19.js.map +1 -0
- package/dist/admins-components20.js +52 -52
- package/dist/admins-components20.js.map +1 -0
- package/dist/admins-components22.js.map +1 -0
- package/dist/admins-components23.js +19 -19
- package/dist/admins-components23.js.map +1 -0
- package/dist/admins-components24.js.map +1 -0
- package/dist/admins-components25.js.map +1 -0
- package/dist/admins-components27.js.map +1 -0
- package/dist/admins-components28.js +39 -22
- package/dist/admins-components28.js.map +1 -0
- package/dist/admins-components3.js.map +1 -0
- package/dist/admins-components30.js.map +1 -0
- package/dist/admins-components31.js +20 -20
- package/dist/admins-components31.js.map +1 -0
- package/dist/admins-components33.js.map +1 -0
- package/dist/admins-components34.js.map +1 -0
- package/dist/admins-components35.js.map +1 -0
- package/dist/admins-components36.js.map +1 -0
- package/dist/admins-components38.js.map +1 -0
- package/dist/admins-components39.js +48 -48
- package/dist/admins-components39.js.map +1 -0
- package/dist/admins-components4.js.map +1 -0
- package/dist/admins-components41.js.map +1 -0
- package/dist/admins-components42.js +41 -41
- package/dist/admins-components42.js.map +1 -0
- package/dist/admins-components43.js.map +1 -0
- package/dist/admins-components44.js +60 -60
- package/dist/admins-components44.js.map +1 -0
- package/dist/admins-components45.js.map +1 -0
- package/dist/admins-components46.js.map +1 -0
- package/dist/admins-components48.js.map +1 -0
- package/dist/admins-components49.js.map +1 -0
- package/dist/admins-components5.js +1 -1
- package/dist/admins-components5.js.map +1 -0
- package/dist/admins-components50.js.map +1 -0
- package/dist/admins-components52.js.map +1 -0
- package/dist/admins-components53.js.map +1 -0
- package/dist/admins-components54.js.map +1 -0
- package/dist/admins-components55.js.map +1 -0
- package/dist/admins-components56.js.map +1 -0
- package/dist/admins-components57.js.map +1 -0
- package/dist/admins-components58.js.map +1 -0
- package/dist/admins-components59.js +80 -75
- package/dist/admins-components59.js.map +1 -0
- package/dist/admins-components6.js.map +1 -0
- package/dist/admins-components61.js.map +1 -0
- package/dist/admins-components62.js +90 -85
- package/dist/admins-components62.js.map +1 -0
- package/dist/admins-components64.js.map +1 -0
- package/dist/admins-components65.js.map +1 -0
- package/dist/admins-components66.js.map +1 -0
- package/dist/admins-components68.js.map +1 -0
- package/dist/admins-components69.js +41 -41
- package/dist/admins-components69.js.map +1 -0
- package/dist/admins-components7.js.map +1 -0
- package/dist/admins-components71.js.map +1 -0
- package/dist/admins-components72.js.map +1 -0
- package/dist/admins-components73.js.map +1 -0
- package/dist/admins-components75.js.map +1 -0
- package/dist/admins-components76.js.map +1 -0
- package/dist/admins-components77.js.map +1 -0
- package/dist/admins-components78.js.map +1 -0
- package/dist/admins-components8.js +93 -93
- package/dist/admins-components8.js.map +1 -0
- package/dist/admins-components80.js.map +1 -0
- package/dist/admins-components81.js +1 -1
- package/dist/admins-components81.js.map +1 -0
- package/dist/admins-components83.js.map +1 -0
- package/dist/admins-components84.js.map +1 -0
- package/dist/admins-components86.js.map +1 -0
- package/dist/admins-components87.js +70 -70
- package/dist/admins-components87.js.map +1 -0
- package/dist/admins-components89.js.map +1 -0
- package/dist/admins-components90.js.map +1 -0
- package/dist/admins-components91.js.map +1 -0
- package/dist/admins-components92.js.map +1 -0
- package/dist/admins-components93.js +1 -1
- package/dist/admins-components93.js.map +1 -0
- package/dist/admins-components94.js.map +1 -0
- package/dist/admins-components95.js.map +1 -0
- package/dist/admins-components96.js.map +1 -0
- package/dist/admins-components97.js.map +1 -0
- package/dist/admins-components98.js.map +1 -0
- package/dist/admins-components99.js.map +1 -0
- package/dist/base.css +1 -1
- package/dist/base.css.map +1 -1
- package/dist/src/components/HeaderComponent.vue.d.ts +13 -2
- package/dist/src/styles/components/calendar.scss_vue_type_style_index_0_src_true_lang.css +1 -1
- package/dist/src/styles/components/copy-to-clipboard.scss_vue_type_style_index_0_src_true_lang.css +1 -1
- package/dist/src/styles/components/data-table/data-cards.scss_vue_type_style_index_0_src_true_lang.css +1 -1
- package/dist/src/styles/components/data-table/data-filters.scss_vue_type_style_index_0_src_true_lang.css +1 -1
- package/dist/src/styles/components/data-table/data-list-guide.scss_vue_type_style_index_0_src_true_lang.css +1 -1
- package/dist/src/styles/components/data-table/data-list-options.scss_vue_type_style_index_0_src_true_lang.css +1 -1
- package/dist/src/styles/components/data-table/data-list.scss_vue_type_style_index_0_src_true_lang.css +1 -1
- package/dist/src/styles/components/data-table/filters-history.scss_vue_type_style_index_0_src_true_lang.css +1 -1
- package/dist/src/styles/components/datepickers.scss_vue_type_style_index_1_src_true_lang.css +1 -1
- package/dist/src/styles/components/dropdown-select.scss_vue_type_style_index_0_src_true_lang.css +1 -1
- package/dist/src/styles/components/header.scss_vue_type_style_index_0_src_true_lang.css +1 -1
- package/dist/src/styles/components/image-picker.scss_vue_type_style_index_0_src_true_lang.css +1 -1
- package/dist/src/styles/components/modal.scss_vue_type_style_index_0_src_true_lang.css +1 -1
- package/dist/src/styles/components/sidebar.scss_vue_type_style_index_0_src_true_lang.css +1 -1
- package/package.json +2 -2
|
@@ -1,115 +1,120 @@
|
|
|
1
1
|
import e from "./admins-components6.js";
|
|
2
|
-
import t from "./admins-
|
|
3
|
-
import n from "./admins-
|
|
4
|
-
import
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import s from "./admins-
|
|
8
|
-
import
|
|
2
|
+
import t from "./admins-components16.js";
|
|
3
|
+
import n from "./admins-components24.js";
|
|
4
|
+
import r from "./admins-components48.js";
|
|
5
|
+
import { useSelection as i } from "./admins-components53.js";
|
|
6
|
+
import { dataTableSettingsDefaults as a } from "./admins-components54.js";
|
|
7
|
+
import { buildActionGroupMenuItems as o, isActionGroup as s } from "./admins-components55.js";
|
|
8
|
+
import c from "./admins-components58.js";
|
|
9
|
+
import { Fragment as l, computed as u, createBlock as d, createCommentVNode as f, createElementBlock as p, createElementVNode as m, createTextVNode as h, createVNode as g, defineComponent as _, mergeProps as v, normalizeClass as y, normalizeStyle as b, openBlock as x, ref as S, renderList as C, toDisplayString as w, unref as T, withModifiers as E } from "vue";
|
|
9
10
|
//#region src/components/data-table/DataTable.vue?vue&type=script&setup=true&lang.ts
|
|
10
|
-
var
|
|
11
|
+
var D = { class: "ac-component" }, O = { class: "c-table-wrapper" }, k = { key: 0 }, A = ["onClick"], j = {
|
|
11
12
|
key: 1,
|
|
12
13
|
class: "c-actions-header"
|
|
13
|
-
},
|
|
14
|
+
}, M = { key: 0 }, N = ["onClick"], P = {
|
|
14
15
|
key: 1,
|
|
15
16
|
class: "c-actions-cell"
|
|
16
|
-
},
|
|
17
|
+
}, F = { class: "c-actions-wrap" }, I = { key: 1 }, L = { class: "c-table__loading-row" }, R = ["colspan"], z = { class: "c-table__loading-wrap" }, B = {
|
|
17
18
|
key: 0,
|
|
18
19
|
class: "c-table__backdrop",
|
|
19
20
|
"aria-hidden": "true"
|
|
20
|
-
},
|
|
21
|
+
}, V = /* @__PURE__ */ _({
|
|
21
22
|
__name: "DataTable",
|
|
22
23
|
props: {
|
|
23
24
|
config: {},
|
|
24
25
|
items: {},
|
|
25
|
-
settings: { default: () => ({ ...
|
|
26
|
+
settings: { default: () => ({ ...a }) },
|
|
26
27
|
loading: {
|
|
27
28
|
type: Boolean,
|
|
28
29
|
default: !1
|
|
29
30
|
}
|
|
30
31
|
},
|
|
31
32
|
emits: ["selection-change", "sort-change"],
|
|
32
|
-
setup(
|
|
33
|
-
let
|
|
34
|
-
function
|
|
35
|
-
let t =
|
|
36
|
-
|
|
33
|
+
setup(a, { emit: _ }) {
|
|
34
|
+
let V = a, H = _, U = S(null), { selectedKeys: W, allSelected: G, toggle: K, toggleAll: q } = i(() => V.items, () => V.config.selectableAttr, (e) => H("selection-change", e)), J = u(() => V.config.columns.filter((e) => e.visible !== !1));
|
|
35
|
+
function Y(e) {
|
|
36
|
+
let t = U.value?.key === e && U.value.direction === "asc" ? "desc" : "asc";
|
|
37
|
+
U.value = {
|
|
37
38
|
key: e,
|
|
38
39
|
direction: t
|
|
39
|
-
},
|
|
40
|
+
}, H("sort-change", {
|
|
40
41
|
key: e,
|
|
41
42
|
direction: t
|
|
42
43
|
});
|
|
43
44
|
}
|
|
44
|
-
return (
|
|
45
|
-
class:
|
|
46
|
-
"is-compact":
|
|
47
|
-
"is-loading":
|
|
45
|
+
return (i, u) => (x(), p("div", D, [m("div", O, [m("table", {
|
|
46
|
+
class: y(["c-table", {
|
|
47
|
+
"is-compact": a.settings.compact,
|
|
48
|
+
"is-loading": a.loading
|
|
48
49
|
}]),
|
|
49
|
-
style:
|
|
50
|
-
}, [
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
}, null,
|
|
55
|
-
(
|
|
50
|
+
style: b({ "--action-count": a.config.actions?.length ?? 0 })
|
|
51
|
+
}, [m("thead", null, [m("tr", null, [
|
|
52
|
+
a.config.selectableAttr ? (x(), p("th", k, [g(t, {
|
|
53
|
+
"model-value": T(G),
|
|
54
|
+
"onUpdate:modelValue": T(q)
|
|
55
|
+
}, null, 8, ["model-value", "onUpdate:modelValue"])])) : f("", !0),
|
|
56
|
+
(x(!0), p(l, null, C(J.value, (e) => (x(), p("th", {
|
|
56
57
|
key: e.property,
|
|
57
|
-
class:
|
|
58
|
+
class: y({
|
|
58
59
|
"c-sortable": e.sort,
|
|
59
|
-
"c-sortable--sorted":
|
|
60
|
+
"c-sortable--sorted": U.value?.key === e.property
|
|
60
61
|
}),
|
|
61
|
-
onClick: (t) => e.sort ?
|
|
62
|
-
}, [
|
|
62
|
+
onClick: (t) => e.sort ? Y(e.property) : void 0
|
|
63
|
+
}, [h(w(e.label) + " ", 1), e.sort ? (x(), p("span", {
|
|
63
64
|
key: 0,
|
|
64
|
-
class:
|
|
65
|
-
"fa-sort":
|
|
66
|
-
"fa-sort-down":
|
|
67
|
-
"fa-sort-up":
|
|
68
|
-
"c-sort-icon--active":
|
|
69
|
-
"is-asc":
|
|
70
|
-
"is-desc":
|
|
65
|
+
class: y(["c-sort-icon fa-solid", {
|
|
66
|
+
"fa-sort": U.value?.key !== e.property,
|
|
67
|
+
"fa-sort-down": U.value?.key === e.property && U.value.direction === "desc",
|
|
68
|
+
"fa-sort-up": U.value?.key === e.property && U.value.direction === "asc",
|
|
69
|
+
"c-sort-icon--active": U.value?.key === e.property,
|
|
70
|
+
"is-asc": U.value?.key === e.property && U.value.direction === "asc",
|
|
71
|
+
"is-desc": U.value?.key === e.property && U.value.direction === "desc"
|
|
71
72
|
}])
|
|
72
|
-
}, null, 2)) :
|
|
73
|
-
|
|
74
|
-
])]), !
|
|
75
|
-
key:
|
|
76
|
-
class:
|
|
77
|
-
"is-selected":
|
|
78
|
-
"is-striped":
|
|
73
|
+
}, null, 2)) : f("", !0)], 10, A))), 128)),
|
|
74
|
+
a.config.actions ? (x(), p("th", j, w(a.config.actionHeader ?? ""), 1)) : f("", !0)
|
|
75
|
+
])]), !a.loading || a.items.length > 0 ? (x(), p("tbody", M, [(x(!0), p(l, null, C(a.items, (r, i) => (x(), p("tr", {
|
|
76
|
+
key: i,
|
|
77
|
+
class: y({
|
|
78
|
+
"is-selected": a.config.selectableAttr && T(W).has(r[a.config.selectableAttr]),
|
|
79
|
+
"is-striped": a.settings.striped && i % 2 == 1
|
|
79
80
|
})
|
|
80
81
|
}, [
|
|
81
|
-
|
|
82
|
+
a.config.selectableAttr ? (x(), p("td", {
|
|
82
83
|
key: 0,
|
|
83
84
|
class: "pointer",
|
|
84
|
-
onClick:
|
|
85
|
-
}, [
|
|
86
|
-
|
|
85
|
+
onClick: E((e) => T(K)(r), ["stop"])
|
|
86
|
+
}, [g(t, {
|
|
87
|
+
"model-value": !!T(W).has(r[a.config.selectableAttr]),
|
|
88
|
+
"onUpdate:modelValue": (e) => T(K)(r),
|
|
89
|
+
onClick: u[0] ||= E(() => {}, ["stop"])
|
|
90
|
+
}, null, 8, ["model-value", "onUpdate:modelValue"])], 8, N)) : f("", !0),
|
|
91
|
+
(x(!0), p(l, null, C(J.value, (e) => (x(), p("td", {
|
|
87
92
|
key: e.property,
|
|
88
|
-
class:
|
|
89
|
-
}, [
|
|
90
|
-
item:
|
|
93
|
+
class: y(["c-table__cell", [e.class]])
|
|
94
|
+
}, [g(c, {
|
|
95
|
+
item: r,
|
|
91
96
|
col: e
|
|
92
97
|
}, null, 8, ["item", "col"])], 2))), 128)),
|
|
93
|
-
|
|
98
|
+
a.config.actions ? (x(), p("td", P, [m("div", F, [(x(!0), p(l, null, C(a.config.actions, (t, i) => (x(), p(l, { key: i }, [T(s)(t) ? (x(), d(n, v({
|
|
94
99
|
key: 0,
|
|
95
|
-
icon:
|
|
96
|
-
label:
|
|
97
|
-
items:
|
|
98
|
-
}, { ref_for: !0 },
|
|
100
|
+
icon: t.icon,
|
|
101
|
+
label: t.label,
|
|
102
|
+
items: T(o)(t, r)
|
|
103
|
+
}, { ref_for: !0 }, t.config), null, 16, [
|
|
99
104
|
"icon",
|
|
100
105
|
"label",
|
|
101
106
|
"items"
|
|
102
|
-
])) : (
|
|
107
|
+
])) : (x(), d(e, v({
|
|
103
108
|
key: 1,
|
|
104
|
-
icon:
|
|
105
|
-
label:
|
|
106
|
-
type:
|
|
107
|
-
disabled:
|
|
108
|
-
size:
|
|
109
|
-
ariaLabel:
|
|
109
|
+
icon: t.icon,
|
|
110
|
+
label: t.label,
|
|
111
|
+
type: t.type,
|
|
112
|
+
disabled: t.disabled ? t.disabled(r) : !1,
|
|
113
|
+
size: t.label ? "small" : "normal",
|
|
114
|
+
ariaLabel: t.ariaLabel,
|
|
110
115
|
outline: "",
|
|
111
|
-
callback: () =>
|
|
112
|
-
}, { ref_for: !0 },
|
|
116
|
+
callback: () => t.callback(r)
|
|
117
|
+
}, { ref_for: !0 }, t.config), null, 16, [
|
|
113
118
|
"icon",
|
|
114
119
|
"label",
|
|
115
120
|
"type",
|
|
@@ -117,18 +122,18 @@ var E = { class: "c-table-wrapper ac-component" }, D = { key: 0 }, O = ["onClick
|
|
|
117
122
|
"size",
|
|
118
123
|
"ariaLabel",
|
|
119
124
|
"callback"
|
|
120
|
-
]))], 64))), 128))])])) :
|
|
121
|
-
], 2))), 128))])) : (
|
|
122
|
-
colspan:
|
|
125
|
+
]))], 64))), 128))])])) : f("", !0)
|
|
126
|
+
], 2))), 128))])) : (x(), p("tbody", I, [m("tr", L, [m("td", {
|
|
127
|
+
colspan: J.value.length + +!!a.config.selectableAttr + +!!a.config.actions,
|
|
123
128
|
class: "c-table__loading-cell"
|
|
124
|
-
}, [
|
|
129
|
+
}, [m("div", z, [g(r, {
|
|
125
130
|
loading: !0,
|
|
126
131
|
size: "2.5rem"
|
|
127
|
-
})])], 8,
|
|
132
|
+
})])], 8, R)])]))], 6), a.loading && a.items.length > 0 ? (x(), p("div", B, [g(r, {
|
|
128
133
|
loading: !0,
|
|
129
134
|
size: "2.5rem"
|
|
130
|
-
})])) :
|
|
135
|
+
})])) : f("", !0)])]));
|
|
131
136
|
}
|
|
132
137
|
});
|
|
133
138
|
//#endregion
|
|
134
|
-
export {
|
|
139
|
+
export { V as default };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"admins-components59.js","names":[],"sources":["../src/components/data-table/DataTable.vue"],"sourcesContent":["<script lang=\"ts\">\nexport type {\n LayoutMode,\n DataListConfig,\n DataListSettings,\n DataTableSettings,\n DataCardsSettings,\n Column,\n Sort,\n Action,\n ActionGroup,\n FilterConfig,\n FilterValue,\n} from '@/types/data-list'\n\nexport {\n dataTableSettingsDefaults,\n dataCardsSettingsDefaults,\n dataListSettingsDefaults,\n} from '@/types/data-list'\n</script>\n\n<script setup lang=\"ts\">\nimport { computed, ref } from 'vue'\nimport Button from '@/components/Button.vue'\nimport Checkbox from '@/components/Checkbox.vue'\nimport { useSelection } from '@/composables/useSelection'\nimport { dataTableSettingsDefaults } from '@/types/data-list'\nimport type { DataListConfig, DataTableSettings } from '@/types/data-list'\nimport Loader from '@/components/Loader.vue'\nimport DataCell from './DataCell.vue'\nimport DropdownMenu from '../DropdownMenu.vue'\nimport { buildActionGroupMenuItems, isActionGroup } from '@/utils/dataList'\n\ntype SortDirection = 'asc' | 'desc'\n\nconst props = withDefaults(\n defineProps<{\n config: DataListConfig\n items: Record<string, unknown>[]\n settings?: DataTableSettings\n loading?: boolean\n }>(),\n {\n settings: () => ({ ...dataTableSettingsDefaults }),\n loading: false,\n },\n)\n\nconst emit = defineEmits<{\n 'selection-change': [selected: unknown[]]\n 'sort-change': [sort: { key: string; direction: SortDirection }]\n}>()\n\n//const CHARACTER_BREAKPOINT = 20\n\nconst activeSort = ref<{\n key: string\n direction: SortDirection\n} | null>(null)\n\nconst {\n selectedKeys,\n allSelected,\n toggle: toggleRow,\n toggleAll,\n} = useSelection(\n () => props.items,\n () => props.config.selectableAttr,\n (s) => emit('selection-change', s),\n)\n\nconst visibleColumns = computed(() => props.config.columns.filter((c) => c.visible !== false))\n\nfunction handleSort(key: string) {\n const direction: SortDirection =\n activeSort.value?.key === key && activeSort.value.direction === 'asc' ? 'desc' : 'asc'\n\n activeSort.value = { key, direction }\n\n emit('sort-change', { key, direction })\n}\n</script>\n\n<template>\n <div class=\"ac-component\">\n <div class=\"c-table-wrapper\">\n <table\n class=\"c-table\"\n :class=\"{ 'is-compact': settings.compact, 'is-loading': loading }\"\n :style=\"{ '--action-count': config.actions?.length ?? 0 }\"\n >\n <thead>\n <tr>\n <th v-if=\"config.selectableAttr\">\n <Checkbox :model-value=\"allSelected\" @update:model-value=\"toggleAll\" />\n </th>\n\n <th\n v-for=\"col in visibleColumns\"\n :key=\"col.property\"\n :class=\"{\n 'c-sortable': col.sort,\n 'c-sortable--sorted': activeSort?.key === col.property,\n }\"\n @click=\"col.sort ? handleSort(col.property) : undefined\"\n >\n {{ col.label }}\n\n <span\n v-if=\"col.sort\"\n class=\"c-sort-icon fa-solid\"\n :class=\"{\n 'fa-sort': activeSort?.key !== col.property,\n 'fa-sort-down':\n activeSort?.key === col.property && activeSort.direction === 'desc',\n 'fa-sort-up': activeSort?.key === col.property && activeSort.direction === 'asc',\n 'c-sort-icon--active': activeSort?.key === col.property,\n 'is-asc': activeSort?.key === col.property && activeSort.direction === 'asc',\n 'is-desc': activeSort?.key === col.property && activeSort.direction === 'desc',\n }\"\n ></span>\n </th>\n\n <th v-if=\"config.actions\" class=\"c-actions-header\">\n {{ config.actionHeader ?? '' }}\n </th>\n </tr>\n </thead>\n\n <tbody v-if=\"!loading || items.length > 0\">\n <tr\n v-for=\"(item, index) in items\"\n :key=\"index\"\n :class=\"{\n 'is-selected': config.selectableAttr && selectedKeys.has(item[config.selectableAttr]),\n 'is-striped': settings.striped && index % 2 === 1,\n }\"\n >\n <td v-if=\"config.selectableAttr\" class=\"pointer\" @click.stop=\"toggleRow(item)\">\n <Checkbox\n :model-value=\"!!selectedKeys.has(item[config.selectableAttr])\"\n @update:model-value=\"toggleRow(item)\"\n @click.stop\n />\n </td>\n\n <td\n v-for=\"col in visibleColumns\"\n :key=\"col.property\"\n class=\"c-table__cell\"\n :class=\"[\n col.class,\n /* { 'is-nowrap': String(getColumnValue(item, col) ?? '').length < CHARACTER_BREAKPOINT}, */\n ]\"\n >\n <DataCell :item=\"item\" :col=\"col\" />\n </td>\n\n <td v-if=\"config.actions\" class=\"c-actions-cell\">\n <div class=\"c-actions-wrap\">\n <template v-for=\"(action, ai) in config.actions\" :key=\"ai\">\n <DropdownMenu\n v-if=\"isActionGroup(action)\"\n :icon=\"action.icon\"\n :label=\"action.label\"\n :items=\"buildActionGroupMenuItems(action, item)\"\n v-bind=\"action.config\"\n />\n\n <Button\n v-else\n :icon=\"action.icon\"\n :label=\"action.label\"\n :type=\"action.type\"\n :disabled=\"action.disabled ? action.disabled(item) : false\"\n :size=\"action.label ? 'small' : 'normal'\"\n :ariaLabel=\"action.ariaLabel\"\n outline\n :callback=\"() => action.callback(item)\"\n v-bind=\"action.config\"\n />\n </template>\n </div>\n </td>\n </tr>\n </tbody>\n <tbody v-else>\n <tr class=\"c-table__loading-row\">\n <td\n :colspan=\"\n visibleColumns.length + (config.selectableAttr ? 1 : 0) + (config.actions ? 1 : 0)\n \"\n class=\"c-table__loading-cell\"\n >\n <div class=\"c-table__loading-wrap\">\n <Loader :loading=\"true\" size=\"2.5rem\" />\n </div>\n </td>\n </tr>\n </tbody>\n </table>\n <div v-if=\"loading && items.length > 0\" class=\"c-table__backdrop\" aria-hidden=\"true\">\n <Loader :loading=\"true\" size=\"2.5rem\" />\n </div>\n </div>\n </div>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/data-table/data-table.scss\"></style>\n"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"admins-components6.js","names":[],"sources":["../src/components/Button.vue"],"sourcesContent":["<script lang=\"ts\">\nexport type ButtonType = 'normal' | 'dark' | 'success' | 'error' | 'warning' | 'info'\n\nexport type IconPosition = 'left' | 'right'\n\nexport interface ButtonProps {\n size?: ControlSize\n type?: ButtonType\n outline?: boolean\n icon?: string\n iconPosition?: IconPosition\n label?: string\n ariaLabel?: string\n callback?: () => void\n indicator?: string | number\n labelAlignmentFix?: boolean\n}\n\nexport const buttonDefaults = {\n size: 'normal' as ControlSize,\n type: 'normal' as ButtonType,\n outline: false,\n icon: undefined,\n iconPosition: 'left' as IconPosition,\n labelAlignmentFix: false,\n}\n</script>\n\n<script setup lang=\"ts\">\nimport type { ControlSize } from '@/types/types'\nimport { sizeToClass, typeToClass } from '@/utils/dom'\nimport { computed } from 'vue'\n\nconst props = withDefaults(defineProps<ButtonProps>(), {\n ...buttonDefaults,\n})\n\nconst classes = computed(() => [\n 'c-btn',\n sizeToClass(props.size, 'c-btn'),\n props.outline && 'c-btn-outline',\n typeToClass(props.type, 'c-btn'),\n])\n</script>\n\n<template>\n <button\n type=\"button\"\n :class=\"classes\"\n :aria-label=\"ariaLabel ?? label\"\n :title=\"ariaLabel ?? label\"\n @click=\"callback?.()\"\n >\n <i v-if=\"icon && iconPosition === 'left'\" :class=\"icon\"></i>\n\n <span v-if=\"label\" :class=\"{ 'align-center-fix': labelAlignmentFix }\">\n {{ label }}\n\n <span v-if=\"indicator !== undefined && indicator !== null\" class=\"c-btn-indicator\">\n {{ indicator }}\n </span>\n </span>\n\n <i v-if=\"icon && iconPosition === 'right'\" :class=\"icon\"></i>\n </button>\n</template>\n"],"mappings":""}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"admins-components61.js","names":[],"sources":["../src/components/data-table/DataTable.vue"],"sourcesContent":["<script lang=\"ts\">\nexport type {\n LayoutMode,\n DataListConfig,\n DataListSettings,\n DataTableSettings,\n DataCardsSettings,\n Column,\n Sort,\n Action,\n ActionGroup,\n FilterConfig,\n FilterValue,\n} from '@/types/data-list'\n\nexport {\n dataTableSettingsDefaults,\n dataCardsSettingsDefaults,\n dataListSettingsDefaults,\n} from '@/types/data-list'\n</script>\n\n<script setup lang=\"ts\">\nimport { computed, ref } from 'vue'\nimport Button from '@/components/Button.vue'\nimport Checkbox from '@/components/Checkbox.vue'\nimport { useSelection } from '@/composables/useSelection'\nimport { dataTableSettingsDefaults } from '@/types/data-list'\nimport type { DataListConfig, DataTableSettings } from '@/types/data-list'\nimport Loader from '@/components/Loader.vue'\nimport DataCell from './DataCell.vue'\nimport DropdownMenu from '../DropdownMenu.vue'\nimport { buildActionGroupMenuItems, isActionGroup } from '@/utils/dataList'\n\ntype SortDirection = 'asc' | 'desc'\n\nconst props = withDefaults(\n defineProps<{\n config: DataListConfig\n items: Record<string, unknown>[]\n settings?: DataTableSettings\n loading?: boolean\n }>(),\n {\n settings: () => ({ ...dataTableSettingsDefaults }),\n loading: false,\n },\n)\n\nconst emit = defineEmits<{\n 'selection-change': [selected: unknown[]]\n 'sort-change': [sort: { key: string; direction: SortDirection }]\n}>()\n\n//const CHARACTER_BREAKPOINT = 20\n\nconst activeSort = ref<{\n key: string\n direction: SortDirection\n} | null>(null)\n\nconst {\n selectedKeys,\n allSelected,\n toggle: toggleRow,\n toggleAll,\n} = useSelection(\n () => props.items,\n () => props.config.selectableAttr,\n (s) => emit('selection-change', s),\n)\n\nconst visibleColumns = computed(() => props.config.columns.filter((c) => c.visible !== false))\n\nfunction handleSort(key: string) {\n const direction: SortDirection =\n activeSort.value?.key === key && activeSort.value.direction === 'asc' ? 'desc' : 'asc'\n\n activeSort.value = { key, direction }\n\n emit('sort-change', { key, direction })\n}\n</script>\n\n<template>\n <div class=\"ac-component\">\n <div class=\"c-table-wrapper\">\n <table\n class=\"c-table\"\n :class=\"{ 'is-compact': settings.compact, 'is-loading': loading }\"\n :style=\"{ '--action-count': config.actions?.length ?? 0 }\"\n >\n <thead>\n <tr>\n <th v-if=\"config.selectableAttr\">\n <Checkbox :model-value=\"allSelected\" @update:model-value=\"toggleAll\" />\n </th>\n\n <th\n v-for=\"col in visibleColumns\"\n :key=\"col.property\"\n :class=\"{\n 'c-sortable': col.sort,\n 'c-sortable--sorted': activeSort?.key === col.property,\n }\"\n @click=\"col.sort ? handleSort(col.property) : undefined\"\n >\n {{ col.label }}\n\n <span\n v-if=\"col.sort\"\n class=\"c-sort-icon fa-solid\"\n :class=\"{\n 'fa-sort': activeSort?.key !== col.property,\n 'fa-sort-down':\n activeSort?.key === col.property && activeSort.direction === 'desc',\n 'fa-sort-up': activeSort?.key === col.property && activeSort.direction === 'asc',\n 'c-sort-icon--active': activeSort?.key === col.property,\n 'is-asc': activeSort?.key === col.property && activeSort.direction === 'asc',\n 'is-desc': activeSort?.key === col.property && activeSort.direction === 'desc',\n }\"\n ></span>\n </th>\n\n <th v-if=\"config.actions\" class=\"c-actions-header\">\n {{ config.actionHeader ?? '' }}\n </th>\n </tr>\n </thead>\n\n <tbody v-if=\"!loading || items.length > 0\">\n <tr\n v-for=\"(item, index) in items\"\n :key=\"index\"\n :class=\"{\n 'is-selected': config.selectableAttr && selectedKeys.has(item[config.selectableAttr]),\n 'is-striped': settings.striped && index % 2 === 1,\n }\"\n >\n <td v-if=\"config.selectableAttr\" class=\"pointer\" @click.stop=\"toggleRow(item)\">\n <Checkbox\n :model-value=\"!!selectedKeys.has(item[config.selectableAttr])\"\n @update:model-value=\"toggleRow(item)\"\n @click.stop\n />\n </td>\n\n <td\n v-for=\"col in visibleColumns\"\n :key=\"col.property\"\n class=\"c-table__cell\"\n :class=\"[\n col.class,\n /* { 'is-nowrap': String(getColumnValue(item, col) ?? '').length < CHARACTER_BREAKPOINT}, */\n ]\"\n >\n <DataCell :item=\"item\" :col=\"col\" />\n </td>\n\n <td v-if=\"config.actions\" class=\"c-actions-cell\">\n <div class=\"c-actions-wrap\">\n <template v-for=\"(action, ai) in config.actions\" :key=\"ai\">\n <DropdownMenu\n v-if=\"isActionGroup(action)\"\n :icon=\"action.icon\"\n :label=\"action.label\"\n :items=\"buildActionGroupMenuItems(action, item)\"\n v-bind=\"action.config\"\n />\n\n <Button\n v-else\n :icon=\"action.icon\"\n :label=\"action.label\"\n :type=\"action.type\"\n :disabled=\"action.disabled ? action.disabled(item) : false\"\n :size=\"action.label ? 'small' : 'normal'\"\n :ariaLabel=\"action.ariaLabel\"\n outline\n :callback=\"() => action.callback(item)\"\n v-bind=\"action.config\"\n />\n </template>\n </div>\n </td>\n </tr>\n </tbody>\n <tbody v-else>\n <tr class=\"c-table__loading-row\">\n <td\n :colspan=\"\n visibleColumns.length + (config.selectableAttr ? 1 : 0) + (config.actions ? 1 : 0)\n \"\n class=\"c-table__loading-cell\"\n >\n <div class=\"c-table__loading-wrap\">\n <Loader :loading=\"true\" size=\"2.5rem\" />\n </div>\n </td>\n </tr>\n </tbody>\n </table>\n <div v-if=\"loading && items.length > 0\" class=\"c-table__backdrop\" aria-hidden=\"true\">\n <Loader :loading=\"true\" size=\"2.5rem\" />\n </div>\n </div>\n </div>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/data-table/data-table.scss\"></style>\n"],"mappings":""}
|
|
@@ -1,41 +1,42 @@
|
|
|
1
1
|
import e from "./admins-components6.js";
|
|
2
|
-
import t from "./admins-
|
|
3
|
-
import n from "./admins-
|
|
4
|
-
import r from "./admins-
|
|
5
|
-
import
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
import l from "./admins-
|
|
9
|
-
import
|
|
2
|
+
import t from "./admins-components16.js";
|
|
3
|
+
import n from "./admins-components24.js";
|
|
4
|
+
import r from "./admins-components38.js";
|
|
5
|
+
import i from "./admins-components48.js";
|
|
6
|
+
import { useSelection as a } from "./admins-components53.js";
|
|
7
|
+
import { dataCardsSettingsDefaults as o } from "./admins-components54.js";
|
|
8
|
+
import { buildActionGroupMenuItems as s, getColumnValue as c, isActionGroup as l } from "./admins-components55.js";
|
|
9
|
+
import u from "./admins-components58.js";
|
|
10
|
+
import { Fragment as d, computed as f, createBlock as p, createCommentVNode as m, createElementBlock as h, createElementVNode as g, createVNode as _, defineComponent as v, mergeProps as y, normalizeClass as b, openBlock as x, ref as S, renderList as C, toDisplayString as w, unref as T, vShow as E, watch as D, withDirectives as O, withModifiers as k } from "vue";
|
|
10
11
|
//#region src/components/data-table/DataCards.vue?vue&type=script&setup=true&lang.ts
|
|
11
|
-
var
|
|
12
|
+
var A = { class: "ac-component" }, j = ["onClick", "onPointerdown"], M = ["onClick"], N = { class: "c-card__heading" }, P = { class: "c-card__label" }, F = ["innerHTML"], I = { class: "c-card__body" }, L = { class: "c-card__field-label" }, R = {
|
|
12
13
|
key: 1,
|
|
13
14
|
class: "c-cards__loading-wrap"
|
|
14
|
-
},
|
|
15
|
+
}, z = {
|
|
15
16
|
key: 2,
|
|
16
17
|
class: "c-cards__backdrop",
|
|
17
18
|
"aria-hidden": "true"
|
|
18
|
-
},
|
|
19
|
+
}, B = /* @__PURE__ */ v({
|
|
19
20
|
__name: "DataCards",
|
|
20
21
|
props: {
|
|
21
22
|
config: {},
|
|
22
23
|
items: {},
|
|
23
|
-
settings: { default: () => ({ ...
|
|
24
|
+
settings: { default: () => ({ ...o }) },
|
|
24
25
|
loading: {
|
|
25
26
|
type: Boolean,
|
|
26
27
|
default: !1
|
|
27
28
|
}
|
|
28
29
|
},
|
|
29
30
|
emits: ["selection-change"],
|
|
30
|
-
setup(
|
|
31
|
-
let
|
|
32
|
-
|
|
33
|
-
|
|
31
|
+
setup(o, { emit: v }) {
|
|
32
|
+
let B = o, V = v, { selectedKeys: H, toggle: U } = a(() => B.items, () => B.config.selectableAttr, (e) => V("selection-change", e)), W = S(/* @__PURE__ */ new Set());
|
|
33
|
+
D(() => B.items, () => {
|
|
34
|
+
W.value = /* @__PURE__ */ new Set();
|
|
34
35
|
});
|
|
35
|
-
let
|
|
36
|
-
let e =
|
|
36
|
+
let G = f(() => B.config.columns.filter((e) => e.visible !== !1)), K = f(() => {
|
|
37
|
+
let e = B.settings;
|
|
37
38
|
if (e?.cardHeaderColumns) {
|
|
38
|
-
let t =
|
|
39
|
+
let t = G.value.filter((t) => e.cardHeaderColumns[t.property]);
|
|
39
40
|
if (t.length > 0) {
|
|
40
41
|
if (e.cardHeaderOrder) {
|
|
41
42
|
let n = e.cardHeaderOrder;
|
|
@@ -47,120 +48,124 @@ var k = ["onClick", "onPointerdown"], A = ["onClick"], j = { class: "c-card__hea
|
|
|
47
48
|
return t;
|
|
48
49
|
}
|
|
49
50
|
}
|
|
50
|
-
let t =
|
|
51
|
-
return t.length > 0 ? t :
|
|
52
|
-
}),
|
|
53
|
-
function
|
|
54
|
-
|
|
55
|
-
|
|
51
|
+
let t = G.value.filter((e) => e.primary);
|
|
52
|
+
return t.length > 0 ? t : G.value.slice(0, 1);
|
|
53
|
+
}), q = null, J = !1;
|
|
54
|
+
function Y(e, t) {
|
|
55
|
+
B.config.selectableAttr && e.button === 0 && (J = !1, q = setTimeout(() => {
|
|
56
|
+
J = !0, U(t);
|
|
56
57
|
}, 500));
|
|
57
58
|
}
|
|
58
|
-
function
|
|
59
|
-
|
|
59
|
+
function X() {
|
|
60
|
+
q &&= (clearTimeout(q), null);
|
|
60
61
|
}
|
|
61
|
-
function
|
|
62
|
-
|
|
62
|
+
function Z(e) {
|
|
63
|
+
J && e.preventDefault();
|
|
63
64
|
}
|
|
64
|
-
function
|
|
65
|
-
if (
|
|
66
|
-
|
|
65
|
+
function Q(e) {
|
|
66
|
+
if (J) {
|
|
67
|
+
J = !1;
|
|
67
68
|
return;
|
|
68
69
|
}
|
|
69
|
-
|
|
70
|
+
$(e);
|
|
70
71
|
}
|
|
71
|
-
function
|
|
72
|
-
|
|
72
|
+
function $(e) {
|
|
73
|
+
W.value.has(e) ? W.value.delete(e) : W.value.add(e), W.value = new Set(W.value);
|
|
73
74
|
}
|
|
74
|
-
return (
|
|
75
|
+
return (a, f) => (x(), h("div", A, [g("div", { class: b(["c-cards-wrapper", { "is-loading": o.loading }]) }, [!o.loading || o.items.length > 0 ? (x(), h("div", {
|
|
75
76
|
key: 0,
|
|
76
|
-
class:
|
|
77
|
-
}, [(
|
|
78
|
-
key:
|
|
79
|
-
class:
|
|
80
|
-
"is-open":
|
|
81
|
-
"is-selected":
|
|
77
|
+
class: b(["c-cards", { "is-compact": o.settings.compact }])
|
|
78
|
+
}, [(x(!0), h(d, null, C(o.items, (i, a) => (x(), h("div", {
|
|
79
|
+
key: a,
|
|
80
|
+
class: b(["c-card", {
|
|
81
|
+
"is-open": W.value.has(a),
|
|
82
|
+
"is-selected": o.config.selectableAttr && T(H).has(i[o.config.selectableAttr])
|
|
82
83
|
}])
|
|
83
|
-
}, [
|
|
84
|
+
}, [g("button", {
|
|
84
85
|
type: "button",
|
|
85
86
|
class: "c-card__header",
|
|
86
|
-
onClick: (e) =>
|
|
87
|
-
onPointerdown: (e) =>
|
|
88
|
-
onPointerup:
|
|
89
|
-
onPointerleave:
|
|
90
|
-
onContextmenu:
|
|
87
|
+
onClick: (e) => Q(a),
|
|
88
|
+
onPointerdown: (e) => Y(e, i),
|
|
89
|
+
onPointerup: f[1] ||= (e) => X(),
|
|
90
|
+
onPointerleave: f[2] ||= (e) => X(),
|
|
91
|
+
onContextmenu: Z
|
|
91
92
|
}, [
|
|
92
|
-
|
|
93
|
+
o.config.selectableAttr ? (x(), h("span", {
|
|
93
94
|
key: 0,
|
|
94
95
|
class: "c-card__check-zone",
|
|
95
|
-
onClick:
|
|
96
|
-
}, [
|
|
97
|
-
|
|
96
|
+
onClick: k((e) => T(U)(i), ["stop"])
|
|
97
|
+
}, [_(t, {
|
|
98
|
+
"model-value": !!T(H).has(i[o.config.selectableAttr]),
|
|
99
|
+
"onUpdate:modelValue": (e) => T(U)(i),
|
|
100
|
+
onClick: f[0] ||= k(() => {}, ["stop"])
|
|
101
|
+
}, null, 8, ["model-value", "onUpdate:modelValue"])], 8, M)) : m("", !0),
|
|
102
|
+
g("span", N, [(x(!0), h(d, null, C(K.value, (e, t) => (x(), h("span", {
|
|
98
103
|
key: e.property,
|
|
99
104
|
class: "c-card__heading-item"
|
|
100
|
-
}, [
|
|
101
|
-
class:
|
|
102
|
-
innerHTML:
|
|
103
|
-
}, null, 10,
|
|
104
|
-
|
|
105
|
+
}, [g("span", P, w(e.label), 1), g("span", {
|
|
106
|
+
class: b(["c-card__title", { "c-truncate": o.settings.compact && t === 0 }]),
|
|
107
|
+
innerHTML: T(c)(i, e)
|
|
108
|
+
}, null, 10, F)]))), 128))]),
|
|
109
|
+
f[4] ||= g("span", {
|
|
105
110
|
class: "c-card__icon",
|
|
106
111
|
"aria-hidden": "true"
|
|
107
|
-
}, [
|
|
108
|
-
], 40,
|
|
112
|
+
}, [g("i", { class: "fa-solid fa-chevron-down" })], -1)
|
|
113
|
+
], 40, j), O(g("div", I, [(x(!0), h(d, null, C(G.value, (e) => (x(), h("div", {
|
|
109
114
|
key: e.property,
|
|
110
115
|
class: "c-card__field",
|
|
111
116
|
tabindex: "0"
|
|
112
117
|
}, [
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
item:
|
|
118
|
+
g("span", L, w(e.label), 1),
|
|
119
|
+
_(u, {
|
|
120
|
+
item: i,
|
|
116
121
|
col: e,
|
|
117
122
|
class: "c-card__field-value",
|
|
118
123
|
copy: !1
|
|
119
124
|
}, null, 8, ["item", "col"]),
|
|
120
|
-
|
|
125
|
+
T(c)(i, e) ? (x(), p(r, {
|
|
121
126
|
key: 0,
|
|
122
127
|
class: "c-card__field-copy click-expand",
|
|
123
|
-
value:
|
|
124
|
-
}, null, 8, ["value"])) :
|
|
125
|
-
]))), 128)),
|
|
128
|
+
value: T(c)(i, e)
|
|
129
|
+
}, null, 8, ["value"])) : m("", !0)
|
|
130
|
+
]))), 128)), o.config.actions ? (x(), h("div", {
|
|
126
131
|
key: 0,
|
|
127
132
|
class: "c-card__actions",
|
|
128
|
-
onClick:
|
|
129
|
-
}, [(
|
|
133
|
+
onClick: f[3] ||= k(() => {}, ["stop"])
|
|
134
|
+
}, [(x(!0), h(d, null, C(o.config.actions, (t, r) => (x(), h(d, { key: r }, [T(l)(t) ? (x(), p(n, y({
|
|
130
135
|
key: 0,
|
|
131
|
-
icon:
|
|
132
|
-
label:
|
|
133
|
-
ariaLabel:
|
|
134
|
-
items:
|
|
135
|
-
}, { ref_for: !0 },
|
|
136
|
+
icon: t.icon,
|
|
137
|
+
label: t.label,
|
|
138
|
+
ariaLabel: t.ariaLabel,
|
|
139
|
+
items: T(s)(t, i)
|
|
140
|
+
}, { ref_for: !0 }, t.config), null, 16, [
|
|
136
141
|
"icon",
|
|
137
142
|
"label",
|
|
138
143
|
"ariaLabel",
|
|
139
144
|
"items"
|
|
140
|
-
])) : (
|
|
145
|
+
])) : (x(), p(e, y({
|
|
141
146
|
key: 1,
|
|
142
|
-
type:
|
|
143
|
-
icon:
|
|
144
|
-
label:
|
|
145
|
-
ariaLabel:
|
|
147
|
+
type: t.type,
|
|
148
|
+
icon: t.icon,
|
|
149
|
+
label: t.cardLabel ?? t.label,
|
|
150
|
+
ariaLabel: t.ariaLabel,
|
|
146
151
|
outline: "",
|
|
147
|
-
disabled:
|
|
148
|
-
callback: () =>
|
|
149
|
-
}, { ref_for: !0 },
|
|
152
|
+
disabled: t.disabled ? t.disabled(i) : !1,
|
|
153
|
+
callback: () => t.callback(i)
|
|
154
|
+
}, { ref_for: !0 }, t.config), null, 16, [
|
|
150
155
|
"type",
|
|
151
156
|
"icon",
|
|
152
157
|
"label",
|
|
153
158
|
"ariaLabel",
|
|
154
159
|
"disabled",
|
|
155
160
|
"callback"
|
|
156
|
-
]))], 64))), 128))])) :
|
|
161
|
+
]))], 64))), 128))])) : m("", !0)], 512), [[E, W.value.has(a)]])], 2))), 128))], 2)) : (x(), h("div", R, [_(i, {
|
|
157
162
|
loading: !0,
|
|
158
163
|
size: "2.5rem"
|
|
159
|
-
})])),
|
|
164
|
+
})])), o.loading && o.items.length > 0 ? (x(), h("div", z, [_(i, {
|
|
160
165
|
loading: !0,
|
|
161
166
|
size: "2.5rem"
|
|
162
|
-
})])) :
|
|
167
|
+
})])) : m("", !0)], 2)]));
|
|
163
168
|
}
|
|
164
169
|
});
|
|
165
170
|
//#endregion
|
|
166
|
-
export {
|
|
171
|
+
export { B as default };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"admins-components62.js","names":[],"sources":["../src/components/data-table/DataCards.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { DataListConfig, DataCardsSettings, DataListSettings } from '@/types/data-list'\nimport DataCell from './DataCell.vue'\nexport { dataCardsSettingsDefaults } from '@/types/data-list'\n</script>\n\n<script setup lang=\"ts\">\nimport { computed, ref, watch } from 'vue'\nimport Button from '@/components/Button.vue'\nimport Checkbox from '@/components/Checkbox.vue'\nimport CopyToClipboard from '@/components/CopyToClipboard.vue'\nimport Loader from '@/components/Loader.vue'\nimport { useSelection } from '@/composables/useSelection'\nimport { dataCardsSettingsDefaults } from '@/types/data-list'\nimport DropdownMenu from '@/components/DropdownMenu.vue'\nimport { getColumnValue } from '@/utils/dataList'\nimport { buildActionGroupMenuItems, isActionGroup } from '@/utils/dataList'\n\nconst props = withDefaults(\n defineProps<{\n config: DataListConfig\n items: Record<string, unknown>[]\n settings?: DataCardsSettings | DataListSettings\n loading?: boolean\n }>(),\n {\n settings: () => ({ ...dataCardsSettingsDefaults }),\n loading: false,\n },\n)\n\nconst emit = defineEmits<{\n 'selection-change': [selected: unknown[]]\n}>()\n\nconst { selectedKeys, toggle: toggleRow } = useSelection(\n () => props.items,\n () => props.config.selectableAttr,\n (s) => emit('selection-change', s),\n)\n\nconst openRowIndexes = ref<Set<number>>(new Set())\n\nwatch(\n () => props.items,\n () => {\n openRowIndexes.value = new Set()\n },\n)\n\nconst visibleColumns = computed(() => props.config.columns.filter((c) => c.visible !== false))\n\nconst cardHeaderColumns = computed(() => {\n const s = props.settings as any\n if (s?.cardHeaderColumns) {\n const cols = visibleColumns.value.filter((c) => s.cardHeaderColumns[c.property])\n if (cols.length > 0) {\n if (s.cardHeaderOrder) {\n const order = s.cardHeaderOrder as string[]\n return [...cols].sort((a, b) => {\n const ai = order.indexOf(a.property)\n const bi = order.indexOf(b.property)\n return (ai === -1 ? 999 : ai) - (bi === -1 ? 999 : bi)\n })\n }\n return cols\n }\n }\n const primary = visibleColumns.value.filter((c) => c.primary)\n if (primary.length > 0) return primary\n\n return visibleColumns.value.slice(0, 1)\n})\n\nlet longPressTimer: ReturnType<typeof setTimeout> | null = null\nlet longPressTriggered = false\n\nfunction onPointerDown(e: PointerEvent, item: Record<string, unknown>) {\n if (!props.config.selectableAttr) return\n if (e.button !== 0) return\n longPressTriggered = false\n longPressTimer = setTimeout(() => {\n longPressTriggered = true\n toggleRow(item)\n }, 500)\n}\n\nfunction onPointerUp() {\n if (longPressTimer) {\n clearTimeout(longPressTimer)\n longPressTimer = null\n }\n}\n\nfunction onContextMenu(e: MouseEvent) {\n if (longPressTriggered) {\n e.preventDefault()\n }\n}\n\nfunction onHeaderClick(index: number) {\n if (longPressTriggered) {\n longPressTriggered = false\n return\n }\n toggleAccordion(index)\n}\n\nfunction toggleAccordion(index: number) {\n if (openRowIndexes.value.has(index)) {\n openRowIndexes.value.delete(index)\n } else {\n openRowIndexes.value.add(index)\n }\n openRowIndexes.value = new Set(openRowIndexes.value)\n}\n</script>\n\n<template>\n <div class=\"ac-component\">\n <div class=\"c-cards-wrapper\" :class=\"{ 'is-loading': loading }\">\n <div\n v-if=\"!loading || items.length > 0\"\n class=\"c-cards\"\n :class=\"{ 'is-compact': settings.compact }\"\n >\n <div\n v-for=\"(item, index) in items\"\n :key=\"index\"\n class=\"c-card\"\n :class=\"{\n 'is-open': openRowIndexes.has(index),\n 'is-selected': config.selectableAttr && selectedKeys.has(item[config.selectableAttr]),\n }\"\n >\n <button\n type=\"button\"\n class=\"c-card__header\"\n @click=\"onHeaderClick(index)\"\n @pointerdown=\"onPointerDown($event, item)\"\n @pointerup=\"onPointerUp()\"\n @pointerleave=\"onPointerUp()\"\n @contextmenu=\"onContextMenu\"\n >\n <span\n v-if=\"config.selectableAttr\"\n class=\"c-card__check-zone\"\n @click.stop=\"toggleRow(item)\"\n >\n <Checkbox\n :model-value=\"!!selectedKeys.has(item[config.selectableAttr])\"\n @update:model-value=\"toggleRow(item)\"\n @click.stop\n />\n </span>\n <span class=\"c-card__heading\">\n <span\n v-for=\"(col, i) in cardHeaderColumns\"\n :key=\"col.property\"\n class=\"c-card__heading-item\"\n >\n <span class=\"c-card__label\">{{ col.label }}</span>\n <span\n class=\"c-card__title\"\n :class=\"{ 'c-truncate': settings.compact && i === 0 }\"\n v-html=\"getColumnValue(item, col)\"\n ></span>\n </span>\n </span>\n <span class=\"c-card__icon\" aria-hidden=\"true\"\n ><i class=\"fa-solid fa-chevron-down\"></i\n ></span>\n </button>\n\n <div v-show=\"openRowIndexes.has(index)\" class=\"c-card__body\">\n <div\n v-for=\"col in visibleColumns\"\n :key=\"col.property\"\n class=\"c-card__field\"\n tabindex=\"0\"\n >\n <span class=\"c-card__field-label\">{{ col.label }}</span>\n <DataCell :item=\"item\" :col=\"col\" class=\"c-card__field-value\" :copy=\"false\" />\n\n <CopyToClipboard\n v-if=\"getColumnValue(item, col)\"\n class=\"c-card__field-copy click-expand\"\n :value=\"getColumnValue(item, col)\"\n />\n </div>\n\n <div v-if=\"config.actions\" class=\"c-card__actions\" @click.stop>\n <template v-for=\"(action, ai) in config.actions\" :key=\"ai\">\n <DropdownMenu\n v-if=\"isActionGroup(action)\"\n :icon=\"action.icon\"\n :label=\"action.label\"\n :ariaLabel=\"action.ariaLabel\"\n :items=\"buildActionGroupMenuItems(action, item)\"\n v-bind=\"action.config\"\n />\n\n <Button\n v-else\n :type=\"action.type\"\n :icon=\"action.icon\"\n :label=\"action.cardLabel ?? action.label\"\n :ariaLabel=\"action.ariaLabel\"\n outline\n :disabled=\"action.disabled ? action.disabled(item) : false\"\n :callback=\"() => action.callback(item)\"\n v-bind=\"action.config\"\n />\n </template>\n </div>\n </div>\n </div>\n </div>\n <div v-else class=\"c-cards__loading-wrap\">\n <Loader :loading=\"true\" size=\"2.5rem\" />\n </div>\n <div v-if=\"loading && items.length > 0\" class=\"c-cards__backdrop\" aria-hidden=\"true\">\n <Loader :loading=\"true\" size=\"2.5rem\" />\n </div>\n </div>\n </div>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/data-table/data-cards.scss\"></style>\n"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"admins-components64.js","names":[],"sources":["../src/components/data-table/DataCards.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { DataListConfig, DataCardsSettings, DataListSettings } from '@/types/data-list'\nimport DataCell from './DataCell.vue'\nexport { dataCardsSettingsDefaults } from '@/types/data-list'\n</script>\n\n<script setup lang=\"ts\">\nimport { computed, ref, watch } from 'vue'\nimport Button from '@/components/Button.vue'\nimport Checkbox from '@/components/Checkbox.vue'\nimport CopyToClipboard from '@/components/CopyToClipboard.vue'\nimport Loader from '@/components/Loader.vue'\nimport { useSelection } from '@/composables/useSelection'\nimport { dataCardsSettingsDefaults } from '@/types/data-list'\nimport DropdownMenu from '@/components/DropdownMenu.vue'\nimport { getColumnValue } from '@/utils/dataList'\nimport { buildActionGroupMenuItems, isActionGroup } from '@/utils/dataList'\n\nconst props = withDefaults(\n defineProps<{\n config: DataListConfig\n items: Record<string, unknown>[]\n settings?: DataCardsSettings | DataListSettings\n loading?: boolean\n }>(),\n {\n settings: () => ({ ...dataCardsSettingsDefaults }),\n loading: false,\n },\n)\n\nconst emit = defineEmits<{\n 'selection-change': [selected: unknown[]]\n}>()\n\nconst { selectedKeys, toggle: toggleRow } = useSelection(\n () => props.items,\n () => props.config.selectableAttr,\n (s) => emit('selection-change', s),\n)\n\nconst openRowIndexes = ref<Set<number>>(new Set())\n\nwatch(\n () => props.items,\n () => {\n openRowIndexes.value = new Set()\n },\n)\n\nconst visibleColumns = computed(() => props.config.columns.filter((c) => c.visible !== false))\n\nconst cardHeaderColumns = computed(() => {\n const s = props.settings as any\n if (s?.cardHeaderColumns) {\n const cols = visibleColumns.value.filter((c) => s.cardHeaderColumns[c.property])\n if (cols.length > 0) {\n if (s.cardHeaderOrder) {\n const order = s.cardHeaderOrder as string[]\n return [...cols].sort((a, b) => {\n const ai = order.indexOf(a.property)\n const bi = order.indexOf(b.property)\n return (ai === -1 ? 999 : ai) - (bi === -1 ? 999 : bi)\n })\n }\n return cols\n }\n }\n const primary = visibleColumns.value.filter((c) => c.primary)\n if (primary.length > 0) return primary\n\n return visibleColumns.value.slice(0, 1)\n})\n\nlet longPressTimer: ReturnType<typeof setTimeout> | null = null\nlet longPressTriggered = false\n\nfunction onPointerDown(e: PointerEvent, item: Record<string, unknown>) {\n if (!props.config.selectableAttr) return\n if (e.button !== 0) return\n longPressTriggered = false\n longPressTimer = setTimeout(() => {\n longPressTriggered = true\n toggleRow(item)\n }, 500)\n}\n\nfunction onPointerUp() {\n if (longPressTimer) {\n clearTimeout(longPressTimer)\n longPressTimer = null\n }\n}\n\nfunction onContextMenu(e: MouseEvent) {\n if (longPressTriggered) {\n e.preventDefault()\n }\n}\n\nfunction onHeaderClick(index: number) {\n if (longPressTriggered) {\n longPressTriggered = false\n return\n }\n toggleAccordion(index)\n}\n\nfunction toggleAccordion(index: number) {\n if (openRowIndexes.value.has(index)) {\n openRowIndexes.value.delete(index)\n } else {\n openRowIndexes.value.add(index)\n }\n openRowIndexes.value = new Set(openRowIndexes.value)\n}\n</script>\n\n<template>\n <div class=\"ac-component\">\n <div class=\"c-cards-wrapper\" :class=\"{ 'is-loading': loading }\">\n <div\n v-if=\"!loading || items.length > 0\"\n class=\"c-cards\"\n :class=\"{ 'is-compact': settings.compact }\"\n >\n <div\n v-for=\"(item, index) in items\"\n :key=\"index\"\n class=\"c-card\"\n :class=\"{\n 'is-open': openRowIndexes.has(index),\n 'is-selected': config.selectableAttr && selectedKeys.has(item[config.selectableAttr]),\n }\"\n >\n <button\n type=\"button\"\n class=\"c-card__header\"\n @click=\"onHeaderClick(index)\"\n @pointerdown=\"onPointerDown($event, item)\"\n @pointerup=\"onPointerUp()\"\n @pointerleave=\"onPointerUp()\"\n @contextmenu=\"onContextMenu\"\n >\n <span\n v-if=\"config.selectableAttr\"\n class=\"c-card__check-zone\"\n @click.stop=\"toggleRow(item)\"\n >\n <Checkbox\n :model-value=\"!!selectedKeys.has(item[config.selectableAttr])\"\n @update:model-value=\"toggleRow(item)\"\n @click.stop\n />\n </span>\n <span class=\"c-card__heading\">\n <span\n v-for=\"(col, i) in cardHeaderColumns\"\n :key=\"col.property\"\n class=\"c-card__heading-item\"\n >\n <span class=\"c-card__label\">{{ col.label }}</span>\n <span\n class=\"c-card__title\"\n :class=\"{ 'c-truncate': settings.compact && i === 0 }\"\n v-html=\"getColumnValue(item, col)\"\n ></span>\n </span>\n </span>\n <span class=\"c-card__icon\" aria-hidden=\"true\"\n ><i class=\"fa-solid fa-chevron-down\"></i\n ></span>\n </button>\n\n <div v-show=\"openRowIndexes.has(index)\" class=\"c-card__body\">\n <div\n v-for=\"col in visibleColumns\"\n :key=\"col.property\"\n class=\"c-card__field\"\n tabindex=\"0\"\n >\n <span class=\"c-card__field-label\">{{ col.label }}</span>\n <DataCell :item=\"item\" :col=\"col\" class=\"c-card__field-value\" :copy=\"false\" />\n\n <CopyToClipboard\n v-if=\"getColumnValue(item, col)\"\n class=\"c-card__field-copy click-expand\"\n :value=\"getColumnValue(item, col)\"\n />\n </div>\n\n <div v-if=\"config.actions\" class=\"c-card__actions\" @click.stop>\n <template v-for=\"(action, ai) in config.actions\" :key=\"ai\">\n <DropdownMenu\n v-if=\"isActionGroup(action)\"\n :icon=\"action.icon\"\n :label=\"action.label\"\n :ariaLabel=\"action.ariaLabel\"\n :items=\"buildActionGroupMenuItems(action, item)\"\n v-bind=\"action.config\"\n />\n\n <Button\n v-else\n :type=\"action.type\"\n :icon=\"action.icon\"\n :label=\"action.cardLabel ?? action.label\"\n :ariaLabel=\"action.ariaLabel\"\n outline\n :disabled=\"action.disabled ? action.disabled(item) : false\"\n :callback=\"() => action.callback(item)\"\n v-bind=\"action.config\"\n />\n </template>\n </div>\n </div>\n </div>\n </div>\n <div v-else class=\"c-cards__loading-wrap\">\n <Loader :loading=\"true\" size=\"2.5rem\" />\n </div>\n <div v-if=\"loading && items.length > 0\" class=\"c-cards__backdrop\" aria-hidden=\"true\">\n <Loader :loading=\"true\" size=\"2.5rem\" />\n </div>\n </div>\n </div>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/data-table/data-cards.scss\"></style>\n"],"mappings":""}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"admins-components65.js","names":[],"sources":["../src/utils/objects.ts"],"sourcesContent":["export function deepMerge(target: Record<string, any>, source: Record<string, any>) {\n const result = { ...target };\n\n for (const key in source) {\n if (\n source[key] &&\n typeof source[key] === 'object' &&\n !Array.isArray(source[key]) &&\n key in target &&\n typeof target[key] === 'object'\n ) {\n result[key] = deepMerge(target[key], source[key]);\n } else {\n result[key] = source[key];\n }\n }\n\n return result;\n}\n"],"mappings":";AAAA,SAAgB,EAAU,GAA6B,GAA6B;CAClF,IAAM,IAAS,EAAE,GAAG,EAAO;CAE3B,KAAK,IAAM,KAAO,GAChB,AACE,EAAO,MACP,OAAO,EAAO,MAAS,YACvB,CAAC,MAAM,QAAQ,EAAO,EAAI,KAC1B,KAAO,KACP,OAAO,EAAO,MAAS,WAEvB,EAAO,KAAO,EAAU,EAAO,IAAM,EAAO,EAAI,IAEhD,EAAO,KAAO,EAAO;CAIzB,OAAO;AACT"}
|