133 lines
3.5 KiB
Plaintext
133 lines
3.5 KiB
Plaintext
<template>
|
|
<div class="upload-container">
|
|
<el-upload
|
|
class="upload-demo"
|
|
action
|
|
:http-request="uploadFile"
|
|
:before-upload="beforeUpload"
|
|
:file-list="fileList"
|
|
:before-remove="beforeRemove"
|
|
:on-remove="handleRemoveFile"
|
|
:on-preview="handlePreview"
|
|
:limit="1"
|
|
:on-exceed="handleExceed"
|
|
accept=".pdf"
|
|
>
|
|
<el-button size="small" type="primary" :disabled="btnDisabled">Upload</el-button>
|
|
<span slot="tip" class="el-upload__tip">(must be in pdf format)</span>
|
|
</el-upload>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import { uploadNonDoctorFile } from '@/api/attachment'
|
|
import { uploadTrialSOW, deleteTrialSOW } from '@/api/financials'
|
|
const type = 'Statement of Work'
|
|
export default {
|
|
name: 'UploadFile',
|
|
props: {
|
|
trialId: {
|
|
type: String,
|
|
required: true
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
fileList: [],
|
|
btnDisabled: false
|
|
}
|
|
},
|
|
methods: {
|
|
initFileList(fileList) {
|
|
this.fileList = fileList
|
|
},
|
|
uploadFile(param) {
|
|
var fileName = param.file.name
|
|
this.btnDisabled = true
|
|
uploadNonDoctorFile(param.file, type)
|
|
.then(res => {
|
|
if (res.IsSuccess) {
|
|
this.fileList.push({ name: fileName, FileName: fileName, Path: res.Result.FilePath, FullPath: res.Result.FullFilePath, Type: type })
|
|
this.saveFile()
|
|
}
|
|
})
|
|
.catch(err => {
|
|
console.log(err)
|
|
this.btnDisabled = false
|
|
})
|
|
},
|
|
saveFile() {
|
|
const { name, Path } = this.fileList[0]
|
|
const param = { SowPath: Path, SowName: name, TrialId: this.trialId }
|
|
uploadTrialSOW(param).then(res => {
|
|
this.btnDisabled = false
|
|
if (res.IsSuccess) {
|
|
this.$message.success('Uploaded successfully')
|
|
this.$emit('getFileList', this.fileList)
|
|
}
|
|
})
|
|
.catch(err => {
|
|
console.log(err)
|
|
this.btnDisabled = false
|
|
})
|
|
},
|
|
beforeUpload(file, fileList) {
|
|
const isValidFile = this.fileValid(file.name, 'pdf')
|
|
if (isValidFile) {
|
|
this.fileList = []
|
|
} else {
|
|
this.$alert('must be in pdf format')
|
|
return false
|
|
}
|
|
},
|
|
beforeRemove(file, fileList) {
|
|
if (file && file.status === 'success') {
|
|
return this.$confirm(`Sure to remove ${file.name}?`)
|
|
}
|
|
},
|
|
handleRemoveFile(file, fileList) {
|
|
if (file && file.status === 'success') {
|
|
const { Path } = this.fileList[0]
|
|
const param = { SowPath: Path, TrialId: this.trialId }
|
|
deleteTrialSOW(param).then(res => {
|
|
if (res.IsSuccess) {
|
|
this.fileList = []
|
|
this.$message({
|
|
message: 'Deleted successfully!',
|
|
type: 'success'
|
|
})
|
|
this.$emit('getFileList', this.fileList)
|
|
}
|
|
})
|
|
}
|
|
},
|
|
handlePreview(file) {
|
|
file.FullPath ? window.open(file.FullPath, '_blank') : ''
|
|
},
|
|
handleExceed(files, fileList) {
|
|
this.$message.warning(`Upload is currently limited to 1 file`)
|
|
},
|
|
fileValid(fileName, typeArr) {
|
|
var extendName = fileName.substring(fileName.lastIndexOf('.') + 1).toLocaleLowerCase()
|
|
if (typeArr.toLocaleLowerCase().indexOf(extendName) > -1) {
|
|
return true
|
|
} else {
|
|
return false
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
<style>
|
|
.upload-container .el-upload--text {
|
|
border: none;
|
|
width: 80px;
|
|
height: 30px;
|
|
}
|
|
.upload-container .el-form-item__label {
|
|
font-size: 12px;
|
|
}
|
|
.upload-container .el-upload-list__item {
|
|
font-size: 12px;
|
|
}
|
|
</style>
|