ykz-wx/node_modules/vant/lib/uploader/Uploader.js

var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name2 in all)
    __defProp(target, name2, { get: all[name2], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
  // If the importer is in node compatibility mode or this is not an ESM
  // file that has been converted to a CommonJS file using a Babel-
  // compatible transform (i.e. "__esModule" has not been set), then set
  // "default" to the CommonJS "module.exports" for node compatibility.
  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
  mod
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
var stdin_exports = {};
__export(stdin_exports, {
  default: () => stdin_default,
  uploaderProps: () => uploaderProps
});
module.exports = __toCommonJS(stdin_exports);
var import_vue = require("vue");
var import_utils = require("../utils");
var import_utils2 = require("./utils");
var import_use = require("@vant/use");
var import_use_expose = require("../composables/use-expose");
var import_icon = require("../icon");
var import_image_preview = require("../image-preview");
var import_UploaderPreviewItem = __toESM(require("./UploaderPreviewItem"));
const uploaderProps = {
  name: (0, import_utils.makeNumericProp)(""),
  accept: (0, import_utils.makeStringProp)("image/*"),
  capture: String,
  multiple: Boolean,
  disabled: Boolean,
  readonly: Boolean,
  lazyLoad: Boolean,
  maxCount: (0, import_utils.makeNumericProp)(Infinity),
  imageFit: (0, import_utils.makeStringProp)("cover"),
  resultType: (0, import_utils.makeStringProp)("dataUrl"),
  uploadIcon: (0, import_utils.makeStringProp)("photograph"),
  uploadText: String,
  deletable: import_utils.truthProp,
  reupload: Boolean,
  afterRead: Function,
  showUpload: import_utils.truthProp,
  modelValue: (0, import_utils.makeArrayProp)(),
  beforeRead: Function,
  beforeDelete: Function,
  previewSize: [Number, String, Array],
  previewImage: import_utils.truthProp,
  previewOptions: Object,
  previewFullImage: import_utils.truthProp,
  maxSize: {
    type: [Number, String, Function],
    default: Infinity
  }
};
var stdin_default = (0, import_vue.defineComponent)({
  name: import_utils2.name,
  props: uploaderProps,
  emits: ["delete", "oversize", "clickUpload", "closePreview", "clickPreview", "clickReupload", "update:modelValue"],
  setup(props, {
    emit,
    slots
  }) {
    const inputRef = (0, import_vue.ref)();
    const urls = [];
    const reuploadIndex = (0, import_vue.ref)(-1);
    const isReuploading = (0, import_vue.ref)(false);
    const getDetail = (index = props.modelValue.length) => ({
      name: props.name,
      index
    });
    const resetInput = () => {
      if (inputRef.value) {
        inputRef.value.value = "";
      }
    };
    const onAfterRead = (items) => {
      resetInput();
      if ((0, import_utils2.isOversize)(items, props.maxSize)) {
        if (Array.isArray(items)) {
          const result = (0, import_utils2.filterFiles)(items, props.maxSize);
          items = result.valid;
          emit("oversize", result.invalid, getDetail());
          if (!items.length) {
            return;
          }
        } else {
          emit("oversize", items, getDetail());
          return;
        }
      }
      items = (0, import_vue.reactive)(items);
      if (reuploadIndex.value > -1) {
        const arr = [...props.modelValue];
        arr.splice(reuploadIndex.value, 1, items);
        emit("update:modelValue", arr);
        reuploadIndex.value = -1;
      } else {
        emit("update:modelValue", [...props.modelValue, ...(0, import_utils.toArray)(items)]);
      }
      if (props.afterRead) {
        props.afterRead(items, getDetail());
      }
    };
    const readFile = (files) => {
      const {
        maxCount,
        modelValue,
        resultType
      } = props;
      if (Array.isArray(files)) {
        const remainCount = +maxCount - modelValue.length;
        if (files.length > remainCount) {
          files = files.slice(0, remainCount);
        }
        Promise.all(files.map((file) => (0, import_utils2.readFileContent)(file, resultType))).then((contents) => {
          const fileList = files.map((file, index) => {
            const result = {
              file,
              status: "",
              message: "",
              objectUrl: URL.createObjectURL(file)
            };
            if (contents[index]) {
              result.content = contents[index];
            }
            return result;
          });
          onAfterRead(fileList);
        });
      } else {
        (0, import_utils2.readFileContent)(files, resultType).then((content) => {
          const result = {
            file: files,
            status: "",
            message: "",
            objectUrl: URL.createObjectURL(files)
          };
          if (content) {
            result.content = content;
          }
          onAfterRead(result);
        });
      }
    };
    const onChange = (event) => {
      const {
        files
      } = event.target;
      if (props.disabled || !files || !files.length) {
        return;
      }
      const file = files.length === 1 ? files[0] : [].slice.call(files);
      if (props.beforeRead) {
        const response = props.beforeRead(file, getDetail());
        if (!response) {
          resetInput();
          return;
        }
        if ((0, import_utils.isPromise)(response)) {
          response.then((data) => {
            if (data) {
              readFile(data);
            } else {
              readFile(file);
            }
          }).catch(resetInput);
          return;
        }
      }
      readFile(file);
    };
    let imagePreview;
    const onClosePreview = () => emit("closePreview");
    const previewImage = (item) => {
      if (props.previewFullImage) {
        const imageFiles = props.modelValue.filter(import_utils2.isImageFile);
        const images = imageFiles.map((item2) => {
          if (item2.objectUrl && !item2.url && item2.status !== "failed") {
            item2.url = item2.objectUrl;
            urls.push(item2.url);
          }
          return item2.url;
        }).filter(Boolean);
        imagePreview = (0, import_image_preview.showImagePreview)((0, import_utils.extend)({
          images,
          startPosition: imageFiles.indexOf(item),
          onClose: onClosePreview
        }, props.previewOptions));
      }
    };
    const closeImagePreview = () => {
      if (imagePreview) {
        imagePreview.close();
      }
    };
    const deleteFile = (item, index) => {
      const fileList = props.modelValue.slice(0);
      fileList.splice(index, 1);
      emit("update:modelValue", fileList);
      emit("delete", item, getDetail(index));
    };
    const reuploadFile = (index) => {
      isReuploading.value = true;
      reuploadIndex.value = index;
      (0, import_vue.nextTick)(() => chooseFile());
    };
    const onInputClick = () => {
      if (!isReuploading.value) {
        reuploadIndex.value = -1;
      }
      isReuploading.value = false;
    };
    const renderPreviewItem = (item, index) => {
      const needPickData = ["imageFit", "deletable", "reupload", "previewSize", "beforeDelete"];
      const previewData = (0, import_utils.extend)((0, import_utils.pick)(props, needPickData), (0, import_utils.pick)(item, needPickData, true));
      return (0, import_vue.createVNode)(import_UploaderPreviewItem.default, (0, import_vue.mergeProps)({
        "item": item,
        "index": index,
        "onClick": () => emit(props.reupload ? "clickReupload" : "clickPreview", item, getDetail(index)),
        "onDelete": () => deleteFile(item, index),
        "onPreview": () => previewImage(item),
        "onReupload": () => reuploadFile(index)
      }, (0, import_utils.pick)(props, ["name", "lazyLoad"]), previewData), (0, import_utils.pick)(slots, ["preview-cover", "preview-delete"]));
    };
    const renderPreviewList = () => {
      if (props.previewImage) {
        return props.modelValue.map(renderPreviewItem);
      }
    };
    const onClickUpload = (event) => emit("clickUpload", event);
    const renderUpload = () => {
      const lessThanMax = props.modelValue.length < +props.maxCount;
      const Input = props.readonly ? null : (0, import_vue.createVNode)("input", {
        "ref": inputRef,
        "type": "file",
        "class": (0, import_utils2.bem)("input"),
        "accept": props.accept,
        "capture": props.capture,
        "multiple": props.multiple && reuploadIndex.value === -1,
        "disabled": props.disabled,
        "onChange": onChange,
        "onClick": onInputClick
      }, null);
      if (slots.default) {
        return (0, import_vue.withDirectives)((0, import_vue.createVNode)("div", {
          "class": (0, import_utils2.bem)("input-wrapper"),
          "onClick": onClickUpload
        }, [slots.default(), Input]), [[import_vue.vShow, lessThanMax]]);
      }
      return (0, import_vue.withDirectives)((0, import_vue.createVNode)("div", {
        "class": (0, import_utils2.bem)("upload", {
          readonly: props.readonly
        }),
        "style": (0, import_utils.getSizeStyle)(props.previewSize),
        "onClick": onClickUpload
      }, [(0, import_vue.createVNode)(import_icon.Icon, {
        "name": props.uploadIcon,
        "class": (0, import_utils2.bem)("upload-icon")
      }, null), props.uploadText && (0, import_vue.createVNode)("span", {
        "class": (0, import_utils2.bem)("upload-text")
      }, [props.uploadText]), Input]), [[import_vue.vShow, props.showUpload && lessThanMax]]);
    };
    const chooseFile = () => {
      if (inputRef.value && !props.disabled) {
        inputRef.value.click();
      }
    };
    (0, import_vue.onBeforeUnmount)(() => {
      urls.forEach((url) => URL.revokeObjectURL(url));
    });
    (0, import_use_expose.useExpose)({
      chooseFile,
      reuploadFile,
      closeImagePreview
    });
    (0, import_use.useCustomFieldValue)(() => props.modelValue);
    return () => (0, import_vue.createVNode)("div", {
      "class": (0, import_utils2.bem)()
    }, [(0, import_vue.createVNode)("div", {
      "class": (0, import_utils2.bem)("wrapper", {
        disabled: props.disabled
      })
    }, [renderPreviewList(), renderUpload()])]);
  }
});