pull/480/head
liting 2024-06-24 12:34:31 +08:00
parent ccc5672288
commit c0d4a7734c
4 changed files with 489 additions and 165 deletions

View File

@ -0,0 +1,129 @@
<template>
<el-form
ref="formRef"
:model="formData"
:rules="formRules"
v-loading="formLoading"
label-width="0px"
:inline-message="true"
>
<el-table :data="formData" class="-mt-10px">
<el-table-column label="序号" type="index" width="100" />
<el-table-column label="设备购置费" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.equipmentFund`" :rules="formRules.equipmentFund" class="mb-0px!">
<el-input v-model="row.equipmentFund" placeholder="请输入设备购置费" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="材料费" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.materialFund`" :rules="formRules.materialFund" class="mb-0px!">
<el-input v-model="row.materialFund" placeholder="请输入材料费" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="实验外协费" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.experimentFund`" :rules="formRules.experimentFund" class="mb-0px!">
<el-input v-model="row.experimentFund" placeholder="请输入实验外协费" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="人员费用" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.peopleFund`" :rules="formRules.peopleFund" class="mb-0px!">
<el-input v-model="row.peopleFund" placeholder="请输入人员费用" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="其他费用" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.otherFund`" :rules="formRules.otherFund" class="mb-0px!">
<el-input v-model="row.otherFund" placeholder="请输入其他费用" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="总金额" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.totalFund`" :rules="formRules.totalFund" class="mb-0px!">
<el-input v-model="row.totalFund" placeholder="请输入总金额" />
</el-form-item>
</template>
</el-table-column>
<el-table-column align="center" fixed="right" label="操作" width="60">
<template #default="{ $index }">
<el-button @click="handleDelete($index)" link></el-button>
</template>
</el-table-column>
</el-table>
</el-form>
<el-row justify="center" class="mt-3">
<el-button @click="handleAdd" round>+ 添加验收经费-</el-button>
</el-row>
</template>
<script setup lang="ts">
import { MainApi } from '@/api/acceptance/acceptance'
const props = defineProps<{
acceptanceId: undefined // ID
}>()
const formLoading = ref(false) //
const formData = ref([])
const formRules = reactive({
})
const formRef = ref() // Ref
/** 监听主表的关联字段的变化,加载对应的子表数据 */
watch(
() => props.acceptanceId,
async (val) => {
// 1.
formData.value = []
// 2. val
if (!val) {
return;
}
try {
formLoading.value = true
formData.value = await MainApi.getFundsListByAcceptanceId(val)
} finally {
formLoading.value = false
}
},
{ immediate: true }
)
/** 新增按钮操作 */
const handleAdd = () => {
const row = {
id: undefined,
acceptanceId: undefined,
equipmentFund: undefined,
materialFund: undefined,
experimentFund: undefined,
peopleFund: undefined,
otherFund: undefined,
totalFund: undefined,
}
row.acceptanceId = props.acceptanceId
formData.value.push(row)
}
/** 删除按钮操作 */
const handleDelete = (index) => {
formData.value.splice(index, 1)
}
/** 表单校验 */
const validate = () => {
return formRef.value.validate()
}
/** 表单值 */
const getData = () => {
return formData.value
}
defineExpose({ validate, getData })
</script>

View File

