'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var vue = require('vue');
var antDesignVue = require('ant-design-vue');
var uploadDrag = require('./upload-drag.js');
require('../../../utils/index.js');
var createNamespace = require('../../../utils/create-namespace.js');

"use strict";
const _hoisted_1 = { class: "ant-upload-drag-icon" };
const _hoisted_2 = { class: "ant-upload-hint" };
var _sfc_main = /* @__PURE__ */ vue.defineComponent({
  ...{ name: "LlUploadDrag" },
  __name: "upload-drag",
  props: uploadDrag.ILlUploadDragProps,
  emits: [
    "update:value",
    "customRequest",
    "cancel",
    "confirm"
  ],
  setup(__props, { emit: __emit }) {
    const attrs = vue.useAttrs();
    const bem = createNamespace.createNamespace("upload-drag");
    const props = __props;
    const emits = __emit;
    const visible = vue.ref(false);
    const originalFileList = vue.ref([]);
    const fileList = vue.ref([]);
    const checkFileType = (file) => {
      if (!props.accept) return true;
      const extension = file.name.split(".").pop()?.toLowerCase() || "";
      const allowedExtensions = props.accept.split(",").map((ext) => ext.trim().replace(".", "").toLowerCase());
      const isValid = allowedExtensions.includes(extension);
      if (!isValid) {
        const allowedFormats = allowedExtensions.join("/");
        antDesignVue.message.error(`${file.name} \u9700\u8981\u4E3A ${allowedFormats} \u683C\u5F0F`);
        return false;
      }
      return true;
    };
    const checkFileSize = (file) => {
      const isSize = !props.fileSize ? true : file.size <= props.fileSize;
      if (!isSize) {
        antDesignVue.message.error(`${file.name} \u6587\u4EF6\u8FC7\u5927`);
        return false;
      }
      return true;
    };
    const beforeUpload = async (file) => {
      return checkFileType(file) && checkFileSize(file);
    };
    const customRequest = async (res) => {
      console.log(res);
      fileList.value.push(res.file);
      emits("customRequest", res);
    };
    const handleRemove = async (e) => {
      fileList.value = fileList.value.filter((item) => item.uid !== e.uid);
    };
    const handleDragReject = () => {
      antDesignVue.message.error("\u8BF7\u4E0A\u4F20\u6B63\u786E\u7684\u6587\u4EF6\u683C\u5F0F");
    };
    const handleClickCancelBtn = () => {
      fileList.value = originalFileList.value;
      emits("update:value", originalFileList.value);
      emits("cancel");
      visible.value = false;
    };
    const handleClickOkBtn = () => {
      emits("update:value", fileList.value);
      emits("confirm");
      visible.value = false;
    };
    vue.watchEffect(() => {
      if (visible.value) {
        originalFileList.value = [...props.value];
      }
    });
    vue.watch(
      () => props.value,
      (arr) => {
        fileList.value = arr;
      }
    );
    return (_ctx, _cache) => {
      const _component_ll_icon = vue.resolveComponent("ll-icon");
      const _component_a_upload_dragger = vue.resolveComponent("a-upload-dragger");
      const _component_ll_new_modal = vue.resolveComponent("ll-new-modal");
      const _component_ll_button = vue.resolveComponent("ll-button");
      return vue.openBlock(), vue.createElementBlock(
        vue.Fragment,
        null,
        [
          vue.createVNode(_component_ll_new_modal, {
            class: vue.normalizeClass(vue.unref(bem).b()),
            title: "\u4E0A\u4F20\u6587\u4EF6",
            open: visible.value,
            keyboard: false,
            "mask-closable": false,
            width: "900px",
            onCancel: handleClickCancelBtn,
            onOk: handleClickOkBtn
          }, {
            default: vue.withCtx(() => [
              vue.createElementVNode(
                "div",
                {
                  class: vue.normalizeClass(vue.unref(bem).e("content"))
                },
                [
                  vue.createVNode(_component_a_upload_dragger, vue.mergeProps(vue.unref(attrs), {
                    accept: props.accept,
                    multiple: props.multiple,
                    "file-size": props.fileSize,
                    "before-upload": beforeUpload,
                    "custom-request": customRequest,
                    "file-list": fileList.value,
                    onReject: handleDragReject,
                    onRemove: handleRemove
                  }), {
                    iconRender: vue.withCtx(() => [
                      vue.createVNode(_component_ll_icon, { "icon-name": "icon-add" })
                    ]),
                    removeIcon: vue.withCtx(() => [
                      vue.createVNode(_component_ll_icon, { "icon-name": "icon-delete" })
                    ]),
                    default: vue.withCtx(() => [
                      vue.createElementVNode("p", _hoisted_1, [
                        vue.createVNode(_component_ll_icon, {
                          "icon-name": "icon-add",
                          color: "#1890ff"
                        })
                      ]),
                      _cache[2] || (_cache[2] = vue.createElementVNode(
                        "p",
                        { class: "ant-upload-text" },
                        [
                          vue.createTextVNode(" \u5C06\u6587\u4EF6\u62D6\u5230\u6B64\u5904\uFF0C\u6216 "),
                          vue.createElementVNode("a", null, "\u70B9\u51FB\u4E0A\u4F20")
                        ],
                        -1
                        /* CACHED */
                      )),
                      vue.createElementVNode(
                        "p",
                        _hoisted_2,
                        vue.toDisplayString(props.tip ? props.tip : "\u652F\u6301\u5355\u4E2A\u6216\u591A\u4E2A\u4E0A\u4F20\uFF0C\u4E25\u7981\u4E0A\u4F20\u516C\u53F8\u6570\u636E\u6216\u5176\u4ED6\u88AB\u7981\u6B62\u7684\u6587\u4EF6\uFF01"),
                        1
                        /* TEXT */
                      )
                    ]),
                    _: 1
                    /* STABLE */
                  }, 16, ["accept", "multiple", "file-size", "file-list"])
                ],
                2
                /* CLASS */
              )
            ]),
            _: 1
            /* STABLE */
          }, 8, ["class", "open"]),
          !_ctx.$slots.buttonContent ? (vue.openBlock(), vue.createBlock(_component_ll_button, {
            key: 0,
            disabled: props.disabled,
            onClick: _cache[0] || (_cache[0] = ($event) => visible.value = true)
          }, {
            icon: vue.withCtx(() => [
              vue.createVNode(_component_ll_icon, { "icon-name": "icon-upload" })
            ]),
            default: vue.withCtx(() => [
              _cache[3] || (_cache[3] = vue.createTextVNode(
                " \u4E0A\u4F20\u6587\u4EF6 ",
                -1
                /* CACHED */
              ))
            ]),
            _: 1
            /* STABLE */
          }, 8, ["disabled"])) : (vue.openBlock(), vue.createBlock(_component_ll_button, {
            key: 1,
            type: "link",
            class: "button-content-btn",
            disabled: props.disabled,
            onClick: _cache[1] || (_cache[1] = ($event) => visible.value = true)
          }, {
            default: vue.withCtx(() => [
              vue.renderSlot(_ctx.$slots, "buttonContent")
            ]),
            _: 3
            /* FORWARDED */
          }, 8, ["disabled"]))
        ],
        64
        /* STABLE_FRAGMENT */
      );
    };
  }
});

exports.default = _sfc_main;
//# sourceMappingURL=upload-drag.vue2.js.map
