sapit-ui-plus/lib/js/SFileUpload.js

import { ref as d, watch as $, onMounted as q, resolveComponent as b, openBlock as s, createElementBlock as u, withModifiers as x, toDisplayString as f, createCommentVNode as c, createVNode as o, withCtx as g, createTextVNode as P, createElementVNode as p } from "vue";
import { r as j, v as z, B as D } from "./index2.js";
import { a as E, d as I, b as V } from "./upload.js";
import { M as H } from "./index7.js";
import { _ as G } from "./index6.js";
const K = { class: "s-file-upload-common" }, X = {
  key: 0,
  class: "head"
}, J = {
  key: 0,
  class: "head"
}, Q = { key: 1 }, W = { class: "preview-content" }, Y = ["src"], Z = {
  __name: "SFileUpload",
  props: {
    /**
     * 文件列表
     * @list
     */
    list: {
      type: Array,
      default: () => []
    },
    /**
     * 标题
     * @label
     */
    label: {
      type: String,
      default: ""
    },
    /**
     * 只读
     * @readonly
    */
    readonly: {
      type: Boolean,
      default: !1
    },
    /**
     * 是否显示删除
     * @delete
    */
    showRemoveIcon: {
      type: Boolean,
      default: !1
    },
    /**
     * 是否显示新增
     * @isAdd
    */
    isAdd: {
      type: Boolean,
      default: !0
    },
    /**
     * 文件类型
     * @accept
    */
    accept: {
      type: String,
      default: ""
    },
    // 展示类型 picture | picture-card 注：规范内不设定text上传类型
    listType: {
      type: String,
      default: "picture"
    },
    maxFileCount: {
      type: Number,
      default: 3
    },
    sizeLimit: {
      type: Number,
      default: 50
    },
    businessTableName: {
      type: String,
      default: "sapit-ui-plus-components-upload"
    },
    businessKey: {
      type: String,
      default: void 0
    },
    showUploadList: {
      type: Boolean,
      default: !0
    }
  },
  setup(l) {
    const m = l, n = d([]), r = d(!1), y = d(""), w = d(""), a = d(0);
    $(() => m.list, (e) => {
      e && e.length && (n.value = e);
    }, { immediate: !0 });
    const L = (e) => {
      const t = e.size / 1024 / 1024 < m.sizeLimit;
      return t || z.warn({
        key: "only-you",
        message: "提醒",
        description: `文件不能大于${m.sizeLimit}MB！`
      }), t;
    }, k = (e) => {
      n.value = e.fileList;
    }, U = ({ onSuccess: e, onError: t, file: i }) => {
      E(i, m.businessTableName, i.uid).then((v) => {
        e();
      }).catch(() => {
        n.value.splice(n.value.length - 1, 1), t();
      });
    }, T = (e) => {
      const t = document.createElement("a");
      t.href = I(e.uid), t.download = "test", t.click();
    }, R = (e) => {
      a.value = n.value.findIndex((t) => t.uid === e.uid), r.value = !0, w.value = e.name || "预览", y.value = e.url || e.thumbUrl;
    }, B = () => {
      r.value = !1;
    }, C = (e) => {
      var t;
      a.value = a.value + e < 0 ? 0 : a.value + e > n.value.length - 1 ? n.value.length - 1 : a.value + e, (t = n.value[a.value]) != null && t.thumbUrl ? (w.value = n.value[a.value].name || "预览", y.value = n.value[a.value].thumbUrl) : F(n.value[a.value]);
    }, F = (e) => {
      if (e.type.includes("office")) {
        const t = window.open("", "");
        t.location = V(e.uid + "/" + e.name);
      } else if (e.type.includes("text"))
        N(e.url);
      else if (e.type.includes("pdf") || e.type.includes("png") || e.type.includes("gif") || e.type.includes("jpeg") || e.type.includes("bmp") || e.type.includes("ico") || e.type.includes("webp")) {
        const t = window.open("", "");
        t.location = e.url;
      } else
        this.$notification.warning({
          message: "不支持此文件类型"
        });
    }, N = (e) => {
      const t = new XMLHttpRequest();
      t.open("GET", e, !0), t.responseType = "blob", t.setRequestHeader("Content-Type", "application/json"), t.onload = function() {
        const i = new Blob([t.response], { type: "application/json;charset=utf-8" }), v = window.URL.createObjectURL(i), h = window.open("", "");
        h.location = v;
      }, t.send();
    };
    return q(() => {
    }), (e, t) => {
      const i = b("PlusOutlined"), v = D, h = G, O = b("LeftOutlined"), S = b("RightOutlined"), A = H;
      return s(), u("div", K, [
        l.isAdd && l.listType === "picture-card" && n.value.length <= l.maxFileCount ? (s(), u("div", X, [
          l.label ? (s(), u("div", {
            key: 0,
            class: "label",
            onClick: t[0] || (t[0] = x(() => {
            }, ["stop"]))
          }, f(l.label), 1)) : c("", !0)
        ])) : c("", !0),
        o(h, {
          accept: l.accept,
          "list-type": l.listType,
          "file-list": n.value,
          disabled: l.readonly,
          maxCount: l.maxFileCount,
          multiple: l.maxFileCount > 1,
          "before-upload": L,
          "custom-request": U,
          onChange: k,
          onPreview: R,
          onDownload: T,
          showUploadList: l.showUploadList
        }, {
          default: g(() => [
            l.isAdd && l.listType === "picture" && n.value.length <= l.maxFileCount ? (s(), u("div", J, [
              l.label ? (s(), u("div", {
                key: 0,
                class: "label",
                onClick: t[1] || (t[1] = x(() => {
                }, ["stop"]))
              }, f(l.label), 1)) : c("", !0),
              o(v, null, {
                default: g(() => [
                  o(i),
                  P(" " + f(e.$l("点击上传", "components.upload")), 1)
                ]),
                _: 1
              })
            ])) : c("", !0),
            l.isAdd && l.listType === "picture-card" && n.value.length <= l.maxFileCount ? (s(), u("span", Q, [
              o(i),
              p("div", null, f(e.$l("点击上传", "components.upload")), 1)
            ])) : c("", !0)
          ]),
          _: 1
        }, 8, ["accept", "list-type", "file-list", "disabled", "maxCount", "multiple", "showUploadList"]),
        o(A, {
          open: r.value,
          title: w.value,
          footer: null,
          onCancel: B,
          width: "800px"
        }, {
          default: g(() => [
            p("div", W, [
              p("div", {
                class: "prev",
                onClick: t[2] || (t[2] = (M) => C(-1))
              }, [
                o(O)
              ]),
              p("img", {
                alt: "example",
                class: "view",
                src: y.value
              }, null, 8, Y),
              p("div", {
                class: "next",
                onClick: t[3] || (t[3] = (M) => C(1))
              }, [
                o(S)
              ])
            ])
          ]),
          _: 1
        }, 8, ["open", "title"])
      ]);
    };
  }
}, ae = /* @__PURE__ */ j(Z, [["__scopeId", "data-v-9a944142"]]);
export {
  ae as default
};