2025-02-24 10:51:47 +08:00

161 lines
6.2 KiB
Vue

<template>
<div>
<el-dialog
title="编辑凭证"
:visible="true"
width="480px"
append-to-body
:close-on-click-modal="false"
@close="handleClose"
>
<div class="dialog-content">
<el-form ref="ruleFormEffect"
:model="Effectobj"
:rules="rulesClientRepayment"
label-width="130px">
<el-form-item label="凭证金额" prop="amount" style="margin-bottom: 10px;">
<el-input class="inputpaddingtop2"
size="small"
placeholder="请输入凭证金额"
v-model="Effectobj.amount">
<template slot="append"></template>
</el-input>
</el-form-item>
<el-form-item label="还款日期" prop="paybackTime" style="margin-bottom: 10px;">
<el-date-picker class="width100" size="small"
v-model="Effectobj.paybackTime"
type="date"
placeholder="选择日期"
value-format="yyyy-MM-dd HH:mm:ss"
format="yyyy-MM-dd">
</el-date-picker>
</el-form-item>
<el-form-item label="备注说明" prop="remark" style="margin-bottom: 10px;">
<el-input
size="small"
clearable
placeholder="请输入备注说明"
v-model="Effectobj.remark">
</el-input>
</el-form-item>
<el-form-item label="凭证" prop="mediaPath">
<upload-file :file-list="fileList" :max-count="1"
:show-file-name="false"
uploadName="支持图片大小不超过10M"
accept=".jpg,.png,.jpeg"
:span="6"
:fileSize="10"
@handleUploadFile="handleUploadFile">
</upload-file>
</el-form-item>
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="handleClose()">取消</el-button>
<el-button type="primary" @click="handleSubmitUpdate()">确认保存</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import api from "@/services/caseManagement";
export default {
components: {
uploadFile: () => import('@/components/uploadFile.vue'),//上传
},
props: {
EffectDialog: {
type: Object,
default: () => {
return {}
},
},
},
data() {
return {
Effectobj:{
mediaPath:[]
},
rulesClientRepayment:{
amount: [
{ required: true, message: '请输入还款金额', trigger: 'change',},
{ pattern: /^[1-9]\d*(,\d{3})*(\.\d{1,2})?$|^0.\d{1,2}$/, message: '请输入2位小数金额', trigger: ['blur', 'change']}
],
paybackTime: [
{ required: true, message: '请选择还款日期', trigger: 'change',},
],
mediaPath: [
{ required: true, message: '请上传文件', trigger: 'change',},
],
},
fileList:[]
};
},
mounted () {
this.Effectobj = JSON.parse(JSON.stringify(this.EffectDialog))
this.Effectobj.mediaPath = JSON.parse(JSON.stringify(this.EffectDialog)).proofUrl
this.fileList = [{url: this.Effectobj.proofUrl,fileName:'上传'}]
},
methods: {
// 修改
handleSubmitUpdate(){
this.$refs.ruleFormEffect.validate((valid) => {
if (valid){
this.Effectobj.createAt =undefined
this.Effectobj.createBy =undefined
this.Effectobj.delFlag =undefined
this.Effectobj.planId =undefined
this.Effectobj.status =undefined
this.Effectobj.updateAt =undefined
this.Effectobj.updateBy =undefined
this.Effectobj.uploaderName =undefined
api.gettraceProof_edit(this.Effectobj).then(res => {
if(!res.code){
this.$parent.getProofList(1)
this.$message.success('编辑成功!')
this.handleClose()
}
})
}
})
},
handleUploadFile(fileList){
// console.log('获取上传文件信息',fileList)
fileList = JSON.parse(JSON.stringify(fileList))
this.fileList = fileList.map((item,i) => {
return {
url: item.url,
fileName:'上传',
previewUrl:item.previewUrl
}
})
this.Effectobj.mediaPath = this.fileList.map((item) => item.url);
},
handleClose() {
this.$emit('update:EffectDialog', null)
},
}
};
</script>
<style scoped lang="scss">
.dialog-content{
padding: 16px 24px;
max-height:500px
}
.department-wrap{
padding: 16px 24px;
max-height: 250px;
.department-wrap-list{
margin-bottom:32px;
}
.department-wrap-list:last-child{
margin-bottom:0;
}
}
.min-height350{min-height: 350px;}
.department-dept ::v-deep .el-checkbox__label {color: $color-000000}
</style>