@ -1,66 +1,44 @@
<template>
<el-form
ref="formRef"
:model="formData"
:rules="formRules"
v-loading="formLoading"
label-width="0px"
:inline-message="true"
>
<el-table :data="formData" class="-mt-10px">
<el-form ref="formRef" :model="formData" :rules="formRules" v-loading="formLoading" label-width="0px"
:inline-message="true">
<el-table :data="formData" style="width: 100%" show-summary>
<el-table-column label="序号" type="index" width="100" />
<el-table-column label="设备购置费" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.equipmentFund`" :rules="formRules.equipmentFund" class="mb-0px!">
<el-input v-model="row.equipmentFund" placeholder="请输入设备购置费" />
</el-form-item>
</template>
<el-table-column prop="name" label="支出明显" />
<el-table-column label="计划金额(万元)" align="center">
<el-table-column prop="amount1" label="集团拨款">
<template #default="scope">
<el-input v-model="scope.row.materialFund" placeholder="请输入" />
</template>
</el-table-column>
<el-table-column prop="amount1" label="自筹">
<template #default="scope">
<el-input v-model="scope.row.materialFund" placeholder="请输入" />
</template>
</el-table-column>
</el-table-column>
<el-table-column label="材料费" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.materialFund`" :rules="formRules.materialFund" class="mb-0px!">
<el-input v-model="row.materialFund" placeholder="请输入材料费" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="实验外协费" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.experimentFund`" :rules="formRules.experimentFund" class="mb-0px!">
<el-input v-model="row.experimentFund" placeholder="请输入实验外协费" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="人员费用" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.peopleFund`" :rules="formRules.peopleFund" class="mb-0px!">
<el-input v-model="row.peopleFund" placeholder="请输入人员费用" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="其他费用" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.otherFund`" :rules="formRules.otherFund" class="mb-0px!">
<el-input v-model="row.otherFund" placeholder="请输入其他费用" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="总金额" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.totalFund`" :rules="formRules.totalFund" class="mb-0px!">
<el-input v-model="row.totalFund" placeholder="请输入总金额" />
</el-form-item>
</template>
</el-table-column>
<el-table-column align="center" fixed="right" label="操作" width="60">
<template #default="{ $index }">
<el-button @click="handleDelete($index)" link></el-button>
</template>
<el-table-column label="实际金额(万元)" align="center">
<el-table-column prop="state" label="集团拨款">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.materialFund`">
<el-input v-model="row.materialFund" placeholder="请输入" />
</el-form-item>
</template>
</el-table-column>
<el-table-column prop="city" label="自筹">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.materialFund`">
<el-input v-model="row.materialFund" placeholder="请输入" />
</el-form-item>
</template>
</el-table-column>
</el-table-column>
</el-table>
</el-form>
<el-row justify="center" class="mt-3">
<!-- <el-row justify="center" class="mt-3">
<el-button @click="handleAdd" round>+ 添加验收经费-</el-button>
</el-row>
</el-row> -->
</template>
<script setup lang="ts">
import { MainApi } from '@/api/acceptance/acceptance'
@ -69,7 +47,13 @@ const props = defineProps<{
acceptanceId: undefined // ID
}>()
const formLoading = ref(false) //
const formData = ref([])
const formData = ref([
{ materialFund: 0, name: '设备购置费' },
{ materialFund: 0, name: '材料费' },
{ materialFund: 0, name: '试验外协费' },
{ materialFund: 0, name: '其他' },
{ materialFund: 0, name: '人员费' }
])
const formRules = reactive({
})
const formRef = ref() // Ref
@ -79,7 +63,7 @@ watch(
() => props.acceptanceId,
async (val) => {
// 1.
formData.value = []
// formData.value = []
// 2. val
if (!val) {
return;

View File

@ -0,0 +1,185 @@
<template>
<el-form
ref="formRef"
:model="formData"
:rules="formRules"
v-loading="formLoading"
label-width="0px"
:inline-message="true"
>
<el-table :data="formData" class="-mt-10px">
<el-table-column label="序号" type="index" width="100" />
<el-table-column label="经费年度" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.fiscalYear`" :rules="formRules.fiscalYear" class="mb-0px!">
<el-input v-model="row.fiscalYear" placeholder="请输入经费年度" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="来源或支出;0来源1支出" min-width="250">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.sourceExpend`" :rules="formRules.sourceExpend" class="mb-0px!">
<el-input v-model="row.sourceExpend" placeholder="请输入来源或支出;0来源1支出" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="集团经费" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.sGroupFund`" :rules="formRules.sGroupFund" class="mb-0px!">
<el-input v-model="row.sGroupFund" placeholder="请输入集团经费" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="政府拨款" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.sGovernmentFund`" :rules="formRules.sGovernmentFund" class="mb-0px!">
<el-input v-model="row.sGovernmentFund" placeholder="请输入政府拨款" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="项目承担单位自筹经费" min-width="200">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.sSelfFinancing`" :rules="formRules.sSelfFinancing" class="mb-0px!">
<el-input v-model="row.sSelfFinancing" placeholder="请输入项目承担单位自筹经费" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="其他" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.sOtherFund`" :rules="formRules.sOtherFund" class="mb-0px!">
<el-input v-model="row.sOtherFund" placeholder="请输入其他" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="合计" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.sTotalFund`" :rules="formRules.sTotalFund" class="mb-0px!">
<el-input v-model="row.sTotalFund" placeholder="请输入合计" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="设备购置费" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.equipmentFund`" :rules="formRules.equipmentFund" class="mb-0px!">
<el-input v-model="row.equipmentFund" placeholder="请输入设备购置费" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="材料费" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.materialFund`" :rules="formRules.materialFund" class="mb-0px!">
<el-input v-model="row.materialFund" placeholder="请输入材料费" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="实验外协费" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.experimentFund`" :rules="formRules.experimentFund" class="mb-0px!">
<el-input v-model="row.experimentFund" placeholder="请输入实验外协费" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="人员费用" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.peopleFund`" :rules="formRules.peopleFund" class="mb-0px!">
<el-input v-model="row.peopleFund" placeholder="请输入人员费用" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="其他费用" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.otherFund`" :rules="formRules.otherFund" class="mb-0px!">
<el-input v-model="row.otherFund" placeholder="请输入其他费用" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="总金额" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.totalFund`" :rules="formRules.totalFund" class="mb-0px!">
<el-input v-model="row.totalFund" placeholder="请输入总金额" />
</el-form-item>
</template>
</el-table-column>
<el-table-column align="center" fixed="right" label="操作" width="60">
<template #default="{ $index }">
<el-button @click="handleDelete($index)" link></el-button>
</template>
</el-table-column>
</el-table>
</el-form>
<el-row justify="center" class="mt-3">
<el-button @click="handleAdd" round>+ 添加任务书经费</el-button>
</el-row>
</template>
<script setup lang="ts">
import { MainApi } from '@/api/contract/contract'
const props = defineProps<{
contractId: undefined // ID
}>()
const formLoading = ref(false) //
const formData = ref([])
const formRules = reactive({
})
const formRef = ref() // Ref
/** 监听主表的关联字段的变化,加载对应的子表数据 */
watch(
() => props.contractId,
async (val) => {
// 1.
formData.value = []
// 2. val
if (!val) {
return;
}
try {
formLoading.value = true
formData.value = await MainApi.getFundsListByContractId(val)
} finally {
formLoading.value = false
}
},
{ immediate: true }
)
/** 新增按钮操作 */
const handleAdd = () => {
const row = {
id: undefined,
contractId: undefined,
fiscalYear: undefined,
sourceExpend: undefined,
sGroupFund: undefined,
sGovernmentFund: undefined,
sSelfFinancing: undefined,
sOtherFund: undefined,
sTotalFund: undefined,
equipmentFund: undefined,
materialFund: undefined,
experimentFund: undefined,
peopleFund: undefined,
otherFund: undefined,
totalFund: undefined,
}
row.contractId = props.contractId
formData.value.push(row)
}
/** 删除按钮操作 */
const handleDelete = (index) => {
formData.value.splice(index, 1)
}
/** 表单校验 */
const validate = () => {
return formRef.value.validate()
}
/** 表单值 */
const getData = () => {
return formData.value
}
defineExpose({ validate, getData })
</script>

View File

@ -1,124 +1,111 @@
<template>
<el-form
ref="formRef"
:model="formData"
:rules="formRules"
v-loading="formLoading"
label-width="0px"
:inline-message="true"
>
<el-table :data="formData" class="-mt-10px">
<el-table-column label="序号" type="index" width="100" />
<el-table-column label="经费年度" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.fiscalYear`" :rules="formRules.fiscalYear" class="mb-0px!">
<el-input v-model="row.fiscalYear" placeholder="请输入经费年度" />
</el-form-item>
</template>
<el-form ref="formRef" :model="formData" :rules="formRules" v-loading="formLoading" label-width="0px"
:inline-message="true">
<el-table :data="formData" class="-mt-10px" :span-method="objectSpanMethod"
show-summary>
<el-table-column prop="id" label="科目" width="180" />
<el-table-column prop="name" label="其中" />
<el-table-column prop="amount1" label="2024年">
<template #default="scope">
<el-input v-model="scope.row.amount2" placeholder="请输入" />
</template>
</el-table-column>
<el-table-column label="来源或支出;0来源1支出" min-width="250">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.sourceExpend`" :rules="formRules.sourceExpend" class="mb-0px!">
<el-input v-model="row.sourceExpend" placeholder="请输入来源或支出;0来源1支出" />
</el-form-item>
</template>
<el-table-column prop="amount2" label="2025年">
<template #default="scope">
<el-input v-model="scope.row.amount2" placeholder="请输入" />
</template>
</el-table-column>
<el-table-column label="集团经费" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.sGroupFund`" :rules="formRules.sGroupFund" class="mb-0px!">
<el-input v-model="row.sGroupFund" placeholder="请输入集团经费" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="政府拨款" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.sGovernmentFund`" :rules="formRules.sGovernmentFund" class="mb-0px!">
<el-input v-model="row.sGovernmentFund" placeholder="请输入政府拨款" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="项目承担单位自筹经费" min-width="200">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.sSelfFinancing`" :rules="formRules.sSelfFinancing" class="mb-0px!">
<el-input v-model="row.sSelfFinancing" placeholder="请输入项目承担单位自筹经费" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="其他" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.sOtherFund`" :rules="formRules.sOtherFund" class="mb-0px!">
<el-input v-model="row.sOtherFund" placeholder="请输入其他" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="合计" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.sTotalFund`" :rules="formRules.sTotalFund" class="mb-0px!">
<el-input v-model="row.sTotalFund" placeholder="请输入合计" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="设备购置费" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.equipmentFund`" :rules="formRules.equipmentFund" class="mb-0px!">
<el-input v-model="row.equipmentFund" placeholder="请输入设备购置费" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="材料费" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.materialFund`" :rules="formRules.materialFund" class="mb-0px!">
<el-input v-model="row.materialFund" placeholder="请输入材料费" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="实验外协费" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.experimentFund`" :rules="formRules.experimentFund" class="mb-0px!">
<el-input v-model="row.experimentFund" placeholder="请输入实验外协费" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="人员费用" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.peopleFund`" :rules="formRules.peopleFund" class="mb-0px!">
<el-input v-model="row.peopleFund" placeholder="请输入人员费用" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="其他费用" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.otherFund`" :rules="formRules.otherFund" class="mb-0px!">
<el-input v-model="row.otherFund" placeholder="请输入其他费用" />
</el-form-item>
</template>
</el-table-column>
<el-table-column label="总金额" min-width="150">
<template #default="{ row, $index }">
<el-form-item :prop="`${$index}.totalFund`" :rules="formRules.totalFund" class="mb-0px!">
<el-input v-model="row.totalFund" placeholder="请输入总金额" />
</el-form-item>
</template>
</el-table-column>
<el-table-column align="center" fixed="right" label="操作" width="60">
<template #default="{ $index }">
<el-button @click="handleDelete($index)" link></el-button>
</template>
<el-table-column prop="amount3" label="2026年" >
<template #default="scope">
<el-input v-model="scope.row.amount3" placeholder="请输入" />
</template>
</el-table-column>
<el-table-column prop="count" label="合计" />
</el-table>
</el-form>
<el-row justify="center" class="mt-3">
<!-- <el-row justify="center" class="mt-3">
<el-button @click="handleAdd" round>+ 添加任务书经费</el-button>
</el-row>
</el-row> -->
</template>
<script setup lang="ts">
import { MainApi } from '@/api/contract/contract'
import type { TableColumnCtx } from 'element-plus'
const props = defineProps<{
contractId: undefined // ID
}>()
const formLoading = ref(false) //
const formData = ref([])
// const formData = ref([])
const formData: User[] = [
{
id: '设备购置费',
name: '集团经费',
amount1: 0,
amount2: 0,
amount3: 0,
count:0,
},
{
id: '设备购置费',
name: '企业自筹经费',
amount1: 0,
amount2: 0,
count:0,
amount3:0,
},
{
id: '材料费',
name: '集团经费',
amount1: 0,
amount2: 0,
amount3: 0,
count:0,
},{
id: '材料费',
name: '企业自筹经费',
amount1: 0,
amount2: 0,
amount3:0,
count:0,
},
{
id: '试验外协费',
name: '集团经费',
amount1: 0,
amount2: 0,
amount3: 0,
count:0,
},{
id: '试验外协费',
name: '企业自筹经费',
amount1: 0,
amount2: 0,
amount3:0,
count:0,
},
{
id: '人员费用',
name: '集团经费',
amount1: 0,
amount2: 0,
amount3: 0,
count:0,
},{
id: '其他费用',
name: '企业自筹经费',
amount1: 0,
amount2: 0,
amount3:0,
count:0,
}, {
id: '其他费用',
name: '企业自筹经费',
amount1: 0,
amount2: 0,
amount3:0,
count:0,
}
]
const formRules = reactive({
})
const formRef = ref() // Ref
@ -165,6 +152,45 @@ const handleAdd = () => {
row.contractId = props.contractId
formData.value.push(row)
}
interface User {
id: string
name: string
amount1: number
amount2: number
amount3: number
count:number
}
interface SpanMethodProps {
row: User
column: TableColumnCtx<User>
rowIndex: number
columnIndex: number
}
const objectSpanMethod = ({
row,
column,
rowIndex,
columnIndex,
}: SpanMethodProps) => {
if (columnIndex === 0 || columnIndex === 5 ) {
if (rowIndex==0 || rowIndex==2 || rowIndex==4 || rowIndex==7 ) {
return {
rowspan: 2,
colspan: 1,
}
}else if(rowIndex==6){
return {
rowspan: 1,
colspan: 1,
}
} else {
return {
rowspan: 0,
colspan: 0,
}
}
}
}
/** 删除按钮操作 */
const handleDelete = (index) => {