zyAdmin/node_modules/@form-create/component-elm-upload/dist/index.es.js

/*!
 * FormCreate 低代码表单渲染器
 * @form-create/component-elm-upload v2.6.3
 * (c) 2018-2024 xaboy
 * Github https://github.com/xaboy/form-create
 * Site https://form-create.com/
 * Released under the MIT License.
 */
(function(){"use strict";try{if(typeof document!="undefined"){var o=document.createElement("style");o.appendChild(document.createTextNode("._fc-upload .fc-files img{width:100%;height:100%;display:inline-block;vertical-align:top}._fc-upload .fc-upload-btn{border:1px dashed #c0ccda;cursor:pointer}._fc-upload .fc-upload-cover{opacity:0;position:absolute;inset:0;background:#0009;-webkit-transition:opacity .3s;-o-transition:opacity .3s;transition:opacity .3s}._fc-upload .fc-upload-cover i{color:#fff;font-size:20px;cursor:pointer;margin:0 2px}._fc-upload .fc-files:hover .fc-upload-cover{opacity:1}._fc-upload .el-upload{display:block}._fc-upload .fc-upload-btn,._fc-upload .fc-files{display:inline-block;width:58px;height:58px;text-align:center;line-height:58px;border:1px solid #c0ccda;border-radius:4px;overflow:hidden;background:#fff;position:relative;-webkit-box-shadow:2px 2px 5px rgba(0,0,0,.1);box-shadow:2px 2px 5px #0000001a;margin-right:4px;-webkit-box-sizing:border-box;box-sizing:border-box}")),document.head.appendChild(o)}}catch(i){console.error("vite-plugin-css-injected-by-js",i)}})();
function f(e) {
  return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
}
function n() {
  return n = Object.assign ? Object.assign.bind() : function(e) {
    for (var t, i = 1; i < arguments.length; i++) for (var s in t = arguments[i], t) Object.prototype.hasOwnProperty.call(t, s) && (e[s] = t[s]);
    return e;
  }, n.apply(this, arguments);
}
var m = ["attrs", "props", "domProps"], y = ["class", "style", "directives"], g = ["on", "nativeOn"], k = function(e) {
  return e.reduce(function(t, i) {
    for (var s in i) if (!t[s]) t[s] = i[s];
    else if (m.indexOf(s) !== -1) t[s] = n({}, t[s], i[s]);
    else if (y.indexOf(s) !== -1) {
      var h = t[s] instanceof Array ? t[s] : [t[s]], u = i[s] instanceof Array ? i[s] : [i[s]];
      t[s] = [].concat(h, u);
    } else if (g.indexOf(s) !== -1)
      for (var r in i[s]) if (t[s][r]) {
        var d = t[s][r] instanceof Array ? t[s][r] : [t[s][r]], c = i[s][r] instanceof Array ? i[s][r] : [i[s][r]];
        t[s][r] = [].concat(d, c);
      } else t[s][r] = i[s][r];
    else if (s === "hook") for (var o in i[s]) t[s][o] = t[s][o] ? v(t[s][o], i[s][o]) : i[s][o];
    else t[s] = i[s];
    return t;
  }, {});
}, v = function(e, t) {
  return function() {
    e && e.apply(this, arguments), t && t.apply(this, arguments);
  };
}, I = k;
const l = /* @__PURE__ */ f(I);
function a(e) {
  return Array.isArray(e) ? e : [null, void 0, ""].indexOf(e) > -1 ? [] : [e];
}
function w(e, t) {
  return Object.keys(e).reduce((i, s) => ((!t || t.indexOf(s) === -1) && i.push(e[s]), i), []);
}
function p(e, t) {
  return {
    url: e,
    name: $(e),
    uid: t
  };
}
function $(e) {
  return ("" + e).split("/").pop();
}
const F = "fcUpload", j = {
  name: F,
  props: {
    formCreateInject: {
      type: Object,
      required: !0
    },
    onHandle: {
      type: Function,
      default(e) {
        this.previewImage = e.url, this.previewVisible = !0;
      }
    },
    uploadType: {
      type: String,
      default: "file"
    },
    limit: {
      type: Number,
      default: 0
    },
    allowRemove: {
      type: Boolean,
      default: !0
    },
    previewMask: void 0,
    modalTitle: String,
    handleIcon: {
      type: [String, Boolean],
      default: () => {
      }
    },
    value: [Array, String]
  },
  data() {
    return {
      uploadList: [],
      previewVisible: !1,
      previewImage: "",
      cacheFiles: []
    };
  },
  created() {
    this.formCreateInject.prop.props.showFileList === void 0 && (this.formCreateInject.prop.props.showFileList = !1), this.formCreateInject.prop.props.fileList = a(this.value).map(p);
  },
  watch: {
    value(e) {
      this.$refs.upload.uploadFiles.every((t) => !t.status || t.status === "success") && (this.$refs.upload.uploadFiles = a(e).map(p), this.uploadList = this.$refs.upload.uploadFiles);
    },
    limit(e, t) {
      (t === 1 || e === 1) && this.update();
    }
  },
  methods: {
    key(e) {
      return e;
    },
    isDisabled() {
      return this.formCreateInject.prop.props.disabled === !0;
    },
    onRemove(e) {
      this.isDisabled() || this.$refs.upload.handleRemove(e);
    },
    handleClick(e) {
      this.onHandle(e);
    },
    makeItem(e, t) {
      const i = this.$createElement;
      return this.uploadType === "image" ? i("img", {
        attrs: {
          src: e.url
        },
        key: this.key("img" + t)
      }) : i("i", {
        class: "el-icon-tickets",
        key: this.key("i" + t)
      });
    },
    makeRemoveIcon(e, t) {
      const i = this.$createElement;
      return i("i", {
        class: "el-icon-delete",
        on: {
          click: () => this.onRemove(e)
        },
        key: this.key("ri" + t)
      });
    },
    makeHandleIcon(e, t) {
      const i = this.$createElement;
      return i("i", {
        class: this.handleIcon === !0 || this.handleIcon === void 0 ? "el-icon-view" : this.handleIcon,
        on: {
          click: () => this.handleClick(e)
        },
        key: this.key("hi" + t)
      });
    },
    makeProgress(e, t) {
      const i = this.$createElement;
      return i("ElProgress", l([{}, {
        props: {
          percentage: e.percentage,
          type: "circle",
          width: 52
        }
      }, {
        style: "margin-top:2px;",
        key: this.key("pg" + t)
      }]));
    },
    makeIcons(e, t) {
      const i = this.$createElement, s = [];
      if (this.allowRemove || this.handleIcon !== !1)
        return (this.uploadType !== "file" && this.handleIcon !== !1 || this.uploadType === "file" && this.handleIcon) && s.push(this.makeHandleIcon(e, t)), this.allowRemove && s.push(this.makeRemoveIcon(e, t)), i("div", {
          class: "fc-upload-cover"
        }, [s]);
    },
    makeFiles() {
      const e = this.$createElement;
      return this.uploadList.map((t, i) => this.$scopedSlots.fileList ? this.$scopedSlots.fileList({
        file: t,
        index: i,
        vm: this
      }) : e("div", {
        key: this.key(i),
        class: "fc-files"
      }, [t.percentage !== void 0 && t.status !== "success" ? this.makeProgress(t, i) : [this.makeItem(t, i), this.makeIcons(t, i)]]));
    },
    makeUpload() {
      const e = this.$createElement, t = !this.limit || this.limit > this.uploadList.length;
      return e("ElUpload", l([{}, this.formCreateInject.prop, {}, {
        style: {
          display: "inline-block"
        },
        key: this.key("upload"),
        ref: "upload"
      }]), [t ? e("template", {
        slot: "default"
      }, [this.$slots.default || e("div", {
        class: "fc-upload-btn"
      }, [e("i", {
        class: "el-icon-upload2"
      })])]) : null, w(this.$slots, ["default"])]);
    },
    update() {
      let e = this.$refs.upload.uploadFiles.map((t) => t.url).filter((t) => t !== void 0 && t.indexOf("blob:") !== 0);
      JSON.stringify(e) !== JSON.stringify(this.cacheFiles) && (this.cacheFiles = [...e], this.$emit("input", this.limit === 1 ? e[0] || "" : e));
    },
    handleCancel() {
      this.previewVisible = !1;
    }
  },
  render() {
    const e = arguments[0];
    return this.$refs.upload && (this.formCreateInject.prop.props.showFileList === void 0 && (this.formCreateInject.prop.props.showFileList = this.$refs.upload.showFileList), this.formCreateInject.prop.props.fileList = this.$refs.upload.fileList), e("div", {
      class: "_fc-upload"
    }, [[this.formCreateInject.prop.props.showFileList ? [] : this.makeFiles(), this.makeUpload()], e("el-dialog", l([{}, {
      props: {
        appendToBody: !0,
        modal: this.previewMask,
        title: this.modalTitle,
        visible: this.previewVisible
      }
    }, {
      on: {
        close: this.handleCancel
      }
    }]), [e("img", {
      attrs: {
        alt: "example",
        src: this.previewImage
      },
      style: "width: 100%"
    })])]);
  },
  mounted() {
    this.uploadList = this.$refs.upload.uploadFiles, this.$watch(() => this.$refs.upload.uploadFiles, () => {
      this.update();
    }, {
      deep: !0
    }), this.$emit("fc.el", this.$refs.upload);
  }
};
export {
  j as default
};