super/IRS-ui-develop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

1

Browse Source
This commit is contained in:
nanxiyu
2025-12-27 16:44:46 +08:00
parent b674b78621
commit a8cb979339
12 changed files with 690 additions and 528 deletions
Download Patch File Download Diff File Expand all files Collapse all files

208
src/components/investment/common/ProjectProgressReportForm.vue
View File

@@ -1,7 +1,8 @@
<template>
<el-row class="page-title-row mb10">
<div class="page-title">{{ t('progressReport.form.title') }}</div>
<div class="page-report-time">{{ t('progressReport.form.reportTime') }}: {{formData.createTime || reportTime }}</div>
<div class="page-report-time">{{ t('progressReport.form.reportTime') }}: {{ formData.createTime || reportTime }}
</div>
<div class="page-unit">{{ t('progressReport.form.unit') }}</div>
</el-row>
<div class="project-progress-report-form">
@@ -11,26 +12,14 @@
<el-col :span="24">
<el-form-item :label="t('progressReport.form.projectName')" required prop="projectName">
<el-select v-model="formData.projectId"
:placeholder="t('progressReport.form.selectPlaceholder')"
@change="handelSelectChange"
>
<el-option
v-for="item in projectNameData"
:key="item.id"
:label="item.projectName || ''"
:value="item.id"
/>
:placeholder="t('progressReport.form.selectPlaceholder')" @change="handelSelectChange">
<el-option v-for="item in projectNameData" :key="item.id" :label="item.projectName || ''"
:value="item.id" />
<template #footer>
<el-pagination
background
layout="sizes, prev, pager, next, jumper, total"
:total="total"
:page-sizes="[10, 20, 50, 100]"
v-model:page-size="queryForm.size"
v-model:current-page="queryForm.page"
@size-change="handlePageSizeChange"
@current-change="handlePageChange"
/>
<el-pagination background layout="sizes, prev, pager, next, jumper, total"
:total="total" :page-sizes="[10, 20, 50, 100]" v-model:page-size="queryForm.size"
v-model:current-page="queryForm.page" @size-change="handlePageSizeChange"
@current-change="handlePageChange" />
</template>
</el-select>
</el-form-item>
@@ -40,24 +29,18 @@
<el-col :span="12">
<el-form-item :label="t('progressReport.form.projectStatus')" required prop="projectStatus">
<el-select v-model="formData.projectStatus"
:placeholder="t('progressReport.form.inputPlaceholder')"
clearable>
<el-option
v-for="item in projectStatusOptions" :key="item.value"
:value="item.value"
:label="item.label"
/>
</el-select>
:placeholder="t('progressReport.form.inputPlaceholder')" clearable>
<el-option v-for="item in projectStatusOptions" :key="item.value" :value="item.value"
:label="item.label" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item :label="t('progressReport.form.constructionStage')">
<el-select v-model="formData.constructionStage"
:placeholder="t('progressReport.form.selectPlaceholder')" clearable>
<el-option v-for="item in constructionStageOptions" :key="item.value"
:value="item.value"
:label="item.label"
/>
<el-option v-for="item in constructionStageOptions" :key="item.value" :value="item.value"
:label="item.label" />
</el-select>
</el-form-item>
</el-col>
@@ -70,7 +53,8 @@
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item :label="t('progressReport.form.totalInvestmentAmount')" required prop="projectTotalAmount">
<el-form-item :label="t('progressReport.form.totalInvestmentAmount')" required
prop="projectTotalAmount">
<el-input v-model="formData.projectTotalAmount"
:placeholder="t('progressReport.form.inputPlaceholder')">
<template #append>{{ t('progressReport.form.unitSuffix') }}</template>
@@ -80,7 +64,8 @@
</el-row>
<el-row :gutter="20" class="form-row">
<el-col :span="12">
<el-form-item :label="t('progressReport.form.cumulativeInvestmentToMonthEnd')" required prop="cumulativeInvestmentToDate">
<el-form-item :label="t('progressReport.form.cumulativeInvestmentToMonthEnd')" required
prop="cumulativeInvestmentToDate">
<el-input v-model="formData.cumulativeInvestmentToDate"
:placeholder="t('progressReport.form.inputPlaceholder')">
<template #append>{{ t('progressReport.form.unitSuffix') }}</template>
@@ -125,14 +110,16 @@
:placeholder="t('progressReport.form.selectYearPlaceholder')" style="width: 100%" />
</el-form-item>
<el-form-item style="height: 82px;"
:label="t('progressReport.form.currentYearPlannedInvestment')" required prop="annualPlannedInvestment">
:label="t('progressReport.form.currentYearPlannedInvestment')" required
prop="annualPlannedInvestment">
<el-input v-model="formData.annualPlannedInvestment"
:placeholder="t('progressReport.form.inputPlaceholder')">
<template #append>{{ t('progressReport.form.unitSuffix') }}</template>
</el-input>
</el-form-item>
<el-form-item style="height: 82px;"
:label="t('progressReport.form.enterpriseCumulativeInvestmentToMonthEnd')" required prop="ytdRemainingInvestment">
:label="t('progressReport.form.enterpriseCumulativeInvestmentToMonthEnd')" required
prop="ytdRemainingInvestment">
<el-input v-model="formData.ytdRemainingInvestment"
:placeholder="t('progressReport.form.inputPlaceholder')">
<template #append>{{ t('progressReport.form.unitSuffix') }}</template>
@@ -210,8 +197,8 @@
<el-input v-model="formData.supportingDocuments"
:placeholder="t('progressReport.form.selectAttachmentPlaceholder')" readonly>
<template #append>
<UploadFile :modelValue="formData.supportingDocuments" @change="uploadChange" :fileSize="20"
type="simple" :limit="10" :isShowTip="false" />
<UploadFile :modelValue="formData.supportingDocuments" @change="uploadChange"
:fileSize="20" type="simple" :limit="10" :isShowTip="false" />
</template>
</el-input>
</el-form-item>
@@ -284,7 +271,7 @@ export interface ProjectProgressReportFormData {
const props = defineProps<{
modelValue?: InvestmentProjectProgress;
rules?:FormRules;
rules?: FormRules;
}>();
const emit = defineEmits<{
@@ -292,37 +279,38 @@ const emit = defineEmits<{
}>();
const useForm = ref<FormInstance | undefined>()
const defaultForm = reactive<InvestmentProjectProgress>({
id: undefined,
projectName: '',
projectId: undefined,
projectStatus: '',
constructionStage: '',
implementingBody: '',
projectTotalAmount: undefined,
cumulativeInvestmentToDate: undefined,
completionRate: undefined,
cumulativePaymentToDate: undefined,
paymentCompletionRate: undefined,
annualReport: undefined,
annualPlannedInvestment: undefined,
ytdRemainingInvestment: undefined,
investmentCompletionRate: undefined,
plannedPayment: undefined,
actualPayment: undefined,
investmentPlanCompletionRate: undefined,
achievements: '',
coordinationIssues: '',
nextWorkPlan: '',
supportingDocuments: '',
remarks: '',
isFinalApplication: undefined,
createBy: '',
createTime: '',
updateBy: '',
updateTime: '',
delFlag: '',
processInstanceId: '',
status: '',
id: undefined,
projectName: '',
projectId: undefined,
projectStatus: '',
constructionStage: '',
implementingBody: '',
projectTotalAmount: undefined,
cumulativeInvestmentToDate: undefined,
completionRate: undefined,
cumulativePaymentToDate: undefined,
paymentCompletionRate: undefined,
annualReport: undefined,
annualPlannedInvestment: undefined,
ytdRemainingInvestment: undefined,
investmentCompletionRate: undefined,
plannedPayment: undefined,
actualPayment: undefined,
investmentPlanCompletionRate: undefined,
achievements: '',
coordinationIssues: '',
nextWorkPlan: '',
supportingDocuments: '',
remarks: '',
isFinalApplication: undefined,
createBy: '',
createTime: '',
updateBy: '',
updateTime: '',
delFlag: '',
processInstanceId: '',
status: '',
deptId: ''
})
const formData = reactive<InvestmentProjectProgress>({ ...defaultForm, ...props.modelValue });
const projectNameData = ref<ProjectPlanApplyFormItem[]>([]);
@@ -340,14 +328,14 @@ const queryForm = reactive<investmentProjectsPlanList>({
size: 10,
});
const getProjectNameList = async () => {
try {
const res = await investmentProjectsPlanPage(queryForm);
projectNameData.value = res.data?.records || [];
total.value = res.data?.total || 0;
} catch (error) {
console.error(error);
projectNameData.value = []; // 出错时设置为空数组
}
try {
const res = await investmentProjectsPlanPage(queryForm);
projectNameData.value = res.data?.records || [];
total.value = res.data?.total || 0;
} catch (error) {
console.error(error);
projectNameData.value = []; // 出错时设置为空数组
}
}
getProjectNameList();
/**
@@ -355,39 +343,39 @@ getProjectNameList();
* @param {string | number} value - 选中的项目ID
*/
const handelSelectChange = (value: string | number) => {
// 根据选中的项目ID查找对应的项目信息
const selectedProject = projectNameData.value.find(item =>
item.id == value
);
// 如果找到了对应的项目，则更新实施单位字段
if (selectedProject) {
formData.implementingBody = selectedProject.projectMainEntity || selectedProject.projectOwnerUnit || '';
formData.projectName = selectedProject.projectName || '';
formData.deptId = selectedProject.deptId;
}
// 根据选中的项目ID查找对应的项目信息
const selectedProject = projectNameData.value.find(item =>
item.id == value
);
// 如果找到了对应的项目，则更新实施单位字段
if (selectedProject) {
formData.implementingBody = selectedProject.projectMainEntity || selectedProject.projectOwnerUnit || '';
formData.projectName = selectedProject.projectName || '';
formData.deptId = String(selectedProject.deptId);
}
}
/**
* 页码大小改变
* @param {number} pageSize - 新的页码大小
* */
const handlePageSizeChange = (pageSize: number) => {
queryForm.size = pageSize;
getProjectNameList();
queryForm.size = pageSize;
getProjectNameList();
}
/**
* 页码改变
* @param {number} page - 新的页码
* */
const handlePageChange = (page: number) => {
queryForm.page = page;
getProjectNameList();
queryForm.page = page;
getProjectNameList();
}
// 监听 formData 变化，同步到父组件
watch(
formData,
(newVal) => {
console.log(newVal);
console.log(newVal);
emit('update:modelValue', { ...newVal });
},
{ deep: true }
@@ -398,30 +386,30 @@ watch(
() => props.modelValue,
(newVal) => {
if (newVal) {
if (typeof newVal.annualReport === 'number') newVal.annualReport = newVal.annualReport.toString()
if (typeof newVal.annualReport === 'number') newVal.annualReport = newVal.annualReport.toString()
Object.assign(formData, defaultForm, newVal);
}
},
{ immediate: true, deep: true }
);
const uploadChange = (_:any,data:any[]) =>{
if (!data || Object.prototype.toString.call(data) !== '[object Array]' || data.length === 0){
formData.supportingDocuments = [];
return;
}
formData.supportingDocuments = data.map((item:any) => {
return {
name: item.name,
url: item.url
}
})
const uploadChange = (_: any, data: any[]) => {
if (!data || Object.prototype.toString.call(data) !== '[object Array]' || data.length === 0) {
formData.supportingDocuments = [];
return;
}
formData.supportingDocuments = data.map((item: any) => {
return {
name: item.name,
url: item.url
}
})
}
defineExpose({
validate: async () => {
const isValid = await useForm.value?.validate();
if (!isValid) return false
return formData
},
validate: async () => {
const isValid = await useForm.value?.validate();
if (!isValid) return false
return formData
},
})
</script>