/**
 * ldesign v0.2.22
 * (c) 2022/12/7 16:21 built by swimly
 * @license MIT
 */

import { defineComponent } from '@vue/composition-api';
import { CloseIcon, TimeFilledIcon, CheckCircleFilledIcon, ErrorCircleFilledIcon, CloseCircleFilledIcon } from '@ldesign/icons-vue';
import { a as abridgeName } from '../../../_chunks/dep-1aa000b6.js';
import { Loading } from '../../loading/index.js';
import { Link } from '../../link/index.js';
import { renderLNodeJSX } from '../../../utils/render-node.js';
import { useGlobalIcon } from '../../../hooks/useGlobalIcon.js';
import { commonProps } from '../const.js';
import '../../../_chunks/dep-eaa95999.js';
import '../../../_chunks/dep-102361be.js';
import '../../../utils/withInstall.js';
import 'vue';
import 'lodash/capitalize';
import '../../../config.js';
import '../../loading/loading.js';
import '../../../utils/dom.js';
import 'raf';
import 'lodash/isString';
import '../../../utils/easing.js';
import '../../../utils/transfer-dom.js';
import '../../config-provider/config-receiver.js';
import 'lodash/mergeWith';
import '../../config-provider/context.js';
import 'lodash/merge';
import '../../../_chunks/dep-b4fd1955.js';
import '../../../utils/mixins.js';
import '../../loading/props.js';
import '../../loading/icon/gradient.js';
import '../../../_chunks/dep-aacc31a3.js';
import '../../../_chunks/dep-c68dc4b6.js';
import '../../../_chunks/dep-1a6bca30.js';
import 'lodash';
import '../../loading/plugin.js';
import '../../link/link.js';
import '../../link/props.js';
import '../../config-provider/useConfig.js';

const NormalFile = defineComponent({
  name: "UploadNormalFile",
  props: {
    multiple: Boolean,
    ...commonProps
  },
  setup(props) {
    const icons = useGlobalIcon({
      CloseIcon: CloseIcon,
      TimeFilledIcon: TimeFilledIcon,
      CheckCircleFilledIcon: CheckCircleFilledIcon,
      ErrorCircleFilledIcon: ErrorCircleFilledIcon,
      CloseCircleFilledIcon: CloseCircleFilledIcon
    });
    const uploadPrefix = `${props.classPrefix}-upload`;
    return {
      uploadPrefix,
      icons
    };
  },
  methods: {
    renderProgress(percent) {
      const h = this.$createElement;
      return h("div", {
        "class": `${this.uploadPrefix}__single-progress`
      }, [h(Loading), h("span", {
        "class": `${this.uploadPrefix}__single-percent`
      }, [percent || 0, "%"])]);
    },
    renderFilePreviewAsText(files) {
      const h = this.$createElement;
      if (this.theme !== "file") return null;
      if (!this.multiple && files[0]?.status === "fail") return null;
      const {
        ErrorCircleFilledIcon,
        TimeFilledIcon,
        CloseIcon
      } = this.icons;
      return files.map((file, index) => h("div", {
        "class": `${this.uploadPrefix}__single-display-text ${this.uploadPrefix}__display-text--margin`,
        "key": file.name + index + file.percent + file.status
      }, [file.url ? h(Link, {
        "attrs": {
          "href": file.url,
          "target": "_blank",
          "hover": "color",
          "size": "small"
        },
        "class": `${this.uploadPrefix}__single-name`
      }, [file.name]) : h("span", {
        "class": `${this.uploadPrefix}__single-name`
      }, [file.name]), file.status === "fail" && h("div", {
        "class": `${this.uploadPrefix}__flow-status`
      }, [h(ErrorCircleFilledIcon)]), file.status === "waiting" && h("div", {
        "class": `${this.uploadPrefix}__flow-status`
      }, [h(TimeFilledIcon)]), file.status === "progress" && this.renderProgress(file.percent), !this.disabled && file.status !== "progress" && h(CloseIcon, {
        "class": `${this.uploadPrefix}__icon-delete`,
        "on": {
          "click": e => this.onRemove({
            e,
            file,
            index
          })
        }
      })]));
    },
    renderFilePreviewAsInput() {
      const h = this.$createElement;
      if (this.theme !== "file-input") return;
      const {
        TimeFilledIcon,
        CheckCircleFilledIcon,
        ErrorCircleFilledIcon,
        CloseCircleFilledIcon
      } = this.icons;
      const file = this.displayFiles[0];
      const inputTextClass = [`${this.classPrefix}-input__inner`, {
        [`${this.uploadPrefix}__placeholder`]: !this.displayFiles[0]
      }];
      const disabledClass = this.disabled ? `${this.classPrefix}-is-disabled` : "";
      const fileName = this.abridgeName?.length && file?.name ? abridgeName(file.name, ...this.abridgeName) : file?.name;
      return h("div", {
        "class": `${this.uploadPrefix}__single-input-preview ${this.classPrefix}-input ${disabledClass}`
      }, [h("div", {
        "class": inputTextClass
      }, [h("span", {
        "class": `${this.uploadPrefix}__single-input-text`
      }, [file?.name ? fileName : this.placeholder]), file?.status === "progress" && this.renderProgress(file.percent), file?.status === "waiting" && h(TimeFilledIcon, {
        "class": `${this.uploadPrefix}__status-icon`
      }), file?.url && file.status === "success" && h(CheckCircleFilledIcon, {
        "class": `${this.uploadPrefix}__status-icon`
      }), file?.name && file.status === "fail" && h(ErrorCircleFilledIcon, {
        "class": `${this.uploadPrefix}__status-icon`
      }), !this.disabled && h(CloseCircleFilledIcon, {
        "class": `${this.uploadPrefix}__single-input-clear`,
        "on": {
          "click": _ref => {
            let {
              e
            } = _ref;
            return this.onRemove({
              e,
              file,
              index: 0
            });
          }
        }
      })])]);
    }
  },
  render() {
    const h = arguments[0];
    const classes = [`${this.uploadPrefix}__single`, `${this.uploadPrefix}__single-${this.theme}`];
    const fileListDisplay = renderLNodeJSX(this, "fileListDisplay", {
      params: {
        files: this.displayFiles
      }
    });
    return h("div", {
      "class": classes
    }, [this.theme === "file-input" && this.renderFilePreviewAsInput(), this.$scopedSlots.default?.(null), this.theme === "file" && this.placeholder && !this.displayFiles[0] && h("small", {
      "class": this.tipsClasses
    }, [this.placeholder]), fileListDisplay || this.renderFilePreviewAsText(this.displayFiles), this.sizeOverLimitMessage && h("small", {
      "class": this.errorClasses
    }, [this.sizeOverLimitMessage]), !this.multiple && this.displayFiles[0]?.status === "fail" && this.theme === "file" ? h("small", {
      "class": this.errorClasses
    }, [this.displayFiles[0].response?.error || this.locale.progress.failText]) : null]);
  }
});

export { NormalFile as default };
//# sourceMappingURL=normal-file.js.map
