108 lines
		
	
	
		
			2.6 KiB
		
	
	
	
		
			Plaintext
		
	
	
			
		
		
	
	
			108 lines
		
	
	
		
			2.6 KiB
		
	
	
	
		
			Plaintext
		
	
	
<template>
 | 
						|
  <el-form
 | 
						|
    ref="uploadExcel"
 | 
						|
    class="upload-excel-file"
 | 
						|
  >
 | 
						|
    <!-- 文件 -->
 | 
						|
    <el-form-item :label="$t('trials:consistencyCheck:label:file')">
 | 
						|
      <div class="upload-container">
 | 
						|
        <el-upload
 | 
						|
          class="upload-demo"
 | 
						|
          action
 | 
						|
          accept=".xlsx,.xls,.csv"
 | 
						|
          :before-upload="beforeUpload"
 | 
						|
          :http-request="handleUploadFile"
 | 
						|
          :on-preview="handlePreview"
 | 
						|
          :show-file-list="true"
 | 
						|
          :limit="1"
 | 
						|
          :on-exceed="handleExceed"
 | 
						|
        >
 | 
						|
          <el-button size="small" type="primary" :loading="btnLoading">
 | 
						|
            {{ $t('trials:consistencyCheck:dialogButton:upload') }}
 | 
						|
          </el-button>
 | 
						|
          <span
 | 
						|
            slot="tip"
 | 
						|
            style="margin-left:10px;"
 | 
						|
            class="el-upload__tip"
 | 
						|
          >
 | 
						|
            ({{ $t('trials:consistencyCheck:message:excelFileOnly') }})
 | 
						|
          </span>
 | 
						|
        </el-upload>
 | 
						|
      </div>
 | 
						|
    </el-form-item>
 | 
						|
  </el-form>
 | 
						|
</template>
 | 
						|
<script>
 | 
						|
import { uploadVisitCheckExcel } from '@/api/trials'
 | 
						|
export default {
 | 
						|
  data() {
 | 
						|
    return {
 | 
						|
      btnLoading: false,
 | 
						|
      trialId: this.$route.query.trialId
 | 
						|
    }
 | 
						|
  },
 | 
						|
  methods: {
 | 
						|
    beforeUpload(file) {
 | 
						|
      // 检测文件类型是否符合要求
 | 
						|
      if (this.checkFileSuffix(file.name)) {
 | 
						|
        return true
 | 
						|
      } else {
 | 
						|
        // Must be xls or xlsx format
 | 
						|
        this.$alert(this.$t('trials:consistencyCheck:message:xlsx'))
 | 
						|
 | 
						|
        return false
 | 
						|
      }
 | 
						|
    },
 | 
						|
    handleUploadFile(param) {
 | 
						|
      this.btnLoading = true
 | 
						|
      uploadVisitCheckExcel(this.trialId, param.file).then(res => {
 | 
						|
        this.btnLoading = false
 | 
						|
        this.$emit('refreshTable')
 | 
						|
      }).catch(() => {
 | 
						|
        this.btnLoading = false
 | 
						|
      })
 | 
						|
    },
 | 
						|
    handlePreview(file) {
 | 
						|
      if (file.fullPath) {
 | 
						|
        window.open(file.fullPath, '_blank')
 | 
						|
      }
 | 
						|
    },
 | 
						|
    handleExceed(files, fileList) {
 | 
						|
      // Upload is currently limited to 1 file
 | 
						|
      this.$message.warning(this.$t('trials:consistencyCheck:message:onlyOneFile'))
 | 
						|
    },
 | 
						|
    checkFileSuffix(fileName) {
 | 
						|
      var typeArr = ['xls', 'xlsx', 'csv']
 | 
						|
      var extendName = fileName.substring(fileName.lastIndexOf('.') + 1).toLocaleLowerCase()
 | 
						|
      if (typeArr.indexOf(extendName) !== -1) {
 | 
						|
        return true
 | 
						|
      } else {
 | 
						|
        return false
 | 
						|
      }
 | 
						|
    }
 | 
						|
  }
 | 
						|
}
 | 
						|
</script>
 | 
						|
 | 
						|
<style lang="scss">
 | 
						|
.upload-excel-file{
 | 
						|
  .upload-container .el-upload--text {
 | 
						|
    border: none;
 | 
						|
    width: 80px;
 | 
						|
    height: 40px;
 | 
						|
  }
 | 
						|
  .upload-container .el-input--small {
 | 
						|
    margin-bottom: 5px;
 | 
						|
  }
 | 
						|
  .upload-container .el-icon-circle-check {
 | 
						|
    color: #00d1b2;
 | 
						|
    font-size: 13px;
 | 
						|
  }
 | 
						|
  .account_item_clear{
 | 
						|
    .el-tag__close{
 | 
						|
      display: none !important;
 | 
						|
    }
 | 
						|
  }
 | 
						|
}
 | 
						|
</style>
 |