taoge_xiaodi/td_official
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(ctr): 优化合同付款比例输入

Browse Source 
- 在收入合同列表中添加预付款比例、尾款比例、质保金比例和付款比例列
- 在合同表单中将预付款比例、尾款比例和质保金比例的输入框改为专用的数字输入框
- 新增付款比例计算逻辑，确保四项比例之和为 100%
- 优化表单验证逻辑，确保付款比例之和必须等于 100%
- 修复了一些与输入格式相关的潜在问题
This commit is contained in:
tcy
2025-08-22 11:11:19 +08:00
parent a437d7a485
commit c1512c5a34
2 changed files with 29 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/views/ctr/incomeContract/index.vue
View File

@ -64,6 +64,10 @@
<el-table-column label="业主单位" align="center" prop="contractOwner" />
<el-table-column label="承包内容" align="center" prop="contractedContent" />
<el-table-column label="合同金额" align="center" prop="amount" />
<el-table-column label="预付款比例(%)" align="center" prop="advancePayRatio" />
<el-table-column label="尾款比例(%)" align="center" prop="balancePayRatio" />
<el-table-column label="质保金比例(%)" align="center" prop="assuranceDepositRatio" />
<el-table-column label="付款比例(%)" align="center" prop="payRatio" />
<el-table-column label="备注" align="center" prop="remark" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope">

37
src/views/ctr/index.vue
View File

@ -107,20 +107,16 @@
</el-select>
</el-form-item>
<el-form-item label="预付款比例（%）" prop="advancePayRatio">
<el-input v-model="form.advancePayRatio" placeholder="请输入预付款比例"
oninput="value=value.replace(/[^0-9.]/g,'').replace(/\.{2,}/g,'.').replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3')" />
<el-input-number v-model="form.advancePayRatio" :max="100" :min="0" />
</el-form-item>
<el-form-item label="尾款比例（%）" prop="balancePayRatio">
<el-input v-model="form.balancePayRatio" placeholder="请输入尾款比例"
oninput="value=value.replace(/[^0-9.]/g,'').replace(/\.{2,}/g,'.').replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3')" />
<el-input-number v-model="form.balancePayRatio" :max="100" :min="0" />
</el-form-item>
<el-form-item label="质保金比例（%）" prop="assuranceDepositRatio;">
<el-input v-model="form.assuranceDepositRatio" placeholder="请输入质保金比例"
oninput="value=value.replace(/[^0-9.]/g,'').replace(/\.{2,}/g,'.').replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3')" />
<el-form-item label="质保金比例（%）" prop="assuranceDepositRatio">
<el-input-number v-model="form.assuranceDepositRatio" :max="100" :min="0" />
</el-form-item>
<el-form-item label="付款比例（%）" prop="payRatio">
<el-input v-model="form.payRatio" placeholder="请输入付款比例"
oninput="value=value.replace(/[^0-9.]/g,'').replace(/\.{2,}/g,'.').replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3')" />
<el-input-number v-model="payRatioComputed" disabled />
</el-form-item>
<el-form-item>
<div>
@ -198,7 +194,7 @@ const payMentRules = {
advancePayRatio: [{ required: true, message: '请输入预付款比例', trigger: 'blur' }],
balancePayRatio: [{ required: true, message: '请输入尾款比例', trigger: 'blur' }],
assuranceDepositRatio: [{ required: true, message: '请输入质保金比例', trigger: 'blur' }],
payRatio: [{ required: true, message: '请输入付款比例', trigger: 'blur' }],
};
const project = computed(() => {
@ -207,6 +203,16 @@ const project = computed(() => {
return JSON.parse(localStorage.getItem("selectedProject"))
});
const payRatioComputed = computed({
get: () => {
const { advancePayRatio = 0, balancePayRatio = 0, assuranceDepositRatio = 0 } = form.value;
const total = 100 - (advancePayRatio + balancePayRatio + assuranceDepositRatio);
// form.value.payRatio = total;
return total;
},
// 只读
set: () => { }
});
const checkContractType = (type) => {
contract_type.value = type;
form.value.contract_type = type;
@ -282,10 +288,16 @@ const resetForm = () => {
}, 0);
};
const submitForm = async () => {
console.log(payMentRef.value);
await payMentRef.value.validate(async (valid) => {
if (valid) {
if (payRatioComputed.value < 0) {
ElMessage.error('四项付款比例之和必须等于100%');
return;
}
form.value.payRatio = payRatioComputed.value;
// 提交付款信息逻辑
console.log('提交付款信息', form.value, fileList.value);
// 这里可以调用API提交数据
@ -304,6 +316,7 @@ const submitForm = async () => {
}
resetForm();
ElMessage.success('合同提交成功');
active.value = 0; // 重置步骤
} else {
ElMessage.error('请填写完整的付款信息');
}