完成事前表格

master
lynn 1 year ago
parent cf5ed38210
commit cfe75282b9

@ -173,7 +173,7 @@ export default {
previewContent: '', // 预览内容
showEditDrawer: false,
showPreviewModal: false, // 添加预览模态窗口控制变量
currentTemplateIndex: 8,
currentTemplateIndex:3,
editForm: {
field: '', // Renamed from name to field
name: '', // Renamed from label to name (Chinese name)
@ -465,14 +465,7 @@ export default {
<div style="display: none;">\${handler}</div>
</td>
<td style="border: 1px solid #000; padding: 8px 12px; font-size: 16px; line-height: 1.5; height: 40px; text-align: center; writing-mode: vertical-lr; text-orientation: upright; letter-spacing: 8px;" rowspan="12">
<div style="display: block;">
<div style="display: flex; align-items: center; justify-content: center;">
<span>附单据</span>
<input type="text" data-field="receipts" style="width: 60px; height: 32px; padding: 4px 8px; border: 1px solid #DCDFE6; border-radius: 4px; background: #fff; color: #333; font-size: 14px; line-height: 1.5; box-shadow: 0 0 4px rgba(220, 223, 230, 0.2); margin: 0 4px;">
<span>张</span>
</div>
</div>
<div style="display: none;">附单据\${receipts}张</div>
<div style="font-size: 16px;">附单据<div style="display: inline-block;"><div style="display: block;"><input type="text" data-field="receipts" style="width: 50px; height: 50px; padding: 4px 8px; border: 1px solid #DCDFE6; border-radius: 4px; background: #fff; color: #333; font-size: 14px; line-height: 1.5; box-shadow: 0 0 4px rgba(220, 223, 230, 0.2);"></div><div style="display: none;">\${receipts}</div></div>张</div>
</td>
</tr>
<tr>
@ -676,14 +669,14 @@ export default {
<div style="display: block;">
<input type="text" data-field="department" style="width: 100%; height: 32px; padding: 4px 8px; border: 1px solid #DCDFE6; border-radius: 4px; background: #fff; color: #333; font-size: 14px; line-height: 1.5; box-shadow: 0 0 4px rgba(220, 223, 230, 0.2);">
</div>
<div style="display: none;">\${getDepartment}</div>
<div style="display: none;">\${department}</div>
</td>
<td style="border: 1px solid #000; padding: 8px 12px; font-size: 16px; line-height: 1.5; height: 40px; width: 120px; background-color: #fff; text-align: center; font-weight: normal;">事由</td>
<td style="border: 1px solid #000; padding: 8px 12px; font-size: 16px; line-height: 1.5; height: 40px; text-align: left;" colspan="2">
<div style="display: block;">
<input type="text" data-field="reason" style="width: 100%; height: 32px; padding: 4px 8px; border: 1px solid #DCDFE6; border-radius: 4px; background: #fff; color: #333; font-size: 14px; line-height: 1.5; box-shadow: 0 0 4px rgba(220, 223, 230, 0.2);">
</div>
<div style="display: none;">\${getReason}</div>
<div style="display: none;">\${reason}</div>
</td>
</tr>
<tr>
@ -692,14 +685,14 @@ export default {
<div style="display: block;">
<input type="text" data-field="date" style="width: 100%; height: 32px; padding: 4px 8px; border: 1px solid #DCDFE6; border-radius: 4px; background: #fff; color: #333; font-size: 14px; line-height: 1.5; box-shadow: 0 0 4px rgba(220, 223, 230, 0.2);">
</div>
<div style="display: none;">\${getDate}</div>
<div style="display: none;">\${date}</div>
</td>
<td style="border: 1px solid #000; padding: 8px 12px; font-size: 16px; line-height: 1.5; height: 40px; width: 120px; background-color: #fff; text-align: center; font-weight: normal;">就餐地点</td>
<td style="border: 1px solid #000; padding: 8px 12px; font-size: 16px; line-height: 1.5; height: 40px; text-align: left;" colspan="2">
<div style="display: block;">
<input type="text" data-field="diningLocation" style="width: 100%; height: 32px; padding: 4px 8px; border: 1px solid #DCDFE6; border-radius: 4px; background: #fff; color: #333; font-size: 14px; line-height: 1.5; box-shadow: 0 0 4px rgba(220, 223, 230, 0.2);">
</div>
<div style="display: none;">\${getDiningLocation}</div>
<div style="display: none;">\${diningLocation}</div>
</td>
</tr>
<tr>
@ -709,7 +702,7 @@ export default {
<div style="display: block;">
<input type="text" data-field="visitorCount" style="width: 100%; height: 32px; padding: 4px 8px; border: 1px solid #DCDFE6; border-radius: 4px; background: #fff; color: #333; font-size: 14px; line-height: 1.5; box-shadow: 0 0 4px rgba(220, 223, 230, 0.2);">
</div>
<div style="display: none;">\${getVisitorCount}</div>
<div style="display: none;">\${visitorCount}</div>
</td>
<td style="border: 1px solid #000; padding: 8px 12px; font-size: 16px; line-height: 1.5; height: 40px; width: 120px; background-color: #fff; text-align: center; font-weight: normal;" rowspan="2">金额(元)</td>
<td style="border: 1px solid #000; padding: 8px 12px; font-size: 16px; line-height: 1.5; height: 40px; width: 100px; background-color: #fff; text-align: center; font-weight: normal;">餐费</td>
@ -717,7 +710,7 @@ export default {
<div style="display: block;">
<input type="text" data-field="mealsFee" style="width: 100%; height: 32px; padding: 4px 8px; border: 1px solid #DCDFE6; border-radius: 4px; background: #fff; color: #333; font-size: 14px; line-height: 1.5; box-shadow: 0 0 4px rgba(220, 223, 230, 0.2);">
</div>
<div style="display: none;">\${getMealsFee}</div>
<div style="display: none;">\${mealsFee}</div>
</td>
</tr>
<tr>
@ -726,14 +719,14 @@ export default {
<div style="display: block;">
<input type="text" data-field="accompanyCount" style="width: 100%; height: 32px; padding: 4px 8px; border: 1px solid #DCDFE6; border-radius: 4px; background: #fff; color: #333; font-size: 14px; line-height: 1.5; box-shadow: 0 0 4px rgba(220, 223, 230, 0.2);">
</div>
<div style="display: none;">\${getAccompanyCount}</div>
<div style="display: none;">\${accompanyCount}</div>
</td>
<td style="border: 1px solid #000; padding: 8px 12px; font-size: 16px; line-height: 1.5; height: 40px; width: 100px; background-color: #fff; text-align: center; font-weight: normal;">住宿费</td>
<td style="border: 1px solid #000; padding: 8px 12px; font-size: 16px; line-height: 1.5; height: 40px; text-align: left;">
<div style="display: block;">
<input type="text" data-field="accommodationFee" style="width: 100%; height: 32px; padding: 4px 8px; border: 1px solid #DCDFE6; border-radius: 4px; background: #fff; color: #333; font-size: 14px; line-height: 1.5; box-shadow: 0 0 4px rgba(220, 223, 230, 0.2);">
</div>
<div style="display: none;">\${getAccommodationFee}</div>
<div style="display: none;">\${accommodationFee}</div>
</td>
</tr>
<tr>
@ -742,14 +735,14 @@ export default {
<div style="display: block;">
<input type="text" data-field="operator" style="width: 100%; height: 32px; padding: 4px 8px; border: 1px solid #DCDFE6; border-radius: 4px; background: #fff; color: #333; font-size: 14px; line-height: 1.5; box-shadow: 0 0 4px rgba(220, 223, 230, 0.2);">
</div>
<div style="display: none;">\${getOperator}</div>
<div style="display: none;">\${operator}</div>
</td>
<td style="border: 1px solid #000; padding: 8px 12px; font-size: 16px; line-height: 1.5; height: 40px; width: 120px; background-color: #fff; text-align: center; font-weight: normal;">审核人</td>
<td style="border: 1px solid #000; padding: 8px 12px; font-size: 16px; line-height: 1.5; height: 40px; text-align: left;" colspan="2">
<div style="display: block;">
<input type="text" data-field="reviewer" style="width: 100%; height: 32px; padding: 4px 8px; border: 1px solid #DCDFE6; border-radius: 4px; background: #fff; color: #333; font-size: 14px; line-height: 1.5; box-shadow: 0 0 4px rgba(220, 223, 230, 0.2);">
</div>
<div style="display: none;">\${getReviewer}</div>
<div style="display: none;">\${reviewer}</div>
</td>
</tr>
<tr>
@ -758,7 +751,7 @@ export default {
<div style="display: block;">
<input type="text" data-field="remarks" style="width: 100%; height: 32px; padding: 4px 8px; border: 1px solid #DCDFE6; border-radius: 4px; background: #fff; color: #333; font-size: 14px; line-height: 1.5; box-shadow: 0 0 4px rgba(220, 223, 230, 0.2);">
</div>
<div style="display: none;">\${getRemarks}</div>
<div style="display: none;">\${remarks}</div>
</td>
</tr>
</tbody>
@ -1719,8 +1712,9 @@ export default {
return
}
// 更新字段元数据
// 更新字段元数据,保留所有必要的属性
this.fieldMetadata[this.editForm.field] = {
field: this.editForm.field, // 确保保留字段名
name: this.editForm.name,
type: this.editForm.type,
options: this.editForm.options
@ -1785,11 +1779,6 @@ export default {
const controlRegex = new RegExp(`<div style="display: block;">[^<]*<[^>]*data-field="${fieldName}"[^>]*>[^<]*<\\/div>[^<]*<div style="display: none;">\\$\\{${fieldName}\\}<\\/div>`, 'g')
newCodeContent = newCodeContent.replace(controlRegex, (match) => {
// 提取原有的字段名
const fieldNameMatch = match.match(/<td[^>]*>([^<]+)<\/td>/)
const originalFieldName = fieldNameMatch ? fieldNameMatch[1] : ''
// 保留原有的字段名,只替换控件部分
return `<div style="display: block;">${controlHtml}</div><div style="display: none;">\${${fieldName}}</div>`
})

@ -123,7 +123,18 @@
</template>
</el-table-column>
</el-table-column>
<el-table-column prop="paymentForm" label="支付表格" width="100"></el-table-column>
<el-table-column label="支付表格">
<el-table-column prop="prePaymentForm" label="事前支付表格" width="120">
<template #default="scope">
<span>{{ scope.row.prePaymentForm || '-' }}</span>
</template>
</el-table-column>
<el-table-column prop="postPaymentForm" label="事后支付表格" width="120">
<template #default="scope">
<span>{{ scope.row.postPaymentForm || '-' }}</span>
</template>
</el-table-column>
</el-table-column>
<el-table-column label="操作" width="150">
<template #default="scope">
<el-button size="small" @click="handleEdit(scope.row)">编辑</el-button>
@ -242,8 +253,19 @@
</div>
<!-- 支付表格 -->
<el-form-item label="支付表格" prop="paymentForm" class="form-section">
<el-select v-model="form.paymentForm" placeholder="请选择支付表格" class="form-input">
<el-form-item label="事前支付表格" prop="prePaymentForm" class="form-section">
<el-select v-model="form.prePaymentForm" placeholder="请选择事前支付表格" class="form-input">
<el-option
v-for="item in paymentFormOptions"
:key="item.id"
:label="item.label"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="事后支付表格" prop="postPaymentForm" class="form-section">
<el-select v-model="form.postPaymentForm" placeholder="请选择事后支付表格" class="form-input">
<el-option
v-for="item in paymentFormOptions"
:key="item.id"
@ -308,7 +330,8 @@ export default {
purchaseApproval: false,
tenderReview: false,
contractSign: false,
paymentForm: ''
prePaymentForm: '', // 事前支付表格
postPaymentForm: '' // 事后支付表格
},
rules: {
category: [
@ -326,11 +349,15 @@ export default {
purchaseMethod: [
{ required: true, message: '请选择采购方式', trigger: 'change' }
],
paymentForm: [
{ required: true, message: '请选择支付表格', trigger: 'change' }
prePaymentForm: [
{ required: true, message: '请选择事前支付表格', trigger: 'change' }
],
postPaymentForm: [
{ required: true, message: '请选择事后支付表格', trigger: 'change' }
]
},
originalPaymentForm: ''
originalPrePaymentForm: '',
originalPostPaymentForm: ''
}
},
created() {
@ -397,7 +424,11 @@ export default {
purchaseApproval: item.flow_purchase || false,
tenderReview: item.flow_invite || false,
contractSign: item.flow_join || false,
paymentForm: item.contract_template?.name || '-'
prePaymentForm: item.before_contract_template?.name || '-',
postPaymentForm: item.contract_template?.name || '-',
// 保存支付表格ID
before_contract_template_id: item.before_contract_template_id,
contract_template_id: item.contract_template_id
}
})
} else {
@ -631,7 +662,8 @@ export default {
purchaseApproval: false,
tenderReview: false,
contractSign: false,
paymentForm: ''
prePaymentForm: '',
postPaymentForm: ''
}
// 使用搜索区域的解析逻辑
@ -639,7 +671,7 @@ export default {
this.dialogVisible = true
},
handleEdit(row) {
async handleEdit(row) {
this.dialogTitle = '编辑配置'
// 清空选项
@ -647,43 +679,53 @@ export default {
this.contractTypeOptions = []
this.purchaseFormOptions = []
// 获取支付表格选项,然后再设置表单数据并打开抽屉
this.getPaymentFormOptions()
.then(() => {
// 设置表单数据
this.form = {
id: row.id, // 记录ID,用于更新
category: row.category_id, // 使用原始ID
affairType: row.work_type_id, // 使用原始ID
contractType: row.contract_type_id, // 使用原始ID
purchaseForm: row.purchase_form_id, // 使用原始ID
purchaseWay: row.purchaseWay === true || row.purchaseWay === 1,
purchaseMethod: row.purchaseMethod === true || row.purchaseMethod === 1,
projectName: row.projectName === true || row.projectName === 1,
projectType: row.projectType === true || row.projectType === 1,
budgetPrice: row.budgetPrice === true || row.budgetPrice === 1,
fundChannel: row.fundChannel === true || row.fundChannel === 1,
budgetPlan: row.budgetPlan === true || row.budgetPlan === 1,
request: row.request === true || row.request === 1,
purchaseApproval: row.purchaseApproval === true || row.purchaseApproval === 1,
tenderReview: row.tenderReview === true || row.tenderReview === 1,
contractSign: row.contractSign === true || row.contractSign === 1,
paymentForm: row.paymentForm || ''
}
// 保存原始支付表格值
this.originalPaymentForm = row.paymentForm
// 加载下拉框选项
this.loadEditOptions(row)
try {
// 先获取支付表格选项
await this.getPaymentFormOptions()
console.log('编辑行数据:', row) // 打印行数据,查看字段名
// 设置表单数据
this.form = {
id: row.id, // 记录ID,用于更新
category: row.category_id, // 使用原始ID
affairType: row.work_type_id, // 使用原始ID
contractType: row.contract_type_id, // 使用原始ID
purchaseForm: row.purchase_form_id, // 使用原始ID
purchaseWay: row.purchaseWay === true || row.purchaseWay === 1,
purchaseMethod: row.purchaseMethod === true || row.purchaseMethod === 1,
projectName: row.projectName === true || row.projectName === 1,
projectType: row.projectType === true || row.projectType === 1,
budgetPrice: row.budgetPrice === true || row.budgetPrice === 1,
fundChannel: row.fundChannel === true || row.fundChannel === 1,
budgetPlan: row.budgetPlan === true || row.budgetPlan === 1,
request: row.request === true || row.request === 1,
purchaseApproval: row.purchaseApproval === true || row.purchaseApproval === 1,
tenderReview: row.tenderReview === true || row.tenderReview === 1,
contractSign: row.contractSign === true || row.contractSign === 1,
prePaymentForm: row.before_contract_template_id || '',
postPaymentForm: row.contract_template_id || ''
}
// 保存原始支付表格值
this.originalPrePaymentForm = row.before_contract_template_id
this.originalPostPaymentForm = row.contract_template_id
// 加载下拉框选项
this.loadEditOptions(row)
// 确保表单数据已经设置
this.$nextTick(() => {
console.log('表单数据:', this.form)
console.log('支付表格选项:', this.paymentFormOptions)
// 打开抽屉
this.dialogVisible = true
})
.catch(error => {
console.error('加载支付表格选项失败:', error)
this.$message.error('加载支付表格选项失败')
this.dialogVisible = true
})
} catch (error) {
console.error('加载数据失败:', error)
this.$message.error('加载数据失败')
}
},
// 加载编辑时的下拉框选项
@ -798,14 +840,21 @@ export default {
// 只添加ID
submitData.id = this.form.id
// 如果支付表格有值且与原始值不同,才添加到提交数据中
if (this.form.paymentForm && this.form.paymentForm !== this.originalPaymentForm) {
submitData.contract_template_id = this.form.paymentForm
// 如果事前支付表格有值且与原始值不同,才添加到提交数据中
if (this.form.prePaymentForm && this.form.prePaymentForm !== this.originalPrePaymentForm) {
submitData.before_contract_template_id = this.form.prePaymentForm
}
} else {
// 如果事后支付表格有值且与原始值不同,才添加到提交数据中
if (this.form.postPaymentForm && this.form.postPaymentForm !== this.originalPostPaymentForm) {
submitData.contract_template_id = this.form.postPaymentForm
}
} else {
// 新增模式下,如果有支付表格值就添加
if (this.form.paymentForm) {
submitData.contract_template_id = this.form.paymentForm
if (this.form.prePaymentForm) {
submitData.before_contract_template_id = this.form.prePaymentForm
}
if (this.form.postPaymentForm) {
submitData.contract_template_id = this.form.postPaymentForm
}
}
@ -816,7 +865,7 @@ export default {
return
}
this.$message.success('保存成功')
this.$message.success('保存成功')
this.dialogVisible = false
// 刷新列表数据
await this.getTableData()
@ -863,9 +912,8 @@ export default {
id: item.id,
label: item.name || item.title || `附件${item.id}`
}))
if (res.data.length > 0) {
this.originalPaymentForm = res.data[0].id // 保存原始支付表格ID
}
console.log('支付表格选项:', this.paymentFormOptions)
} else {
this.paymentFormOptions = []
}

Loading…
Cancel
Save