@qxs-bns/components 0.0.5 → 0.0.6

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.
Files changed (43) hide show
  1. package/index.cjs +1 -1
  2. package/index.js +898 -13
  3. package/package.json +1 -1
  4. package/vendor.cjs +6 -0
  5. package/vendor.js +1377 -0
  6. package/dist/hooks/src/use-namespace/index.cjs +0 -1
  7. package/dist/hooks/src/use-namespace/index.js +0 -49
  8. package/package.json.cjs +0 -1
  9. package/package.json.js +0 -4
  10. package/src/components.cjs +0 -1
  11. package/src/components.js +0 -10
  12. package/src/defaults.cjs +0 -1
  13. package/src/defaults.js +0 -6
  14. package/src/file-upload/index.cjs +0 -1
  15. package/src/file-upload/index.js +0 -7
  16. package/src/file-upload/src/file-upload.vue.cjs +0 -1
  17. package/src/file-upload/src/file-upload.vue.js +0 -82
  18. package/src/file-upload/src/file-upload.vue2.cjs +0 -1
  19. package/src/file-upload/src/file-upload.vue2.js +0 -4
  20. package/src/fixed-action-bar/index.cjs +0 -1
  21. package/src/fixed-action-bar/index.js +0 -7
  22. package/src/fixed-action-bar/src/fixed-action-bar.vue.cjs +0 -1
  23. package/src/fixed-action-bar/src/fixed-action-bar.vue.js +0 -63
  24. package/src/fixed-action-bar/src/fixed-action-bar.vue2.cjs +0 -1
  25. package/src/fixed-action-bar/src/fixed-action-bar.vue2.js +0 -4
  26. package/src/image-upload/index.cjs +0 -1
  27. package/src/image-upload/index.js +0 -7
  28. package/src/image-upload/src/image-upload.vue.cjs +0 -1
  29. package/src/image-upload/src/image-upload.vue.js +0 -164
  30. package/src/image-upload/src/image-upload.vue2.cjs +0 -1
  31. package/src/image-upload/src/image-upload.vue2.js +0 -4
  32. package/src/make-installer.cjs +0 -1
  33. package/src/make-installer.js +0 -13
  34. package/src/photo-crop-tool/index.cjs +0 -1
  35. package/src/photo-crop-tool/index.js +0 -7
  36. package/src/photo-crop-tool/src/composables.cjs +0 -1
  37. package/src/photo-crop-tool/src/composables.js +0 -33
  38. package/src/photo-crop-tool/src/photo-crop-tool.vue.cjs +0 -1
  39. package/src/photo-crop-tool/src/photo-crop-tool.vue.js +0 -224
  40. package/src/photo-crop-tool/src/photo-crop-tool.vue2.cjs +0 -1
  41. package/src/photo-crop-tool/src/photo-crop-tool.vue2.js +0 -4
  42. package/src/withInstall.cjs +0 -1
  43. package/src/withInstall.js +0 -9
