@keyblade/pro-components 1.13.8-alpha.9 → 1.14.0

package/es/pro-image-upload/image-upload.vue.js

@@ -1,34 +1,62 @@
-import { defineComponent as he, mergeModels as Y, useSlots as Ie, useModel as xe, ref as m, computed as w, watch as Z, resolveComponent as Ue, createElementBlock as Ce, openBlock as N, createVNode as ye, createBlock as Be, createCommentVNode as we, normalizeClass as Ee, createSlots as Me, withCtx as A, unref as R, renderSlot as _ } from "vue";
-import { Message as g } from "@arco-design/web-vue";
-import { conclude as L } from "vue-global-config";
-import { EImageUploadInnerBeforeUploadStep as v } from "./types.js";
-import { defaultImageUploadOptions as U } from "./constant.js";
-import Se from "./cropper.vue.js";
-import { defaultImageUploadCheckOptions as be, defaultImageUploadCompressorOptions as Le, defaultImageUploadCropOptions as Oe, oneTravelImageCheckAndTransform as $e, oneTravelImageCompressor as ke } from "@keyblade/one-travel";
-const ze = "keyblade-pro-image-upload";
-var ee, ae, le;
-const qe = /* @__PURE__ */ he({
+var ye = Object.defineProperty;
+var le = Object.getOwnPropertySymbols;
+var Ce = Object.prototype.hasOwnProperty, Be = Object.prototype.propertyIsEnumerable;
+var oe = (s, c, u) => c in s ? ye(s, c, { enumerable: !0, configurable: !0, writable: !0, value: u }) : s[c] = u, Q = (s, c) => {
+  for (var u in c || (c = {}))
+    Ce.call(c, u) && oe(s, u, c[u]);
+  if (le)
+    for (var u of le(c))
+      Be.call(c, u) && oe(s, u, c[u]);
+  return s;
+};
+var L = (s, c, u) => new Promise((E, i) => {
+  var e = (v) => {
+    try {
+      x(u.next(v));
+    } catch (m) {
+      i(m);
+    }
+  }, j = (v) => {
+    try {
+      x(u.throw(v));
+    } catch (m) {
+      i(m);
+    }
+  }, x = (v) => v.done ? E(v.value) : Promise.resolve(v.value).then(e, j);
+  x((u = u.apply(s, c)).next());
+});
+import { defineComponent as we, mergeModels as ne, useSlots as be, useModel as Ee, ref as U, computed as O, watch as te, createElementBlock as Me, openBlock as ie, createVNode as Se, createBlock as Le, createCommentVNode as Oe, unref as z, normalizeClass as $e, createSlots as ke, withCtx as T, renderSlot as V, normalizeProps as ze, guardReactiveProps as je } from "vue";
+import { Message as y, Upload as Pe } from "@arco-design/web-vue";
+import { conclude as W } from "vue-global-config";
+import { EImageUploadInnerBeforeUploadStep as I } from "./types.js";
+import { defaultImageUploadOptions as b } from "./constant.js";
+import Qe from "./cropper.vue.js";
+import { defaultImageUploadCheckOptions as Te, defaultImageUploadCompressorOptions as Ve, defaultImageUploadCropOptions as We, oneTravelImageCheckAndTransform as Fe, oneTravelImageCompressor as He } from "@keyblade/one-travel";
+const qe = "keyblade-pro-image-upload";
+var re, ue, de;
+const Ae = /* @__PURE__ */ we({
   __name: "image-upload",
-  props: /* @__PURE__ */ Y({
+  props: /* @__PURE__ */ ne({
     action: {},
     handlerResponse: {},
     headers: {},
     data: {},
-    name: { default: (ee = U) == null ? void 0 : ee.name },
+    name: { default: (re = b) == null ? void 0 : re.name },
     tip: {},
     accept: { default: () => {
-      var C;
-      return ((C = U) == null ? void 0 : C.accept) || [];
+      var s;
+      return ((s = b) == null ? void 0 : s.accept) || [];
     } },
-    multiple: { type: Boolean, default: U.multiple },
-    singleLimit: { default: U.singleLimit },
+    multiple: { type: Boolean, default: b.multiple },
+    singleLimit: { default: b.singleLimit },
     limit: {},
     exceedTip: {},
-    disabled: { type: Boolean, default: (ae = U) == null ? void 0 : ae.disabled },
-    hideInnerBeforeUploadLoading: { type: Boolean, default: (le = U) == null ? void 0 : le.hideInnerBeforeUploadLoading },
+    disabled: { type: Boolean, default: (ue = b) == null ? void 0 : ue.disabled },
+    hideInnerBeforeUploadLoading: { type: Boolean, default: (de = b) == null ? void 0 : de.hideInnerBeforeUploadLoading },
     checkOptions: {},
     compressorOptions: {},
     cropOptions: {},
+    cropModalIndex: {},
     onSuccess: {},
     onError: {},
     onExceed: {},
@@ -39,126 +67,126 @@ const qe = /* @__PURE__ */ he({
     modelValue: { required: !0 },
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ Y(["cropperImgLoad"], ["update:modelValue"]),
-  setup(C, { expose: oe, emit: ne }) {
-    const O = Ie(), u = xe(C, "modelValue"), e = C, te = ne, S = m(), $ = m(), p = m(), h = m([]), n = m(), c = m(), s = m(), ie = w(() => e.accept.map((a) => `.${a}`).join(",")), f = w(() => L([e.checkOptions, be]) || {}), y = w(() => L([e.compressorOptions, Le]) || {}), B = w(() => L([e.cropOptions, Oe]) || {}), re = (a) => {
-      var i, d, t, r;
-      const l = (r = (t = (d = (i = S.value) == null ? void 0 : i.$el) == null ? void 0 : d.querySelector) == null ? void 0 : t.call(d, "input")) == null ? void 0 : r.files;
-      return l && l.length > 0 && (s.value = {
+  emits: /* @__PURE__ */ ne(["cropperImgLoad"], ["update:modelValue"]),
+  setup(s, { expose: c, emit: u }) {
+    const E = be(), i = Ee(s, "modelValue"), e = s, j = u, x = U(), v = U(), m = U(), C = U([]), n = U(), p = U(), g = U(), se = O(() => e.accept.map((a) => `.${a}`).join(",")), h = O(() => W([e.checkOptions, Te]) || {}), M = O(() => W([e.compressorOptions, Ve]) || {}), S = O(() => W([e.cropOptions, We]) || {}), ce = (a) => {
+      var t, f, d, r;
+      const l = (r = (d = (f = (t = x.value) == null ? void 0 : t.$el) == null ? void 0 : f.querySelector) == null ? void 0 : d.call(f, "input")) == null ? void 0 : r.files;
+      return l && l.length > 0 && (g.value = {
         selectCount: l.length
-      }), e != null && e.onBeforeUpload ? e == null ? void 0 : e.onBeforeUpload(a) : s.value && (e != null && e.singleLimit) && s.value.selectCount > (e == null ? void 0 : e.singleLimit) ? (s.value.handleIndex === void 0 ? (s.value.handleIndex = 0, g.clear(), g.error(`单次最多可选择${e == null ? void 0 : e.singleLimit}张图片`)) : s.value.handleIndex += 1, s.value.handleIndex === s.value.selectCount - 1 && (s.value = void 0), !1) : new Promise(async (E, M) => {
+      }), e != null && e.onBeforeUpload ? e == null ? void 0 : e.onBeforeUpload(a) : g.value && (e != null && e.singleLimit) && g.value.selectCount > (e == null ? void 0 : e.singleLimit) ? (g.value.handleIndex === void 0 ? (g.value.handleIndex = 0, y.clear(), y.error(`单次最多可选择${e == null ? void 0 : e.singleLimit}张图片`)) : g.value.handleIndex += 1, g.value.handleIndex === g.value.selectCount - 1 && (g.value = void 0), !1) : new Promise(($, k) => L(null, null, function* () {
         try {
-          E(await fe(a));
-        } catch {
-          M();
-        } finally {
+          $(yield pe(a));
+        } catch (P) {
           k();
+        } finally {
+          F();
         }
-      });
-    }, ue = async (a) => {
-      const l = u.value.findIndex((i) => i.uid === a.uid);
-      return u.value.splice(l, 1), u.value = [...u.value], !1;
-    }, de = (a, l) => {
-      e != null && e.onExceed ? e == null || e.onExceed(a, l) : (g.error(e.exceedTip ?? `超过数量上限，最多上传${(e == null ? void 0 : e.limit) || 1}张`), u.value = a);
-    }, se = async (a) => {
+      }));
+    }, fe = (a) => L(null, null, function* () {
+      const l = i.value.findIndex((t) => t.uid === a.uid);
+      return i.value.splice(l, 1), i.value = [...i.value], !1;
+    }), ve = (a, l) => {
+      var t;
+      e != null && e.onExceed ? e == null || e.onExceed(a, l) : (y.error((t = e.exceedTip) != null ? t : `超过数量上限，最多上传${(e == null ? void 0 : e.limit) || 1}张`), i.value = a);
+    }, me = (a) => L(null, null, function* () {
       if (e != null && e.onSuccess)
         e == null || e.onSuccess(a);
       else {
         if (!(e != null && e.handlerResponse))
           return;
-        const l = await e.handlerResponse(a.response), i = u.value.findIndex((d) => d.uid === a.uid);
-        l.success ? u.value[i] = {
-          ...u.value[i],
-          ...l
-        } : u.value.splice(i, 1);
+        const l = yield e.handlerResponse(a.response), t = i.value.findIndex((f) => f.uid === a.uid);
+        l.success ? i.value[t] && (i.value[t] = Q(Q({}, i.value[t]), l)) : i.value.splice(t, 1);
       }
-    }, ce = (a) => {
+    }), ge = (a) => {
       e != null && e.onError ? e == null || e.onError(a) : setTimeout(() => {
-        const l = u.value.findIndex((i) => i.uid === a.uid);
-        u.value.splice(l, 1);
+        const l = i.value.findIndex((t) => t.uid === a.uid);
+        i.value.splice(l, 1);
       });
-    }, fe = (a) => new Promise((l, i) => {
-      h.value.push({ file: a, resolve: l, reject: i }), h.value.length === 1 && !n.value && k();
-    }), k = () => {
-      n.value === void 0 ? n.value = 0 : n.value + 1 >= h.value.length ? (n.value = void 0, h.value = []) : n.value += 1;
-    }, ve = () => {
+    }, pe = (a) => new Promise((l, t) => {
+      C.value.push({ file: a, resolve: l, reject: t }), C.value.length === 1 && !n.value && F();
+    }), F = () => {
+      n.value === void 0 ? n.value = 0 : n.value + 1 >= C.value.length ? (n.value = void 0, C.value = []) : n.value += 1;
+    }, he = () => {
       var a;
-      (a = p.value) == null || a.reject();
-    }, me = (a) => {
+      (a = m.value) == null || a.reject();
+    }, Ie = (a) => {
       var l;
-      (l = p.value) == null || l.resolve(a);
-    }, ge = (a) => {
-      te("cropperImgLoad", a);
+      (l = m.value) == null || l.resolve(a);
+    }, xe = (a) => {
+      j("cropperImgLoad", a);
     };
-    Z(n, async () => {
-      var E, M, b, z, j, Q, T, V, W, F, H, P, q, D, G, J, K, X;
-      if (n.value === void 0 || h.value.length === 0)
+    te(n, () => L(null, null, function* () {
+      var $, k, P, H, q, D, G, J, K, X, Y, Z, N, R, A, _, ee, ae;
+      if (n.value === void 0 || C.value.length === 0)
         return;
-      const a = h.value[n.value], { file: l, resolve: i, reject: d } = a;
-      let t = l.name, r = l;
-      if ((E = f.value) != null && E.enable) {
-        c.value = {
+      const a = C.value[n.value];
+      if (!a) return;
+      const { file: l, resolve: t, reject: f } = a;
+      let d = l.name, r = l;
+      if (($ = h.value) != null && $.enable) {
+        p.value = {
           loading: !0,
           text: `第${n.value + 1}张图片检测中，请稍等`
-        }, (M = e == null ? void 0 : e.onInnerBeforeUploadStart) == null || M.call(
+        }, (k = e == null ? void 0 : e.onInnerBeforeUploadStart) == null || k.call(
           e,
           l,
           n.value,
-          v.check
+          I.check
         );
-        const o = await $e(l, l.name, {
-          imageMaxSize: f.value.maxSize,
-          imageAllowedType: f.value.allowedType,
-          imageMinWidth: f.value.minWidth,
-          imageMinHeight: f.value.minHeight,
-          imageMaxWidth: f.value.maxWidth,
-          imageMaxHeight: f.value.maxHeight
+        const o = yield Fe(l, l.name, {
+          imageMaxSize: h.value.maxSize,
+          imageAllowedType: h.value.allowedType,
+          imageMinWidth: h.value.minWidth,
+          imageMinHeight: h.value.minHeight,
+          imageMaxWidth: h.value.maxWidth,
+          imageMaxHeight: h.value.maxHeight
         });
-        if (c.value = void 0, (b = e == null ? void 0 : e.onInnerBeforeUploadEnd) == null || b.call(
+        if (p.value = void 0, (P = e == null ? void 0 : e.onInnerBeforeUploadEnd) == null || P.call(
           e,
           l,
           n.value,
-          v.check,
+          I.check,
           {
             success: o.success,
             error: o == null ? void 0 : o.error,
             errorMessage: o == null ? void 0 : o.errorMessage
           }
         ), !o.success)
-          return (z = f.value) != null && z.showErrorMessage && g.error((o == null ? void 0 : o.errorMessage) || "图片校验及转换失败"), d();
+          return (H = h.value) != null && H.showErrorMessage && y.error((o == null ? void 0 : o.errorMessage) || "图片校验及转换失败"), f();
         if (o != null && o.hasTransform) {
-          const x = t == null ? void 0 : t.split(".");
-          x.pop(), t = `${x.join(",")}.jpg`, r = new File([o.file], t, {
+          const w = d == null ? void 0 : d.split(".");
+          w.pop(), d = `${w.join(",")}.jpg`, r = new File([o.file], d, {
             type: o.file.type
           });
         } else
           r = o.file;
       }
-      if ((j = B.value) != null && j.enable && !((T = (Q = t == null ? void 0 : t.toLocaleLowerCase) == null ? void 0 : Q.call(t)) != null && T.endsWith(".gif"))) {
-        (V = e == null ? void 0 : e.onInnerBeforeUploadStart) == null || V.call(
+      if ((q = S.value) != null && q.enable && !((G = (D = d == null ? void 0 : d.toLocaleLowerCase) == null ? void 0 : D.call(d)) != null && G.endsWith(".gif"))) {
+        (J = e == null ? void 0 : e.onInnerBeforeUploadStart) == null || J.call(
           e,
           l,
           n.value,
-          v.crop
+          I.crop
         );
         try {
-          (W = B.value) != null && W.customCrop ? r = await B.value.customCrop(r) : r = await new Promise((o, x) => {
-            p.value = { file: r, resolve: o, reject: x };
-          }), (F = e == null ? void 0 : e.onInnerBeforeUploadEnd) == null || F.call(
+          (K = S.value) != null && K.customCrop ? r = yield S.value.customCrop(r) : r = yield new Promise((o, w) => {
+            m.value = { file: r, resolve: o, reject: w };
+          }), (X = e == null ? void 0 : e.onInnerBeforeUploadEnd) == null || X.call(
             e,
             l,
             n.value,
-            v.crop,
+            I.crop,
             {
               success: !1
             }
           );
-        } catch {
-          return (H = e == null ? void 0 : e.onInnerBeforeUploadEnd) == null || H.call(
+        } catch (o) {
+          return (Y = e == null ? void 0 : e.onInnerBeforeUploadEnd) == null || Y.call(
             e,
             l,
             n.value,
-            v.crop,
+            I.crop,
             {
               success: !1,
               error: {
@@ -166,31 +194,31 @@ const qe = /* @__PURE__ */ he({
               },
               errorMessage: "图片剪裁失败"
             }
-          ), (P = B.value) != null && P.showErrorMessage && g.error("图片剪裁失败"), d();
+          ), (Z = S.value) != null && Z.showErrorMessage && y.error("图片剪裁失败"), f();
         } finally {
-          p.value = void 0;
+          m.value = void 0;
         }
       }
-      if ((q = y.value) != null && q.enable) {
-        c.value = {
+      if ((N = M.value) != null && N.enable) {
+        p.value = {
           loading: !0,
           text: `第${n.value + 1}张图片处理中，请稍等`
-        }, (D = e == null ? void 0 : e.onInnerBeforeUploadStart) == null || D.call(
+        }, (R = e == null ? void 0 : e.onInnerBeforeUploadStart) == null || R.call(
           e,
           l,
           n.value,
-          v.compress
+          I.compress
         );
-        const o = await ke(r, {
-          maxSize: y.value.maxSize,
-          size: y.value.size,
-          excludeAllowedTypes: (G = y.value.excludeAllowedTypes) == null ? void 0 : G.map((x) => `${x}`)
+        const o = yield He(r, {
+          maxSize: M.value.maxSize,
+          size: M.value.size,
+          excludeAllowedTypes: (A = M.value.excludeAllowedTypes) == null ? void 0 : A.map((w) => `${w}`)
         });
-        if (c.value = void 0, (J = e == null ? void 0 : e.onInnerBeforeUploadEnd) == null || J.call(
+        if (p.value = void 0, (_ = e == null ? void 0 : e.onInnerBeforeUploadEnd) == null || _.call(
           e,
           l,
           n.value,
-          v.compress,
+          I.compress,
           {
             success: o.success,
             error: {
@@ -199,95 +227,101 @@ const qe = /* @__PURE__ */ he({
             errorMessage: o == null ? void 0 : o.errorMessage
           }
         ), !o.success)
-          return (K = y.value) != null && K.showErrorMessage && g.error((o == null ? void 0 : o.errorMessage) || "图片压缩失败"), d();
-        r = new File([o.file], t, {
+          return (ee = M.value) != null && ee.showErrorMessage && y.error((o == null ? void 0 : o.errorMessage) || "图片压缩失败"), f();
+        r = new File([o.file], d, {
           type: o.file.type
         });
       }
-      c.value = void 0, (X = e == null ? void 0 : e.onInnerBeforeUploadEnd) == null || X.call(
+      p.value = void 0, (ae = e == null ? void 0 : e.onInnerBeforeUploadEnd) == null || ae.call(
         e,
         l,
         n.value,
-        v.all,
+        I.all,
         {
           success: !0
         }
-      ), i(r);
-    });
-    let I;
-    Z(
-      () => c.value,
+      ), t(r);
+    }));
+    let B;
+    te(
+      () => p.value,
       () => {
         var a;
-        c.value ? I = g.loading({
-          content: c.value.text,
+        p.value ? B = y.loading({
+          content: p.value.text,
           id: "image-upload-id",
           duration: 0
-        }) : (a = I == null ? void 0 : I.close) == null || a.call(I);
+        }) : (a = B == null ? void 0 : B.close) == null || a.call(B);
       }
     );
-    const pe = w(() => u.value.every((a) => a.status && ["done", "error"].includes(a.status)));
-    return oe({
-      uploadInsRef: S,
-      cropperInsRef: $,
-      isUploadComplete: pe
+    const Ue = O(() => i.value.every((a) => a.status && ["done", "error"].includes(a.status)));
+    return c({
+      uploadInsRef: x,
+      cropperInsRef: v,
+      isUploadComplete: Ue
     }), (a, l) => {
-      var d, t;
-      const i = Ue("a-upload");
-      return N(), Ce("div", null, [
-        ye(i, {
-          class: Ee([`${ze}-upload`]),
+      var t, f, d;
+      return ie(), Me("div", null, [
+        Se(z(Pe), {
+          class: $e([`${qe}-upload`]),
           ref_key: "uploadInsRef",
-          ref: S,
+          ref: x,
           "list-type": "picture-card",
           tip: a.tip || "上传",
           "image-preview": "",
-          "file-list": u.value,
-          "onUpdate:fileList": l[0] || (l[0] = (r) => u.value = r),
+          "file-list": i.value,
+          "onUpdate:fileList": l[0] || (l[0] = (r) => i.value = r),
           action: a.action,
           headers: a.headers,
           data: a.data,
           name: a.name,
-          accept: ie.value,
+          accept: se.value,
           multiple: a.multiple,
           limit: a.limit,
           disabled: a.disabled,
-          "on-before-upload": re,
-          "on-before-remove": ue,
-          onExceedLimit: de,
-          onSuccess: se,
-          onError: ce
-        }, Me({ _: 2 }, [
-          (d = R(O)) != null && d.image ? {
+          "on-before-upload": ce,
+          "on-before-remove": fe,
+          onExceedLimit: ve,
+          onSuccess: me,
+          onError: ge
+        }, ke({ _: 2 }, [
+          (t = z(E)) != null && t.image ? {
             name: "image",
-            fn: A(({ fileItem: r }) => [
-              _(a.$slots, "image", { fileItem: r })
+            fn: T(({ fileItem: r }) => [
+              V(a.$slots, "image", { fileItem: r })
             ]),
             key: "0"
           } : void 0,
-          (t = R(O)) != null && t["upload-button"] ? {
+          (f = z(E)) != null && f["upload-button"] ? {
             name: "upload-button",
-            fn: A(() => [
-              _(a.$slots, "upload-button")
+            fn: T(() => [
+              V(a.$slots, "upload-button")
             ]),
             key: "1"
+          } : void 0,
+          (d = z(E)) != null && d["extra-button"] ? {
+            name: "extra-button",
+            fn: T((r) => [
+              V(a.$slots, "extra-button", ze(je(r)))
+            ]),
+            key: "2"
           } : void 0
         ]), 1032, ["class", "tip", "file-list", "action", "headers", "data", "name", "accept", "multiple", "limit", "disabled"]),
-        p.value && n.value !== void 0 ? (N(), Be(Se, {
+        m.value && n.value !== void 0 ? (ie(), Le(Qe, {
           key: 0,
           ref_key: "cropperInsRef",
-          ref: $,
-          file: p.value.file,
+          ref: v,
+          file: m.value.file,
           index: n.value,
-          options: B.value,
-          onCancel: ve,
-          onConfirm: me,
-          onImgLoad: ge
-        }, null, 8, ["file", "index", "options"])) : we("", !0)
+          options: S.value,
+          onCancel: he,
+          onConfirm: Ie,
+          onImgLoad: xe
+        }, null, 8, ["file", "index", "options"])) : Oe("", !0)
       ]);
     };
   }
 });
 export {
-  qe as default
+  Ae as default
 };