yk-element-components/upload/index.mjs

import { reactive as C, ref as b, resolveComponent as f, openBlock as v, createElementBlock as F, Fragment as B, createVNode as c, isRef as x, withCtx as U, renderSlot as S, unref as d } from "vue";
const E = {
  __name: "index",
  props: {
    showFileList: {
      type: Boolean,
      default: !0
    },
    cropperWidth: {
      type: Number,
      default: 150
    },
    cropperHeight: {
      type: Number,
      default: 150
    },
    cropBoxResizable: {
      type: Boolean,
      default() {
        return !0;
      }
    },
    guides: {
      type: Boolean,
      default() {
        return !0;
      }
    },
    action: {
      type: String,
      required: !1,
      default: "#"
    },
    aspectRatio: {
      type: Number,
      default: 1 / 1
    },
    headers: {
      type: Object,
      default() {
        return {};
      }
    },
    data: Object,
    multiple: Boolean,
    name: {
      type: String,
      default: "file"
    },
    drag: Boolean,
    accept: String,
    beforeUpload: Function,
    beforeRemove: Function,
    onRemove: {
      type: Function,
      default: () => {
      }
    },
    onChange: {
      type: Function,
      default: () => {
      }
    },
    onPreview: {
      type: Function
    },
    onSuccess: {
      type: Function,
      default: () => {
      }
    },
    onProgress: {
      type: Function,
      default: () => {
      }
    },
    onError: {
      type: Function,
      default: () => {
      }
    },
    fileList: {
      type: Array,
      default() {
        return [];
      }
    },
    autoUpload: {
      type: Boolean,
      default: !0
    },
    listType: {
      type: String,
      default: "text"
    },
    httpRequest: Function,
    disabled: Boolean,
    limit: Number,
    onExceed: {
      type: Function,
      default: () => {
      }
    },
    orCropper: {
      type: Boolean,
      default: !1
    },
    type: {
      type: String,
      default: "select"
    }
  },
  setup(e) {
    const a = e;
    let l = C({
      show: !1,
      file: null,
      loading: !1,
      submitted: !1,
      uploadFiles: []
    });
    const p = (t, o) => {
      let n = new FileReader();
      n.onload = (i) => {
        typeof o == "function" && o(i.target.result);
      }, n.readAsDataURL(t);
    }, r = b(), m = (t, o) => {
      t.status === "ready" && (a.orCropper ? y({
        ...t,
        file: t.raw,
        fileList: o
      }) : a.autoUpload && (r.value.submit(), s())), a.onChange(t, o);
    }, y = (t) => {
      if (t.file instanceof File) {
        if (l.show)
          return;
        l.file = t.file, l.show = !0;
      }
    }, s = () => {
      const t = a.fileList;
      t.splice(t.indexOf(l.file), 1), l.show = !1;
    }, h = (t) => {
      if (t) {
        let o = new File([t], l.file.name, {
          type: t.type
        }), n = a.fileList[a.fileList.length - 1];
        o.uid = n.raw.uid, n.raw = o, p(n.raw, (i) => {
          n.url = i, a.autoUpload && r.value.submit(), s();
        });
      } else
        a.autoUpload && r.value.submit(), s();
    }, g = () => {
    }, R = () => {
    }, w = () => {
    };
    return (t, o) => {
      const n = f("el-upload"), i = f("yk-imgCropper");
      return v(), F(B, null, [
        c(n, {
          ref_key: "yUpload",
          ref: r,
          "auto-upload": !1,
          action: e.action,
          headers: e.headers,
          data: e.data,
          multiple: e.multiple,
          name: e.name,
          drag: e.drag,
          accept: e.accept,
          type: e.type,
          beforeUpload: e.beforeUpload,
          beforeRemove: e.beforeRemove,
          onRemove: e.onRemove,
          onChange: m,
          onPreview: e.onPreview,
          onSuccess: e.onSuccess,
          onProgress: e.onProgress,
          onError: e.onError,
          "file-list": e.fileList,
          "onUpdate:file-list": o[0] || (o[0] = (u) => x(fileList) ? fileList.value = u : null),
          listType: e.listType,
          httpRequest: e.httpRequest,
          disabled: e.disabled,
          limit: e.limit,
          onExceed: e.onExceed,
          "show-file-list": e.showFileList
        }, {
          default: U(() => [
            S(t.$slots, "default")
          ]),
          _: 3
        }, 8, ["action", "headers", "data", "multiple", "name", "drag", "accept", "type", "beforeUpload", "beforeRemove", "onRemove", "onPreview", "onSuccess", "onProgress", "onError", "file-list", "listType", "httpRequest", "disabled", "limit", "onExceed", "show-file-list"]),
        c(i, {
          show: d(l).show,
          "onUpdate:show": o[1] || (o[1] = (u) => d(l).show = u),
          file: d(l).file,
          aspectRatio: e.aspectRatio,
          aspectRatioDeviation: 0.1,
          cropBoxResizable: e.cropBoxResizable,
          guides: e.guides,
          onConfirm: h,
          onCancel: s,
          onClose: g,
          onOpen: w,
          onClosed: R,
          cropperWidth: e.cropperWidth,
          cropperHeight: e.cropperHeight
        }, null, 8, ["show", "file", "aspectRatio", "aspectRatioDeviation", "cropBoxResizable", "guides", "cropperWidth", "cropperHeight"])
      ], 64);
    };
  }
}, P = {
  install(e) {
    e.component("yk-upload", E);
  }
};
export {
  P as default
};