luohairen
2024-12-12 2c9999d20ae7e98cb1ac31ff5b4594ce4c49a9d6
src/components/FileUpload/index.vue
@@ -2,6 +2,7 @@
  <div class="upload-file">
    <el-upload
      multiple
      :accept="acceptList"
      :action="uploadFileUrl"
      :before-upload="handleBeforeUpload"
      :file-list="fileList"
@@ -15,7 +16,7 @@
      ref="fileUpload"
    >
      <!-- 上传按钮 -->
      <el-button size="mini" type="primary">选取文件</el-button>
      <el-button icon="el-icon-upload2" size="small" type="primary">上传</el-button>
      <!-- 上传提示 -->
      <div class="el-upload__tip" slot="tip" v-if="showTip">
        请上传
@@ -55,7 +56,7 @@
    // 大小限制(MB)
    fileSize: {
      type: Number,
      default: 5,
      default: 20,
    },
    // 文件类型, 例如['png', 'jpg', 'jpeg']
    fileType: {
@@ -109,6 +110,11 @@
    showTip() {
      return this.isShowTip && (this.fileType || this.fileSize);
    },
    acceptList () {
      let temp = '.*'
      temp = this.fileType.map(item => '.' + item).join(',')
      return temp
    }
  },
  methods: {
    // 上传前校检格式和大小
@@ -119,14 +125,9 @@
        const fileExt = fileName[fileName.length - 1];
        const isTypeOk = this.fileType.indexOf(fileExt) >= 0;
        if (!isTypeOk) {
          this.$modal.msgError(`文件格式不正确,请上传${this.fileType.join("/")}格式文件!`);
          this.$modal.msgError(`文件格式不正确, 请上传${this.fileType.join("/")}格式文件!`);
          return false;
        }
      }
      // 校检文件名是否包含特殊字符
      if (file.name.includes(',')) {
        this.$modal.msgError('文件名不正确,不能包含英文逗号!');
        return false;
      }
      // 校检文件大小
      if (this.fileSize) {
@@ -152,7 +153,7 @@
    // 上传成功回调
    handleUploadSuccess(res, file) {
      if (res.code === 200) {
        this.uploadList.push({ name: res.fileName, url: res.fileName });
        this.uploadList.push({ name: res.newFileName, originalName: res.originalFilename , url: res.fileName });
        this.uploadedSuccessfully();
      } else {
        this.number--;
@@ -165,7 +166,9 @@
    // 删除文件
    handleDelete(index) {
      this.fileList.splice(index, 1);
      this.$emit("input", this.listToString(this.fileList));
      // this.$emit("input", this.listToString(this.fileList));
      //修改为返回数组
      this.$emit("input", this.fileList);
    },
    // 上传结束处理
    uploadedSuccessfully() {
@@ -173,7 +176,9 @@
        this.fileList = this.fileList.concat(this.uploadList);
        this.uploadList = [];
        this.number = 0;
        this.$emit("input", this.listToString(this.fileList));
        // this.$emit("input", this.listToString(this.fileList));
        //修改为返回数组
        this.$emit("input", this.fileList);
        this.$modal.closeLoading();
      }
    },