nidapeng
2024-04-02 adb4be885811ee602073c2e723d9d09df0e5b4e6
company/src/components/common/UploadFile.vue
@@ -3,7 +3,7 @@
    <el-upload
      ref="uploadFileBtn"
      class="upload-demo"
      :accept="uploadData.fileTyp"
      :accept="uploadData.fileType"
      :action="uploadImgUrl"
      :limit="1"
      :before-remove="removes"
@@ -13,7 +13,7 @@
      :before-upload="beforeFileUpload"
      :file-list="fileList">
    <el-button size="small" type="primary"  >点击上传</el-button>
    <div style="display: inline-block"  slot="tip" class="el-upload__tip">(只能上传{{ uploadData.fileType }}文件,且不超过5mb)</div>
    <div style="display: inline-block;position: absolute"  slot="tip" class="el-upload__tip" v-if="showTips">{{'(只能上传'+uploadData.fileType +'文件,且不超过5mb)'}}</div>
  </el-upload>
  </div>
@@ -30,7 +30,14 @@
      type: Object,
      default: () => {}
    },
    tipsLabel: '',
    fileIndex: {
      type: Number,
      default: () =>0
    },
    showTips: {
      type: Boolean,
    default: () => true
    },
    customStyle: {
      type: String,
      default: 'width: 190px; height: 190px;'
@@ -49,6 +56,11 @@
        this.fileList = new Array();
      }
     // alert(this.fileList)
    },
    tipsLabel (nv,ov) {
      if(this.tipsLabel ==null){
        this.tipsLabel = ''
      }
    }
  },
  methods: {
@@ -64,7 +76,7 @@
        let { data } = res
        // this.fileList = [{name: data.originname, url: data.url }]
        this.$message.success('上传成功')
        this.$emit('uploadSuccess', { fileurl: data.imgaddr,  fileurlFull: data.url, name: data.originname })
        this.$emit('uploadSuccess', { fileurl: data.imgaddr,  fileurlFull: data.url, name: data.originname ,index:this.fileIndex})
      } else {
        this.$message.apiFailed('上传失败')
      }
@@ -91,7 +103,7 @@
  height: $image-width;
}
::v-deep .el-upload {
  border: 1px dashed #d9d9d9;
  //border: 1px dashed #d9d9d9;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
@@ -114,7 +126,7 @@
  width: $image-width;
  height: $image-width;
  display: block;
}
}#67C23A
.tips-style {
  height: 13px;
  font-size: 13px;
@@ -128,6 +140,9 @@
  width: 90px !important;
  height: 90px !important;
}
::v-deep .el-upload-list__item-name{
  color: #67C23A;
}
::v-deep .el-upload-list__item {
  width: 80% !important;
  height: 50px !important;