xiaoy
/
contract-business-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

完成预付款登记前完成支付表格填写

Browse Source
master
lynn 8 months ago
parent 63e03e782c
commit d8d035824f
1 changed files with 167 additions and 66 deletions
Show Stats Download Patch File Download Diff File

233
src/views/contract/contractList.vue
Unescape View File

@ -164,14 +164,14 @@
<template v-if="scope.row.assurance_status==1"> <template v-if="scope.row.assurance_status==1">
<!-- 那么必须财务审核通过--> <!-- 那么必须财务审核通过-->
<Button class="slot-btns-item" size="small" type="primary" <Button class="slot-btns-item" size="small" type="primary"
@click="$refs['paymentRegistration'].getContract(scope.row),$refs['paymentRegistration'].isShowPaymentRegistration = true"> @click="checkFormsBeforePayment(scope.row)">
付款登记 付款登记
</Button> </Button>
</template> </template>
</template> </template>
<template v-else> <template v-else>
<Button class="slot-btns-item" size="small" type="primary" <Button class="slot-btns-item" size="small" type="primary"
@click="$refs['paymentRegistration'].getContract(scope.row),$refs['paymentRegistration'].isShowPaymentRegistration = true"> @click="checkFormsBeforePayment(scope.row)">
付款登记 付款登记
</Button> </Button>
</template> </template>
@ -510,44 +510,66 @@
<div slot="footer"> <div slot="footer">
<div class="modal-footer"> <div class="modal-footer">
<Button v-if="currentStep > 1" @click="prevStep" class="action-button">上一步</Button> <!-- 从付款登记进入时的按钮控制 -->
<Button v-if="currentStep < 3" type="primary" @click="nextStep" class="action-button">下一步</Button> <template v-if="isFromPayment">
<!-- 当有事前支付表格且未显示事后支付表格时 --> <!-- 只显示事前支付表格时 -->
<template v-if="currentStep === 3 && form.before_contract_template && !form.showAfterPayment"> <template v-if="form.before_contract_template && !form.showAfterPayment && (!form.contract_template || form.forms)">
<!-- 新增模式下显示跳过按钮 --> <Button type="primary" @click="submit" class="action-button">提交</Button>
<template v-if="!isEditMode">
<Button type="primary" @click="nextPaymentStep" class="action-button">下一步</Button>
<Button @click="skipPrePayment" class="action-button">跳过，稍后填写</Button>
</template> </template>
<!-- 编辑模式下，只有当before_forms为空时才显示跳过按钮 --> <!-- 只显示事后支付表格时 -->
<template v-else-if="(!form.before_forms || form.before_forms.trim() === '' || !form.skipBeforeTemplate)"> <template v-else-if="form.contract_template && form.showAfterPayment && (!form.before_contract_template || form.before_forms)">
<Button type="primary" @click="nextPaymentStep" class="action-button">下一步</Button> <Button type="primary" @click="submit" class="action-button">提交</Button>
<Button @click="skipPrePayment" class="action-button">跳过，稍后填写</Button>
</template> </template>
<!-- 编辑模式下，如果before_forms不为空，只显示下一步按钮 --> <!-- 两个表格都没填写时 -->
<template v-else> <template v-else-if="form.before_contract_template && !form.showAfterPayment && form.contract_template && !form.forms">
<Button type="primary" @click="nextPaymentStep" class="action-button">下一步</Button> <Button type="primary" @click="nextPaymentStep" class="action-button">下一步</Button>
</template> </template>
</template> <!-- 其他情况 -->
<!-- 当显示事后支付表格时 --> <template v-else>
<template v-else-if="currentStep === 3 && form.contract_template">
<!-- 新增模式下显示跳过按钮 -->
<template v-if="!isEditMode">
<Button type="primary" @click="submit" class="action-button">提交</Button> <Button type="primary" @click="submit" class="action-button">提交</Button>
<Button @click="skipPostPayment" class="action-button">跳过，稍后填写</Button>
</template> </template>
<!-- 编辑模式下，只有当forms为空时才显示跳过按钮 --> </template>
<template v-else-if="(!form.forms || form.forms.trim() === '' || !form.skipAfterTemplate)"> <!-- 正常编辑模式时的按钮控制 -->
<Button type="primary" @click="submit" class="action-button">提交</Button> <template v-else>
<Button @click="skipPostPayment" class="action-button">跳过，稍后填写</Button> <Button v-if="currentStep > 1" @click="prevStep" class="action-button">上一步</Button>
<Button v-if="currentStep < 3" type="primary" @click="nextStep" class="action-button">下一步</Button>
<!-- 当有事前支付表格且未显示事后支付表格时 -->
<template v-if="currentStep === 3 && form.before_contract_template && !form.showAfterPayment">
<!-- 新增模式下显示跳过按钮 -->
<template v-if="!isEditMode">
<Button type="primary" @click="nextPaymentStep" class="action-button">下一步</Button>
<Button @click="skipPrePayment" class="action-button">跳过，稍后填写</Button>
</template>
<!-- 编辑模式下，只有当before_forms为空时才显示跳过按钮 -->
<template v-else-if="(!form.before_forms || form.before_forms.trim() === '' || !form.skipBeforeTemplate)">
<Button type="primary" @click="nextPaymentStep" class="action-button">下一步</Button>
<Button @click="skipPrePayment" class="action-button">跳过，稍后填写</Button>
</template>
<!-- 编辑模式下，如果before_forms不为空，只显示下一步按钮 -->
<template v-else>
<Button type="primary" @click="nextPaymentStep" class="action-button">下一步</Button>
</template>
</template> </template>
<!-- 编辑模式下，如果forms不为空，只显示提交按钮 --> <!-- 当显示事后支付表格时 -->
<template v-else> <template v-else-if="currentStep === 3 && form.contract_template">
<Button type="primary" @click="submit" class="action-button">提交</Button> <!-- 新增模式下显示跳过按钮 -->
<template v-if="!isEditMode">
<Button type="primary" @click="submit" class="action-button">提交</Button>
<Button @click="skipPostPayment" class="action-button">跳过，稍后填写</Button>
</template>
<!-- 编辑模式下，只有当forms为空时才显示跳过按钮 -->
<template v-else-if="(!form.forms || form.forms.trim() === '' || !form.skipAfterTemplate)">
<Button type="primary" @click="submit" class="action-button">提交</Button>
<Button @click="skipPostPayment" class="action-button">跳过，稍后填写</Button>
</template>
<!-- 编辑模式下，如果forms不为空，只显示提交按钮 -->
<template v-else>
<Button type="primary" @click="submit" class="action-button">提交</Button>
</template>
</template> </template>
<!-- 当没有支付表格时，只显示"提交"按钮 -->
<Button v-else-if="currentStep === 3" type="primary" @click="submit" class="action-button">提交</Button>
</template> </template>
<!-- 当没有支付表格时，只显示"提交"按钮 -->
<Button v-else-if="currentStep === 3" type="primary" @click="submit" class="action-button">提交</Button>
<Button @click="cancel" class="action-button">取消</Button> <Button @click="cancel" class="action-button">取消</Button>
</div> </div>
</div> </div>
@ -643,7 +665,8 @@ import {
addContrant, addContrant,
delContract, delContract,
checkContractName, checkContractName,
editorContract editorContract,
detailContract
} from "@/api/contract/contract" } from "@/api/contract/contract"
import { import {
getparameter getparameter
@ -906,6 +929,9 @@ export default {
return '无' return '无'
} }
switch (value) { switch (value) {
case 0:
return "无"
break;
case 1: case 1:
return "待申请" return "待申请"
break; break;
@ -930,6 +956,9 @@ export default {
return '无' return '无'
} }
switch (value) { switch (value) {
case 0:
return "无"
break;
case 1: case 1:
return "待申请" return "待申请"
break; break;
@ -957,6 +986,9 @@ export default {
return '无' return '无'
} }
switch (value) { switch (value) {
case 0:
return "无"
break;
case 1: case 1:
return "待申请" return "待申请"
break; break;
@ -981,6 +1013,9 @@ export default {
return "无" return "无"
} }
switch (value) { switch (value) {
case 0:
return "无"
break;
case 1: case 1:
return "待申请" return "待申请"
break; break;
@ -1297,7 +1332,7 @@ export default {
payee: '' payee: ''
} }
], ],
showAfterPayment: false, // 是否显示事后支付表格 showAfterPayment: true, // 是否显示事后支付表格
contract_carry_department: [] // 新增执行科室字段 contract_carry_department: [] // 新增执行科室字段
}, },
categoryOptions: [], categoryOptions: [],
@ -1324,6 +1359,7 @@ export default {
plan: [], // 添加这个来存储选中的预算计划 plan: [], // 添加这个来存储选中的预算计划
isEditMode: false, // 添加编辑模式标识 isEditMode: false, // 添加编辑模式标识
currentContractId: null, // 添加当前编辑的合同ID currentContractId: null, // 添加当前编辑的合同ID
isFromPayment: false, // 是否从付款登记进入
} }
}, },
methods: { methods: {
@ -1421,6 +1457,11 @@ export default {
} }
} }
switch (row.req_status) { switch (row.req_status) {
case 0:
return {
'color': 'rgb(140,140,140)'
}
break;
case 1: case 1:
return { return {
'color': 'rgb(96,109,241)' 'color': 'rgb(96,109,241)'
@ -1449,6 +1490,11 @@ export default {
} }
} }
switch (row.purchase_status) { switch (row.purchase_status) {
case 0:
return {
'color': 'rgb(140,140,140)'
}
break;
case 1: case 1:
return { return {
'color': 'rgb(96,109,241)' 'color': 'rgb(96,109,241)'
@ -1477,6 +1523,11 @@ export default {
} }
} }
switch (row.invite_status) { switch (row.invite_status) {
case 0:
return {
'color': 'rgb(140,140,140)'
}
break;
case 1: case 1:
return { return {
'color': 'rgb(96,109,241)' 'color': 'rgb(96,109,241)'
@ -1505,6 +1556,11 @@ export default {
} }
} }
switch (row.join_status) { switch (row.join_status) {
case 0:
return {
'color': 'rgb(140,140,140)'
}
break;
case 1: case 1:
return { return {
'color': 'rgb(96,109,241)' 'color': 'rgb(96,109,241)'
@ -1868,6 +1924,8 @@ export default {
//提交新建 //提交新建
async submit() { async submit() {
try { try {
console.log(this.form.showAfterPayment);
// 保存事前支付表格的数据 // 保存事前支付表格的数据
if (!this.form.showAfterPayment && this.form.before_contract_template) { if (!this.form.showAfterPayment && this.form.before_contract_template) {
// 获取所有输入控件 // 获取所有输入控件
@ -1957,6 +2015,7 @@ export default {
submitData.contract_type = this.form.contractType submitData.contract_type = this.form.contractType
submitData.purchase_type_id = this.form.purchaseForm submitData.purchase_type_id = this.form.purchaseForm
submitData.purchase_way_id = this.form.purchaseMethod submitData.purchase_way_id = this.form.purchaseMethod
submitData.plan_price = this.form.price
// 处理事前支付模板 // 处理事前支付模板
if (this.form.skipBeforeTemplate && !this.isEditMode) { if (this.form.skipBeforeTemplate && !this.isEditMode) {
@ -2145,6 +2204,8 @@ export default {
} }
}); });
console.log(missingFields);
if (missingFields.length > 0) { if (missingFields.length > 0) {
this.$Message.warning('请填写所有必填项'); this.$Message.warning('请填写所有必填项');
return; return;
@ -2640,39 +2701,39 @@ export default {
}, },
// 切换到事后支付表格 // 切换到事后支付表格
nextPaymentStep() { nextPaymentStep() {
// 保存事前支付表格的数据 // 保存事前支付表格的数据
if (this.form.before_contract_template && !this.form.showAfterPayment) { if (this.form.before_contract_template && !this.form.showAfterPayment) {
// 获取所有输入控件 // 获取所有输入控件
const inputs = this.$refs.beforePaymentForm.querySelectorAll('input, select, textarea'); const inputs = this.$refs.beforePaymentForm.querySelectorAll('input, select, textarea');
// 遍历所有输入控件，更新值到 HTML // 遍历所有输入控件，更新值到 HTML
inputs.forEach(input => { inputs.forEach(input => {
const fieldName = input.getAttribute('data-field'); const fieldName = input.getAttribute('data-field');
if (fieldName) { if (fieldName) {
const field = this.form.before_contract_template.contract_template_fields.find(f => f.field === fieldName); const field = this.form.before_contract_template.contract_template_fields.find(f => f.field === fieldName);
if (field) { if (field) {
if (input.type === 'checkbox' || input.type === 'radio') { if (input.type === 'checkbox' || input.type === 'radio') {
// 对于复选框和单选框，需要找到选中的值 // 对于复选框和单选框，需要找到选中的值
const checkedInput = this.$refs.beforePaymentForm.querySelector(`[data-field="${fieldName}"]:checked`); const checkedInput = this.$refs.beforePaymentForm.querySelector(`[data-field="${fieldName}"]:checked`);
field.value = checkedInput ? checkedInput.value : ''; field.value = checkedInput ? checkedInput.value : '';
// 更新 HTML 中的 checked 状态 // 更新 HTML 中的 checked 状态
if (checkedInput) { if (checkedInput) {
checkedInput.setAttribute('checked', 'checked'); checkedInput.setAttribute('checked', 'checked');
}
} else {
field.value = input.value;
// 更新 HTML 中的 value
input.setAttribute('value', input.value);
} }
} else {
field.value = input.value;
// 更新 HTML 中的 value
input.setAttribute('value', input.value);
} }
} }
} });
});
// 获取更新后的 HTML
// 获取更新后的 HTML const beforeFormHtml = this.$refs.beforePaymentForm.innerHTML;
const beforeFormHtml = this.$refs.beforePaymentForm.innerHTML;
// 更新模板和保存数据
// 更新模板和保存数据 this.form.before_forms = beforeFormHtml;
this.form.before_forms = beforeFormHtml;
} }
this.form.showAfterPayment = true; this.form.showAfterPayment = true;
}, },
@ -2745,11 +2806,12 @@ export default {
}, },
// 编辑按钮点击事件 // 编辑按钮点击事件
async handleEdit(row) { async handleEdit(row, isFromPayment = false) {
this.isEditMode = true; this.isEditMode = true;
this.currentContractId = row.id; this.currentContractId = row.id;
this.isShowAdd = true; this.isShowAdd = true;
this.currentStep = 1; this.currentStep = 1; // 始终保持初始值为1
this.isFromPayment = isFromPayment; // 设置是否从付款登记进入
try { try {
// 1. 先获取分类选项 // 1. 先获取分类选项
@ -2789,8 +2851,6 @@ export default {
if (detail.purchase_way_id) { if (detail.purchase_way_id) {
this.form.purchaseMethod = detail.purchase_way_id; this.form.purchaseMethod = detail.purchase_way_id;
} }
console.log("detail", detail);
// 保存其他表单数据 // 保存其他表单数据
this.form = { this.form = {
@ -2831,6 +2891,15 @@ export default {
if (this.form.plan && this.form.plan.length > 0) { if (this.form.plan && this.form.plan.length > 0) {
this.form.plan_display = this.form.plan.map(item => item.label).join(', '); this.form.plan_display = this.form.plan.map(item => item.label).join(', ');
} }
// 如果是从付款登记进入,手动触发流程
if (isFromPayment) {
this.disablePrevStep = true;
// 手动触发第一步到第二步的流程
await this.nextStep();
// 手动触发第二步到第三步的流程
await this.nextStep();
}
} }
} catch (error) { } catch (error) {
console.error('初始化编辑数据失败:', error); console.error('初始化编辑数据失败:', error);
@ -3024,6 +3093,38 @@ export default {
return true; return true;
}, },
async checkFormsBeforePayment(row) {
try {
// 获取最新的合同详情
const res = await detailContract({ id: row.id });
if (res) {
console.log("detail", res);
// 检查是否有事前支付表格且未填写
if (res.before_contract_template && !res.before_forms) {
// 有事前支付表格但未填写,进入编辑模式
await this.handleEdit(row, true);
return;
}
// 检查是否有事后支付表格且未填写
if (res.contract_template && !res.forms) {
// 有事后支付表格但未填写,进入编辑模式
await this.handleEdit(row, true);
return;
}
// 如果都有填写或没有配置支付表格,则继续付款登记流程
this.$refs['paymentRegistration'].getContract(row);
this.$refs['paymentRegistration'].isShowPaymentRegistration = true;
} else {
this.$Message.error('获取合同详情失败');
}
} catch (error) {
console.error('Error checking forms:', error);
this.$Message.error('检查表单时发生错误');
}
},
}, },
mounted() { mounted() {
this.window.width = screen.availWidth * 0.95 this.window.width = screen.availWidth * 0.95

Write Preview
Loading…
Cancel
Save