@das-fed/upf-ui 6.4.0-dev.124

package/packages/components/image-viewer/index.js

@@ -0,0 +1,732 @@
+import '@das-fed/upf-ui/packages/components/image-viewer/style.css';
+import { withInstall as Pe } from "@das-fed/upf-utils/with-install/index";
+import { setThemeRule as Oe } from "@das-fed/upf-web/packages/theme/index";
+import { ref as ne, computed as D, watch as Je, createApp as Ne, defineComponent as Fe, createElementBlock as h, openBlock as d, Fragment as x, createCommentVNode as r, createElementVNode as N, withDirectives as B, normalizeStyle as $, createVNode as H, unref as e, normalizeClass as _, withCtx as q, createBlock as I, vShow as Q, isRef as ue, createTextVNode as ce, toDisplayString as de, renderList as me } from "vue";
+import { ElImageViewer as Ve, ElImage as ge } from "element-plus";
+import { Upload as pe } from "ant-design-vue";
+import { vDasTooltip as fe } from "@das-fed/upf-ui/packages/components/text-tooltip/index";
+import { DasImageUpload as Ae } from "@das-fed/upf-ui/packages/components/image-upload/index";
+import { DasSpin as ve } from "@das-fed/upf-ui/packages/components/spin/index";
+import { DasAudioVideo as ee } from "@das-fed/upf-ui/packages/components/audio-video/index";
+import { DasIconDownload as we } from "@das-fed/upf-ui/packages/icons/download/index";
+import { DasIconChange as te } from "@das-fed/upf-ui/packages/icons/change/index";
+import { DasIconDelete as Ce } from "@das-fed/upf-ui/packages/icons/delete/index";
+import { useModelValue as Ee } from "@das-fed/upf-utils/vue";
+import { DasMessage as he } from "@das-fed/upf-ui/packages/components/message/index";
+import { extractFilename as ye, getFileExtension as Te } from "@das-fed/upf-utils/common-tools";
+import { getConfig as re } from "@das-fed/upf-utils/config";
+import { currentLang as Ie, i18n as ke } from "@das-fed/upf-web/packages/i18n/index";
+import { iotMinio as Be } from "@das-fed/upf-utils/api-services/modules/iot";
+import { useFile as Le } from "@das-fed/upf-utils/api-services/modules/file";
+import { getUserInfo as Me } from "@das-fed/upf-utils/common-info";
+import { pureImageSrc as le } from "@das-fed/upf-utils/pure-image-src";
+import "ant-design-vue/es/upload/style/css";
+import "element-plus/es/components/image/style/css";
+import "element-plus/es/components/image-viewer/style/css";
+import "@das-fed/upf-ui/packages/global/theme";
+const se = "data:image/png;base64,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", Ke = (t, a) => {
+  const s = new Image();
+  s.setAttribute("crossOrigin", "Anonymous"), s.onload = function() {
+    let o = document.createElement("canvas");
+    const m = o.getContext("2d");
+    o.width = s.width, o.height = s.height, m.drawImage(s, 0, 0, s.width, s.height), o.toBlob((f) => {
+      let v = URL.createObjectURL(f), l = document.createElement("a"), R = new MouseEvent("click");
+      const C = t.substring(t.lastIndexOf(".")).toLowerCase();
+      l.download = a || `default${C}`, l.href = v, l.dispatchEvent(R), URL.revokeObjectURL(v);
+    });
+  }, s.src = t + "?v=" + Date.now();
+}, je = (t, a) => {
+  t && fetch(t).then((s) => s.blob()).then((s) => {
+    const o = document.createElement("a");
+    document.body.appendChild(o), o.style.display = "none";
+    const m = window.URL.createObjectURL(s);
+    o.href = m, o.download = a, o.click(), document.body.removeChild(o), window.URL.revokeObjectURL(m);
+  });
+}, ze = (t) => {
+  const a = (t == null ? void 0 : t.minioTokenApi) ?? "token";
+  return Be.get(a, (s) => (s.headers || (s.headers = {}), t != null && t.baseUrl && (s.baseURL = t.baseUrl), s));
+}, He = (t) => Be.post("put-object", (a) => (a.headers || (a.headers = {}), t && (a.baseURL = t), a.headers["Content-Type"] = "multipart/form-data", a)), qe = () => {
+  const t = Me();
+  return t ? t.tenantId : "";
+}, Ye = (t) => {
+  const { baseUrl: a, serviceName: s, pathPrefix: o, bucketName: m, minioTokenApi: f, autoContentType: v } = t, l = async () => {
+    const [w, u] = await ze({ baseUrl: a, minioTokenApi: f })().run();
+    return w ? { stauts: !1 } : { status: !0, data: u };
+  }, { generateUniqueName: R } = Le();
+  return { upload: async (w, u = {}) => {
+    const E = await l();
+    if (!E.status) return;
+    const U = w.name, k = E.data, F = o || qe(), V = U.substring(U.lastIndexOf(".")).toLowerCase(), L = t.randomName ? `${R("")}${V}` : U, M = s ? `${F}/${s}/${L}` : `${F}/${L}`, K = {
+      accessKeyId: k.accessKeyId,
+      secretAccessKey: k.secretAccessKey,
+      sessionToken: k.sessionToken,
+      file: w,
+      bucketName: m || "business",
+      filePath: M,
+      isThumbnail: !0,
+      autoContentType: v === !0 ? !0 : void 0,
+      ...u
+    }, [j, z] = await He(a)(K).run();
+    return j ? "error" : z.value;
+  } };
+}, Ze = () => ({ size2B: (a) => {
+  isNaN(Number(a)) ? a = a.toString() : a = a + "M";
+  const s = Number(a.slice(0, -1)), o = a[a.length - 1].toUpperCase(), m = 1024, f = {
+    M: m * m,
+    K: m,
+    B: 1
+  };
+  return { finalSize: s * f[o], sizeText: a };
+} }), Ge = (t) => ({ handlerImageSrc: (s, o) => {
+  if (o.startsWith("http")) return o;
+  const m = t.useOriginUrl ? o : le(o);
+  return s + m;
+} }), Xe = async (t) => {
+  const s = re().baseURL + le(t);
+  return await ye(s);
+}, We = async (t) => {
+  const a = re();
+  let s = [];
+  for (const o of t) {
+    const m = a.baseURL + le(o), f = await ye(m);
+    s.push(f);
+  }
+  return s;
+}, xe = (t, a) => {
+  const s = re(), o = Ee(t, "modelValue"), m = Ee(t, "status"), { upload: f } = Ye(t), { size2B: v } = Ze(), { handlerImageSrc: l } = Ge(t), R = ne(""), C = ne([]), w = [".mp4", ".avi", ".mkv", ".mov", ".wmv", ".flv", ".mpeg", ".webm"], u = [".mp3", ".wav", ".aac", ".flac", ".ogg", ".alff", ".wma", ".m4a"], E = D(() => t.baseUrl ? t.baseUrl : process.env.NODE_ENV === "production" ? "" : s.baseURL || ""), U = (i) => {
+    if (i) {
+      const c = i.substring(i.lastIndexOf(".")).toLowerCase();
+      if (w.includes(c)) return "isVideo";
+      if (u.includes(c)) return "isAudio";
+    }
+    return "isImg";
+  }, k = D(() => {
+    var c;
+    let i = t.accept ? (c = t.accept) == null ? void 0 : c.split(",") : [];
+    return i.includes("image/jpg") && !i.includes("image/jpeg") && i.push("image/jpeg"), i.includes(".jpg") && !i.includes(".jpeg") && i.push(".jpeg"), t.acceptVideo && (i = [...i, ...w]), t.acceptAudio && (i = [...i, ...u]), i.join(",");
+  }), F = D(() => m.value === "uploading"), V = ne(0), L = (i) => F.value ? V.value === i : !1, M = D(() => o.value ? [l(E.value, o.value)] : []), K = D(() => o.value ? o.value.map((i) => [l(E.value, i)]) : []), j = D(() => t.status !== "info" && (t.needDeleteBtn || t.needChangeBtn) || t.needDownloadBtn), z = D(() => t.status !== "info" && t.needDeleteBtn || t.needDownloadBtn), Y = D(() => {
+    const i = [], c = t.previewBtnConfig;
+    if (typeof c == "boolean")
+      return c ? ["zoom_in", "zoom_out", "turn_left", "turn_right", "full_screen"] : [];
+    for (const S in c)
+      c[S] && i.push(S);
+    return i;
+  }), ae = () => {
+    setTimeout(() => {
+      const i = document.querySelector(".el-image-viewer__wrapper");
+      i == null || i.classList.add("das-image-viewer-preview-btn-groups"), i == null || i.classList.add(...Y.value);
+    }, 0);
+  }, O = (i) => {
+    a("clickChangeIcon", i);
+  }, J = (i, c) => {
+    t.limitNum === 1 ? (o.value = "", a("update:modelValue", ""), a("deleteImage", i)) : (o.value.splice(c, 1), a("update:modelValue", o.value), a("deleteImage", i));
+  }, X = (i, c = 0) => {
+    var Z;
+    a("downloadImage", i);
+    let S = "";
+    t.limitNum === 1 ? S = t.imageName || R.value : S = ((Z = t.imageName) == null ? void 0 : Z[c]) || C.value[c], U(i) === "isImg" ? Ke(l(E.value, i), S) : je(l(E.value, i), S);
+  }, W = async (i, c) => {
+    var Z;
+    if (t.maxSize) {
+      const { finalSize: b, sizeText: y } = v(t.maxSize);
+      if (i.size > b) {
+        const G = Ie.value === "zh-CN" ? "、" : ", ", T = ke(
+          "das-ui-import-upload-key3",
+          y,
+          ((Z = k.value) == null ? void 0 : Z.toUpperCase().replaceAll(".", "").replaceAll(",", G)) ?? ""
+        ).value, oe = t.errorMessage || T;
+        return he.warning(oe), !1;
+      }
+    }
+    const S = async (b) => {
+      V.value = b, a("update:status", "uploading"), a("image-upload", i);
+      const y = await f(i);
+      return y === "error" ? (a("update:status", "error"), !1) : (a("upload-success", i, y), t.limitNum === 1 ? o.value = y : o.value[b] = y, a("update:modelValue", o.value), a("update:status", "normal"), !1);
+    };
+    if (t.customCheck) {
+      const b = t.customCheck(i);
+      if (b instanceof Promise)
+        return new Promise(async (y, G) => {
+          let T;
+          try {
+            T = await b.then();
+          } catch {
+            T = !1;
+          }
+          T ? S(c) : G(!1);
+        });
+      if (!b) return !1;
+    } else if (k.value) {
+      const b = k.value.split(",").filter((P) => P.trim().startsWith(".")).map((P) => P.trim()), y = k.value.split(",").filter((P) => !P.trim().startsWith(".")).map((P) => P.trim()), G = Te(i.name), T = b.includes(G);
+      let oe = y.includes("image/*") && i.type.split("/")[0].trim() === "image", Se = y.includes("video/*") && i.type.split("/")[0].trim() === "video", De = y.includes("audio/*") && i.type.split("/")[0].trim() === "audio", Re = y.includes(i.type) || oe || Se || De;
+      if (!T && !Re) {
+        const P = t.acceptAudio || t.acceptVideo ? "das-ui-import-upload-key2" : "das-ui-import-upload-key1", Ue = Ie.value === "zh-CN" ? "、" : ", ", be = t.errorMessage || ke(P, k.value.toUpperCase().replaceAll(".", "").replaceAll(",", Ue)).value;
+        return he.warning(be), !1;
+      }
+    }
+    return S(c);
+  }, n = async (i) => {
+    t.limitNum !== 1 && (V.value = o.length), a("update:status", "uploading"), a("image-upload", i);
+    const c = await f(i);
+    a("upload-success", i, c), t.limitNum === 1 ? g(c) : A(c);
+  }, g = (i) => {
+    if (i === "error") {
+      a("update:status", "error");
+      return;
+    }
+    o.value = i, a("update:modelValue", o.value), a("update:status", "normal");
+  }, A = (i) => {
+    if (i === "error") {
+      a("update:status", "error");
+      return;
+    }
+    o.value.push(i), a("update:modelValue", o.value), a("update:status", "normal");
+  };
+  return Je(o, async () => {
+    const i = t.limitNum ?? 1;
+    i === 1 && o.value ? R.value = await Xe(o.value) : i > 1 && o.value.length > 0 && (C.value = await We(o.value));
+  }, {
+    deep: !0,
+    immediate: !0
+  }), {
+    url: o,
+    singlePreviewList: M,
+    multiPreviewList: K,
+    isAccept: k,
+    loading: F,
+    uploadStatus: m,
+    previewBtns: Y,
+    operateShow: j,
+    operateShow_Multi: z,
+    singlePreviewName: R,
+    multiPreviewName: C,
+    getFileType: U,
+    changeImg: O,
+    delImg: J,
+    beforeupload: W,
+    uploadImg: n,
+    onDownload: X,
+    handleImageClick: ae,
+    isLoadingMulti: L
+  };
+}, $e = (t, a) => {
+  var f;
+  const { __IN_DAS_MICRO_APP: s, __DAS_MAIN_APP_HREF: o } = window;
+  if (!s || !o) return;
+  const { origin: m } = new URL(o);
+  (f = window.top) == null || f.postMessage({ type: t, data: a }, m);
+}, Qe = "proxy-image-viewer", ie = {
+  sendMessageToMainApp: $e,
+  // @ts-ignore
+  isMicroApp: () => window.__IN_DAS_MICRO_APP && window.top !== window.self,
+  addEventFromMicroApp: () => {
+    window.addEventListener("message", (t) => {
+      const { type: a, data: s } = t.data;
+      if (a !== Qe) return;
+      const o = document.createElement("div");
+      o.classList.add("das-image-viewer-preview-btn-groups");
+      const { previewList: m, previewBtns: f } = s, v = Ne(Ve, {
+        urlList: m,
+        onClose: () => {
+          v.unmount(), document.body.removeChild(o);
+        }
+      });
+      document.body.appendChild(o), v.mount(o), setTimeout(() => {
+        const l = document.querySelector(".el-image-viewer__wrapper");
+        l == null || l.classList.add("das-image-viewer-preview-btn-groups"), l == null || l.classList.add(...f);
+      }, 0);
+    });
+  }
+};
+ie.addEventFromMicroApp();
+const _e = (t) => {
+  const { handleImageClickProxy: a, previewBtns: s } = t;
+  return { needPreviewImage: D(() => !t.needPreview || ie.isMicroApp() ? !1 : t.needPreview), handleImageClick: (f) => {
+    if (!t.needPreview) return;
+    if (!ie.isMicroApp()) {
+      a();
+      return;
+    }
+    let v = [];
+    Array.isArray(f) && v.push(...f), typeof f == "string" && v.push(f), ie.sendMessageToMainApp(Qe, {
+      previewList: v,
+      previewBtns: s.value
+    });
+  } };
+}, et = {
+  key: 0,
+  class: "das-ui-image-viewer-container"
+}, tt = {
+  class: "no-data-img",
+  src: se,
+  alt: ""
+}, it = { class: "image-name" }, at = { class: "das-ui-image-viewer-groups" }, ot = { class: "image-name" }, nt = { class: "das-ui-image-viewer-container" }, st = {
+  key: 1,
+  class: "das-ui-image-viewer-container"
+}, rt = { class: "das-ui-image-viewer" }, lt = {
+  key: 2,
+  class: "das-ui-image-viewer"
+}, ut = /* @__PURE__ */ Fe({
+  __name: "Index",
+  props: {
+    style: { default: "" },
+    modelValue: {},
+    status: { default: "normal" },
+    imageName: {},
+    accept: { default: ".png, .jpg, .jpeg, .gif, .svg" },
+    acceptVideo: { type: Boolean },
+    acceptAudio: { type: Boolean },
+    showImageName: { type: Boolean },
+    baseUrl: {},
+    serviceName: {},
+    pathPrefix: {},
+    bucketName: {},
+    minioTokenApi: { default: "token" },
+    maxSize: {},
+    limitNum: { default: 1 },
+    errorMessage: {},
+    customCheck: {},
+    needPreview: { type: Boolean, default: !0 },
+    needDownloadBtn: { type: Boolean, default: !0 },
+    needDeleteBtn: { type: Boolean, default: !0 },
+    needChangeBtn: { type: Boolean, default: !0 },
+    mode: { default: "upload" },
+    previewBtnConfig: { type: [Boolean, Object], default: !0 },
+    imageFit: { default: "cover" },
+    autoContentType: { type: Boolean },
+    message: {},
+    videoWidth: {},
+    videoHeight: {},
+    randomName: { type: Boolean, default: !1 },
+    useOriginUrl: { type: Boolean, default: !1 },
+    openFileDialogOnClick: { type: Boolean, default: !0 }
+  },
+  emits: ["update:modelValue", "update:status", "downloadImage", "image-upload", "upload-success", "clickChangeIcon", "deleteImage"],
+  setup(t, { emit: a }) {
+    const s = t, o = a, m = D(() => {
+      const g = [
+        s.needDownloadBtn,
+        s.limitNum === 1 && u.value !== "info" && s.needChangeBtn,
+        u.value !== "info" && s.needDeleteBtn
+      ].filter((p) => p).length;
+      let A = "center";
+      return g === 2 && (A = "space-around"), g === 3 && (A = "space-between"), {
+        "justify-content": A
+      };
+    }), f = D(() => s.mode === "view" ? !1 : l.value ? u.value === "error" : u.value !== "info"), v = (n) => {
+      n.stopPropagation();
+    }, {
+      url: l,
+      isAccept: R,
+      singlePreviewList: C,
+      multiPreviewList: w,
+      uploadStatus: u,
+      loading: E,
+      previewBtns: U,
+      operateShow: k,
+      operateShow_Multi: F,
+      singlePreviewName: V,
+      multiPreviewName: L,
+      changeImg: M,
+      delImg: K,
+      beforeupload: j,
+      uploadImg: z,
+      onDownload: Y,
+      handleImageClick: ae,
+      getFileType: O,
+      isLoadingMulti: J
+    } = xe(s, o), { needPreviewImage: X, handleImageClick: W } = _e({
+      needPreview: s.needPreview,
+      handleImageClickProxy: ae,
+      previewBtns: U
+    });
+    return (n, g) => (d(), h(
+      x,
+      null,
+      [
+        r(" 单文件 "),
+        n.limitNum === 1 ? (d(), h("div", et, [
+          N(
+            "div",
+            {
+              class: "das-ui-image-viewer",
+              style: $(n.style)
+            },
+            [
+              r(" 状态不为 error 时显示 "),
+              B(H(e(ve), {
+                class: _([{ "loading-border": e(E) }]),
+                type: "component",
+                spinning: e(E)
+              }, {
+                default: q(() => [
+                  r(" 图片 "),
+                  e(O)(e(C)[0]) === "isImg" ? B((d(), I(e(ge), {
+                    key: 0,
+                    class: _(["image-context", [e(U)]]),
+                    "preview-teleported": !0,
+                    src: e(C)[0],
+                    "preview-src-list": e(X) ? e(C) : void 0,
+                    "initial-index": 0,
+                    fit: n.imageFit,
+                    onClick: g[0] || (g[0] = (A) => e(W)(e(C)))
+                  }, null, 8, ["class", "src", "preview-src-list", "fit"])), [
+                    [Q, !e(E)]
+                  ]) : r("v-if", !0),
+                  r(" 视频 "),
+                  e(O)(e(C)[0]) === "isVideo" ? B((d(), I(e(ee), {
+                    key: 1,
+                    mode: e(u) === "info" || n.mode === "view" ? "view" : "normal",
+                    src: e(C)[0],
+                    needPreview: n.needPreview,
+                    width: "100%",
+                    height: "100%",
+                    "player-props": { videoWidth: n.videoWidth, videoHeight: n.videoHeight },
+                    fullPath: ""
+                  }, null, 8, ["mode", "src", "needPreview", "player-props"])), [
+                    [Q, !e(E)]
+                  ]) : r("v-if", !0),
+                  r(" 音频 "),
+                  e(O)(e(C)[0]) === "isAudio" ? B((d(), I(e(ee), {
+                    key: 2,
+                    mode: e(u) === "info" || n.mode === "view" ? "view" : "normal",
+                    src: e(C)[0],
+                    needPreview: n.needPreview,
+                    width: "100%",
+                    height: "100%",
+                    type: "audio",
+                    fullPath: ""
+                  }, null, 8, ["mode", "src", "needPreview"])), [
+                    [Q, !e(E)]
+                  ]) : r("v-if", !0),
+                  !e(E) && e(k) ? (d(), h(
+                    "div",
+                    {
+                      key: 3,
+                      class: "operate-container",
+                      style: $(m.value),
+                      onClick: v
+                    },
+                    [
+                      n.needDownloadBtn ? (d(), I(e(we), {
+                        key: 0,
+                        class: "operate-btn",
+                        size: "medium",
+                        "icon-color": "#fff",
+                        onClick: g[1] || (g[1] = (A) => e(Y)(e(l)))
+                      })) : r("v-if", !0),
+                      e(u) !== "info" && n.needChangeBtn ? (d(), h("div", {
+                        key: 1,
+                        class: "change-icon-box",
+                        onClick: g[2] || (g[2] = (A) => e(M)(e(l)))
+                      }, [
+                        n.openFileDialogOnClick ? (d(), I(e(pe), {
+                          key: 0,
+                          "before-upload": (A) => e(j)(A, 0),
+                          accept: e(R),
+                          openFileDialogOnClick: n.openFileDialogOnClick
+                        }, {
+                          itemRender: q(({ file: A, actions: p }) => g[7] || (g[7] = [])),
+                          default: q(() => [
+                            H(e(te), {
+                              class: "operate-btn m-t-6",
+                              "icon-color": "#fff",
+                              size: "medium"
+                            })
+                          ]),
+                          _: 1
+                          /* STABLE */
+                        }, 8, ["before-upload", "accept", "openFileDialogOnClick"])) : r("v-if", !0),
+                        n.openFileDialogOnClick ? r("v-if", !0) : (d(), I(e(te), {
+                          key: 1,
+                          class: "operate-btn m-t-6",
+                          "icon-color": "#fff",
+                          size: "medium"
+                        }))
+                      ])) : r("v-if", !0),
+                      e(u) !== "info" && n.needDeleteBtn ? (d(), I(e(Ce), {
+                        key: 2,
+                        class: "operate-btn",
+                        "icon-color": "#fff",
+                        size: "medium",
+                        onClick: g[3] || (g[3] = (A) => e(K)(e(l)))
+                      })) : r("v-if", !0)
+                    ],
+                    4
+                    /* STYLE */
+                  )) : r("v-if", !0)
+                ]),
+                _: 1
+                /* STABLE */
+              }, 8, ["class", "spinning"]), [
+                [Q, e(l) && n.status !== "error"]
+              ]),
+              r(" 上传模式，当 url 为空或者 uploading 和 error 时显示 "),
+              B(H(e(Ae), {
+                status: e(u),
+                "onUpdate:status": g[4] || (g[4] = (A) => ue(u) ? u.value = A : null),
+                "max-size": n.maxSize,
+                accept: n.accept,
+                acceptVideo: n.acceptVideo,
+                message: n.message,
+                acceptAudio: n.acceptAudio,
+                autoContentType: n.autoContentType,
+                "custom-check": n.customCheck,
+                "error-message": n.errorMessage,
+                openFileDialogOnClick: n.openFileDialogOnClick,
+                onImageUpload: e(z)
+              }, null, 8, ["status", "max-size", "accept", "acceptVideo", "message", "acceptAudio", "autoContentType", "custom-check", "error-message", "openFileDialogOnClick", "onImageUpload"]), [
+                [Q, f.value]
+              ]),
+              r(" 查看模式 "),
+              B(N(
+                "img",
+                tt,
+                null,
+                512
+                /* NEED_PATCH */
+              ), [
+                [Q, !e(l) && (e(u) === "info" || n.mode === "view")]
+              ])
+            ],
+            4
+            /* STYLE */
+          ),
+          B((d(), h("div", it, [
+            ce(
+              de(s.imageName || e(V)),
+              1
+              /* TEXT */
+            )
+          ])), [
+            [Q, e(l) && n.showImageName && (e(u) === "normal" || e(u) === "info")],
+            [e(fe)]
+          ])
+        ])) : (d(), h(
+          x,
+          { key: 1 },
+          [
+            r(" 多文件 "),
+            N("div", at, [
+              r(" 已上传的图片集合 "),
+              (d(!0), h(
+                x,
+                null,
+                me(e(l), (A, p) => {
+                  var i;
+                  return d(), h("div", {
+                    key: p,
+                    class: "das-ui-image-viewer-container"
+                  }, [
+                    N(
+                      "div",
+                      {
+                        class: "das-ui-image-viewer",
+                        style: $(n.style)
+                      },
+                      [
+                        B(H(e(ve), {
+                          class: _([{ "loading-border": e(J)(p) }]),
+                          type: "component",
+                          spinning: e(J)(p)
+                        }, {
+                          default: q(() => [
+                            e(O)(e(w)[p][0]) === "isImg" ? B((d(), I(e(ge), {
+                              key: 0,
+                              class: _(["image-context", [e(U)]]),
+                              src: e(w)[p][0],
+                              "preview-teleported": !0,
+                              "preview-src-list": e(X) ? e(w)[p] : void 0,
+                              "initial-index": p,
+                              onClick: (c) => e(W)(e(w)[p]),
+                              fit: "cover"
+                            }, null, 8, ["class", "src", "preview-src-list", "initial-index", "onClick"])), [
+                              [Q, !e(J)(p)]
+                            ]) : r("v-if", !0),
+                            r(" 视频 "),
+                            e(O)(e(w)[p][0]) === "isVideo" ? B((d(), I(e(ee), {
+                              key: 1,
+                              mode: e(u) === "info" || n.mode === "view" ? "view" : "normal",
+                              src: e(w)[p][0],
+                              needPreview: n.needPreview,
+                              width: "100%",
+                              height: "100%",
+                              fullPath: "",
+                              "player-props": { videoWidth: n.videoWidth, videoHeight: n.videoHeight }
+                            }, null, 8, ["mode", "src", "needPreview", "player-props"])), [
+                              [Q, !e(J)(p)]
+                            ]) : r("v-if", !0),
+                            r(" 音频 "),
+                            e(O)(e(w)[p][0]) === "isAudio" ? B((d(), I(e(ee), {
+                              key: 2,
+                              mode: e(u) === "info" || n.mode === "view" ? "view" : "normal",
+                              src: e(w)[p][0],
+                              needPreview: n.needPreview,
+                              width: "100%",
+                              height: "100%",
+                              type: "audio",
+                              fullPath: ""
+                            }, null, 8, ["mode", "src", "needPreview"])), [
+                              [Q, !e(J)(p)]
+                            ]) : r("v-if", !0),
+                            !e(E) && e(F) ? (d(), h(
+                              "div",
+                              {
+                                key: 3,
+                                class: "operate-container",
+                                style: $(m.value)
+                              },
+                              [
+                                n.needDownloadBtn ? (d(), I(e(we), {
+                                  key: 0,
+                                  class: "operate-btn",
+                                  size: "medium",
+                                  "icon-color": "#fff",
+                                  onClick: (c) => e(Y)(A, p)
+                                }, null, 8, ["onClick"])) : r("v-if", !0),
+                                e(u) !== "info" && n.needChangeBtn ? (d(), h("div", {
+                                  key: 1,
+                                  class: "change-icon-box",
+                                  onClick: g[5] || (g[5] = (c) => e(M)(e(l)))
+                                }, [
+                                  n.openFileDialogOnClick ? (d(), I(e(pe), {
+                                    key: 0,
+                                    "before-upload": (c) => e(j)(c, p),
+                                    accept: e(R),
+                                    openFileDialogOnClick: n.openFileDialogOnClick
+                                  }, {
+                                    itemRender: q(({ file: c, actions: S }) => g[8] || (g[8] = [])),
+                                    default: q(() => [
+                                      H(e(te), {
+                                        class: "operate-btn m-t-6",
+                                        "icon-color": "#fff",
+                                        size: "medium"
+                                      })
+                                    ]),
+                                    _: 2
+                                    /* DYNAMIC */
+                                  }, 1032, ["before-upload", "accept", "openFileDialogOnClick"])) : r("v-if", !0),
+                                  n.openFileDialogOnClick ? r("v-if", !0) : (d(), I(e(te), {
+                                    key: 1,
+                                    class: "operate-btn m-t-6",
+                                    "icon-color": "#fff",
+                                    size: "medium"
+                                  }))
+                                ])) : r("v-if", !0),
+                                e(u) !== "info" && n.needDeleteBtn ? (d(), I(e(Ce), {
+                                  key: 2,
+                                  class: "operate-btn",
+                                  "icon-color": "#fff",
+                                  size: "medium",
+                                  onClick: (c) => e(K)(A, p)
+                                }, null, 8, ["onClick"])) : r("v-if", !0)
+                              ],
+                              4
+                              /* STYLE */
+                            )) : r("v-if", !0)
+                          ]),
+                          _: 2
+                          /* DYNAMIC */
+                        }, 1032, ["class", "spinning"]), [
+                          [Q, A]
+                        ])
+                      ],
+                      4
+                      /* STYLE */
+                    ),
+                    B((d(), h("div", ot, [
+                      ce(
+                        de(((i = s.imageName) == null ? void 0 : i[p]) || e(L)[p]),
+                        1
+                        /* TEXT */
+                      )
+                    ])), [
+                      [Q, A && n.showImageName && !e(J)(p)],
+                      [e(fe)]
+                    ])
+                  ]);
+                }),
+                128
+                /* KEYED_FRAGMENT */
+              )),
+              r(" 查看模式下，默认占位符 "),
+              n.mode === "view" ? (d(!0), h(
+                x,
+                { key: 0 },
+                me(n.limitNum - e(l).length, (A) => (d(), h("div", nt, g[9] || (g[9] = [
+                  N(
+                    "div",
+                    { class: "das-ui-image-viewer" },
+                    [
+                      N("img", {
+                        class: "no-data-img",
+                        src: se,
+                        alt: ""
+                      })
+                    ],
+                    -1
+                    /* HOISTED */
+                  )
+                ])))),
+                256
+                /* UNKEYED_FRAGMENT */
+              )) : r("v-if", !0),
+              r(" 图片数量未到达最大数量限制时，显示上传组件 "),
+              n.mode === "upload" && e(u) !== "info" && e(l).length < n.limitNum ? (d(), h("div", st, [
+                N("div", rt, [
+                  H(e(Ae), {
+                    status: e(u),
+                    "onUpdate:status": g[6] || (g[6] = (A) => ue(u) ? u.value = A : null),
+                    "max-size": n.maxSize,
+                    accept: n.accept,
+                    acceptVideo: n.acceptVideo,
+                    acceptAudio: n.acceptAudio,
+                    message: n.message,
+                    "custom-check": n.customCheck,
+                    "error-message": n.errorMessage,
+                    openFileDialogOnClick: n.openFileDialogOnClick,
+                    onImageUpload: e(z)
+                  }, null, 8, ["status", "max-size", "accept", "acceptVideo", "acceptAudio", "message", "custom-check", "error-message", "openFileDialogOnClick", "onImageUpload"])
+                ])
+              ])) : r("v-if", !0),
+              r(" 当图片状态为查看态且无数据时，显示无数据图片 "),
+              e(u) === "info" && e(l).length === 0 ? (d(), h("div", lt, g[10] || (g[10] = [
+                N(
+                  "img",
+                  {
+                    class: "no-data-img",
+                    src: se,
+                    alt: ""
+                  },
+                  null,
+                  -1
+                  /* HOISTED */
+                )
+              ]))) : r("v-if", !0)
+            ])
+          ],
+          2112
+          /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
+        ))
+      ],
+      2112
+      /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
+    ));
+  }
+}), ct = (t, a) => {
+  const s = t.__vccOpts || t;
+  for (const [o, m] of a)
+    s[o] = m;
+  return s;
+}, dt = /* @__PURE__ */ ct(ut, [["__scopeId", "data-v-43332e9a"]]), mt = {
+  "--das-ui-image-viewer-bg-color": { light: "rgba(0, 0, 0, 0.5)" },
+  "--das-ui-image-viewer-btn-hover": { light: "#87A9FF" },
+  "--das-ui-image-viewer-btn-active": { light: "#276FF5" }
+}, Tt = Pe(dt);
+Oe(mt);
+export {
+  Tt as DasImageViewer,
+  Tt as default,
+  Ye as minioUpload,
+  Ze as useCalculateSize
+};