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

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

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

Write Preview
Loading…
Cancel
Save