137 lines
4.6 KiB
Vue
137 lines
4.6 KiB
Vue
<template>
|
||
<div>
|
||
<el-dialog title="上传文件" :visible="true" width="500px" append-to-body :close-on-click-modal="false"
|
||
@close="handleClose">
|
||
<div class="dialog-content dialog-office-batch">
|
||
<div class="p-16 pr-40">
|
||
<el-form ref="ruleFormRepayment"
|
||
:model="repaymentObj"
|
||
:rules="rulesClientRule"
|
||
label-width="100px">
|
||
<el-form-item label="材料类型:" prop="materialType">
|
||
<el-select v-model="repaymentObj.materialType" placeholder="请选择" class="width100">
|
||
<el-option
|
||
v-for="(item,index) in materialTypeOptions"
|
||
:key="index"
|
||
:label="item.label"
|
||
:value="item.value">
|
||
</el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-form-item label="文件上传:" prop="url">
|
||
<upload-file :file-list="fileList" :max-count="1"
|
||
:show-file-name="false"
|
||
uploadName=""
|
||
accept=".jpg,.png,.jpeg,.pdf"
|
||
:span="6"
|
||
:file-size="50"
|
||
@handleUploadFile="handleUploadFile">
|
||
</upload-file>
|
||
</el-form-item>
|
||
<el-form-item label="上传要求:">
|
||
<div style="line-height: 20px;padding-top: 10px">
|
||
<div>请知悉！</div>
|
||
<div>请上传图片或pdf材料，单个文件需要在0KB以上，50MB以内;文件名称中请勿包含换行符、空格、tab&V:?"#*|&"<>%+'等特殊字符。</div>
|
||
<div>文件名称不超过45个字</div>
|
||
</div>
|
||
</el-form-item>
|
||
</el-form>
|
||
|
||
</div>
|
||
|
||
</div>
|
||
<span slot="footer" class="dialog-footer">
|
||
<el-button @click="handleClose()">取消</el-button>
|
||
<el-button type="primary" @click="handleSubmit()">完成</el-button>
|
||
</span>
|
||
</el-dialog>
|
||
</div>
|
||
</template>
|
||
<script>
|
||
import caseMaterial from "@/services/caseMaterial";
|
||
export default {
|
||
components: {
|
||
uploadFile: () => import('@/components/uploadFile.vue'),//上传
|
||
},
|
||
props: {
|
||
eventDialog: {
|
||
type: Object,
|
||
default: () => {
|
||
return {}
|
||
},
|
||
},
|
||
},
|
||
data() {
|
||
return {
|
||
materialTypeOptions: [
|
||
{ label: '身份证件', value: 'IDENTITY' },
|
||
{ label: '金融许可证', value: 'FINANCIAL_LICENSES' },
|
||
{ label: '营业执照', value: 'BUSINESS_LICENSES' },
|
||
{ label: '法定代表人身份证明', value: 'IDENTITY_LEGAL' },
|
||
{ label: '起诉状', value: 'COMPLAINTS' },
|
||
{ label: '证据清单', value: 'EVIDENCE' },
|
||
{ label: '合约', value: 'CONTRACTS' },
|
||
{ label: '申领表', value: 'APPLICATION_FORMS' },
|
||
{ label: '交易明细', value: 'TRANSACTION_DETAILS' },
|
||
{ label: '其他证据', value: 'OTHER' },
|
||
],
|
||
repaymentObj: {
|
||
caseId: '',
|
||
materialType: '',
|
||
category: 'EVIDENTIAL',
|
||
name: '',
|
||
url: '',
|
||
},
|
||
rulesClientRule: {
|
||
materialType: [
|
||
{required: true, message: '请选择', trigger: 'change',},
|
||
],
|
||
url: [
|
||
{ required: true, message: '请上传', trigger: 'change',},
|
||
],
|
||
},
|
||
fileList: [],
|
||
};
|
||
},
|
||
mounted() {
|
||
// console.log(1231)
|
||
},
|
||
methods: {
|
||
handleUploadFile(fileList){
|
||
console.log('获取上传文件信息',fileList)
|
||
fileList = JSON.parse(JSON.stringify(fileList))
|
||
this.fileList = fileList.map((item,i) => {
|
||
return {
|
||
url: item.url,
|
||
fileName: item.fileName,
|
||
previewUrl:item.previewUrl,
|
||
objectName: item.objectName
|
||
}
|
||
})
|
||
this.repaymentObj.name = this.fileList.length?this.fileList[0].objectName : '';
|
||
this.repaymentObj.url = this.fileList.length?this.fileList[0].url : '';
|
||
this.$refs.ruleFormRepayment.clearValidate('url');
|
||
},
|
||
handleClose() {
|
||
this.$emit('update:eventDialog', null)
|
||
},
|
||
handleSubmit() {
|
||
if(!this.$clickThrottle()) { return }//防止重复点击
|
||
this.$refs.ruleFormRepayment.validate((valid) => {
|
||
if (valid) {
|
||
this.repaymentObj.caseId = this.eventDialog.caseId;
|
||
caseMaterial.addCaseFile(this.repaymentObj).then(res => {
|
||
this.$parent.getFileCaseList()
|
||
this.handleClose()
|
||
this.$message.success("操作成功");
|
||
})
|
||
}
|
||
})
|
||
}
|
||
}
|
||
};
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
|
||
</style> |