ablok-components 0.3.85 → 0.3.87
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/ablok-components.umd.js +2 -2
- package/dist/components/molecules/bulk-upload/bulk-upload.vue.d.ts +39 -0
- package/dist/components/molecules/bulk-upload/bulk-upload.vue.js +88 -64
- package/dist/components/molecules/file-upload/file-upload.vue.d.ts +42 -0
- package/dist/components/molecules/file-upload/file-upload.vue.js +47 -44
- package/package.json +1 -1
|
@@ -6,29 +6,47 @@ declare const _default: import('../../../../vue/dist/vue.esm-bundler.js').Define
|
|
|
6
6
|
type?: string;
|
|
7
7
|
caption?: string;
|
|
8
8
|
src?: any;
|
|
9
|
+
name?: string;
|
|
10
|
+
size?: number;
|
|
11
|
+
lastModified?: number;
|
|
9
12
|
}[];
|
|
10
13
|
(...items: {
|
|
11
14
|
type?: string;
|
|
12
15
|
caption?: string;
|
|
13
16
|
src?: any;
|
|
17
|
+
name?: string;
|
|
18
|
+
size?: number;
|
|
19
|
+
lastModified?: number;
|
|
14
20
|
}[]): {
|
|
15
21
|
type?: string;
|
|
16
22
|
caption?: string;
|
|
17
23
|
src?: any;
|
|
24
|
+
name?: string;
|
|
25
|
+
size?: number;
|
|
26
|
+
lastModified?: number;
|
|
18
27
|
}[];
|
|
19
28
|
new (arrayLength: number): {
|
|
20
29
|
type?: string;
|
|
21
30
|
caption?: string;
|
|
22
31
|
src?: any;
|
|
32
|
+
name?: string;
|
|
33
|
+
size?: number;
|
|
34
|
+
lastModified?: number;
|
|
23
35
|
}[];
|
|
24
36
|
new (...items: {
|
|
25
37
|
type?: string;
|
|
26
38
|
caption?: string;
|
|
27
39
|
src?: any;
|
|
40
|
+
name?: string;
|
|
41
|
+
size?: number;
|
|
42
|
+
lastModified?: number;
|
|
28
43
|
}[]): {
|
|
29
44
|
type?: string;
|
|
30
45
|
caption?: string;
|
|
31
46
|
src?: any;
|
|
47
|
+
name?: string;
|
|
48
|
+
size?: number;
|
|
49
|
+
lastModified?: number;
|
|
32
50
|
}[];
|
|
33
51
|
isArray(arg: any): arg is any[];
|
|
34
52
|
readonly prototype: any[];
|
|
@@ -64,29 +82,47 @@ declare const _default: import('../../../../vue/dist/vue.esm-bundler.js').Define
|
|
|
64
82
|
type?: string;
|
|
65
83
|
caption?: string;
|
|
66
84
|
src?: any;
|
|
85
|
+
name?: string;
|
|
86
|
+
size?: number;
|
|
87
|
+
lastModified?: number;
|
|
67
88
|
}[];
|
|
68
89
|
(...items: {
|
|
69
90
|
type?: string;
|
|
70
91
|
caption?: string;
|
|
71
92
|
src?: any;
|
|
93
|
+
name?: string;
|
|
94
|
+
size?: number;
|
|
95
|
+
lastModified?: number;
|
|
72
96
|
}[]): {
|
|
73
97
|
type?: string;
|
|
74
98
|
caption?: string;
|
|
75
99
|
src?: any;
|
|
100
|
+
name?: string;
|
|
101
|
+
size?: number;
|
|
102
|
+
lastModified?: number;
|
|
76
103
|
}[];
|
|
77
104
|
new (arrayLength: number): {
|
|
78
105
|
type?: string;
|
|
79
106
|
caption?: string;
|
|
80
107
|
src?: any;
|
|
108
|
+
name?: string;
|
|
109
|
+
size?: number;
|
|
110
|
+
lastModified?: number;
|
|
81
111
|
}[];
|
|
82
112
|
new (...items: {
|
|
83
113
|
type?: string;
|
|
84
114
|
caption?: string;
|
|
85
115
|
src?: any;
|
|
116
|
+
name?: string;
|
|
117
|
+
size?: number;
|
|
118
|
+
lastModified?: number;
|
|
86
119
|
}[]): {
|
|
87
120
|
type?: string;
|
|
88
121
|
caption?: string;
|
|
89
122
|
src?: any;
|
|
123
|
+
name?: string;
|
|
124
|
+
size?: number;
|
|
125
|
+
lastModified?: number;
|
|
90
126
|
}[];
|
|
91
127
|
isArray(arg: any): arg is any[];
|
|
92
128
|
readonly prototype: any[];
|
|
@@ -120,6 +156,9 @@ declare const _default: import('../../../../vue/dist/vue.esm-bundler.js').Define
|
|
|
120
156
|
type?: string;
|
|
121
157
|
caption?: string;
|
|
122
158
|
src?: any;
|
|
159
|
+
name?: string;
|
|
160
|
+
size?: number;
|
|
161
|
+
lastModified?: number;
|
|
123
162
|
}[];
|
|
124
163
|
disabled: boolean;
|
|
125
164
|
}, {}, {}, {}, string, import('../../../../vue/dist/vue.esm-bundler.js').ComponentProvideOptions, true, {
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
import
|
|
1
|
+
import { defineComponent as x, computed as D, ref as v, resolveComponent as M, openBlock as i, createElementBlock as c, createElementVNode as o, toDisplayString as f, createCommentVNode as h, createVNode as m, withCtx as k, withDirectives as I, vModelText as L, withModifiers as V, nextTick as S } from "vue";
|
|
2
|
+
import U from "../file-upload/file-upload.vue.js";
|
|
3
3
|
/* empty css */
|
|
4
|
-
const
|
|
4
|
+
const F = { class: "container" }, H = { class: "row" }, N = { class: "col-12" }, A = {
|
|
5
5
|
key: 0,
|
|
6
6
|
class: "grid place-items-center text-center text-muted py-5 border border-bottom-0"
|
|
7
|
-
},
|
|
7
|
+
}, E = { class: "m-0" }, j = { class: "preview-item border-bottom p-3" }, q = { class: "d-flex gap-3" }, G = { class: "col-2" }, K = { class: "col" }, R = { class: "file-meta text-muted small mb-2" }, J = { class: "fw-semibold" }, O = { key: 0 }, P = { key: 1 }, Q = ["onUpdate:modelValue", "id"], W = ["innerHTML"], X = { class: "col-auto d-flex flex-column gap-2" }, Y = ["onClick"], Z = ["onClick"], ee = { class: "d-flex align-items-end p-3" }, te = { class: "btn btn-primary btn-sm ms-auto d-flex align-items-center gap-2" }, oe = ["innerHTML"], ae = /* @__PURE__ */ x({
|
|
8
8
|
__name: "bulk-upload",
|
|
9
9
|
props: {
|
|
10
10
|
storeId: String,
|
|
@@ -25,46 +25,63 @@ const S = { class: "container" }, A = { class: "row" }, B = { class: "col-12" },
|
|
|
25
25
|
}
|
|
26
26
|
},
|
|
27
27
|
emits: ["update:modelValue"],
|
|
28
|
-
setup(
|
|
29
|
-
const
|
|
28
|
+
setup($, { emit: w }) {
|
|
29
|
+
const b = $, y = w, d = D({
|
|
30
30
|
get: () => {
|
|
31
|
-
const
|
|
32
|
-
return
|
|
31
|
+
const t = b.modelValue || [];
|
|
32
|
+
return u.value = t.map((e) => e.caption || ""), t.map((e) => ({
|
|
33
|
+
type: e.type,
|
|
34
|
+
src: e.src,
|
|
35
|
+
...e.name ? { name: e.name } : {},
|
|
36
|
+
...e.size ? { size: e.size } : {},
|
|
37
|
+
...e.lastModified ? { lastModified: e.lastModified } : {}
|
|
38
|
+
}));
|
|
33
39
|
},
|
|
34
|
-
set: (
|
|
35
|
-
const
|
|
36
|
-
|
|
40
|
+
set: (t) => {
|
|
41
|
+
const e = d.value || [], s = Array.isArray(t) ? t : [], a = s.length <= e.length && s.every((l) => e.some((n) => n.src === l.src));
|
|
42
|
+
p(a ? s : [...e, ...s]);
|
|
37
43
|
}
|
|
38
|
-
}),
|
|
39
|
-
function C(
|
|
40
|
-
const
|
|
41
|
-
|
|
44
|
+
}), g = v(null), r = v({}), u = v({});
|
|
45
|
+
function C(t) {
|
|
46
|
+
const e = [...b.modelValue || []];
|
|
47
|
+
e.splice(t, 1), y("update:modelValue", e);
|
|
42
48
|
}
|
|
43
|
-
async function
|
|
44
|
-
|
|
49
|
+
async function B(t) {
|
|
50
|
+
r.value[t] = !r.value[t], r.value[t] || p(), await S(), g.value?.querySelector(`#caption-${t}`)?.focus();
|
|
45
51
|
}
|
|
46
|
-
function
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
52
|
+
function z(t) {
|
|
53
|
+
if (t == null) return "";
|
|
54
|
+
const e = ["B", "KB", "MB", "GB", "TB"];
|
|
55
|
+
let s = t, a = e.shift();
|
|
56
|
+
for (; s >= 1024 && e.length; )
|
|
57
|
+
s /= 1024, a = e.shift();
|
|
58
|
+
return `${s.toFixed(1)} ${a}`;
|
|
59
|
+
}
|
|
60
|
+
function T(t) {
|
|
61
|
+
return t ? new Date(t).toLocaleDateString() : "";
|
|
62
|
+
}
|
|
63
|
+
function p(t) {
|
|
64
|
+
y("update:modelValue", (t || d.value).map((e, s) => ({
|
|
65
|
+
...e,
|
|
66
|
+
caption: u.value[s] || ""
|
|
50
67
|
})));
|
|
51
68
|
}
|
|
52
|
-
return (
|
|
53
|
-
const s =
|
|
54
|
-
return
|
|
69
|
+
return (t, e) => {
|
|
70
|
+
const s = M("base-image"), a = M("svg-icon");
|
|
71
|
+
return i(), c("div", {
|
|
55
72
|
class: "bulk-upload",
|
|
56
73
|
ref_key: "root",
|
|
57
|
-
ref:
|
|
74
|
+
ref: g
|
|
58
75
|
}, [
|
|
59
|
-
o("div",
|
|
60
|
-
o("div",
|
|
61
|
-
o("div",
|
|
62
|
-
|
|
63
|
-
o("p",
|
|
76
|
+
o("div", F, [
|
|
77
|
+
o("div", H, [
|
|
78
|
+
o("div", N, [
|
|
79
|
+
d.value.length ? h("", !0) : (i(), c("div", A, [
|
|
80
|
+
o("p", E, f(t.$t("fileInput.noFilesSelected")), 1)
|
|
64
81
|
])),
|
|
65
|
-
|
|
66
|
-
modelValue:
|
|
67
|
-
"onUpdate:modelValue":
|
|
82
|
+
m(U, {
|
|
83
|
+
modelValue: d.value,
|
|
84
|
+
"onUpdate:modelValue": e[1] || (e[1] = (l) => d.value = l),
|
|
68
85
|
multiple: !0,
|
|
69
86
|
accept: "image/*",
|
|
70
87
|
"drop-files": !0,
|
|
@@ -72,60 +89,67 @@ const S = { class: "container" }, A = { class: "row" }, B = { class: "col-12" },
|
|
|
72
89
|
"local-url-format": "objectUrl",
|
|
73
90
|
class: "d-flex flex-column border"
|
|
74
91
|
}, {
|
|
75
|
-
"preview-item":
|
|
76
|
-
o("div",
|
|
77
|
-
o("div",
|
|
78
|
-
o("div",
|
|
79
|
-
|
|
80
|
-
src:
|
|
92
|
+
"preview-item": k(({ bind: { item: l, index: n } }) => [
|
|
93
|
+
o("div", j, [
|
|
94
|
+
o("div", q, [
|
|
95
|
+
o("div", G, [
|
|
96
|
+
m(s, {
|
|
97
|
+
src: l.src,
|
|
81
98
|
alt: "",
|
|
82
99
|
class: "img-thumbnail"
|
|
83
100
|
}, null, 8, ["src"])
|
|
84
101
|
]),
|
|
85
|
-
o("div",
|
|
86
|
-
|
|
102
|
+
o("div", K, [
|
|
103
|
+
o("div", R, [
|
|
104
|
+
o("div", J, f(l.name || t.$t("fileInput.unknownFile")), 1),
|
|
105
|
+
o("div", null, [
|
|
106
|
+
l.size ? (i(), c("span", O, f(z(l.size)), 1)) : h("", !0),
|
|
107
|
+
l.lastModified ? (i(), c("span", P, " · " + f(T(l.lastModified)), 1)) : h("", !0)
|
|
108
|
+
])
|
|
109
|
+
]),
|
|
110
|
+
r.value[n] ? I((i(), c("textarea", {
|
|
87
111
|
key: 0,
|
|
88
|
-
"onUpdate:modelValue": (
|
|
89
|
-
id: `caption-${
|
|
112
|
+
"onUpdate:modelValue": (_) => u.value[n] = _,
|
|
113
|
+
id: `caption-${n}`,
|
|
90
114
|
class: "form-control rounded-0 h-100",
|
|
91
|
-
onChangeCapture:
|
|
92
|
-
}, null, 40,
|
|
93
|
-
[
|
|
94
|
-
]) : (
|
|
115
|
+
onChangeCapture: e[0] || (e[0] = (_) => p())
|
|
116
|
+
}, null, 40, Q)), [
|
|
117
|
+
[L, u.value[n]]
|
|
118
|
+
]) : (i(), c("p", {
|
|
95
119
|
key: 1,
|
|
96
120
|
class: "m-0",
|
|
97
|
-
innerHTML:
|
|
98
|
-
}, null, 8,
|
|
121
|
+
innerHTML: u.value[n] || `<small>${t.$t("fileInput.noCaption")}</small>`
|
|
122
|
+
}, null, 8, W))
|
|
99
123
|
]),
|
|
100
|
-
o("div",
|
|
124
|
+
o("div", X, [
|
|
101
125
|
o("button", {
|
|
102
|
-
onClick: V((
|
|
126
|
+
onClick: V((_) => C(n), ["prevent"]),
|
|
103
127
|
class: "btn btn--close"
|
|
104
128
|
}, [
|
|
105
|
-
|
|
106
|
-
], 8,
|
|
129
|
+
m(a, { symbol: "x" })
|
|
130
|
+
], 8, Y),
|
|
107
131
|
o("button", {
|
|
108
|
-
onClick: V((
|
|
132
|
+
onClick: V((_) => B(n), ["prevent"]),
|
|
109
133
|
class: "btn btn--close"
|
|
110
134
|
}, [
|
|
111
|
-
|
|
112
|
-
symbol:
|
|
135
|
+
m(a, {
|
|
136
|
+
symbol: r.value[n] ? "check" : "edit-3"
|
|
113
137
|
}, null, 8, ["symbol"])
|
|
114
|
-
], 8,
|
|
138
|
+
], 8, Z)
|
|
115
139
|
])
|
|
116
140
|
])
|
|
117
141
|
])
|
|
118
142
|
]),
|
|
119
|
-
button:
|
|
120
|
-
o("span",
|
|
121
|
-
o("span",
|
|
122
|
-
|
|
143
|
+
button: k(() => [
|
|
144
|
+
o("span", ee, [
|
|
145
|
+
o("span", te, [
|
|
146
|
+
m(a, {
|
|
123
147
|
symbol: "upload",
|
|
124
148
|
size: "small"
|
|
125
149
|
}),
|
|
126
150
|
o("span", {
|
|
127
|
-
innerHTML:
|
|
128
|
-
}, null, 8,
|
|
151
|
+
innerHTML: t.$t("common.selectFile")
|
|
152
|
+
}, null, 8, oe)
|
|
129
153
|
])
|
|
130
154
|
])
|
|
131
155
|
]),
|
|
@@ -139,5 +163,5 @@ const S = { class: "container" }, A = { class: "row" }, B = { class: "col-12" },
|
|
|
139
163
|
}
|
|
140
164
|
});
|
|
141
165
|
export {
|
|
142
|
-
|
|
166
|
+
ae as default
|
|
143
167
|
};
|
|
@@ -9,6 +9,9 @@ declare function __VLS_template(): {
|
|
|
9
9
|
item: {
|
|
10
10
|
type?: string;
|
|
11
11
|
src?: string;
|
|
12
|
+
name?: string;
|
|
13
|
+
size?: number;
|
|
14
|
+
lastModified?: number;
|
|
12
15
|
};
|
|
13
16
|
index: number;
|
|
14
17
|
};
|
|
@@ -30,24 +33,42 @@ declare const __VLS_component: import('../../../../vue/dist/vue.esm-bundler.js')
|
|
|
30
33
|
(arrayLength: number): {
|
|
31
34
|
type?: string;
|
|
32
35
|
src?: string;
|
|
36
|
+
name?: string;
|
|
37
|
+
size?: number;
|
|
38
|
+
lastModified?: number;
|
|
33
39
|
}[];
|
|
34
40
|
(...items: {
|
|
35
41
|
type?: string;
|
|
36
42
|
src?: string;
|
|
43
|
+
name?: string;
|
|
44
|
+
size?: number;
|
|
45
|
+
lastModified?: number;
|
|
37
46
|
}[]): {
|
|
38
47
|
type?: string;
|
|
39
48
|
src?: string;
|
|
49
|
+
name?: string;
|
|
50
|
+
size?: number;
|
|
51
|
+
lastModified?: number;
|
|
40
52
|
}[];
|
|
41
53
|
new (arrayLength: number): {
|
|
42
54
|
type?: string;
|
|
43
55
|
src?: string;
|
|
56
|
+
name?: string;
|
|
57
|
+
size?: number;
|
|
58
|
+
lastModified?: number;
|
|
44
59
|
}[];
|
|
45
60
|
new (...items: {
|
|
46
61
|
type?: string;
|
|
47
62
|
src?: string;
|
|
63
|
+
name?: string;
|
|
64
|
+
size?: number;
|
|
65
|
+
lastModified?: number;
|
|
48
66
|
}[]): {
|
|
49
67
|
type?: string;
|
|
50
68
|
src?: string;
|
|
69
|
+
name?: string;
|
|
70
|
+
size?: number;
|
|
71
|
+
lastModified?: number;
|
|
51
72
|
}[];
|
|
52
73
|
isArray(arg: any): arg is any[];
|
|
53
74
|
readonly prototype: any[];
|
|
@@ -154,24 +175,42 @@ declare const __VLS_component: import('../../../../vue/dist/vue.esm-bundler.js')
|
|
|
154
175
|
(arrayLength: number): {
|
|
155
176
|
type?: string;
|
|
156
177
|
src?: string;
|
|
178
|
+
name?: string;
|
|
179
|
+
size?: number;
|
|
180
|
+
lastModified?: number;
|
|
157
181
|
}[];
|
|
158
182
|
(...items: {
|
|
159
183
|
type?: string;
|
|
160
184
|
src?: string;
|
|
185
|
+
name?: string;
|
|
186
|
+
size?: number;
|
|
187
|
+
lastModified?: number;
|
|
161
188
|
}[]): {
|
|
162
189
|
type?: string;
|
|
163
190
|
src?: string;
|
|
191
|
+
name?: string;
|
|
192
|
+
size?: number;
|
|
193
|
+
lastModified?: number;
|
|
164
194
|
}[];
|
|
165
195
|
new (arrayLength: number): {
|
|
166
196
|
type?: string;
|
|
167
197
|
src?: string;
|
|
198
|
+
name?: string;
|
|
199
|
+
size?: number;
|
|
200
|
+
lastModified?: number;
|
|
168
201
|
}[];
|
|
169
202
|
new (...items: {
|
|
170
203
|
type?: string;
|
|
171
204
|
src?: string;
|
|
205
|
+
name?: string;
|
|
206
|
+
size?: number;
|
|
207
|
+
lastModified?: number;
|
|
172
208
|
}[]): {
|
|
173
209
|
type?: string;
|
|
174
210
|
src?: string;
|
|
211
|
+
name?: string;
|
|
212
|
+
size?: number;
|
|
213
|
+
lastModified?: number;
|
|
175
214
|
}[];
|
|
176
215
|
isArray(arg: any): arg is any[];
|
|
177
216
|
readonly prototype: any[];
|
|
@@ -281,6 +320,9 @@ declare const __VLS_component: import('../../../../vue/dist/vue.esm-bundler.js')
|
|
|
281
320
|
modelValue: {
|
|
282
321
|
type?: string;
|
|
283
322
|
src?: string;
|
|
323
|
+
name?: string;
|
|
324
|
+
size?: number;
|
|
325
|
+
lastModified?: number;
|
|
284
326
|
}[];
|
|
285
327
|
name: string;
|
|
286
328
|
placeholder: string;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { defineComponent as L, ref as y, toRef as
|
|
1
|
+
import { defineComponent as L, ref as y, toRef as M, computed as N, watch as b, openBlock as u, createElementBlock as d, normalizeClass as h, unref as v, Fragment as V, renderList as P, renderSlot as S, createElementVNode as c, withModifiers as w, createVNode as p, Transition as T, withCtx as H, createCommentVNode as W } from "vue";
|
|
2
2
|
import k from "../../atoms/svg-icon/svg-icon.vue.js";
|
|
3
3
|
/* empty css */
|
|
4
4
|
import q from "../../atoms/input-file/input-file.vue.js";
|
|
@@ -10,7 +10,7 @@ import { uniqueId as F } from "../../../utilities/helpers.js";
|
|
|
10
10
|
const _ = ["src"], j = ["onClick"], x = ["onClick"], G = ["for"], J = ["innerHTML"], K = {
|
|
11
11
|
key: 0,
|
|
12
12
|
class: "file-upload__loading-spinner"
|
|
13
|
-
},
|
|
13
|
+
}, ne = /* @__PURE__ */ L({
|
|
14
14
|
__name: "file-upload",
|
|
15
15
|
props: {
|
|
16
16
|
modelValue: {
|
|
@@ -102,93 +102,96 @@ const _ = ["src"], j = ["onClick"], x = ["onClick"], G = ["for"], J = ["innerHTM
|
|
|
102
102
|
}
|
|
103
103
|
},
|
|
104
104
|
emits: ["update:modelValue", "update:src"],
|
|
105
|
-
setup(
|
|
106
|
-
const e =
|
|
105
|
+
setup(o, { emit: U }) {
|
|
106
|
+
const e = o, i = U, g = y(), m = y([]), n = y([]), { pending: $, uploadFile: B } = I(e), { toLocalUrl: D, revoke: z } = R(M(e, "localUrlFormat")), { isDragging: C } = E(g, {
|
|
107
107
|
enabled: () => e.dropFiles,
|
|
108
108
|
onDrop: (t) => {
|
|
109
|
-
|
|
109
|
+
m.value = t;
|
|
110
110
|
}
|
|
111
|
-
}), A =
|
|
111
|
+
}), A = N(() => e.modelValue?.length ? e.modelValue : e.src ? [{ type: "", src: e.src }] : n.value);
|
|
112
112
|
function f(t) {
|
|
113
|
-
const l = typeof t == "string" ? parseInt(t, 10) : t,
|
|
114
|
-
if (
|
|
115
|
-
const
|
|
116
|
-
l <
|
|
117
|
-
} else if (
|
|
118
|
-
const
|
|
119
|
-
i("update:modelValue",
|
|
113
|
+
const l = typeof t == "string" ? parseInt(t, 10) : t, a = Array.isArray(e.modelValue) && e.modelValue.length > 0, r = Array.isArray(n.value) && n.value.length > 0;
|
|
114
|
+
if (r && l < n.value.length && (z(n.value[l]?.src), n.value.splice(l, 1)), a) {
|
|
115
|
+
const s = [...e.modelValue];
|
|
116
|
+
l < s.length && s.splice(l, 1), i("update:modelValue", s), e.multiple || i("update:src", s[0]?.src || "");
|
|
117
|
+
} else if (r) {
|
|
118
|
+
const s = e.multiple ? n.value : n.value[0];
|
|
119
|
+
i("update:modelValue", s), e.multiple || i("update:src", n.value[0]?.src || "");
|
|
120
120
|
} else
|
|
121
121
|
i("update:modelValue", e.multiple ? [] : void 0), i("update:src", "");
|
|
122
|
-
|
|
122
|
+
m.value.splice(l, 1);
|
|
123
123
|
}
|
|
124
|
-
return b(() =>
|
|
124
|
+
return b(() => m.value, async (t) => {
|
|
125
125
|
const l = await Promise.all(
|
|
126
|
-
t.map(async (
|
|
127
|
-
src: e.toDataUrl ? await D(
|
|
128
|
-
type:
|
|
126
|
+
t.map(async (a) => ({
|
|
127
|
+
src: e.toDataUrl ? await D(a) : await B(a),
|
|
128
|
+
type: a.type,
|
|
129
|
+
name: a.name,
|
|
130
|
+
size: a.size,
|
|
131
|
+
lastModified: a.lastModified
|
|
129
132
|
}))
|
|
130
133
|
);
|
|
131
|
-
|
|
132
|
-
}, { deep: !0 }), b(() =>
|
|
134
|
+
n.value = l;
|
|
135
|
+
}, { deep: !0 }), b(() => n.value, async (t) => {
|
|
133
136
|
const l = e.multiple ? t : t[0];
|
|
134
137
|
i("update:modelValue", l), e.multiple || i("update:src", t[0] && t[0].src);
|
|
135
138
|
}, { deep: !0 }), (t, l) => (u(), d("div", {
|
|
136
139
|
ref_key: "root",
|
|
137
140
|
ref: g,
|
|
138
141
|
class: h(["file-upload", {
|
|
139
|
-
"has-dragging":
|
|
140
|
-
"is-dragging": v(
|
|
142
|
+
"has-dragging": o.dropFiles,
|
|
143
|
+
"is-dragging": v(C)
|
|
141
144
|
}])
|
|
142
145
|
}, [
|
|
143
|
-
(u(!0), d(V, null,
|
|
144
|
-
key:
|
|
145
|
-
class: h(
|
|
146
|
+
(u(!0), d(V, null, P(A.value, (a, r) => (u(), d("div", {
|
|
147
|
+
key: a.src,
|
|
148
|
+
class: h(o.enablePreview ? "file-upload__thumbnail" : "file-upload__reset")
|
|
146
149
|
}, [
|
|
147
150
|
S(t.$slots, "preview-item", {
|
|
148
|
-
bind: { item:
|
|
151
|
+
bind: { item: a, index: r },
|
|
149
152
|
on: { removeFile: f }
|
|
150
153
|
}, () => [
|
|
151
|
-
|
|
154
|
+
o.enablePreview ? (u(), d(V, { key: 0 }, [
|
|
152
155
|
c("img", {
|
|
153
|
-
src: `${
|
|
156
|
+
src: `${a.src}${o.previewWidth ? `?width=${o.previewWidth}` : ""}`,
|
|
154
157
|
class: "img-thumbnail rounded"
|
|
155
158
|
}, null, 8, _),
|
|
156
159
|
c("button", {
|
|
157
|
-
onClick: w((
|
|
160
|
+
onClick: w((s) => f(r), ["prevent"]),
|
|
158
161
|
class: "btn btn--close"
|
|
159
162
|
}, [
|
|
160
|
-
|
|
163
|
+
p(k, { symbol: "x" })
|
|
161
164
|
], 8, j)
|
|
162
165
|
], 64)) : (u(), d("button", {
|
|
163
166
|
key: 1,
|
|
164
|
-
onClick: w((
|
|
167
|
+
onClick: w((s) => f(r), ["prevent"]),
|
|
165
168
|
class: "btn btn--close btn-outline-contrast"
|
|
166
169
|
}, [
|
|
167
|
-
|
|
170
|
+
p(k, { symbol: "x" })
|
|
168
171
|
], 8, x))
|
|
169
172
|
])
|
|
170
173
|
], 2))), 128)),
|
|
171
|
-
|
|
172
|
-
modelValue:
|
|
173
|
-
"onUpdate:modelValue": l[0] || (l[0] = (
|
|
174
|
-
id:
|
|
175
|
-
name:
|
|
176
|
-
accept:
|
|
177
|
-
"max-file-size":
|
|
178
|
-
multiple:
|
|
174
|
+
p(q, {
|
|
175
|
+
modelValue: m.value,
|
|
176
|
+
"onUpdate:modelValue": l[0] || (l[0] = (a) => m.value = a),
|
|
177
|
+
id: o.id,
|
|
178
|
+
name: o.name,
|
|
179
|
+
accept: o.accept,
|
|
180
|
+
"max-file-size": o.maxFileSize,
|
|
181
|
+
multiple: o.multiple,
|
|
179
182
|
class: "d-none"
|
|
180
183
|
}, null, 8, ["modelValue", "id", "name", "accept", "max-file-size", "multiple"]),
|
|
181
184
|
c("label", {
|
|
182
|
-
for:
|
|
185
|
+
for: o.id,
|
|
183
186
|
class: "file-upload__label"
|
|
184
187
|
}, [
|
|
185
188
|
S(t.$slots, "button", {}, () => [
|
|
186
189
|
c("span", {
|
|
187
190
|
class: "btn btn-outline-contrast",
|
|
188
|
-
innerHTML: v(O)(
|
|
191
|
+
innerHTML: v(O)(o.label || t.$t("common.selectFile"))
|
|
189
192
|
}, null, 8, J)
|
|
190
193
|
]),
|
|
191
|
-
|
|
194
|
+
p(T, { name: "fade" }, {
|
|
192
195
|
default: H(() => [
|
|
193
196
|
v($) ? (u(), d("span", K, [...l[1] || (l[1] = [
|
|
194
197
|
c("span", {
|
|
@@ -206,5 +209,5 @@ const _ = ["src"], j = ["onClick"], x = ["onClick"], G = ["for"], J = ["innerHTM
|
|
|
206
209
|
}
|
|
207
210
|
});
|
|
208
211
|
export {
|
|
209
|
-
|
|
212
|
+
ne as default
|
|
210
213
|
};
|