zhouhaibin
3 months ago
14 changed files with 710 additions and 103 deletions
@ -0,0 +1,300 @@ |
|||
<template> |
|||
<!-- 自定义表单 --> |
|||
<el-divider content-position="left">项目申报金额</el-divider> |
|||
<BasicForm @register="registerMoneyFormSchemas" /> |
|||
|
|||
<el-divider content-position="left" |
|||
>造价建议金额 <a-button type="link" @click="costButton">详情</a-button></el-divider |
|||
> |
|||
|
|||
<a-form :label-col="{ span: 2 }" :wrapper-col="{ span: 6 }" disabled> |
|||
<a-form-item label="总投资(元)" name="urtEstimatedAmount"> |
|||
<a-input v-model:value="suggestedCostAmount" /> |
|||
<span class="text-green-400">{{ suggestedCostAmountDiff }}</span> |
|||
</a-form-item> |
|||
</a-form> |
|||
|
|||
<el-divider content-position="left" |
|||
>项目联审资金 <a-button type="link" @click="urtEstimatedButton">详情</a-button></el-divider |
|||
> |
|||
<a-form :label-col="{ span: 2 }" :wrapper-col="{ span: 6 }" disabled> |
|||
<a-form-item label="总投资(元)" name="urtEstimatedAmount"> |
|||
<a-input v-model:value="urtEstimatedAmount" /> |
|||
<span class="text-green-400">{{ urtEstimatedAmountDiff }}</span> |
|||
</a-form-item> |
|||
</a-form> |
|||
<el-divider content-position="left" |
|||
>立项审批资金 <a-button type="link" @click="approvalButton">详情</a-button></el-divider |
|||
> |
|||
<BasicForm @register="registerApprovalMoneyForm"> |
|||
<template #approvalTotalMoneySlot> |
|||
<a-input v-model:value="res.approvalTotalMoney" /> |
|||
<span class="text-green-400">{{ approvalTotalMoneyDiff }}</span> |
|||
</template> |
|||
<template #approvalCentralMoneySlot> |
|||
<a-input v-model:value="res.approvalCentralMoney" /> |
|||
<span class="text-green-400">{{ approvalCentralMoneyDiff }}</span> |
|||
</template> |
|||
</BasicForm> |
|||
|
|||
<el-divider content-position="left" |
|||
>合同签订资金 <a-button type="link" @click="contractButton">详情</a-button></el-divider |
|||
> |
|||
<BasicForm @register="registerContractMoneyForm"> |
|||
<template #contractTotalMoneySlot> |
|||
<a-input v-model:value="res.contractTotalMoney" /> |
|||
<span class="text-green-400">{{ contractTotalMoneyDiff }}</span> |
|||
</template> |
|||
<template #contractCentralMoneySlot> |
|||
<a-input v-model:value="res.contractCentralMoney" /> |
|||
<span class="text-green-400">{{ contractCentralMoneyDiff }}</span> |
|||
</template> |
|||
</BasicForm> |
|||
<planinfoFileDetail @register="registerFileInfo"></planinfoFileDetail> |
|||
</template> |
|||
<script lang="ts" name="uploadFile" setup> |
|||
import { ref, defineProps, watchEffect, onMounted } from 'vue'; |
|||
import { MoneyFormSchemas } from '@/views/projectLib/projectInfo/projectInfo.data'; |
|||
import { queryMoneyDetail } from '@/views/projectLib/projectInfo/projectInfo.api'; |
|||
import { |
|||
ApprovalMoneyFormSchemas, |
|||
ContractMoneyFormSchemas, |
|||
} from '@/views/projectLib/projectPlan/projectPlan.data'; |
|||
import { queryPlanInfoMainTimeline } from '@/views/projectLib/projectPlan/projectPlan.api'; |
|||
import { useForm, BasicForm } from '@/components/Form'; |
|||
import planinfoFileDetail from '../projectPlan/planinfoFileDetail.vue'; |
|||
import { useModal } from '@/components/Modal'; |
|||
|
|||
const [registerFileInfo, { openModal: openFileInfo }] = useModal(); //文件上传和查看 |
|||
|
|||
const [ |
|||
registerApprovalMoneyForm, |
|||
{ |
|||
validate: validateApprovalMoneyForm, |
|||
getFieldsValue: getApprovalMoneyFieldsValue, |
|||
setFieldsValue: setApprovalMoneyFieldsValue, |
|||
updateSchema: updateApprovalMoneySchema, |
|||
}, |
|||
] = useForm({ |
|||
//注册表单列 |
|||
schemas: ApprovalMoneyFormSchemas, |
|||
showActionButtonGroup: false, |
|||
disabled: true, |
|||
wrapperCol: { style: { width: 'auto' } }, |
|||
}); |
|||
const [ |
|||
registerContractMoneyForm, |
|||
{ |
|||
validate: validateContractMoneyForm, |
|||
getFieldsValue: getContractMoneyFieldsValue, |
|||
setFieldsValue: setContractMoneyFieldsValue, |
|||
updateSchema: updateContractMoneySchema, |
|||
}, |
|||
] = useForm({ |
|||
//注册表单列 |
|||
schemas: ContractMoneyFormSchemas, |
|||
showActionButtonGroup: false, |
|||
disabled: true, |
|||
wrapperCol: { style: { width: 'auto' } }, |
|||
}); |
|||
const [ |
|||
registerMoneyFormSchemas, |
|||
{ |
|||
validate: validateMoneyFormForm, |
|||
getFieldsValue: getMoneyFormFieldsValue, |
|||
setFieldsValue: setMoneyFormFieldsValue, |
|||
updateSchema: updateMoneyFormSchema, |
|||
}, |
|||
] = useForm({ |
|||
//注册表单列 |
|||
schemas: MoneyFormSchemas, |
|||
showActionButtonGroup: false, |
|||
disabled: true, |
|||
wrapperCol: { style: { width: 'auto' } }, |
|||
}); |
|||
let dataTo = defineProps(['projectid', 'type']); |
|||
const res = ref(); |
|||
const urtEstimatedAmount = ref<number>(0); |
|||
const suggestedCostAmount = ref<number>(0); |
|||
const urtEstimatedAmountDiff = ref(); |
|||
const suggestedCostAmountDiff = ref(); |
|||
const contractTotalMoneyDiff = ref(); |
|||
const approvalTotalMoneyDiff = ref(); |
|||
const approvalCentralMoneyDiff = ref(); |
|||
const contractCentralMoneyDiff = ref(); |
|||
const getdata = ref(); |
|||
onMounted(async () => { |
|||
let param: any = { |
|||
projectid: dataTo.projectid, |
|||
}; |
|||
res.value = await queryMoneyDetail(param); |
|||
setApprovalMoneyFieldsValue(res.value); |
|||
setContractMoneyFieldsValue(res.value); |
|||
setMoneyFormFieldsValue(res.value); |
|||
urtEstimatedAmount.value = res.value.urtEstimatedAmount; |
|||
suggestedCostAmount.value = res.value.suggestedCostAmount; |
|||
if (suggestedCostAmount.value) { |
|||
suggestedCostAmountDiff.value = |
|||
'总投资比项目申报资金核减' + |
|||
(res.value.totalMoney - suggestedCostAmount.value) + |
|||
'元(' + |
|||
(((res.value.totalMoney - suggestedCostAmount.value) / res.value.totalMoney) * 100).toFixed( |
|||
2, |
|||
) + |
|||
'%)'; |
|||
} |
|||
|
|||
if (urtEstimatedAmount.value) { |
|||
urtEstimatedAmountDiff.value = |
|||
'总投资比项目申报资金核减' + |
|||
(res.value.totalMoney - urtEstimatedAmount.value) + |
|||
'元(' + |
|||
(((res.value.totalMoney - urtEstimatedAmount.value) / res.value.totalMoney) * 100).toFixed( |
|||
2, |
|||
) + |
|||
'%)'; |
|||
} |
|||
if (res.value.approvalTotalMoney) { |
|||
approvalTotalMoneyDiff.value = |
|||
'总投资比项目申报资金核减' + |
|||
(res.value.totalMoney - res.value.approvalTotalMoney) + |
|||
'元(' + |
|||
( |
|||
((res.value.totalMoney - res.value.approvalTotalMoney) / res.value.totalMoney) * |
|||
100 |
|||
).toFixed(2) + |
|||
'%)'; |
|||
approvalCentralMoneyDiff.value = |
|||
'中央资金比项目申报资金核减' + |
|||
(res.value.centralMoney - res.value.approvalCentralMoney) + |
|||
'元(' + |
|||
( |
|||
((res.value.centralMoney - res.value.approvalCentralMoney) / res.value.centralMoney) * |
|||
100 |
|||
).toFixed(2) + |
|||
'%)'; |
|||
updateApprovalMoneySchema({ |
|||
//标题名称 |
|||
label: '立项总金额(元)', |
|||
//字段 |
|||
field: 'approvalTotalMoney', |
|||
labelWidth: 'auto', |
|||
componentProps: { |
|||
precision: 2, |
|||
style: { width: '100%' }, |
|||
}, |
|||
colProps: { span: 8 }, |
|||
dynamicDisabled: true, |
|||
slot: 'approvalTotalMoneySlot', |
|||
}); |
|||
updateApprovalMoneySchema({ |
|||
//标题名称 |
|||
label: '中央资金(元)', |
|||
//字段 |
|||
field: 'approvalCentralMoney', |
|||
labelWidth: 'auto', |
|||
componentProps: { |
|||
precision: 2, |
|||
min: 0, |
|||
style: { width: '100%' }, |
|||
}, |
|||
colProps: { span: 8 }, |
|||
dynamicDisabled: true, |
|||
slot: 'approvalCentralMoneySlot', |
|||
}); |
|||
} |
|||
if (res.value.contractTotalMoney) { |
|||
contractTotalMoneyDiff.value = |
|||
'总投资比立项审批资金核减' + |
|||
(res.value.approvalTotalMoney - res.value.contractTotalMoney) + |
|||
'元(' + |
|||
( |
|||
((res.value.approvalTotalMoney - res.value.contractTotalMoney) / |
|||
res.value.approvalTotalMoney) * |
|||
100 |
|||
).toFixed(2) + |
|||
'%)'; |
|||
contractCentralMoneyDiff.value = |
|||
'中央资金比立项审批资金核减' + |
|||
(res.value.approvalCentralMoney - res.value.contractCentralMoney) + |
|||
'元(' + |
|||
( |
|||
((res.value.approvalCentralMoney - res.value.contractCentralMoney) / |
|||
res.value.approvalCentralMoney) * |
|||
100 |
|||
).toFixed(2) + |
|||
'%)'; |
|||
updateContractMoneySchema({ |
|||
//标题名称 |
|||
label: '合同总金额(元)', |
|||
//字段 |
|||
field: 'contractTotalMoney', |
|||
labelWidth: 'auto', |
|||
componentProps: { |
|||
precision: 2, |
|||
style: { width: '100%' }, |
|||
}, |
|||
colProps: { span: 8 }, |
|||
dynamicDisabled: true, |
|||
slot: 'contractTotalMoneySlot', |
|||
}); |
|||
updateContractMoneySchema({ |
|||
//标题名称 |
|||
label: '中央资金(元)', |
|||
//字段 |
|||
field: 'contractCentralMoney', |
|||
labelWidth: 'auto', |
|||
componentProps: { |
|||
precision: 2, |
|||
min: 0, |
|||
style: { width: '100%' }, |
|||
}, |
|||
colProps: { span: 8 }, |
|||
dynamicDisabled: true, |
|||
slot: 'contractCentralMoneySlot', |
|||
}); |
|||
} |
|||
getdata.value = await queryPlanInfoMainTimeline({ projectid: dataTo.projectid }); |
|||
}); |
|||
async function costButton() { |
|||
if (getdata.value[0].children[3].isfinish != 0) { |
|||
openFileInfo(true, { |
|||
planinfoid: getdata.value[0].children[3].id, |
|||
taskName: getdata.value[0].children[3].taskName, |
|||
isfinish: getdata.value[0].children[3].isfinish, |
|||
projectid: dataTo.projectid, |
|||
}); |
|||
} |
|||
} |
|||
function urtEstimatedButton() { |
|||
if (getdata.value[0].children[4].isfinish != 0) { |
|||
openFileInfo(true, { |
|||
planinfoid: getdata.value[0].children[4].id, |
|||
taskName: getdata.value[0].children[4].taskName, |
|||
isfinish: getdata.value[0].children[4].isfinish, |
|||
projectid: dataTo.projectid, |
|||
}); |
|||
} |
|||
} |
|||
function approvalButton() { |
|||
if (getdata.value[0].children[4].isfinish != 0) { |
|||
openFileInfo(true, { |
|||
planinfoid: getdata.value[0].children[6].id, |
|||
taskName: getdata.value[0].children[6].taskName, |
|||
isfinish: getdata.value[0].children[6].isfinish, |
|||
projectid: dataTo.projectid, |
|||
}); |
|||
} |
|||
} |
|||
function contractButton() { |
|||
if (getdata.value[1].children[2].isfinish != 0) { |
|||
openFileInfo(true, { |
|||
planinfoid: getdata.value[1].children[2].id, |
|||
taskName: getdata.value[1].children[2].taskName, |
|||
isfinish: getdata.value[1].children[2].isfinish, |
|||
projectid: dataTo.projectid, |
|||
}); |
|||
} |
|||
} |
|||
</script> |
|||
<style></style> |
|||
@ -0,0 +1,82 @@ |
|||
<template> |
|||
<div> |
|||
<a-spin :spinning="loading" /> |
|||
|
|||
<a-tabs v-model:activeKey="activeKey" type="card" @change="handleTabChange"> |
|||
<a-tab-pane v-for="(tab, index) in list" :key="index + 1" :tab="tab.projectName"> |
|||
<div> |
|||
<div class="grid grid-cols-2 gap-2"> |
|||
<div id="1"> |
|||
<a-card :title="'项目名称：' + tab.projectName" :bordered="false"> |
|||
<div class="font-semibold"> 项目进度 </div> |
|||
<Progress :percent="tab.projectTotalProgress" /> |
|||
</a-card> |
|||
</div> |
|||
<div id="2"> |
|||
<a-card :bordered="false"> |
|||
<div class="font-semibold"> 资金支付情况 </div> |
|||
<Progress :percent="69" /> |
|||
<div class="font-semibold"> 中央资金支付情况 </div> |
|||
<Progress :percent="42" strokeColor="#2E54A1" /> |
|||
</a-card> |
|||
</div> |
|||
</div> |
|||
<div class="mt-1"> |
|||
<a-card :bordered="false"> |
|||
<el-steps finish-status="success" :active="tab.projectProgressDetail.status"> |
|||
<el-step |
|||
v-for="(item, index) in tab.projectProgressDetail" |
|||
:key="index" |
|||
:status="item.isfinish == 2 ? 'success' : 'wait'" |
|||
> |
|||
<template #title> |
|||
<div> |
|||
{{ item.taskName }} |
|||
</div> |
|||
<div v-if="item.taskName != '项目申报阶段'"> |
|||
{{ item.scheduledStartTime + '--' + item.scheduledEndTime }} |
|||
</div> |
|||
</template> |
|||
<template #description> |
|||
<elstepchild v-if="item.children != null" :child="item.children"></elstepchild> |
|||
</template> |
|||
<template #icon> |
|||
<Progress |
|||
type="circle" |
|||
:percent="item.percent" |
|||
:size="40" |
|||
:status="item.progressStatus" |
|||
></Progress> |
|||
</template> |
|||
</el-step> |
|||
</el-steps> |
|||
</a-card> |
|||
</div> |
|||
</div> |
|||
</a-tab-pane> |
|||
</a-tabs> |
|||
</div> |
|||
</template> |
|||
|
|||
<script lang="ts" name="system-user" setup> |
|||
//ts语法 |
|||
import { ref, onMounted } from 'vue'; |
|||
import { ActionItem, BasicTable, TableAction, useTable } from '@/components/Table'; |
|||
import { useModal, BasicModal } from '@/components/Modal'; |
|||
import { Progress } from 'ant-design-vue'; |
|||
import elstepchild from '@/views/projectLib/projectPlan/elstepchild.vue'; |
|||
|
|||
import { projectContactShouYe } from '@/views/projectLib/projectInfo/projectInfo.api'; |
|||
const list = ref([]); |
|||
const activeKey = ref(1); |
|||
const loading = ref(true); |
|||
onMounted(async () => { |
|||
list.value = await projectContactShouYe(); |
|||
loading.value = false; |
|||
}); |
|||
function handleTabChange(key) { |
|||
console.log(key, typeof key); |
|||
} |
|||
</script> |
|||
|
|||
<style scoped></style> |
|||
Loading…
Reference in new issue