package/index.js CHANGED
@@ -1,15 +1,900 @@
1
- import o from "./src/defaults.js";
2
- import { QxsFileUpload as x } from "./src/file-upload/index.js";
3
- import { QxsFixedActionBar as i } from "./src/fixed-action-bar/index.js";
4
- import { QxsImageUpload as n } from "./src/image-upload/index.js";
5
- import { QxsPhotoCropTool as f } from "./src/photo-crop-tool/index.js";
6
- const t = o.install, e = o.version;
1
+ var Ue = Object.defineProperty, Fe = Object.defineProperties;
2
+ var Pe = Object.getOwnPropertyDescriptors;
3
+ var se = Object.getOwnPropertySymbols;
4
+ var Se = Object.prototype.hasOwnProperty, Ee = Object.prototype.propertyIsEnumerable;
5
+ var ze = (e, l, t) => l in e ? Ue(e, l, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[l] = t, te = (e, l) => {
6
+ for (var t in l || (l = {}))
7
+ Se.call(l, t) && ze(e, t, l[t]);
8
+ if (se)
9
+ for (var t of se(l))
10
+ Ee.call(l, t) && ze(e, t, l[t]);
11
+ return e;
12
+ }, he = (e, l) => Fe(e, Pe(l));
13
+ var ge = (e, l) => {
14
+ var t = {};
15
+ for (var o in e)
16
+ Se.call(e, o) && l.indexOf(o) < 0 && (t[o] = e[o]);
17
+ if (e != null && se)
18
+ for (var o of se(e))
19
+ l.indexOf(o) < 0 && Ee.call(e, o) && (t[o] = e[o]);
20
+ return t;
21
+ };
22
+ var Be = (e, l, t) => new Promise((o, r) => {
23
+ var i = (v) => {
24
+ try {
25
+ d(t.next(v));
26
+ } catch (s) {
27
+ r(s);
28
+ }
29
+ }, p = (v) => {
30
+ try {
31
+ d(t.throw(v));
32
+ } catch (s) {
33
+ r(s);
34
+ }
35
+ }, d = (v) => v.done ? o(v.value) : Promise.resolve(v.value).then(i, p);
36
+ d((t = t.apply(e, l)).next());
37
+ });
38
+ import { getCurrentInstance as ue, inject as De, ref as y, computed as H, unref as _, defineComponent as ce, resolveComponent as U, openBlock as V, createBlock as we, normalizeClass as W, withCtx as F, createElementBlock as D, createElementVNode as R, createVNode as T, createCommentVNode as ye, createTextVNode as je, isRef as Qe, toRefs as Ye, customRef as He, onMounted as ne, nextTick as Oe, watch as j, getCurrentScope as Xe, onScopeDispose as Ge, shallowRef as qe, onUpdated as Ke, useAttrs as Je, onUnmounted as Te, Fragment as We, normalizeStyle as P, renderSlot as Ze, toDisplayString as be, withModifiers as Me, withDirectives as et, vShow as tt } from "vue";
39
+ import { u as ot, E as oe, p as lt, z as nt, d as it } from "./vendor.js";
40
+ function de(e, l) {
41
+ return e.install = (t) => {
42
+ for (const o of [e, ...Object.values({})])
43
+ t.component(o.name, o);
44
+ }, e;
45
+ }
46
+ const me = "qxs", at = "is-";
47
+ function G(e, l, t, o, r) {
48
+ let i = `${e}-${l}`;
49
+ return t && (i += `-${t}`), o && (i += `__${o}`), r && (i += `--${r}`), i;
50
+ }
51
+ const st = Symbol("namespaceContextKey");
52
+ function rt(e) {
53
+ const l = ue() ? De(st, y(me)) : y(me);
54
+ return H(() => _(l) || me);
55
+ }
56
+ function pe(e, l) {
57
+ const t = rt();
58
+ return {
59
+ namespace: t,
60
+ b: (o = "") => G(t.value, e, o, "", ""),
61
+ e: (o) => o ? G(t.value, e, "", o, "") : "",
62
+ m: (o) => o ? G(t.value, e, "", "", o) : "",
63
+ be: (o, r) => o && r ? G(t.value, e, o, r, "") : "",
64
+ em: (o, r) => o && r ? G(t.value, e, "", o, r) : "",
65
+ bm: (o, r) => o && r ? G(t.value, e, o, "", r) : "",
66
+ bem: (o, r, i) => o && r && i ? G(t.value, e, o, r, i) : "",
67
+ is: (o, ...r) => {
68
+ const i = r.length >= 1 ? r[0] : !0;
69
+ return o && i ? `${at}${o}` : "";
70
+ },
71
+ // css
72
+ cssVar: (o) => {
73
+ const r = {};
74
+ for (const i in o)
75
+ o[i] && (r[`--${t.value}-${i}`] = o[i]);
76
+ return r;
77
+ },
78
+ cssVarName: (o) => `--${t.value}-${o}`,
79
+ cssVarBlock: (o) => {
80
+ const r = {};
81
+ for (const i in o)
82
+ o[i] && (r[`--${t.value}-${e}-${i}`] = o[i]);
83
+ return r;
84
+ },
85
+ cssVarBlockName: (o) => `--${t.value}-${e}-${o}`
86
+ };
87
+ }
88
+ const ut = { class: "slot" }, ct = {
89
+ key: 0,
90
+ class: "el-upload__tip"
91
+ }, dt = { style: { display: "inline-block" } }, pt = /* @__PURE__ */ ce({
92
+ name: "QxsFileUpload",
93
+ __name: "file-upload",
94
+ props: {
95
+ action: {},
96
+ headers: {},
97
+ data: {},
98
+ name: { default: "file" },
99
+ size: { default: 20 },
100
+ max: { default: 3 },
101
+ accept: { default: "zip,rar" },
102
+ files: { default: () => [] },
103
+ notip: { type: Boolean, default: !1 },
104
+ ext: {}
105
+ },
106
+ emits: ["onSuccess"],
107
+ setup(e, { emit: l }) {
108
+ const t = e, o = l, r = pe("file-upload"), i = H(() => t.accept.split(",").map((s) => s.split("/").pop())), p = (s) => {
109
+ var a;
110
+ const u = (a = s.name.split(".").at(-1)) != null ? a : "", c = i.value.includes(u), n = s.size / 1024 / 1024 < t.size;
111
+ return c || oe.error(`上传文件只支持 ${i.value.join(" / ")} 格式!`), n || oe.error(`上传文件大小不能超过 ${t.size}MB!`), c && n;
112
+ }, d = () => {
113
+ oe.warning("文件上传超过限制");
114
+ }, v = (s, f, u) => {
115
+ o("onSuccess", s, f, u);
116
+ };
117
+ return (s, f) => {
118
+ const u = U("el-icon"), c = U("el-alert"), n = U("el-upload");
119
+ return V(), we(n, {
120
+ headers: s.headers,
121
+ action: s.action,
122
+ data: s.data,
123
+ name: s.name,
124
+ "before-upload": p,
125
+ "on-exceed": d,
126
+ "on-success": v,
127
+ "file-list": s.files,
128
+ limit: s.max,
129
+ drag: "",
130
+ class: W(_(r).e("control"))
131
+ }, {
132
+ tip: F(() => [
133
+ s.notip ? ye("", !0) : (V(), D("div", ct, [
134
+ R("div", dt, [
135
+ T(c, {
136
+ title: `上传文件支持 ${i.value.join(" / ")} 格式,单个文件大小不超过 ${s.size}MB,且文件数量不超过 ${s.max} 个`,
137
+ type: "info",
138
+ "show-icon": "",
139
+ closable: !1
140
+ }, null, 8, ["title"])
141
+ ])
142
+ ]))
143
+ ]),
144
+ default: F(() => [
145
+ R("div", ut, [
146
+ T(u, { class: "el-icon--upload" }, {
147
+ default: F(() => [
148
+ T(_(ot))
149
+ ]),
150
+ _: 1
151
+ }),
152
+ f[0] || (f[0] = R("div", { class: "el-upload__text" }, [
153
+ je(" 将文件拖到此处,或"),
154
+ R("em", null, "点击上传")
155
+ ], -1))
156
+ ])
157
+ ]),
158
+ _: 1
159
+ }, 8, ["headers", "action", "data", "name", "file-list", "limit", "class"]);
160
+ };
161
+ }
162
+ }), ft = de(pt);
163
+ function vt(e, l) {
164
+ let t, o, r;
165
+ const i = y(!0), p = () => {
166
+ i.value = !0, r();
167
+ };
168
+ j(e, p, { flush: "sync" });
169
+ const d = typeof l == "function" ? l : l.get, v = typeof l == "function" ? void 0 : l.set, s = He((f, u) => (o = f, r = u, {
170
+ get() {
171
+ return i.value && (t = d(), i.value = !1), o(), t;
172
+ },
173
+ set(c) {
174
+ v == null || v(c);
175
+ }
176
+ }));
177
+ return Object.isExtensible(s) && (s.trigger = p), s;
178
+ }
179
+ function xe(e) {
180
+ return Xe() ? (Ge(e), !0) : !1;
181
+ }
182
+ function E(e) {
183
+ return typeof e == "function" ? e() : _(e);
184
+ }
185
+ const Ie = typeof window != "undefined" && typeof document != "undefined";
186
+ typeof WorkerGlobalScope != "undefined" && globalThis instanceof WorkerGlobalScope;
187
+ const ht = (e) => e != null, gt = Object.prototype.toString, mt = (e) => gt.call(e) === "[object Object]", wt = () => {
188
+ };
189
+ function yt(e) {
190
+ return ue();
191
+ }
192
+ function bt(e, l = {}) {
193
+ if (!Qe(e))
194
+ return Ye(e);
195
+ const t = Array.isArray(e.value) ? Array.from({ length: e.value.length }) : {};
196
+ for (const o in e.value)
197
+ t[o] = He(() => ({
198
+ get() {
199
+ return e.value[o];
200
+ },
201
+ set(r) {
202
+ var i;
203
+ if ((i = E(l.replaceRef)) != null ? i : !0)
204
+ if (Array.isArray(e.value)) {
205
+ const d = [...e.value];
206
+ d[o] = r, e.value = d;
207
+ } else {
208
+ const d = he(te({}, e.value), { [o]: r });
209
+ Object.setPrototypeOf(d, Object.getPrototypeOf(e.value)), e.value = d;
210
+ }
211
+ else
212
+ e.value[o] = r;
213
+ }
214
+ }));
215
+ return t;
216
+ }
217
+ function $e(e, l = !0, t) {
218
+ yt() ? ne(e, t) : l ? e() : Oe(e);
219
+ }
220
+ function A(e) {
221
+ var l;
222
+ const t = E(e);
223
+ return (l = t == null ? void 0 : t.$el) != null ? l : t;
224
+ }
225
+ const ie = Ie ? window : void 0;
226
+ function le(...e) {
227
+ let l, t, o, r;
228
+ if (typeof e[0] == "string" || Array.isArray(e[0]) ? ([t, o, r] = e, l = ie) : [l, t, o, r] = e, !l)
229
+ return wt;
230
+ Array.isArray(t) || (t = [t]), Array.isArray(o) || (o = [o]);
231
+ const i = [], p = () => {
232
+ i.forEach((f) => f()), i.length = 0;
233
+ }, d = (f, u, c, n) => (f.addEventListener(u, c, n), () => f.removeEventListener(u, c, n)), v = j(
234
+ () => [A(l), E(r)],
235
+ ([f, u]) => {
236
+ if (p(), !f)
237
+ return;
238
+ const c = mt(u) ? te({}, u) : u;
239
+ i.push(
240
+ ...t.flatMap((n) => o.map((a) => d(f, n, a, c)))
241
+ );
242
+ },
243
+ { immediate: !0, flush: "post" }
244
+ ), s = () => {
245
+ v(), p();
246
+ };
247
+ return xe(s), s;
248
+ }
249
+ function xt() {
250
+ const e = y(!1), l = ue();
251
+ return l && ne(() => {
252
+ e.value = !0;
253
+ }, l), e;
254
+ }
255
+ function Ve(e) {
256
+ const l = xt();
257
+ return H(() => (l.value, !!e()));
258
+ }
259
+ function $t(e, l, t = {}) {
260
+ const c = t, { window: o = ie } = c, r = ge(c, ["window"]);
261
+ let i;
262
+ const p = Ve(() => o && "MutationObserver" in o), d = () => {
263
+ i && (i.disconnect(), i = void 0);
264
+ }, v = H(() => {
265
+ const n = E(e), a = (Array.isArray(n) ? n : [n]).map(A).filter(ht);
266
+ return new Set(a);
267
+ }), s = j(
268
+ () => v.value,
269
+ (n) => {
270
+ d(), p.value && n.size && (i = new MutationObserver(l), n.forEach((a) => i.observe(a, r)));
271
+ },
272
+ { immediate: !0, flush: "post" }
273
+ ), f = () => i == null ? void 0 : i.takeRecords(), u = () => {
274
+ d(), s();
275
+ };
276
+ return xe(u), {
277
+ isSupported: p,
278
+ stop: u,
279
+ takeRecords: f
280
+ };
281
+ }
282
+ function _t(e) {
283
+ const l = ue(), t = vt(
284
+ () => null,
285
+ () => l.proxy.$el
286
+ );
287
+ return Ke(t.trigger), ne(t.trigger), t;
288
+ }
289
+ function Rt(e, l = {}) {
290
+ var t, o;
291
+ const {
292
+ pointerTypes: r,
293
+ preventDefault: i,
294
+ stopPropagation: p,
295
+ exact: d,
296
+ onMove: v,
297
+ onEnd: s,
298
+ onStart: f,
299
+ initialValue: u,
300
+ axis: c = "both",
301
+ draggingElement: n = ie,
302
+ containerElement: a,
303
+ handle: b = e
304
+ } = l, w = y(
305
+ (t = E(u)) != null ? t : { x: 0, y: 0 }
306
+ ), O = y(), z = (g) => r ? r.includes(g.pointerType) : !0, B = (g) => {
307
+ E(i) && g.preventDefault(), E(p) && g.stopPropagation();
308
+ }, fe = (g) => {
309
+ var N;
310
+ if (g.button !== 0 || E(l.disabled) || !z(g) || E(d) && g.target !== E(e))
311
+ return;
312
+ const C = E(a), L = (N = C == null ? void 0 : C.getBoundingClientRect) == null ? void 0 : N.call(C), S = E(e).getBoundingClientRect(), J = {
313
+ x: g.clientX - (C ? S.left - L.left + C.scrollLeft : S.left),
314
+ y: g.clientY - (C ? S.top - L.top + C.scrollTop : S.top)
315
+ };
316
+ (f == null ? void 0 : f(J, g)) !== !1 && (O.value = J, B(g));
317
+ }, K = (g) => {
318
+ if (E(l.disabled) || !z(g) || !O.value)
319
+ return;
320
+ const N = E(a), C = E(e).getBoundingClientRect();
321
+ let { x: L, y: S } = w.value;
322
+ (c === "x" || c === "both") && (L = g.clientX - O.value.x, N && (L = Math.min(Math.max(0, L), N.scrollWidth - C.width))), (c === "y" || c === "both") && (S = g.clientY - O.value.y, N && (S = Math.min(Math.max(0, S), N.scrollHeight - C.height))), w.value = {
323
+ x: L,
324
+ y: S
325
+ }, v == null || v(w.value, g), B(g);
326
+ }, ve = (g) => {
327
+ E(l.disabled) || !z(g) || O.value && (O.value = void 0, s == null || s(w.value, g), B(g));
328
+ };
329
+ if (Ie) {
330
+ const g = { capture: (o = l.capture) != null ? o : !0 };
331
+ le(b, "pointerdown", fe, g), le(n, "pointermove", K, g), le(n, "pointerup", ve, g);
332
+ }
333
+ return he(te({}, bt(w)), {
334
+ position: w,
335
+ isDragging: H(() => !!O.value),
336
+ style: H(
337
+ () => `left:${w.value.x}px;top:${w.value.y}px;`
338
+ )
339
+ });
340
+ }
341
+ function Ae(e, l, t = {}) {
342
+ const u = t, { window: o = ie } = u, r = ge(u, ["window"]);
343
+ let i;
344
+ const p = Ve(() => o && "ResizeObserver" in o), d = () => {
345
+ i && (i.disconnect(), i = void 0);
346
+ }, v = H(() => Array.isArray(e) ? e.map((c) => A(c)) : [A(e)]), s = j(
347
+ v,
348
+ (c) => {
349
+ if (d(), p.value && o) {
350
+ i = new ResizeObserver(l);
351
+ for (const n of c)
352
+ n && i.observe(n, r);
353
+ }
354
+ },
355
+ { immediate: !0, flush: "post" }
356
+ ), f = () => {
357
+ d(), s();
358
+ };
359
+ return xe(f), {
360
+ isSupported: p,
361
+ stop: f
362
+ };
363
+ }
364
+ function Ct(e, l = {}) {
365
+ const {
366
+ reset: t = !0,
367
+ windowResize: o = !0,
368
+ windowScroll: r = !0,
369
+ immediate: i = !0
370
+ } = l, p = y(0), d = y(0), v = y(0), s = y(0), f = y(0), u = y(0), c = y(0), n = y(0);
371
+ function a() {
372
+ const b = A(e);
373
+ if (!b) {
374
+ t && (p.value = 0, d.value = 0, v.value = 0, s.value = 0, f.value = 0, u.value = 0, c.value = 0, n.value = 0);
375
+ return;
376
+ }
377
+ const w = b.getBoundingClientRect();
378
+ p.value = w.height, d.value = w.bottom, v.value = w.left, s.value = w.right, f.value = w.top, u.value = w.width, c.value = w.x, n.value = w.y;
379
+ }
380
+ return Ae(e, a), j(() => A(e), (b) => !b && a()), $t(e, a, {
381
+ attributeFilter: ["style", "class"]
382
+ }), r && le("scroll", a, { capture: !0, passive: !0 }), o && le("resize", a, { passive: !0 }), $e(() => {
383
+ i && a();
384
+ }), {
385
+ height: p,
386
+ bottom: d,
387
+ left: v,
388
+ right: s,
389
+ top: f,
390
+ width: u,
391
+ x: c,
392
+ y: n,
393
+ update: a
394
+ };
395
+ }
396
+ function re(e, l = { width: 0, height: 0 }, t = {}) {
397
+ const { window: o = ie, box: r = "content-box" } = t, i = H(() => {
398
+ var u, c;
399
+ return (c = (u = A(e)) == null ? void 0 : u.namespaceURI) == null ? void 0 : c.includes("svg");
400
+ }), p = y(l.width), d = y(l.height), { stop: v } = Ae(
401
+ e,
402
+ ([u]) => {
403
+ const c = r === "border-box" ? u.borderBoxSize : r === "content-box" ? u.contentBoxSize : u.devicePixelContentBoxSize;
404
+ if (o && i.value) {
405
+ const n = A(e);
406
+ if (n) {
407
+ const a = n.getBoundingClientRect();
408
+ p.value = a.width, d.value = a.height;
409
+ }
410
+ } else if (c) {
411
+ const n = Array.isArray(c) ? c : [c];
412
+ p.value = n.reduce((a, { inlineSize: b }) => a + b, 0), d.value = n.reduce((a, { blockSize: b }) => a + b, 0);
413
+ } else
414
+ p.value = u.contentRect.width, d.value = u.contentRect.height;
415
+ },
416
+ t
417
+ );
418
+ $e(() => {
419
+ const u = A(e);
420
+ u && (p.value = "offsetWidth" in u ? u.offsetWidth : l.width, d.value = "offsetHeight" in u ? u.offsetHeight : l.height);
421
+ });
422
+ const s = j(
423
+ () => A(e),
424
+ (u) => {
425
+ p.value = u ? l.width : 0, d.value = u ? l.height : 0;
426
+ }
427
+ );
428
+ function f() {
429
+ v(), s();
430
+ }
431
+ return {
432
+ width: p,
433
+ height: d,
434
+ stop: f
435
+ };
436
+ }
437
+ function kt(e = _t()) {
438
+ const l = qe(), t = () => {
439
+ const o = A(e);
440
+ o && (l.value = o.parentElement);
441
+ };
442
+ return $e(t), j(() => E(e), t), l;
443
+ }
444
+ const zt = /* @__PURE__ */ ce({
445
+ name: "QxsFixedActionBar",
446
+ inheritAttrs: !1,
447
+ __name: "fixed-action-bar",
448
+ props: {
449
+ padding: {
450
+ type: String,
451
+ default: "8px"
452
+ }
453
+ },
454
+ setup(e) {
455
+ const l = e, t = pe("fixed-action-bar"), o = Je(), r = y(!1), i = y(null), p = y(null), d = kt(p), { height: v } = re(i, void 0, { box: "border-box" }), { left: s } = Ct(d), { width: f } = re(d, void 0, { box: "border-box" });
456
+ function u() {
457
+ const n = window.scrollY || document.documentElement.scrollTop, a = window.innerHeight || document.documentElement.clientHeight, b = document.documentElement.scrollHeight;
458
+ r.value = Math.ceil(n + a) >= b;
459
+ }
460
+ ne(() => {
461
+ u(), window.addEventListener("scroll", u);
462
+ }), Te(() => {
463
+ window.removeEventListener("scroll", u);
464
+ });
465
+ const c = H(() => te({
466
+ width: `${f || 0}px`,
467
+ left: `${s}px`,
468
+ class: `${r.value ? "" : t.is("shadow")} ${o.class || ""}`
469
+ }, t.cssVarBlock({
470
+ "actionbar-padding": `${l.padding}`
471
+ })));
472
+ return (n, a) => (V(), D(We, null, [
473
+ R("div", {
474
+ ref_key: "placeholderRef",
475
+ ref: p,
476
+ style: P(`width: 100%; height: ${_(v)}px`)
477
+ }, null, 4),
478
+ R("div", {
479
+ ref_key: "actionbar",
480
+ ref: i,
481
+ style: P(c.value),
482
+ class: W([c.value.class, _(t).e("actionbar")]),
483
+ "data-fixed-calc-width": ""
484
+ }, [
485
+ Ze(n.$slots, "default")
486
+ ], 6)
487
+ ], 64));
488
+ }
489
+ }), St = de(zt), Et = {
490
+ key: 1,
491
+ class: "image"
492
+ }, Bt = { class: "mask" }, Mt = { class: "actions" }, Ht = {
493
+ key: 0,
494
+ class: "el-upload__tip-text"
495
+ }, Ot = { style: { display: "inline-block" } }, Tt = /* @__PURE__ */ ce({
496
+ name: "QxsImageUpload",
497
+ __name: "image-upload",
498
+ props: {
499
+ action: {},
500
+ headers: {},
501
+ data: {},
502
+ name: { default: "file" },
503
+ url: { default: "" },
504
+ size: { default: 20 },
505
+ width: { default: 160 },
506
+ accept: { default: "image/jpeg,image/jpg,image/png,image/gif" },
507
+ height: { default: 90 },
508
+ placeholder: { default: "点击上传图片" },
509
+ notip: { type: Boolean, default: !1 },
510
+ tipText: {},
511
+ beforeUpload: {}
512
+ },
513
+ emits: ["update:url", "onSuccess"],
514
+ setup(e, { emit: l }) {
515
+ const t = e, o = l, r = pe("image-upload"), i = y({
516
+ imageViewerVisible: !1,
517
+ progress: {
518
+ preview: "",
519
+ percent: 0
520
+ }
521
+ }), p = H(() => t.accept.split(",").map((n) => n.split("/").pop()));
522
+ function d() {
523
+ i.value.imageViewerVisible = !0;
524
+ }
525
+ function v() {
526
+ i.value.imageViewerVisible = !1;
527
+ }
528
+ function s() {
529
+ o("update:url", "");
530
+ }
531
+ const f = (n) => {
532
+ var z;
533
+ const b = (z = n.name.split(".").at(-1)) != null ? z : "", w = p.value.includes(b), O = n.size / 1024 / 1024 < t.size;
534
+ return w ? O ? i.value.progress.preview = URL.createObjectURL(n) : oe.error(`上传图片大小不能超过 ${t.size}MB!`) : oe.error(`上传图片只支持${p.value.join(" / ")}格式!`), w && O && (!t.beforeUpload || t.beforeUpload(n));
535
+ }, u = (n) => {
536
+ i.value.progress.percent = ~~n.percent;
537
+ }, c = (...n) => {
538
+ i.value.progress.preview = "", i.value.progress.percent = 0, o("onSuccess", ...n);
539
+ };
540
+ return (n, a) => {
541
+ const b = U("el-icon"), w = U("el-image"), O = U("el-progress"), z = U("el-upload"), B = U("el-image-viewer");
542
+ return V(), D("div", {
543
+ class: W(_(r).e("upload-container"))
544
+ }, [
545
+ T(z, {
546
+ "show-file-list": !1,
547
+ headers: n.headers,
548
+ action: n.action,
549
+ data: n.data,
550
+ name: n.name,
551
+ "before-upload": f,
552
+ "on-progress": u,
553
+ "on-success": c,
554
+ drag: "",
555
+ accept: n.accept,
556
+ class: W(_(r).e("image-upload"))
557
+ }, {
558
+ default: F(() => [
559
+ n.url === "" ? (V(), we(w, {
560
+ key: 0,
561
+ src: n.url === "" ? n.placeholder : n.url,
562
+ style: P(`width:${n.width}px;height:${n.height}px;`),
563
+ fit: "fill"
564
+ }, {
565
+ error: F(() => [
566
+ R("div", {
567
+ class: "image-slot",
568
+ style: P(`width:${n.width}px;height:${n.height}px;`)
569
+ }, [
570
+ T(b, null, {
571
+ default: F(() => [
572
+ T(_(lt))
573
+ ]),
574
+ _: 1
575
+ }),
576
+ R("p", null, be(n.placeholder), 1)
577
+ ], 4)
578
+ ]),
579
+ _: 1
580
+ }, 8, ["src", "style"])) : (V(), D("div", Et, [
581
+ T(w, {
582
+ src: n.url,
583
+ style: P(`width:${n.width}px;height:${n.height}px;`),
584
+ fit: "fill"
585
+ }, null, 8, ["src", "style"]),
586
+ R("div", Bt, [
587
+ R("div", Mt, [
588
+ R("span", {
589
+ title: "预览",
590
+ onClick: Me(d, ["stop"])
591
+ }, [
592
+ T(b, null, {
593
+ default: F(() => [
594
+ T(_(nt))
595
+ ]),
596
+ _: 1
597
+ })
598
+ ]),
599
+ R("span", {
600
+ title: "移除",
601
+ onClick: Me(s, ["stop"])
602
+ }, [
603
+ T(b, null, {
604
+ default: F(() => [
605
+ T(_(it))
606
+ ]),
607
+ _: 1
608
+ })
609
+ ])
610
+ ])
611
+ ])
612
+ ])),
613
+ et(R("div", {
614
+ class: "progress",
615
+ style: P(`width:${n.width}px;height:${n.height}px;`)
616
+ }, [
617
+ T(w, {
618
+ src: i.value.progress.preview,
619
+ style: P(`width:${n.width}px;height:${n.height}px;`),
620
+ fit: "fill"
621
+ }, null, 8, ["src", "style"]),
622
+ T(O, {
623
+ type: "circle",
624
+ width: Math.min(n.width, n.height) * 0.8,
625
+ percentage: i.value.progress.percent
626
+ }, null, 8, ["width", "percentage"])
627
+ ], 4), [
628
+ [tt, n.url === "" && i.value.progress.percent]
629
+ ])
630
+ ]),
631
+ _: 1
632
+ }, 8, ["headers", "action", "data", "name", "accept", "class"]),
633
+ n.notip ? ye("", !0) : (V(), D("div", Ht, [
634
+ R("div", Ot, be(n.tipText || `上传图片支持 ${p.value.join(" / ")} 格式,且图片大小不超过 ${n.size}MB,建议图片尺寸为 ${n.width}*${n.height}`), 1)
635
+ ])),
636
+ i.value.imageViewerVisible ? (V(), we(B, {
637
+ key: 1,
638
+ "url-list": [n.url],
639
+ teleported: "",
640
+ onClose: v
641
+ }, null, 8, ["url-list"])) : ye("", !0)
642
+ ], 2);
643
+ };
644
+ }
645
+ }), Wt = de(Tt);
646
+ function It(e) {
647
+ const l = y(null);
648
+ return e && (l.value = e.getContext("2d")), {
649
+ clearCanvas: () => {
650
+ l.value && l.value.clearRect(0, 0, e.width, e.height);
651
+ },
652
+ drawColor: (p, d, v, s, f) => {
653
+ l.value && (l.value.fillStyle = f, l.value.fillRect(p, d, v, s));
654
+ },
655
+ drawImage: (p, d, v, s, f) => {
656
+ l.value.drawImage(p, d, v, s, f);
657
+ },
658
+ cropCanvas: (p, d, v, s) => new Promise((f) => {
659
+ if (l.value) {
660
+ const u = document.createElement("canvas");
661
+ u.width = v, u.height = s;
662
+ const c = u.getContext("2d");
663
+ c ? (c.drawImage(e, p, d, v, s, 0, 0, v, s), u.toBlob((n) => {
664
+ if (n) {
665
+ const a = new File([n], "cropped_image.png", { type: "image/png" });
666
+ f(a);
667
+ } else
668
+ f(null);
669
+ }, "image/png")) : f(null);
670
+ } else
671
+ f(null);
672
+ })
673
+ };
674
+ }
675
+ const Vt = ["src"], At = /* @__PURE__ */ ce({
676
+ name: "QxsPhotoCropTool",
677
+ __name: "photo-crop-tool",
678
+ props: {
679
+ imgFile: {
680
+ type: Object,
681
+ default: () => null
682
+ },
683
+ aspectRatio: {
684
+ type: String,
685
+ default: () => "16 / 9"
686
+ },
687
+ defaultWidth: {
688
+ type: Number,
689
+ default: () => 320
690
+ },
691
+ defaultHeight: {
692
+ type: Number,
693
+ default: () => 180
694
+ },
695
+ /**
696
+ * free 自由缩放
697
+ * fixed 固定比例缩放
698
+ */
699
+ zoomType: {
700
+ type: String,
701
+ default: () => "fixed"
702
+ }
703
+ },
704
+ setup(e, { expose: l }) {
705
+ const t = e;
706
+ let o = 0, r = 0, i = 0, p = 0;
707
+ const d = pe("photo-crop-tool"), v = y(null), s = y(null), f = y(null), u = y(""), c = y(""), n = y({
708
+ x: 0,
709
+ y: 0
710
+ }), a = y({
711
+ width: t.defaultWidth,
712
+ height: t.defaultHeight,
713
+ x: 0,
714
+ y: 0
715
+ }), { width: b, height: w } = re(v), { width: O } = re(f), { x: z, y: B, style: fe } = Rt(v, {
716
+ containerElement: s,
717
+ draggingElement: v,
718
+ disabled: H(() => !!c.value),
719
+ exact: !0,
720
+ initialValue: n
721
+ }), K = H(() => t.imgFile ? URL.createObjectURL(t.imgFile) : "");
722
+ j(() => t.imgFile, (h) => {
723
+ h && !h.type.startsWith("image/") ? u.value = "文件类型错误" : u.value = "";
724
+ });
725
+ const ve = H(() => {
726
+ var h;
727
+ return (((h = f.value) == null ? void 0 : h.naturalWidth) || 0) / O.value;
728
+ }), g = H(() => {
729
+ const h = {
730
+ left: 0,
731
+ top: 0
732
+ };
733
+ return c.value === "bottom-right" ? (h.left = a.value.x, h.top = a.value.y) : c.value === "top-left" ? (h.left = a.value.x - b.value, h.top = a.value.y - w.value) : c.value === "top-right" ? (h.top = a.value.y - w.value, h.left = a.value.x) : c.value === "bottom-left" && (h.left = a.value.x - b.value, h.top = a.value.y), h;
734
+ }), N = H(() => {
735
+ const { aspectRatio: h } = t, m = {
736
+ width: `${a.value.width || t.defaultWidth}`,
737
+ height: `${a.value.height || t.defaultHeight}`,
738
+ "aspect-ratio": h,
739
+ top: `${g.value.top}px`,
740
+ left: `${g.value.left}px`
741
+ };
742
+ return t.zoomType === "free" ? delete m["aspect-ratio"] : t.zoomType === "fixed" && delete m.height, d.cssVarBlock(m);
743
+ });
744
+ function C(h) {
745
+ return h * ve.value;
746
+ }
747
+ function L() {
748
+ return Be(this, arguments, function* (h = f.value) {
749
+ var Z, ee;
750
+ let m = "transparent";
751
+ s.value && (m = window.getComputedStyle(s.value).backgroundColor);
752
+ const $ = document.createElement("canvas");
753
+ $.width = C(((Z = s.value) == null ? void 0 : Z.clientWidth) || 0), $.height = C(((ee = s.value) == null ? void 0 : ee.clientHeight) || 0);
754
+ const { drawImage: q, cropCanvas: Q, drawColor: Y } = It($);
755
+ return Y(0, 0, $.width, $.height, m), q(h, C(h.offsetLeft), C(h.offsetTop), h.naturalWidth, h.naturalHeight), yield Q(C(z.value), C(B.value), C(b.value), C(w.value));
756
+ });
757
+ }
758
+ function S(h, m) {
759
+ var Q, Y;
760
+ const $ = ((Q = s.value) == null ? void 0 : Q.clientWidth) || 1 / 0, q = ((Y = s.value) == null ? void 0 : Y.clientHeight) || 1 / 0;
761
+ return {
762
+ width: Math.min(Math.max(h, 0), $),
763
+ height: Math.min(Math.max(m, 0), q)
764
+ };
765
+ }
766
+ function J(h) {
767
+ var q, Q, Y, Z, ee, Re, Ce, ke;
768
+ const m = h.clientX - o, $ = h.clientY - r;
769
+ if (c.value === "bottom-right") {
770
+ if (t.zoomType === "free") {
771
+ const { width: k, height: x } = S(i + m, p + $);
772
+ a.value.width = k, a.value.height = x;
773
+ } else if (t.zoomType === "fixed") {
774
+ const k = Number.parseFloat(t.aspectRatio.split(" / ")[0]) / Number.parseFloat(t.aspectRatio.split(" / ")[1]);
775
+ let x = i + m, M = x / k;
776
+ const { width: X, height: I } = S(x, M);
777
+ I > (((q = s.value) == null ? void 0 : q.clientHeight) || 1 / 0) && (M = ((Q = s.value) == null ? void 0 : Q.clientHeight) || 1 / 0, x = M * k), a.value.width = X, a.value.height = I;
778
+ }
779
+ } else if (c.value === "top-left") {
780
+ if (t.zoomType === "free") {
781
+ const { width: k, height: x } = S(i - m, p - $);
782
+ a.value.width = k, a.value.height = x;
783
+ } else if (t.zoomType === "fixed") {
784
+ const k = Number.parseFloat(t.aspectRatio.split(" / ")[0]) / Number.parseFloat(t.aspectRatio.split(" / ")[1]);
785
+ let x = i - m, M = x / k;
786
+ const { width: X, height: I } = S(x, M);
787
+ I > (((Y = s.value) == null ? void 0 : Y.clientHeight) || 1 / 0) && (M = ((Z = s.value) == null ? void 0 : Z.clientHeight) || 1 / 0, x = M * k), a.value.width = X, a.value.height = I;
788
+ }
789
+ z.value = g.value.left, B.value = g.value.top;
790
+ } else if (c.value === "top-right") {
791
+ if (t.zoomType === "free") {
792
+ const { width: k, height: x } = S(i + m, p - $);
793
+ a.value.width = k, a.value.height = x;
794
+ } else if (t.zoomType === "fixed") {
795
+ const k = Number.parseFloat(t.aspectRatio.split(" / ")[0]) / Number.parseFloat(t.aspectRatio.split(" / ")[1]);
796
+ let x = i + m, M = x / k;
797
+ const { width: X, height: I } = S(x, M);
798
+ I > (((ee = s.value) == null ? void 0 : ee.clientHeight) || 1 / 0) && (M = ((Re = s.value) == null ? void 0 : Re.clientHeight) || 1 / 0, x = M * k), a.value.width = X, a.value.height = I;
799
+ }
800
+ z.value = g.value.left, B.value = g.value.top;
801
+ } else if (c.value === "bottom-left") {
802
+ if (t.zoomType === "free") {
803
+ const { width: k, height: x } = S(i - m, p + $);
804
+ a.value.width = k, a.value.height = x;
805
+ } else if (t.zoomType === "fixed") {
806
+ const k = Number.parseFloat(t.aspectRatio.split(" / ")[0]) / Number.parseFloat(t.aspectRatio.split(" / ")[1]);
807
+ let x = i - m, M = x / k;
808
+ const { width: X, height: I } = S(x, M);
809
+ I > (((Ce = s.value) == null ? void 0 : Ce.clientHeight) || 1 / 0) && (M = ((ke = s.value) == null ? void 0 : ke.clientHeight) || 1 / 0, x = M * k), a.value.width = X, a.value.height = I;
810
+ }
811
+ z.value = g.value.left, B.value = g.value.top;
812
+ }
813
+ h.preventDefault(), h.stopPropagation();
814
+ }
815
+ function ae(h, m) {
816
+ c.value = m, o = h.clientX, r = h.clientY, i = a.value.width, p = a.value.height, m === "bottom-right" ? (a.value.x = z.value, a.value.y = B.value) : m === "top-left" ? (a.value.x = z.value + b.value, a.value.y = B.value + w.value) : m === "top-right" ? (a.value.x = z.value, a.value.y = B.value + w.value) : m === "bottom-left" && (a.value.x = z.value + b.value, a.value.y = B.value);
817
+ }
818
+ function _e() {
819
+ c.value = "";
820
+ }
821
+ function Le() {
822
+ a.value.width = t.defaultWidth, a.value.height = t.defaultHeight, z.value = 0, B.value = 0;
823
+ }
824
+ return document.addEventListener("mouseup", _e), document.addEventListener("mousemove", J), ne(() => {
825
+ Oe(() => {
826
+ var h, m;
827
+ n.value.x = (((h = s.value) == null ? void 0 : h.offsetWidth) || 0) / 2 - a.value.width / 2, n.value.y = (((m = s.value) == null ? void 0 : m.offsetHeight) || 0) / 2 - a.value.height / 2;
828
+ });
829
+ }), Te(() => {
830
+ K.value && URL.revokeObjectURL(K.value), document.removeEventListener("mouseup", _e), document.removeEventListener("mousemove", J);
831
+ }), l({
832
+ crop: L,
833
+ resize: Le
834
+ }), (h, m) => (V(), D("div", {
835
+ ref_key: "containerBoxRef",
836
+ ref: s,
837
+ class: W([_(d).e("img-box")])
838
+ }, [
839
+ u.value ? (V(), D("div", {
840
+ key: 0,
841
+ class: W([_(d).e("error-message")])
842
+ }, be(u.value), 3)) : (V(), D(We, { key: 1 }, [
843
+ R("img", {
844
+ ref_key: "imgRef",
845
+ ref: f,
846
+ class: W([_(d).e("image")]),
847
+ src: K.value
848
+ }, null, 10, Vt),
849
+ R("div", {
850
+ ref_key: "cropBoxRef",
851
+ ref: v,
852
+ class: W([_(d).e("crop-tool-box")]),
853
+ style: P([N.value, c.value ? `left: ${g.value.left}px;top: ${g.value.top}px` : _(fe)])
854
+ }, [
855
+ R("div", {
856
+ class: W([_(d).e("top-left")]),
857
+ onMousedown: m[0] || (m[0] = ($) => ae($, "top-left"))
858
+ }, null, 34),
859
+ R("div", {
860
+ class: W([_(d).e("top-right")]),
861
+ onMousedown: m[1] || (m[1] = ($) => ae($, "top-right"))
862
+ }, null, 34),
863
+ R("div", {
864
+ class: W([_(d).e("bottom-right")]),
865
+ onMousedown: m[2] || (m[2] = ($) => ae($, "bottom-right"))
866
+ }, null, 34),
867
+ R("div", {
868
+ class: W([_(d).e("bottom-left")]),
869
+ onMousedown: m[3] || (m[3] = ($) => ae($, "bottom-left"))
870
+ }, null, 34)
871
+ ], 6)
872
+ ], 64))
873
+ ], 2));
874
+ }
875
+ }), Nt = de(At), Lt = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
876
+ __proto__: null,
877
+ QxsFileUpload: ft,
878
+ QxsFixedActionBar: St,
879
+ QxsImageUpload: Wt,
880
+ QxsPhotoCropTool: Nt
881
+ }, Symbol.toStringTag, { value: "Module" })), Ut = "0.0.6";
882
+ function Ft(e) {
883
+ return {
884
+ version: Ut,
885
+ install: (t) => {
886
+ for (const o in e)
887
+ t.use(e[o]);
888
+ }
889
+ };
890
+ }
891
+ const Ne = Ft(Lt), Qt = Ne.install, Yt = Ne.version;
7
892
  export {
8
- x as QxsFileUpload,
9
- i as QxsFixedActionBar,
10
- n as QxsImageUpload,
11
- f as QxsPhotoCropTool,
12
- o as default,
13
- t as install,
14
- e as version
893
+ ft as QxsFileUpload,
894
+ St as QxsFixedActionBar,
895
+ Wt as QxsImageUpload,
896
+ Nt as QxsPhotoCropTool,
897
+ Ne as default,
898
+ Qt as install,
899
+ Yt as version
15
900
  };