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 752c943db9
commit c197319c3a
2 changed files with 146 additions and 81 deletions
Show Stats Download Patch File Download Diff File

48
src/views/contract/components/editorContract.vue
Unescape View File

@ -561,23 +561,24 @@
}, },
//选择计划 //选择计划
selectPlan(sel, row) { selectPlan(sel, row) {
if (sel) { if (sel) {
let select = sel.map(item => { let select = sel.map(item => {
return { return {
label: item.name, label: item.name,
value: { value: {
plan_id: item.id, plan_id: item.id,
use_money: item.useMoney, use_money: item.useMoney || 0,
new_money: item.money new_money: item.money
} }
} }
}) })
this.plan = [...this.detail.plan, ...select] // 合并已选计划和新增计划，去重
const existingPlanIds = this.detail.plan.map(p => p.value.plan_id)
const newPlans = select.filter(p => !existingPlanIds.includes(p.value.plan_id))
this.plan = [...this.detail.plan, ...newPlans]
} else { } else {
this.plan = this.detail.plan; this.plan = this.detail.plan
} }
}, },
delPlan(val) { delPlan(val) {
@ -611,15 +612,18 @@
}, },
//默认选择计划 //默认选择计划
toggleSelection(plans) { toggleSelection(plans) {
var selPlans = [...this.detail.plan, ...this.plan] if (plans && plans.length > 0) {
if (plans) { this.plans.forEach(plan => {
this.plans.filter(plan => { const isSelected = plans.includes(plan.id)
if (plans.includes(plan.id)) { if (isSelected) {
plan.useMoney = selPlans[plans.indexOf(plan.id)].value.use_money const selectedPlan = this.plan.find(p => p.value.plan_id === plan.id)
return true if (selectedPlan) {
plan.useMoney = selectedPlan.value.use_money
}
this.$nextTick(() => {
this.$refs.editorPlanTable.toggleRowSelection(plan, true)
})
} }
}).map(row => {
this.$refs.editorPlanTable.toggleRowSelection(row)
}) })
} else { } else {
this.$refs.editorPlanTable.clearSelection() this.$refs.editorPlanTable.clearSelection()
@ -632,14 +636,14 @@
this.contrantId = res.id this.contrantId = res.id
this.detail = { this.detail = {
name: res.name, name: res.name,
is_simple:res?.is_simple, is_simple: res?.is_simple,
has_charge: res?.has_charge, has_charge: res?.has_charge,
date: res.date, date: res.date,
req_status: res.req_status, req_status: res.req_status,
purchase_status: res.purchase_status, purchase_status: res.purchase_status,
join_status: res.join_status, join_status: res.join_status,
invite_status: res.invite_status, invite_status: res.invite_status,
supply:res?.supply, supply: res?.supply,
type: res.type, type: res.type,
methods: res.purchase_type_id, methods: res.purchase_type_id,
modality: res.purchase_way_id, modality: res.purchase_way_id,
@ -649,13 +653,12 @@
price: res.plan_price, price: res.plan_price,
isBudget: res.is_plan === 1 ? true : false, isBudget: res.is_plan === 1 ? true : false,
plan: res.plans.map(item => { plan: res.plans.map(item => {
const planLink = res.plan_link.find(link => link.plan_id === item.id)
return { return {
label: item.name, label: item.name,
value: { value: {
plan_id: item.id, plan_id: item.id,
use_money: res.plan_link.filter(item1 => { use_money: planLink ? planLink.use_money : 0,
return item1.plan_id === item.id
})[0].use_money,
new_money: item.money new_money: item.money
} }
} }
@ -664,15 +667,8 @@
gov_plane: res.gov_plane, gov_plane: res.gov_plane,
contract_carry_department: res.contract_carry_department.map(i => i.carry_department_id) contract_carry_department: res.contract_carry_department.map(i => i.carry_department_id)
} }
this.plan = [...this.detail.plan]
this.$refs['govPlane'].selected = res.gov_plane this.$refs['govPlane'].selected = res.gov_plane
this.plan = this.detail.plan
this.oaFlow = {
hetonghuiqian: res.join_last_flow_id,
caigou: res.purchase_last_flow_id,
zhaobiaowenjianshencha: res.invite_last_flow_id,
qingshi: res.req_last_flow_id
}
}, },
//y验证合同的名称是否存在重复 //y验证合同的名称是否存在重复
checkName(e) { checkName(e) {

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

@ -493,12 +493,12 @@
<!-- 事前支付表格 --> <!-- 事前支付表格 -->
<div v-if="form.before_contract_template && !form.showAfterPayment" class="form-section"> <div v-if="form.before_contract_template && !form.showAfterPayment" class="form-section">
<div class="section-title">事前支付表格</div> <div class="section-title">事前支付表格</div>
<div ref="beforePaymentForm" v-html="form.before_contract_template.template"></div> <div ref="beforePaymentForm" v-html="isEditMode ? (form.before_forms || form.before_contract_template.template) : form.before_contract_template.template"></div>
</div> </div>
<!-- 事后支付表格 --> <!-- 事后支付表格 -->
<div v-else-if="form.contract_template" class="form-section"> <div v-else-if="form.contract_template" class="form-section">
<div class="section-title">事后支付表格</div> <div class="section-title">事后支付表格</div>
<div ref="afterPaymentForm" v-html="form.contract_template.template"></div> <div ref="afterPaymentForm" v-html="isEditMode ? (form.forms || form.contract_template.template) : form.contract_template.template"></div>
</div> </div>
<!-- 无支付表格提示 --> <!-- 无支付表格提示 -->
<div v-else class="form-section"> <div v-else class="form-section">
@ -512,15 +512,39 @@
<div class="modal-footer"> <div class="modal-footer">
<Button v-if="currentStep > 1" @click="prevStep" 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> <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="currentStep === 3 && form.before_contract_template && !form.showAfterPayment">
<Button type="primary" @click="nextPaymentStep" class="action-button">下一步</Button> <!-- 新增模式下显示跳过按钮 -->
<Button @click="skipPrePayment" 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>
<!-- 编辑模式下，只有当before_forms为空时才显示跳过按钮 -->
<template v-else-if="!form.before_forms || form.before_forms.trim() === ''">
<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>
<!-- 当显示事后支付表格时，显示"提交"和"跳过"按钮 --> <!-- 当显示事后支付表格时 -->
<template v-else-if="currentStep === 3 && form.contract_template"> <template v-else-if="currentStep === 3 && form.contract_template">
<Button type="primary" @click="submit" class="action-button">提交</Button> <!-- 新增模式下显示跳过按钮 -->
<Button @click="skipPostPayment" 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() === ''">
<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> <Button v-else-if="currentStep === 3" type="primary" @click="submit" class="action-button">提交</Button>
@ -995,7 +1019,13 @@ export default {
width: 320, width: 320,
align: "left", align: "left",
customFn: (row) => { customFn: (row) => {
return row.plans.map(item => `[${item.year}] - ${item.name}`).join('，') return row.plans.map(item => {
return (
<div>
[{item.year}] - {item.name}
</div>
)
})
} }
}, },
{ {
@ -1234,6 +1264,10 @@ export default {
purchaseForm: '', purchaseForm: '',
purchaseSubForm: '', purchaseSubForm: '',
purchaseMethod: '', purchaseMethod: '',
forms:'',
before_forms:'',
other_data:[],
before_other_data:[],
name: '', name: '',
type: '', // 项目类型 type: '', // 项目类型
moneyWay: [], moneyWay: [],
@ -1800,8 +1834,8 @@ export default {
} }
// 设置表单数据 // 设置表单数据
this.form.plan = this.plan this.form.plan = this.plan
// 设置显示文本 // 设置显示文本，使用换行符分隔
this.form.plan_display = this.plan.map(item => item.label).join(', ') this.form.plan_display = this.plan.map(item => item.label).join('\n')
// 关闭对话框 // 关闭对话框
this.isShowPlan = false this.isShowPlan = false
}, },
@ -1835,7 +1869,7 @@ export default {
...this.form, ...this.form,
is_plan: this.form.isBudget ? 1 : 0, is_plan: this.form.isBudget ? 1 : 0,
money_way_id: this.form.moneyWay.join(','), money_way_id: this.form.moneyWay.join(','),
plans: this.form.plan.map(item => ({ contract_plan_links: this.form.plan.map(item => ({
plan_id: item.value.plan_id, plan_id: item.value.plan_id,
use_money: item.value.use_money use_money: item.value.use_money
})), })),
@ -1844,6 +1878,12 @@ export default {
})) }))
}; };
submitData.contract_category = this.form.category
submitData.work_type = this.form.affairType
submitData.contract_type = this.form.contractType
submitData.purchase_type_id = this.form.purchaseForm
submitData.purchase_way_id = this.form.purchaseMethod
// 处理事前支付模板 // 处理事前支付模板
if (this.form.skipBeforeTemplate) { if (this.form.skipBeforeTemplate) {
// 如果用户选择跳过，提交空的模板和字段列表 // 如果用户选择跳过，提交空的模板和字段列表
@ -1995,6 +2035,10 @@ export default {
} else if (this.currentStep === 2) { } else if (this.currentStep === 2) {
this.$refs.basicInfoForm.validate((valid) => { this.$refs.basicInfoForm.validate((valid) => {
if (valid) { if (valid) {
// 在进入第三步之前，重置 showAfterPayment 状态
if (this.form.before_contract_template) {
this.form.showAfterPayment = false;
}
this.currentStep++; this.currentStep++;
} }
}); });
@ -2004,48 +2048,53 @@ export default {
}, },
prevStep() { prevStep() {
// 如果在事后支付表格，先保存内容 if (this.currentStep === 3) {
if (this.currentStep === 3 && this.form.showAfterPayment && // 如果在事后支付表格，先保存内容
this.form.contract_template && if (this.form.showAfterPayment &&
this.form.contract_template.contract_template_fields && this.form.contract_template &&
this.$refs.afterPaymentForm) { this.form.contract_template.contract_template_fields &&
// 获取所有输入控件 this.$refs.afterPaymentForm) {
const inputs = this.$refs.afterPaymentForm.querySelectorAll('input, select, textarea'); // 获取所有输入控件
const inputs = this.$refs.afterPaymentForm.querySelectorAll('input, select, textarea');
// 遍历所有输入控件，更新值到 HTML
inputs.forEach(input => { // 遍历所有输入控件，更新值到 HTML
const fieldName = input.getAttribute('data-field'); inputs.forEach(input => {
if (fieldName) { const fieldName = input.getAttribute('data-field');
const field = this.form.contract_template.contract_template_fields.find(f => f.field === fieldName); if (fieldName) {
if (field) { const field = this.form.contract_template.contract_template_fields.find(f => f.field === fieldName);
if (input.type === 'checkbox' || input.type === 'radio') { if (field) {
// 对于复选框和单选框，需要找到选中的值 if (input.type === 'checkbox' || input.type === 'radio') {
const checkedInput = this.$refs.afterPaymentForm.querySelector(`[data-field="${fieldName}"]:checked`); // 对于复选框和单选框，需要找到选中的值
field.value = checkedInput ? checkedInput.value : ''; const checkedInput = this.$refs.afterPaymentForm.querySelector(`[data-field="${fieldName}"]:checked`);
// 更新 HTML 中的 checked 状态 field.value = checkedInput ? checkedInput.value : '';
if (checkedInput) { // 更新 HTML 中的 checked 状态
checkedInput.setAttribute('checked', '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 // 获取更新后的 HTML
const afterFormHtml = this.$refs.afterPaymentForm.innerHTML; const afterFormHtml = this.$refs.afterPaymentForm.innerHTML;
// 更新模板 // 更新模板和保存数据
this.form.contract_template.template = afterFormHtml; this.form.contract_template.template = afterFormHtml;
} this.form.forms = afterFormHtml;
if (this.currentStep === 3 && this.form.showAfterPayment && this.form.before_contract_template) { }
// 如果在事后支付表格且有事前支付表格，则返回事前支付表格 if (this.form.showAfterPayment && this.form.before_contract_template) {
this.form.showAfterPayment = false; // 如果在事后支付表格且有事前支付表格，则返回事前支付表格
this.form.showAfterPayment = false;
} else {
// 其他情况正常返回上一步
this.currentStep--;
}
} else { } else {
// 其他情况正常返回上一步
this.currentStep--; this.currentStep--;
} }
}, },
@ -2094,9 +2143,23 @@ export default {
return return
} }
// 在编辑模式下，保存当前的forms和before_forms值
let currentForms = null;
let currentBeforeForms = null;
if (this.isEditMode) {
currentForms = this.form.forms;
currentBeforeForms = this.form.before_forms;
}
// 根据返回的配置参数设置表单 // 根据返回的配置参数设置表单
this.setFormConfig(res) this.setFormConfig(res)
// 在编辑模式下，恢复forms和before_forms的值
if (this.isEditMode) {
this.form.forms = currentForms;
this.form.before_forms = currentBeforeForms;
}
// 进入下一步 // 进入下一步
this.currentStep++ this.currentStep++
} catch (error) { } catch (error) {
@ -2471,7 +2534,7 @@ export default {
// 切换到事后支付表格 // 切换到事后支付表格
nextPaymentStep() { nextPaymentStep() {
// 保存事前支付表格的数据 // 保存事前支付表格的数据
if (this.form.before_contract_template && this.form.before_contract_template.contract_template_fields) { 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');
@ -2500,10 +2563,10 @@ export default {
// 获取更新后的 HTML // 获取更新后的 HTML
const beforeFormHtml = this.$refs.beforePaymentForm.innerHTML; const beforeFormHtml = this.$refs.beforePaymentForm.innerHTML;
console.log("被修改的模板", beforeFormHtml);
// 更新模板 // 更新模板和保存数据
this.form.before_contract_template.template = beforeFormHtml; this.form.before_contract_template.template = beforeFormHtml;
this.form.before_forms = beforeFormHtml;
} }
this.form.showAfterPayment = true; this.form.showAfterPayment = true;
}, },
@ -2617,9 +2680,15 @@ export default {
this.form.purchaseMethod = detail.purchase_way_id; this.form.purchaseMethod = detail.purchase_way_id;
} }
console.log("detail", detail);
// 保存其他表单数据 // 保存其他表单数据
this.form = { this.form = {
...this.form, ...this.form,
forms: detail.forms,
before_forms: detail.before_forms,
other_data: detail.other_data,
before_other_data: detail.before_other_data,
type: detail.type, type: detail.type,
isBudget: detail.is_plan, isBudget: detail.is_plan,
is_simple: detail.is_simple, is_simple: detail.is_simple,
@ -2708,7 +2777,7 @@ export default {
purchaseMethod: detail.purchase_way_id, // 采购方式 purchaseMethod: detail.purchase_way_id, // 采购方式
// 其他基本信息 // 其他基本信息
type: detail.type, type: detail.type,
isBudget: detail.is_plan === 1, isBudget: detail.is_plan,
is_simple: detail.is_simple, is_simple: detail.is_simple,
has_charge: detail.has_charge, has_charge: detail.has_charge,
is_substitute: detail.is_substitute, is_substitute: detail.is_substitute,

Write Preview
Loading…
Cancel
Save