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

master
lynn 2 years ago
commit 40c0aedbd3

@ -387,7 +387,7 @@
<el-form-item label="项目名称" prop="name" :rules="[{ required: true, message: '请输入项目名称', trigger: 'submit' }]" v-show="showFields.projectName">
<el-input v-model="form.name" placeholder="请输入项目名称"></el-input>
</el-form-item>
<el-form-item label="项目类型" prop="type" :rules="[{ required: true, message: '请选择项目类型', trigger: 'submit' }]" v-show="showFields.projectType">
<el-select v-model="form.type" placeholder="请选择项目类型" style="width: 100%">
<el-option v-for="item in type" :key="item.value" :value="item.value" :label="item.label"></el-option>
@ -395,9 +395,9 @@
</el-form-item>
<!-- 新增承包商/供应商输入框 -->
<el-form-item
label="承包商/供应商"
prop="supply"
<el-form-item
label="承包商/供应商"
prop="supply"
:rules="[{ required: form.is_simple === 1, message: '请输入承包商/供应商', trigger: 'submit' }]"
v-show="form.is_simple === 1">
<el-input v-model="form.supply" placeholder="请输入承包商/供应商"></el-input>
@ -406,78 +406,78 @@
<!-- 新增执行科室选择 -->
<el-form-item label="执行科室" prop="contract_carry_department" :rules="[{ required: true, message: '请选择执行科室', trigger: 'submit' }]">
<div class="department-selector">
<el-select
v-model="form.contract_carry_department"
placeholder="请选择执行科室"
<el-select
v-model="form.contract_carry_department"
placeholder="请选择执行科室"
style="width: 100%"
multiple
collapse-tags
@remove-tag="removeDepartment">
<el-option
v-for="item in departments"
:key="item.id"
:label="item.name"
<el-option
v-for="item in departments"
:key="item.id"
:label="item.name"
:value="item.id">
</el-option>
</el-select>
<div class="department-tags" v-if="form.contract_carry_department && form.contract_carry_department.length > 0">
<el-tag
v-for="id in form.contract_carry_department"
:key="id"
closable
<el-tag
v-for="id in form.contract_carry_department"
:key="id"
closable
@close="removeDepartment(id)">
{{ getDepartmentName(id) }}
</el-tag>
</div>
</div>
</el-form-item>
<el-form-item label="合同预算金额(元)" prop="price" :rules="[{ required: true, message: '请输入预算金额', trigger: 'submit' }]" v-show="showFields.budgetPrice">
<el-input-number v-model="form.price" :min="0" :precision="2" :step="1000" style="width: 100%"></el-input-number>
</el-form-item>
<el-form-item label="资金渠道" prop="moneyWay" :rules="[{ required: true, message: '请选择资金渠道', trigger: 'submit' }]" v-show="showFields.fundChannel">
<div class="money-way-selector">
<el-select
v-model="form.moneyWay"
placeholder="请选择资金渠道"
<el-select
v-model="form.moneyWay"
placeholder="请选择资金渠道"
style="width: 100%"
multiple
collapse-tags
@remove-tag="removeMoneyWay">
<el-option
v-for="item in moneyWay"
:key="item.id"
:label="item.value"
<el-option
v-for="item in moneyWay"
:key="item.id"
:label="item.value"
:value="item.id">
</el-option>
</el-select>
<div class="money-way-tags" v-if="form.moneyWay && form.moneyWay.length > 0">
<el-tag
v-for="id in form.moneyWay"
:key="id"
closable
<el-tag
v-for="id in form.moneyWay"
:key="id"
closable
@close="removeMoneyWay(id)">
{{ getMoneyWayName(id) }}
</el-tag>
</div>
</div>
</el-form-item>
<el-form-item label="关联预算计划" prop="plan" v-show="showFields.budgetPlan" :rules="[{ required: true, message: '请选择关联预算计划', trigger: 'change' }]">
<div class="plan-selector">
<el-input
v-model="form.plan_display"
placeholder="请选择预算计划"
readonly
<el-input
v-model="form.plan_display"
placeholder="请选择预算计划"
readonly
class="plan-input"
@focus="showPlanForSearch('modal')">
</el-input>
<div class="plan-tags" v-if="form.plan && form.plan.length > 0">
<el-tag
v-for="item in form.plan"
:key="item.id"
closable
<el-tag
v-for="item in form.plan"
:key="item.id"
closable
@close="removePlan(item)">
{{ item.label }}
</el-tag>
@ -1046,7 +1046,13 @@ export default {
width: 320,
align: "left",
customFn: (row) => {
return row.money_way_detail.map(item => item.value).join(',')
{
return row.money_way_detail.map(item => {
return (<div> {
item.value
} </div>)
})
}
}
},
{
@ -1930,7 +1936,7 @@ export default {
if (!this.form.showAfterPayment && this.form.before_contract_template) {
// 获取所有输入控件
const inputs = this.$refs.beforePaymentForm.querySelectorAll('input, select, textarea');
// 遍历所有输入控件,更新值到 HTML
inputs.forEach(input => {
const fieldName = input.getAttribute('data-field');
@ -1953,10 +1959,10 @@ export default {
}
}
});
// 获取更新后的 HTML
const beforeFormHtml = this.$refs.beforePaymentForm.innerHTML;
// 更新模板和保存数据
this.form.before_forms = beforeFormHtml;
}
@ -1965,7 +1971,7 @@ export default {
if (this.form.showAfterPayment && this.form.contract_template) {
// 获取所有输入控件
const inputs = this.$refs.afterPaymentForm.querySelectorAll('input, select, textarea');
// 遍历所有输入控件,更新值到 HTML
inputs.forEach(input => {
const fieldName = input.getAttribute('data-field');
@ -1988,10 +1994,10 @@ export default {
}
}
});
// 获取更新后的 HTML
const afterFormHtml = this.$refs.afterPaymentForm.innerHTML;
// 更新模板和保存数据
this.form.forms = afterFormHtml;
}
@ -2082,29 +2088,29 @@ export default {
this.form.purchaseMethod = ''
this.updateTypeOptions()
},
handleAffairTypeChange() {
this.form.contractType = ''
this.form.purchaseForm = ''
this.form.purchaseMethod = ''
this.updateTypeOptions()
},
handleContractTypeChange() {
this.form.purchaseForm = ''
this.form.purchaseMethod = ''
this.updateTypeOptions()
},
handlePurchaseFormChange() {
this.form.purchaseMethod = ''
this.updateTypeOptions()
},
handlePurchaseMethodChange() {
this.updateTypeOptions()
},
updateTypeOptions() {
// 重置所有选项
this.affairTypeOptions = []
@ -2143,21 +2149,21 @@ export default {
// 获取当前选中的采购子形式
const selectedPurchaseSubForm = this.purchaseSubFormOptions.find(item => item.id === this.form.purchaseSubForm)
// 如果有采购子形式,使用其children作为采购方式
if (selectedPurchaseSubForm && selectedPurchaseSubForm.children) {
this.purchaseMethodOptions = selectedPurchaseSubForm.children
}
}
// 如果没有采购子形式,使用采购形式的children作为采购方式
else if (selectedPurchaseForm.children) {
this.purchaseMethodOptions = selectedPurchaseForm.children
}
},
nextStep() {
if (this.currentStep === 1) {
// 验证是否至少选择了一个下拉框
if (!this.form.category && !this.form.affairType && !this.form.contractType &&
if (!this.form.category && !this.form.affairType && !this.form.contractType &&
!this.form.purchaseForm && !this.form.purchaseMethod) {
this.$Message.warning('请至少选择一个选项');
return;
@ -2167,27 +2173,27 @@ export default {
} else if (this.currentStep === 2) {
// 验证基本信息表单
const visibleFields = [];
// 检查项目名称是否显示
if (this.showFields.projectName) {
visibleFields.push('name');
}
// 检查项目类型是否显示
if (this.showFields.projectType) {
visibleFields.push('type');
}
// 检查预算价格是否显示
if (this.showFields.budgetPrice) {
visibleFields.push('price');
}
// 检查资金渠道是否显示
if (this.showFields.fundChannel) {
visibleFields.push('moneyWay');
}
// 检查预算计划是否显示
if (this.showFields.budgetPlan) {
visibleFields.push('plan');
@ -2232,17 +2238,17 @@ export default {
this.currentStep++;
}
},
prevStep() {
if (this.currentStep === 3) {
// 如果在事后支付表格,先保存内容
if (this.form.showAfterPayment &&
this.form.contract_template &&
this.form.contract_template.contract_template_fields &&
if (this.form.showAfterPayment &&
this.form.contract_template &&
this.form.contract_template.contract_template_fields &&
this.$refs.afterPaymentForm) {
// 获取所有输入控件
const inputs = this.$refs.afterPaymentForm.querySelectorAll('input, select, textarea');
// 遍历所有输入控件,更新值到 HTML
inputs.forEach(input => {
const fieldName = input.getAttribute('data-field');
@ -2265,10 +2271,10 @@ export default {
}
}
});
// 获取更新后的 HTML
const afterFormHtml = this.$refs.afterPaymentForm.innerHTML;
// 更新模保存数据
this.form.forms = afterFormHtml;
}
@ -2283,7 +2289,7 @@ export default {
this.currentStep--;
}
},
// 获取模版配置参数
async getTemplateConfig() {
try {
@ -2293,11 +2299,11 @@ export default {
contract_type: this.form.contractType || 0,
purchase_form: this.form.purchaseForm || 0
}
console.log('请求模版配置参数:', params)
const res = await getContractCategoryTemplateConfigParams(params)
console.log('模版配置返回数据:', res)
if (res.errcode !== undefined) {
this.$message.error(res.errmsg || '获取模版配置失败')
return
@ -2313,7 +2319,7 @@ export default {
// 根据返回的配置参数设置表单
this.setFormConfig(res)
// 在编辑模式下,恢复forms和before_forms的值
if (this.isEditMode) {
this.form.forms = currentForms;
@ -2327,7 +2333,7 @@ export default {
if (this.form.before_forms && this.form.before_forms.trim() !== '') {
this.form.skipBeforeTemplate = true;
}
// 进入下一步
this.currentStep++
} catch (error) {
@ -2339,7 +2345,7 @@ export default {
// 设置表单配置
setFormConfig(config) {
console.log('模版配置参数:', config)
// 只更新显示/隐藏状态,不影响数据来源
Object.assign(this.showFields, {
projectName: config.project_name === 1, // 项目名称
@ -2355,13 +2361,13 @@ export default {
let beforeTemplate = config.before_contract_template.template;
if (beforeTemplate && config.before_contract_template.contract_template_fields) {
console.log('处理事前支付表格模板:', config.before_contract_template.contract_template_fields)
// 遍历字段列表,为每个字段找到对应的控件
config.before_contract_template.contract_template_fields.forEach(field => {
// 在模板中查找 data-field 属性值与字段名相同的控件
const regex = new RegExp(`<[^>]*data-field="${field.field}"[^>]*>`, 'g');
const matches = beforeTemplate.match(regex);
if (matches) {
matches.forEach(match => {
// 获取控件类型
@ -2372,15 +2378,15 @@ export default {
else if (match.includes('type="radio"')) controlType = 'radio';
else if (match.includes('<select')) controlType = 'select';
else if (match.includes('<textarea')) controlType = 'textarea';
// 根据控件类型设置 id 和 value
let newControl = match;
// 添加 id
if (!newControl.includes('id=')) {
newControl = newControl.replace('data-field', `id="before_${field.field}" data-field`);
}
// 设置 value
if (controlType === 'checkbox' || controlType === 'radio') {
// 对于复选框和单选框,需要处理 options
@ -2403,7 +2409,7 @@ export default {
newControl = newControl.replace(/value="[^"]*"/, `value="${field.value || ''}"`);
}
}
// 替换原控件
beforeTemplate = beforeTemplate.replace(match, newControl);
});
@ -2419,13 +2425,13 @@ export default {
let afterTemplate = config.contract_template.template;
if (afterTemplate && config.contract_template.contract_template_fields) {
console.log('处理事后支付表格模板:', config.contract_template.contract_template_fields)
// 遍历字段列表,为每个字段找到对应的控件
config.contract_template.contract_template_fields.forEach(field => {
// 在模板中查找 data-field 属性值与字段名相同的控件
const regex = new RegExp(`<[^>]*data-field="${field.field}"[^>]*>`, 'g');
const matches = afterTemplate.match(regex);
if (matches) {
matches.forEach(match => {
// 获取控件类型
@ -2436,15 +2442,15 @@ export default {
else if (match.includes('type="radio"')) controlType = 'radio';
else if (match.includes('<select')) controlType = 'select';
else if (match.includes('<textarea')) controlType = 'textarea';
// 根据控件类型设置 id 和 value
let newControl = match;
// 添加 id
if (!newControl.includes('id=')) {
newControl = newControl.replace('data-field', `id="after_${field.field}" data-field`);
}
// 设置 value
if (controlType === 'checkbox' || controlType === 'radio') {
// 对于复选框和单选框,需要处理 options
@ -2467,7 +2473,7 @@ export default {
newControl = newControl.replace(/value="[^"]*"/, `value="${field.value || ''}"`);
}
}
// 替换原控件
afterTemplate = afterTemplate.replace(match, newControl);
});
@ -2486,11 +2492,11 @@ export default {
// Reset form
this.resetForm();
},
handleAddContractOk() {
// 这个方法可以移除,因为功能已经被 nextStep 和 submit 方法替代
},
handleAddContractCancel() {
// 这个方法可以移除,因为功能已经被 cancel 方法替代
},
@ -2537,7 +2543,7 @@ export default {
showAfterPayment: false,
contract_carry_department: []
};
this.affairTypeOptions = [];
this.contractTypeOptions = [];
this.purchaseFormOptions = [];
@ -2554,13 +2560,13 @@ export default {
this.$message.error(res.errmsg || '获取分类配置失败')
return
}
// 保存采购方式映射
this.purchaseMethodsMap = res.purchase_methods || {}
// 设置分类选项 - 从第二级开始(合同类、报销类、其他支出类)
this.categoryOptions = res.map?.[0]?.children || []
// 递归处理每一层的 children,确保所有层级都被正确解析
const processChildren = (items) => {
if (!items) return
@ -2576,10 +2582,10 @@ export default {
}
})
}
// 处理所有层级的 children
processChildren(this.categoryOptions)
// 初始化其他选项
this.updateTypeOptions()
} catch (error) {
@ -2587,7 +2593,7 @@ export default {
this.$message.error('获取分类配置失败')
}
},
// 初始化采购方式映射
initPurchaseMethodsMap() {
this.purchaseMethodsMap = {}
@ -2667,7 +2673,7 @@ export default {
}
}
}
// 直接从采购形式中查找
const purchaseMethod = purchaseForm.children.find(item => item.id === id)
if (purchaseMethod) {
@ -2677,7 +2683,7 @@ export default {
}
}
}
// 备用:从映射中查找
return this.purchaseMethodsMap[id] || ''
},
@ -2769,7 +2775,7 @@ export default {
this.form.before_other_data = [];
this.form.skipBeforeTemplate = true;
}
},
// 跳过事后支付表格
@ -2816,42 +2822,42 @@ export default {
try {
// 1. 先获取分类选项
await this.getCategoryOptions();
// 2. 获取合同详情
const res = await getContract({ id: row.id });
if (res && res.list && res.list.data && res.list.data.length > 0) {
const detail = res.list.data[0];
// 3. 通过正常的流程来初始化下拉框
// 设置分类
if (detail.contract_category) {
this.form.category = detail.contract_category;
this.handleCategoryChange(detail.contract_category);
}
// 设置事项类型
if (detail.work_type) {
this.form.affairType = detail.work_type;
this.handleAffairTypeChange(detail.work_type);
}
// 设置合同类型
if (detail.contract_type) {
this.form.contractType = detail.contract_type;
this.handleContractTypeChange(detail.contract_type);
}
// 设置采购形式
if (detail.purchase_type_id) {
this.form.purchaseForm = detail.purchase_type_id;
this.handlePurchaseFormChange(detail.purchase_type_id);
}
// 设置采购方式
if (detail.purchase_way_id) {
this.form.purchaseMethod = detail.purchase_way_id;
}
// 保存其他表单数据
this.form = {
...this.form,
@ -2886,7 +2892,7 @@ export default {
before_contract_template: detail.before_contract_template,
contract_template: detail.contract_template
};
// 设置预算计划显示文本
if (this.form.plan && this.form.plan.length > 0) {
this.form.plan_display = this.form.plan.map(item => item.label).join(', ');
@ -2986,12 +2992,12 @@ export default {
forms: detail.forms,
other_data: detail.other_data,
};
// 设置预算计划显示文本
if (this.form.plan && this.form.plan.length > 0) {
this.form.plan_display = this.form.plan.map(item => item.label).join(', ');
}
// 确保停留在第一步
this.currentStep = 1;
}
@ -3435,11 +3441,11 @@ export default {
& + .form-section {
margin-top: 24px;
}
:deep(.el-radio-group) {
.el-radio {
margin-right: 30px;
&:last-child {
margin-right: 0;
}
@ -3451,7 +3457,7 @@ export default {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 20px;
.control-item {
background: #f9fafb;
border-radius: 4px;
@ -3485,17 +3491,17 @@ export default {
.plan-selector {
width: 100%;
.plan-input {
width: 100%;
}
.plan-tags {
margin-top: 8px;
display: flex;
flex-wrap: wrap;
gap: 8px;
.el-tag {
margin-right: 0;
}
@ -3533,13 +3539,13 @@ export default {
.money-way-selector {
width: 100%;
.money-way-tags {
margin-top: 8px;
display: flex;
flex-wrap: wrap;
gap: 8px;
.el-tag {
margin-right: 0;
}
@ -3548,13 +3554,13 @@ export default {
.department-selector {
width: 100%;
.department-tags {
margin-top: 8px;
display: flex;
flex-wrap: wrap;
gap: 8px;
.el-tag {
margin-right: 0;
}
@ -3564,10 +3570,10 @@ export default {
.skip-option {
margin-top: 16px;
text-align: center;
.el-button {
color: #909399;
&:hover {
color: #409EFF;
}

@ -141,14 +141,29 @@ export default {
label: "年份",
width: 100,
align: "center",
fixed:'left'
},
{
prop: "name",
label: "项目名称",
width: 180,
align: "left",
fixed:'left'
},
{
label: '完成情况',
width: 160,
fixed:'left',
customFn:row => {
return (
<div>
{ row.public_act_date ? (<Tag color="success">采购意向公开已完成</Tag>) : (<Tag color="warning">采购意向公开未完成</Tag>) }
{ row.invite_act_date ? <Tag color="success">招标文件挂网已完成</Tag> : (<Tag color="warning">招标文件挂网未完成</Tag>) }
{ row.open_act_date ? <Tag color="success">项目开标已完成</Tag> : (<Tag color="warning">项目开标未完成</Tag>) }
</div>
)
}
},
{
prop: "is_face_small",
label: "是否面向专门面向中小企业采购",
@ -169,20 +184,6 @@ export default {
: "否";
},
},
{
label: '完成情况',
width: 160,
customFn:row => {
return (
<div>
{ row.public_act_date ? '' : (<Tag color="warning">采购意向公开未完成</Tag>) }
{ row.invite_act_date ? '' : (<Tag color="warning">招标文件挂网未完成</Tag>) }
{ row.open_act_date ? '' : (<Tag color="warning">项目开标未完成</Tag>) }
{ (row.public_act_date && row.invite_act_date && row.open_act_date) ? (<Tag color="success">已完成</Tag>) : '' }
</div>
)
}
},
{
prop: "public_plane_date",
label: "采购意向公开计划时间",

Loading…
Cancel
Save