1226 lines
44 KiB
Vue
1226 lines
44 KiB
Vue
<template>
|
||
<el-row class="page-title-row mb10">
|
||
<div class="page-title" v-if="!props.isUpdate">{{ t('planApply.title') }}</div>
|
||
<div class="page-title" v-else>{{ t('planApply.title1') }}</div>
|
||
<div class="page-unit">{{ t('planApply.detail.unitLabel') }}</div>
|
||
</el-row>
|
||
<div class="project-plan-apply-form">
|
||
<div class="form-section-title">{{ t('planApply.applySection.title') }}</div>
|
||
<el-form :model="formData" label-width="165px" class="plan-form" :rules="rules" ref="useForm">
|
||
<el-row :gutter="20" class="form-row">
|
||
<el-col :span="24">
|
||
<el-form-item :label="t('planApply.applySection.projectName')" required prop="entity.projectName">
|
||
<template #label>
|
||
<span style="color: var(--el-text-color-regular)">{{ t('planApply.applySection.projectName')
|
||
}}</span>
|
||
</template>
|
||
<el-input v-model="formData.entity.projectName" :placeholder="t('planApply.placeholder.input')"
|
||
readonly>
|
||
<template #append>
|
||
<el-icon class="cursor-pointer interactive-icon" @click="handleSelectProject">
|
||
<FolderOpened />
|
||
</el-icon>
|
||
</template>
|
||
</el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row :gutter="20" class="form-row">
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('planApply.applySection.groupName')" required prop="entity.groupCompany">
|
||
<template #label>
|
||
<span style="color: var(--el-text-color-regular)">{{ t('planApply.applySection.groupName')
|
||
}}</span>
|
||
</template>
|
||
<el-input v-model="formData.entity.groupCompany"
|
||
:placeholder="t('planApply.placeholder.input')" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('planApply.applySection.projectNature')">
|
||
<el-select v-model="formData.entity.projectNature"
|
||
:placeholder="t('planApply.placeholder.select')" clearable>
|
||
<el-option v-for="item in projectNatureOptions" :label="item.label" :value="item.value"
|
||
:key="item.value" />
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row :gutter="20" class="form-row">
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('planApply.applySection.projectMainUnit')" required
|
||
prop="entity.projectMainEntity">
|
||
<el-tree-select v-model="formData.entity.projectMainEntity" :data="projectMainEntityOptions"
|
||
check-strictly node-key="name" :props="{
|
||
value: 'name',
|
||
label: 'name',
|
||
children: 'children',
|
||
}" :render-after-expand="false" @current-change="handleProjectMainUnitChange" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('reserveRegistration.basicInfo.projectOwnerUnit')">
|
||
<el-tree-select v-model="formData.entity.projectOwnerUnit" :data="projectMainEntityOptions"
|
||
check-strictly node-key="name" :props="{
|
||
value: 'name',
|
||
label: 'name',
|
||
children: 'children',
|
||
}" :render-after-expand="false" />
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-row :gutter="20" class="form-row">
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('planApply.applySection.investmentCategory')" required
|
||
prop="entity.investmentCategory">
|
||
<template #label>
|
||
<span style="color: var(--el-text-color-regular)">{{
|
||
t('planApply.applySection.investmentCategory') }}</span>
|
||
</template>
|
||
<el-select v-model="formData.entity.investmentCategory"
|
||
:placeholder="t('planApply.placeholder.select')" clearable>
|
||
<el-option v-for="item in investmentCategoryOptions" :key="item.value" :label="item.label"
|
||
:value="item.value" />
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('planApply.applySection.investmentType')" required
|
||
prop="entity.investmentArea">
|
||
<template #label>
|
||
<span style="color: var(--el-text-color-regular)">{{
|
||
t('planApply.applySection.investmentType') }}</span>
|
||
</template>
|
||
<el-select v-model="formData.entity.investmentArea"
|
||
:placeholder="t('planApply.placeholder.select')" clearable>
|
||
<el-option v-for="item in investmentAreaOptions" :key="item.value" :label="item.label"
|
||
:value="item.value" />
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-row :gutter="20" class="form-row">
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('planApply.applySection.projectAddress')" required
|
||
prop="entity.projectAddress">
|
||
<template #label>
|
||
<span style="color: var(--el-text-color-regular)">{{
|
||
t('planApply.applySection.projectAddress') }}</span>
|
||
</template>
|
||
<el-input v-model="formData.entity.projectAddress"
|
||
:placeholder="t('planApply.placeholder.input')" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('planApply.applySection.projectDetailAddress')" required
|
||
prop="entity.projectAddressDetail">
|
||
<template #label>
|
||
<span style="color: var(--el-text-color-regular)">{{
|
||
t('planApply.applySection.projectDetailAddress') }}</span>
|
||
</template>
|
||
<el-input v-model="formData.entity.projectAddressDetail"
|
||
:placeholder="t('planApply.placeholder.input')" />
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-row :gutter="20" class="form-row">
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('reserveRegistration.basicInfo.projectDirection')" required
|
||
prop="entity.projectInvestmentDirection">
|
||
<el-select v-model="formData.entity.projectInvestmentDirection"
|
||
:placeholder="t('planApply.placeholder.select')">
|
||
<el-option v-for="item in projectDirectionOptions" :key="item.value" :label="item.label"
|
||
:value="item.value" />
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('reserveRegistration.basicInfo.directionSubdivision')" required
|
||
prop="entity.investmentDirectionSegmentation">
|
||
<template #label>
|
||
<span style="color: var(--el-text-color-regular)">{{
|
||
t('reserveRegistration.basicInfo.directionSubdivision') }}</span>
|
||
</template>
|
||
<el-select v-model="formData.entity.investmentDirectionSegmentation"
|
||
:placeholder="t('planApply.placeholder.select')">
|
||
<el-option v-for="item in ProjectDirectionDetailsOptionsEnums" :key="item.value"
|
||
:label="item.label" :value="item.value" />
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-row :gutter="20" class="form-row">
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('reserveRegistration.basicInfo.projectSource')" required
|
||
prop="entity.projectSource">
|
||
<template #label>
|
||
<span style="color: var(--el-text-color-regular)">{{
|
||
t('reserveRegistration.basicInfo.projectSource') }}</span>
|
||
</template>
|
||
<el-select v-model="formData.entity.projectSource"
|
||
:placeholder="t('planApply.placeholder.select')">
|
||
<el-option v-for="item in projectSourceOptions" :key="item.value" :label="item.label"
|
||
:value="item.value" />
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('planApply.applySection.constructionNature')" required
|
||
prop="entity.constructionNature">
|
||
<template #label>
|
||
<span style="color: var(--el-text-color-regular)">{{
|
||
t('planApply.applySection.constructionNature') }}</span>
|
||
</template>
|
||
<el-select v-model="formData.entity.constructionNature"
|
||
:placeholder="t('planApply.placeholder.select')" clearable>
|
||
<el-option v-for="item in constructionNatureOptions" :key="item.value" :label="item.label"
|
||
:value="item.value" />
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-row :gutter="20" class="form-row">
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('reserveRegistration.basicInfo.majorInvestmentProject')" required
|
||
prop="entity.majorInvestmentProjects">
|
||
<el-select v-model="formData.entity.majorInvestmentProjects"
|
||
:placeholder="t('planApply.placeholder.input')">
|
||
<el-option v-for="item in yesOrNo" :value="item.value" :label="item.label"
|
||
:key="item.value" />
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('planApply.applySection.keyProject')" required prop="entity.keyProject">
|
||
<el-select v-model="formData.entity.keyProject" :placeholder="t('planApply.placeholder.select')"
|
||
clearable>
|
||
<el-option v-for="item in projectImportantOptions" :key="item.value" :label="item.label"
|
||
:value="item.value" />
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-row :gutter="20" class="form-row">
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('planApply.applySection.isWithinMainBusiness')" required
|
||
prop="entity.isMainBusiness">
|
||
<el-select v-model="formData.entity.isMainBusiness"
|
||
:placeholder="t('planApply.placeholder.select')" clearable @change="(e: any) => {
|
||
if (e === '1') {
|
||
formData.entity.mainBusinessTypes = ''
|
||
}
|
||
}">
|
||
<el-option v-for="item in yesOrNo" :value="item.value" :label="item.label"
|
||
:key="item.value" />
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('planApply.applySection.mainBusinessType')"
|
||
:required="formData.entity.isMainBusiness === '0'" prop="entity.mainBusinessTypes">
|
||
<el-select v-model="formData.entity.mainBusinessTypes">
|
||
<el-option v-for="item in mainBusinessOptions" :key="item.value" :label="item.label"
|
||
:value="item.value" :disabled="formData.entity.isMainBusiness !== '0'" />
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-row :gutter="20" class="form-row">
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('reserveRegistration.basicInfo.mainBusinessCode')" required
|
||
prop="entity.mainBusinessCode">
|
||
<el-input v-model="formData.entity.mainBusinessCode"
|
||
:placeholder="t('planApply.placeholder.input')" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('planApply.applySection.isManufacturing')" required
|
||
prop="entity.isManufacturingIndustry">
|
||
<el-select v-model="formData.entity.isManufacturingIndustry"
|
||
:placeholder="t('planApply.placeholder.select')" clearable>
|
||
<el-option :label="t('planApply.common.yes')" :value="t('planApply.common.yes')" />
|
||
<el-option :label="t('planApply.common.no')" :value="t('planApply.common.no')" />
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-row :gutter="20" class="form-row">
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('reserveRegistration.basicInfo.strategicEmergingIndustry')" required
|
||
prop="entity.isStrategicEmergingIndustries">
|
||
<el-select v-model="formData.entity.isStrategicEmergingIndustries"
|
||
:placeholder="t('planApply.placeholder.select')" clearable>
|
||
<el-option v-for="item in strategicIndustryOptions" :key="item.value" :label="item.label"
|
||
:value="item.value" />
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('planApply.applySection.cityStrategy')" required
|
||
prop="entity.urbanStrategy">
|
||
<el-select v-model="formData.entity.urbanStrategy"
|
||
:placeholder="t('planApply.placeholder.select')">
|
||
<el-option v-for="item in cityStrategyOptions" :key="item.value" :label="item.label"
|
||
:value="item.value" />
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-row :gutter="20" class="form-row">
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('planApply.applySection.projectImplementationStart')" required
|
||
prop="entity.projectStartTime">
|
||
<el-date-picker v-model="formData.entity.projectStartTime" type="date" value-format="YYYY-MM-DD"
|
||
:placeholder="t('planApply.placeholder.select')" style="width: 100%" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('planApply.applySection.projectImplementationEnd')" required
|
||
prop="entity.projectEndTime">
|
||
<el-date-picker v-model="formData.entity.projectEndTime" type="date" value-format="YYYY-MM-DD"
|
||
:placeholder="t('planApply.placeholder.select')" style="width: 100%" />
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-row :gutter="20" class="plan-investment-block">
|
||
<el-col :span="12">
|
||
<div class="plan-investment-panel left-panel">
|
||
<div class="panel-title">{{ t('planApply.planInvestment.currentYearTotalTitle') }}</div>
|
||
<div style="flex: 1">
|
||
<el-form-item style="height: 82px" :label="t('planApply.planInvestment.planYear')">
|
||
<el-date-picker v-model="formData.entity.planInvestmentYear" type="year"
|
||
value-format="YYYY" :placeholder="t('planApply.placeholder.selectYear')"
|
||
style="width: 100%" />
|
||
</el-form-item>
|
||
<el-form-item style="height: 82px"
|
||
:label="t('planApply.planInvestment.plannedImageQuota') + '(万元)'" required
|
||
prop="entity.planImageQuota">
|
||
<el-input-number readonly :precision="2" length="20" :controls="false"
|
||
v-model="formData.entity.planImageQuota"
|
||
:placeholder="t('planApply.placeholder.input')" />
|
||
</el-form-item>
|
||
<el-form-item style="height: 82px"
|
||
:label="t('planApply.planInvestment.annualPlanPayment') + '(万元)'" required
|
||
prop="entity.planPaymentLimit">
|
||
<el-input-number readonly :precision="2" length="20" :controls="false"
|
||
v-model="formData.entity.planPaymentLimit"
|
||
:placeholder="t('planApply.placeholder.input')" />
|
||
</el-form-item>
|
||
</div>
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<div class="plan-investment-panel right-panel">
|
||
<div class="panel-title">{{ t('planApply.planInvestment.currentYearFundingTitle') }}</div>
|
||
<div style="flex: 1">
|
||
<el-form-item :label="t('planApply.investmentEstimate.capitalFunding') + '(万元)'" required
|
||
prop="entity.ownedFunds">
|
||
<el-input-number readonly :precision="2" length="20" :controls="false"
|
||
v-model="formData.entity.ownedFunds"
|
||
:placeholder="t('planApply.placeholder.input')" />
|
||
</el-form-item>
|
||
<el-form-item :label="t('planApply.investmentEstimate.financialFunding') + '(万元)'" required
|
||
prop="entity.financialFunds">
|
||
<el-input-number readonly :precision="2" length="20" :controls="false"
|
||
v-model="formData.entity.financialFunds"
|
||
:placeholder="t('planApply.placeholder.input')" />
|
||
</el-form-item>
|
||
<el-form-item :label="t('planApply.investmentEstimate.externalRaisedFunds') + '(万元)'"
|
||
required prop="entity.externalRaisedCapital">
|
||
<el-input-number readonly :precision="2" length="20" :controls="false"
|
||
v-model="formData.entity.externalRaisedCapital"
|
||
:placeholder="t('planApply.placeholder.input')" />
|
||
</el-form-item>
|
||
<el-form-item :label="t('planApply.investmentEstimate.otherFunding') + '(万元)'" required
|
||
prop="entity.otherFunds">
|
||
<el-input-number readonly :precision="2" length="20" :controls="false"
|
||
v-model="formData.entity.otherFunds"
|
||
:placeholder="t('planApply.placeholder.input')"></el-input-number>
|
||
</el-form-item>
|
||
<el-form-item :label="t('planApply.investmentEstimate.financialFundingDescription')">
|
||
<el-input v-model="formData.entity.governmentFundSourceDesc"
|
||
:placeholder="t('planApply.placeholder.input')" />
|
||
</el-form-item>
|
||
<el-form-item :label="t('planApply.investmentEstimate.otherFundingDescription')">
|
||
<el-input v-model="formData.entity.otherFundSourceDesc"
|
||
:placeholder="t('planApply.placeholder.input')" />
|
||
</el-form-item>
|
||
</div>
|
||
</div>
|
||
</el-col>
|
||
</el-row>
|
||
<!--项目概述-->
|
||
<el-row :gutter="20" class="form-row">
|
||
<el-col :span="24">
|
||
<el-form-item :label="t('planApply.applySection.projectOverview')" required
|
||
prop="entity.projectDesc">
|
||
<el-input v-model="formData.entity.projectDesc"
|
||
:placeholder="t('planApply.placeholder.input')" />
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-row class="form-row">
|
||
<el-col :span="24">
|
||
<el-form-item :label="t('planApply.applySection.projectInitialPlan')">
|
||
<el-input v-model="formData.entity.projectPreliminaryPlan"
|
||
:placeholder="t('planApply.placeholder.input')" />
|
||
</el-form-item>
|
||
<el-form-item :label="t('planApply.headerForm.attachments')">
|
||
<UploadFile :modelValue="formData.entity.projectPreliminaryPlanAttachment"
|
||
@change="uploadChange" :fileSize="20" type="simple" :limit="10" />
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-row class="form-row">
|
||
<el-col :span="24">
|
||
<el-form-item :label="t('planApply.applySection.remark')">
|
||
<el-input v-model="formData.entity.remark" :placeholder="t('planApply.placeholder.input')" />
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<!--项目投资情况-->
|
||
<div class="form-section-title">{{ t('planApply.investmentStatus.title') }} 单位：{{
|
||
t('planApply.investmentEstimate.unitSuffix') }}</div>
|
||
<el-row :gutter="20" class="form-row">
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('planApply.investmentStatus.totalInvestmentAmount')" required
|
||
prop="entity.projectTotalAmount">
|
||
<el-input-number :precision="2" :length="20" :controls="false" min="0"
|
||
v-model="formData.entity.projectTotalAmount"
|
||
:placeholder="t('planApply.placeholder.input')"></el-input-number>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('planApply.investmentStatus.cumulativeInvestmentLastYear')" required
|
||
prop="entity.lastYearCompleted" label-width="230px">
|
||
<el-input-number :precision="2" :length="20" :controls="false" min="0"
|
||
v-model="formData.entity.lastYearCompleted"
|
||
:placeholder="t('planApply.placeholder.input')" />
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-row :gutter="20" class="form-row">
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('planApply.investmentStatus.ourTotalInvestmentAmount')" required
|
||
prop="entity.ourInvestmentTotalAmount">
|
||
<el-input-number :precision="2" :length="20" :controls="false" min="0"
|
||
v-model="formData.entity.ourInvestmentTotalAmount"
|
||
:placeholder="t('planApply.placeholder.input')">
|
||
<template #append>{{ t('planApply.investmentEstimate.unitSuffix') }}</template>
|
||
</el-input-number>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('planApply.investmentStatus.ourCumulativeInvestmentLastYear')" required
|
||
prop="entity.ourLastYearCompleted" label-width="230px">
|
||
<el-input-number :precision="2" :length="20" :controls="false" min="0"
|
||
v-model="formData.entity.ourLastYearCompleted"
|
||
:placeholder="t('planApply.placeholder.input')">
|
||
<template #append>{{ t('planApply.investmentEstimate.unitSuffix') }}</template>
|
||
</el-input-number>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<!--年度项目投资信息-->
|
||
<div class="form-section-title">{{ t('planApply.annualInvestmentInfo.title') }}</div>
|
||
<div class="table-actions">
|
||
<el-button type="primary" @click="handleAddAnnualInvestment">
|
||
{{ t('planApply.annualInvestmentInfo.add') }}
|
||
</el-button>
|
||
<el-button @click="handleCopyAnnualInvestment">
|
||
{{ t('planApply.annualInvestmentInfo.copy') }}
|
||
</el-button>
|
||
<el-button @click="handleRemoveAnnualInvestment">
|
||
{{ t('planApply.annualInvestmentInfo.remove') }}
|
||
</el-button>
|
||
<el-button @click="handleRemoveAllAnnualInvestment">
|
||
{{ t('planApply.annualInvestmentInfo.removeAll') }}
|
||
</el-button>
|
||
</div>
|
||
<el-table :data="formData.investmentProjects" border style="width: 100%" class="annual-investment-table">
|
||
<el-table-column width="60" align="center">
|
||
<template>
|
||
<el-radio v-model="selectedAnnualInvestmentIndex" />
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column :label="t('planApply.annualInvestmentInfo.table.index')" width="60" align="center">
|
||
<template #default="{ $index }">
|
||
{{ $index + 1 }}
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column min-width="140">
|
||
<template #header>
|
||
<span class="required-field">{{ t('planApply.annualInvestmentInfo.table.planYear') }}</span>
|
||
</template>
|
||
<template #default="{ row }">
|
||
<el-date-picker v-model="row.plannedInvestmentYear" type="year" value-format="YYYY"
|
||
:placeholder="t('planApply.placeholder.select')" style="width: 100%"
|
||
:class="{ 'is-error': !row.plannedInvestmentYear }" />
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column min-width="160">
|
||
<template #header>
|
||
<span class="required-field">{{ t('planApply.annualInvestmentInfo.table.plannedImageQuota') +
|
||
'(万元)' }}</span>
|
||
</template>
|
||
<template #default="{ row }">
|
||
<el-input-number :precision="2" :controls="false" :min="0" :value-on-clear="null"
|
||
v-model="row.plannedImageAmount" :placeholder="t('planApply.placeholder.input')"
|
||
:class="{ 'is-error': row.plannedImageAmount === null }" />
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column min-width="160">
|
||
<template #header>
|
||
<span class="required-field">{{ t('planApply.annualInvestmentInfo.table.annualPlanPayment') +
|
||
'(万元)' }}</span>
|
||
</template>
|
||
<template #default="{ row }">
|
||
<el-input-number :precision="2" :controls="false" :min="0" :value-on-clear="null"
|
||
v-model="row.plannedPaymentAmount" :placeholder="t('planApply.placeholder.input')"
|
||
:class="{ 'is-error': row.plannedPaymentAmount === null }" />
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column :label="t('planApply.annualInvestmentInfo.table.fundingSources')" align="center">
|
||
<el-table-column min-width="140">
|
||
<template #header>
|
||
<span class="required-field">{{ t('planApply.annualInvestmentInfo.table.capitalFunding') +
|
||
'(万元)' }}</span>
|
||
</template>
|
||
<template #default="{ row }">
|
||
<el-input-number :precision="2" :controls="false" :min="0" :value-on-clear="null"
|
||
v-model="row.selfFunding" :placeholder="t('planApply.placeholder.input')"
|
||
:class="{ 'is-error': row.selfFunding === null }" />
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column min-width="150">
|
||
<template #header>
|
||
<span class="required-field">{{
|
||
t('planApply.annualInvestmentInfo.table.externalRaisedFunds') + '(万元)' }}</span>
|
||
</template>
|
||
<template #default="{ row }">
|
||
<el-input-number :precision="2" :controls="false" :min="0" :value-on-clear="null"
|
||
v-model="row.externalFunding" :placeholder="t('planApply.placeholder.input')"
|
||
:class="{ 'is-error': row.externalFunding === null }" />
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column min-width="140">
|
||
<template #header>
|
||
<span class="required-field">{{ t('planApply.annualInvestmentInfo.table.financialFunding') +
|
||
'(万元)' }}</span>
|
||
</template>
|
||
<template #default="{ row }">
|
||
<el-input-number :precision="2" :controls="false" :min="0" :value-on-clear="null"
|
||
v-model="row.fiscalFunding" :placeholder="t('planApply.placeholder.input')"
|
||
:class="{ 'is-error': row.fiscalFunding === null }" />
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column min-width="140">
|
||
<template #header>
|
||
<span class="required-field">{{ t('planApply.annualInvestmentInfo.table.otherFunding') +
|
||
'(万元)' }}</span>
|
||
</template>
|
||
<template #default="{ row }">
|
||
<el-input-number :precision="2" :controls="false" :min="0" :value-on-clear="null"
|
||
v-model="row.otherFunding" :placeholder="t('planApply.placeholder.input')"
|
||
:class="{ 'is-error': row.otherFunding === null }" />
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column :label="t('planApply.annualInvestmentInfo.table.financialFundingDescription')"
|
||
min-width="200">
|
||
<template #default="{ row }">
|
||
<el-input v-model="row.fiscalFundingSource"
|
||
:placeholder="t('planApply.placeholder.input')" />
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column :label="t('planApply.annualInvestmentInfo.table.otherFundingDescription')"
|
||
min-width="200">
|
||
<template #default="{ row }">
|
||
<el-input v-model="row.otherFundingSource"
|
||
:placeholder="t('planApply.placeholder.input')" />
|
||
</template>
|
||
</el-table-column>
|
||
</el-table-column>
|
||
</el-table>
|
||
<!-- 项目决策信息-->
|
||
<div class="form-section-title">{{ t('planApply.decisionInfo.title') }}</div>
|
||
<el-row :gutter="20" class="form-row">
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('planApply.decisionInfo.decisionType')">
|
||
<el-select v-model="formData.entity.decisionType"
|
||
:placeholder="t('planApply.placeholder.select')">
|
||
<el-option v-for="item in decisionTypeOptions" :key="item.value" :label="item.label"
|
||
:value="item.value" />
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('planApply.decisionInfo.isCompleteEstablishmentProcedures')" required
|
||
prop="entity.isProjectApprovalCompleted">
|
||
<el-select v-model="formData.entity.isProjectApprovalCompleted"
|
||
:placeholder="t('planApply.placeholder.select')">
|
||
<el-option v-for="item in yesOrNo" :key="item.value" :label="item.label"
|
||
:value="item.value" />
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-row :gutter="20" class="form-row">
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('planApply.decisionInfo.establishmentDocumentNumber')"
|
||
:prop="formData.entity.isProjectApprovalCompleted === '0' ? 'entity.projectApprovalFileNo' : ''">
|
||
<el-input v-model="formData.entity.projectApprovalFileNo"
|
||
:placeholder="t('planApply.placeholder.input')" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('planApply.decisionInfo.establishmentDocumentInfo')"
|
||
:prop="formData.entity.isProjectApprovalCompleted === '0' ? 'entity.projectApprovalFileInfo' : ''">
|
||
<el-input v-model="formData.entity.projectApprovalFileInfo"
|
||
:placeholder="t('planApply.placeholder.input')" />
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-row :gutter="20" class="form-row">
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('planApply.decisionInfo.isCompleteDecisionProcedures')" required
|
||
prop="entity.isDecisionProcedureCompleted">
|
||
<el-select v-model="formData.entity.isDecisionProcedureCompleted"
|
||
:placeholder="t('planApply.placeholder.select')">
|
||
<el-option v-for="item in yesOrNo" :key="item.value" :label="item.label"
|
||
:value="item.value" />
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item :label="t('planApply.decisionInfo.decisionProgramDocumentNumber')"
|
||
:prop="formData.entity.isDecisionProcedureCompleted === '0' ? 'entity.decisionProcedureFileNo' : ''">
|
||
<el-input v-model="formData.entity.decisionProcedureFileNo"
|
||
:placeholder="t('planApply.placeholder.input')" />
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-row :gutter="20" class="form-row">
|
||
<el-col :span="24">
|
||
<el-form-item :label="t('planApply.decisionInfo.decisionDocumentInfo')"
|
||
:prop="formData.entity.isDecisionProcedureCompleted === '0' ? 'entity.decisionFileInfo' : ''">
|
||
<el-input v-model="formData.entity.decisionFileInfo"
|
||
:placeholder="t('planApply.placeholder.input')" />
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<!-- 审核意见-->
|
||
<div class="form-section-title">{{ t('planApply.reviewOpinions.title') }}</div>
|
||
<el-row class="form-row">
|
||
<el-col :span="24">
|
||
<el-form-item :label="t('planApply.reviewOpinions.submitUnitOpinion')">
|
||
<el-input v-model="formData.entity.submitUnitOpinion" :readonly="mode === 'view'" />
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-row class="form-row">
|
||
<el-col :span="24">
|
||
<el-form-item :label="t('planApply.reviewOpinions.groupInvestmentDeptOpinion')">
|
||
<el-input v-model="formData.entity.groupInvestmentDeptOpinion" :readonly="mode === 'view'" />
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-row class="form-row">
|
||
<el-col :span="24">
|
||
<el-form-item :label="t('planApply.reviewOpinions.submitUnitLeadershipOpinion')">
|
||
<el-input v-model="formData.entity.submitUnitLeadershipOpinion" :readonly="mode === 'view'" />
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-row class="form-row">
|
||
<el-col :span="24">
|
||
<el-form-item :label="t('planApply.reviewOpinions.submitUnitMainLeadershipOpinion')">
|
||
<el-input v-model="formData.entity.submitUnitMainLeadershipOpinion"
|
||
:readonly="mode === 'view'" />
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
</el-form>
|
||
<ProjectNameList :visible="visible" @emit:cancel="visible = false" @emit:confirm="projectNameFn" />
|
||
<LibrarySelect v-model="librarySelectVisible" @select="handleLibrarySelect" />
|
||
</div>
|
||
</template>
|
||
|
||
<script lang="ts" setup>
|
||
import { ref, watch, nextTick, computed } from 'vue';
|
||
import { useI18n } from 'vue-i18n';
|
||
import type { InvestmentProjects, ProjectPlanApplyFormData } from '../interface/types';
|
||
import ProjectNameList from '/@/components/ProjectNameList/index.vue';
|
||
import UploadFile from '/@/components/Upload/index.vue';
|
||
import {
|
||
projectNatureOptions,
|
||
investmentAreaOptions,
|
||
investmentCategoryOptions,
|
||
projectSourceOptions,
|
||
constructionNatureOptions,
|
||
projectImportantOptions,
|
||
mainBusinessOptions,
|
||
strategicIndustryOptions,
|
||
cityStrategyOptions, decisionTypeOptions, yesOrNo, projectDirectionOptions,
|
||
} from '/@/hooks/enums';
|
||
import type { FormInstance, FormRules } from 'element-plus';
|
||
import { ElMessage } from 'element-plus';
|
||
import { FolderOpened } from '@element-plus/icons-vue';
|
||
import LibrarySelect from '/@/views/invMid/projectLibrary/components/LibrarySelect.vue';
|
||
import { selectTreeCompanyTree } from '/@/api/admin/dept';
|
||
const { t } = useI18n();
|
||
const useForm = ref<FormInstance | undefined>();
|
||
const props = withDefaults(
|
||
defineProps<{
|
||
modelValue?: ProjectPlanApplyFormData;
|
||
rules?: FormRules;
|
||
isUpdate?: boolean;
|
||
mode?: 'edit' | 'view';
|
||
}>(),
|
||
{
|
||
modelValue: () => ({
|
||
entity: {
|
||
id: null,
|
||
projectName: '',
|
||
projectNature: '',
|
||
groupCompany: '',
|
||
projectOwnerUnit: '',
|
||
projectMainEntity: '',
|
||
projectDepartment: '',
|
||
investmentCategory: '',
|
||
investmentArea: '',
|
||
projectAddress: '',
|
||
projectAddressDetail: '',
|
||
projectInvestmentDirection: '',
|
||
totalInvestment: '',
|
||
investmentDirectionSegmentation: '',
|
||
projectBackground: '',
|
||
constructionNature: '',
|
||
constructionStage: '',
|
||
keyProject: '',
|
||
isMainBusiness: '',
|
||
mainBusinessTypes: '',
|
||
mainBusinessCode: '',
|
||
isManufacturingIndustry: '',
|
||
isStuckIndustry: '',
|
||
urbanStrategy: '',
|
||
projectSource: '',
|
||
majorInvestmentProjects: '',
|
||
isStrategicEmergingIndustries: '',
|
||
projectStartTime: '',
|
||
projectEndTime: '',
|
||
projectConstructionContent: '',
|
||
planInvestmentYear: '',
|
||
annualPlanTotal: '',
|
||
annualPlanInvestment: '',
|
||
planPaymentLimit: '',
|
||
plannedImageAmount: '',
|
||
ownedFunds: '',
|
||
financialFunds: '',
|
||
externalFunding: '',
|
||
externalRaisedCapital: '',
|
||
otherFunds: '',
|
||
governmentFundSourceDesc: '',
|
||
otherFundSourceDesc: '',
|
||
projectTotalAmount: '',
|
||
lastYearCompleted: '',
|
||
ourInvestmentTotalAmount: '',
|
||
ourLastYearCompleted: '',
|
||
projectDesc: '',
|
||
promotionPlan: '',
|
||
projectPreliminaryPlan: '',
|
||
projectPreliminaryPlanAttachment: '',
|
||
attachments: [],
|
||
remark: '',
|
||
decisionType: '',
|
||
isProjectApprovalCompleted: '',
|
||
isDecisionProcedureCompleted: '',
|
||
projectApprovalFileNo: '',
|
||
projectApprovalFileInfo: '',
|
||
decisionProcedureFileNo: '',
|
||
decisionFileInfo: '',
|
||
submitUnitOpinion: '',
|
||
groupInvestmentDeptOpinion: '',
|
||
submitUnitLeadershipOpinion: '',
|
||
submitUnitMainLeadershipOpinion: '',
|
||
planImageQuota: '',
|
||
deptId: 0,
|
||
processInstanceId: '',
|
||
status: 0
|
||
},
|
||
investmentProjects: [
|
||
{
|
||
plannedInvestmentYear: '',
|
||
plannedImageAmount: '',
|
||
plannedPaymentAmount: '',
|
||
selfFunding: '',
|
||
externalFunding: '',
|
||
fiscalFunding: '',
|
||
otherFunding: '',
|
||
fiscalFundingSource: '',
|
||
otherFundingSource: '',
|
||
},
|
||
],
|
||
}),
|
||
rules: () => ({}),
|
||
isUpdate: false,
|
||
mode: 'edit',
|
||
}
|
||
);
|
||
|
||
const emit = defineEmits<{
|
||
(e: 'update:modelValue', value: ProjectPlanApplyFormData): void;
|
||
}>();
|
||
|
||
const mode = computed(() => props.mode);
|
||
|
||
const defaultForm: ProjectPlanApplyFormData = {
|
||
entity: {
|
||
id: null,
|
||
projectName: '',
|
||
projectNature: '',
|
||
groupCompany: '',
|
||
projectOwnerUnit: '',
|
||
projectMainEntity: '',
|
||
projectDepartment: '',
|
||
investmentCategory: '',
|
||
investmentArea: '',
|
||
projectAddress: '',
|
||
projectAddressDetail: '',
|
||
projectInvestmentDirection: '',
|
||
totalInvestment: '',
|
||
investmentDirectionSegmentation: '',
|
||
projectBackground: '',
|
||
constructionNature: '',
|
||
constructionStage: '',
|
||
keyProject: '',
|
||
isMainBusiness: '',
|
||
mainBusinessTypes: '',
|
||
mainBusinessCode: '',
|
||
isManufacturingIndustry: '',
|
||
isStuckIndustry: '',
|
||
urbanStrategy: '',
|
||
projectSource: '',
|
||
majorInvestmentProjects: '',
|
||
isStrategicEmergingIndustries: '',
|
||
projectStartTime: '',
|
||
projectEndTime: '',
|
||
projectConstructionContent: '',
|
||
planInvestmentYear: '',
|
||
annualPlanTotal: '',
|
||
annualPlanInvestment: '',
|
||
planPaymentLimit: '',
|
||
plannedImageAmount: '',
|
||
ownedFunds: '',
|
||
financialFunds: '',
|
||
externalFunding: '',
|
||
externalRaisedCapital: '',
|
||
otherFunds: '',
|
||
governmentFundSourceDesc: '',
|
||
otherFundSourceDesc: '',
|
||
projectTotalAmount: '',
|
||
lastYearCompleted: '',
|
||
ourInvestmentTotalAmount: '',
|
||
ourLastYearCompleted: '',
|
||
projectDesc: '',
|
||
promotionPlan: '',
|
||
projectPreliminaryPlan: '',
|
||
projectPreliminaryPlanAttachment: '',
|
||
attachments: [],
|
||
remark: '',
|
||
decisionType: '',
|
||
isProjectApprovalCompleted: '',
|
||
isDecisionProcedureCompleted: '',
|
||
projectApprovalFileNo: '',
|
||
projectApprovalFileInfo: '',
|
||
decisionProcedureFileNo: '',
|
||
decisionFileInfo: '',
|
||
submitUnitOpinion: '',
|
||
groupInvestmentDeptOpinion: '',
|
||
submitUnitLeadershipOpinion: '',
|
||
submitUnitMainLeadershipOpinion: '',
|
||
planImageQuota: '',
|
||
deptId: 0,
|
||
processInstanceId: '',
|
||
status: 0,
|
||
},
|
||
investmentProjects: [
|
||
{
|
||
plannedInvestmentYear: '',
|
||
plannedImageAmount: '',
|
||
plannedPaymentAmount: '',
|
||
selfFunding: '',
|
||
externalFunding: '',
|
||
fiscalFunding: '',
|
||
otherFunding: '',
|
||
fiscalFundingSource: '',
|
||
otherFundingSource: '',
|
||
},
|
||
],
|
||
};
|
||
|
||
const formData = ref<ProjectPlanApplyFormData>({ ...defaultForm });
|
||
|
||
const selectedAnnualInvestmentIndex = ref<number>(formData.value.investmentProjects.length > 0 ? 0 : -1);
|
||
|
||
const handleAddAnnualInvestment = () => {
|
||
const newItem: InvestmentProjects = {
|
||
plannedInvestmentYear: '',
|
||
plannedImageAmount: null,
|
||
plannedPaymentAmount: null,
|
||
selfFunding: null,
|
||
externalFunding: null,
|
||
fiscalFunding: null,
|
||
otherFunding: null,
|
||
fiscalFundingSource: '',
|
||
otherFundingSource: '',
|
||
};
|
||
formData.value.investmentProjects.push(newItem);
|
||
selectedAnnualInvestmentIndex.value = formData.value.investmentProjects.length - 1;
|
||
};
|
||
const year = computed(() => formData.value.entity.planInvestmentYear)
|
||
// 修改计算逻辑，确保正确处理初始值
|
||
const safeParseFloat = (value: string | number | null): number => {
|
||
if (value === null) return 0;
|
||
const parsed = typeof value === 'string' ? parseFloat(value) : value;
|
||
return isNaN(parsed) ? 0 : parsed;
|
||
};
|
||
// 监听投资计划数据变化
|
||
watch(() => formData.value.investmentProjects, (newValue) => {
|
||
if (!year.value) return;
|
||
let totalPlanImageQuota = 0;
|
||
let totalPlanPaymentLimit = 0;
|
||
let totalOwnedFunds = 0;
|
||
let totaExternalFunding = 0;
|
||
let externalRaisedCapital = 0
|
||
let otherFunding = 0;
|
||
newValue.forEach((item) => {
|
||
if (item.plannedInvestmentYear === year.value) {
|
||
totalPlanImageQuota += safeParseFloat(item.plannedImageAmount);
|
||
totalPlanPaymentLimit += safeParseFloat(item.plannedPaymentAmount);
|
||
totalOwnedFunds += safeParseFloat(item.selfFunding); // 自筹
|
||
totaExternalFunding += safeParseFloat(item.externalFunding); // 外部
|
||
externalRaisedCapital += safeParseFloat(item.fiscalFunding); // 财政
|
||
otherFunding += safeParseFloat(item.otherFunding); // 其他
|
||
}
|
||
});
|
||
nextTick(() => {
|
||
formData.value.entity.planImageQuota = totalPlanImageQuota.toString();
|
||
formData.value.entity.planPaymentLimit = totalPlanPaymentLimit.toString();
|
||
formData.value.entity.externalRaisedCapital = totaExternalFunding.toString();
|
||
formData.value.entity.ownedFunds = totalOwnedFunds.toString();
|
||
formData.value.entity.financialFunds = externalRaisedCapital.toString();
|
||
formData.value.entity.otherFunds = otherFunding.toString();
|
||
})
|
||
}, { deep: true })
|
||
const handleCopyAnnualInvestment = () => {
|
||
if (selectedAnnualInvestmentIndex.value >= 0 && selectedAnnualInvestmentIndex.value < formData.value.investmentProjects.length) {
|
||
const selectedItem = formData.value.investmentProjects[selectedAnnualInvestmentIndex.value];
|
||
const copiedItem: InvestmentProjects = { ...selectedItem };
|
||
formData.value.investmentProjects.push(copiedItem);
|
||
selectedAnnualInvestmentIndex.value = formData.value.investmentProjects.length - 1;
|
||
}
|
||
};
|
||
|
||
const handleRemoveAnnualInvestment = () => {
|
||
if (selectedAnnualInvestmentIndex.value >= 0 && selectedAnnualInvestmentIndex.value < formData.value.investmentProjects.length) {
|
||
formData.value.investmentProjects.splice(selectedAnnualInvestmentIndex.value, 1);
|
||
if (selectedAnnualInvestmentIndex.value >= formData.value.investmentProjects.length) {
|
||
selectedAnnualInvestmentIndex.value = formData.value.investmentProjects.length - 1;
|
||
}
|
||
}
|
||
};
|
||
|
||
const handleRemoveAllAnnualInvestment = () => {
|
||
formData.value.investmentProjects = [];
|
||
selectedAnnualInvestmentIndex.value = -1;
|
||
};
|
||
const visible = ref(false);
|
||
const librarySelectVisible = ref(false);
|
||
const handleSelectProject = () => {
|
||
if (props.isUpdate) {
|
||
librarySelectVisible.value = true;
|
||
} else {
|
||
visible.value = true;
|
||
}
|
||
};
|
||
watch(
|
||
() => props.modelValue,
|
||
(newVal) => {
|
||
Object.assign(formData.value, newVal || {});
|
||
formData.value.entity.planInvestmentYear = String(newVal?.entity?.planInvestmentYear);
|
||
// 如果有数据且没有选中，默认选中第一行
|
||
if (formData.value.investmentProjects.length > 0 && selectedAnnualInvestmentIndex.value === -1) {
|
||
selectedAnnualInvestmentIndex.value = 0;
|
||
}
|
||
},
|
||
{ immediate: true, deep: true }
|
||
);
|
||
|
||
watch(
|
||
() => formData.value,
|
||
() => {
|
||
emit('update:modelValue', { ...formData.value });
|
||
},
|
||
{ deep: true }
|
||
);
|
||
const validateForm = async () => {
|
||
// 先验证表单
|
||
const formValid = await useForm.value?.validate().catch(() => false);
|
||
|
||
// 帮助函数：检查值是否为空
|
||
const isEmptyValue = (value: any): boolean => {
|
||
if (value === null || value === undefined) return true;
|
||
if (typeof value === 'string' && value.trim() === '') return true;
|
||
if (typeof value === 'number' && isNaN(value)) return true;
|
||
return false;
|
||
};
|
||
|
||
// 验证年度项目投资信息表格
|
||
let tableValid = true;
|
||
const tableErrors: string[] = [];
|
||
|
||
if (formData.value.investmentProjects.length === 0) {
|
||
tableErrors.push('请至少添加一条年度项目投资信息');
|
||
tableValid = false;
|
||
} else {
|
||
formData.value.investmentProjects.forEach((item, index) => {
|
||
const rowNum = index + 1;
|
||
if (isEmptyValue(item.plannedInvestmentYear)) {
|
||
tableErrors.push(`第${rowNum}行：计划投资年度必填`);
|
||
tableValid = false;
|
||
}
|
||
if (isEmptyValue(item.plannedImageAmount)) {
|
||
tableErrors.push(`第${rowNum}行：计划形象额度必填`);
|
||
tableValid = false;
|
||
}
|
||
if (isEmptyValue(item.plannedPaymentAmount)) {
|
||
tableErrors.push(`第${rowNum}行：计划支付额度必填`);
|
||
tableValid = false;
|
||
}
|
||
if (isEmptyValue(item.selfFunding)) {
|
||
tableErrors.push(`第${rowNum}行：自有资金必填`);
|
||
tableValid = false;
|
||
}
|
||
if (isEmptyValue(item.externalFunding)) {
|
||
tableErrors.push(`第${rowNum}行：对外募集资金必填`);
|
||
tableValid = false;
|
||
}
|
||
if (isEmptyValue(item.fiscalFunding)) {
|
||
tableErrors.push(`第${rowNum}行：财政资金必填`);
|
||
tableValid = false;
|
||
}
|
||
if (isEmptyValue(item.otherFunding)) {
|
||
tableErrors.push(`第${rowNum}行：其他资金必填`);
|
||
tableValid = false;
|
||
}
|
||
});
|
||
}
|
||
|
||
if (!tableValid) {
|
||
// 显示第一个表格错误
|
||
ElMessage.error(tableErrors[0]);
|
||
return Promise.reject(new Error(tableErrors[0]));
|
||
}
|
||
|
||
if (!formValid) {
|
||
return Promise.reject(new Error('表单验证失败'));
|
||
}
|
||
|
||
return Promise.resolve(true);
|
||
};
|
||
const projectNameFn = (row: any) => {
|
||
Object.assign(formData.value.entity, row);
|
||
visible.value = false;
|
||
};
|
||
const handleLibrarySelect = (row: any) => {
|
||
Object.assign(formData.value.entity, {
|
||
...row,
|
||
id: '',
|
||
parentId: row.id,
|
||
projectPreliminaryPlanAttachment: row.projectPreliminaryPlanAttachment ? JSON.parse(row.projectPreliminaryPlanAttachment) : [],
|
||
});
|
||
librarySelectVisible.value = false;
|
||
};
|
||
defineExpose({
|
||
validateForm: validateForm,
|
||
});
|
||
const uploadChange = (_: any, data: any[]) => {
|
||
if (!data || Object.prototype.toString.call(data) !== '[object Array]' || data.length === 0) {
|
||
formData.value.entity.projectPreliminaryPlanAttachment = [];
|
||
return;
|
||
}
|
||
formData.value.entity.projectPreliminaryPlanAttachment = data.map((item: any) => {
|
||
return {
|
||
name: item.name,
|
||
url: item.url,
|
||
};
|
||
});
|
||
};
|
||
const projectMainEntityOptions = ref([]);
|
||
const getDeptTree = async () => {
|
||
const res = await selectTreeCompanyTree();
|
||
projectMainEntityOptions.value = res.data || [];
|
||
};
|
||
getDeptTree();
|
||
const newProjectDirectionDetailsOptions: any = {
|
||
'1': [
|
||
{ label: '先进制造业', value: '1' },
|
||
{ label: '现代服务业', value: '2' },
|
||
{ label: '现代农业', value: '3' },
|
||
{ label: '数字经济产业', value: '4' },],
|
||
'2': [
|
||
{ label: '交通基础设施', value: '5' },
|
||
{ label: '城市基础设施', value: '6' },
|
||
{ label: '水利及能源基础', value: '7' },
|
||
{ label: '新型基础设施', value: '8' },
|
||
],
|
||
'3': [
|
||
{ label: '应急安全', value: '9' },
|
||
{ label: '医疗卫生', value: '10' },
|
||
{ label: '教育文体', value: '11' },
|
||
{ label: '城市有机更新', value: '12' },
|
||
{ label: '生态环保', value: '13' },
|
||
]
|
||
}
|
||
const ProjectDirectionDetailsOptionsEnums = computed(() => {
|
||
return newProjectDirectionDetailsOptions[formData.value.entity.projectInvestmentDirection]
|
||
})
|
||
const handleProjectMainUnitChange = (value: any) => {
|
||
formData.value.entity.deptId = value.id
|
||
}
|
||
</script>
|
||
|
||
<style scoped>
|
||
.page-title-row {
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
position: relative;
|
||
}
|
||
|
||
.page-title {
|
||
font-size: 20px;
|
||
font-weight: 600;
|
||
}
|
||
|
||
.page-unit {
|
||
position: absolute;
|
||
right: 0;
|
||
font-size: 14px;
|
||
color: var(--el-text-color-secondary);
|
||
}
|
||
|
||
.project-plan-apply-form {
|
||
background: #fff;
|
||
border-radius: 4px;
|
||
padding: 20px;
|
||
}
|
||
|
||
.form-section-title {
|
||
font-size: 16px;
|
||
font-weight: 600;
|
||
color: var(--el-text-color-primary);
|
||
margin: 24px 0 16px;
|
||
padding-left: 10px;
|
||
border-left: 4px solid var(--el-color-primary);
|
||
}
|
||
|
||
.plan-form {
|
||
width: 100%;
|
||
}
|
||
|
||
/* 表单 label 左对齐 */
|
||
.plan-form :deep(.el-form-item__label) {
|
||
text-align: left;
|
||
justify-content: flex-start;
|
||
}
|
||
|
||
/* 必填字段标签显示为红色 */
|
||
/*.plan-form :deep(.el-form-item.is-required .el-form-item__label) {
|
||
color: var(--el-color-danger);
|
||
}*/
|
||
|
||
.form-row {
|
||
margin-bottom: 16px;
|
||
margin-top: 16px;
|
||
}
|
||
|
||
.form-row:last-of-type {
|
||
margin-bottom: 0;
|
||
}
|
||
|
||
.sub-section-title {
|
||
font-size: 15px;
|
||
font-weight: 600;
|
||
color: var(--el-text-color-primary);
|
||
margin: 24px 0 16px;
|
||
}
|
||
|
||
.plan-investment-panel {
|
||
display: flex;
|
||
flex-direction: row;
|
||
align-items: center;
|
||
}
|
||
|
||
.panel-title {
|
||
width: 200px;
|
||
padding-top: 0;
|
||
margin-top: 0;
|
||
}
|
||
|
||
.plan-investment-panel :deep(.el-form-item__label) {
|
||
padding-top: 0;
|
||
line-height: 32px;
|
||
}
|
||
|
||
.plan-investment-panel :deep(.el-form-item) {
|
||
align-items: center;
|
||
}
|
||
|
||
.table-actions {
|
||
margin-bottom: 16px;
|
||
display: flex;
|
||
gap: 12px;
|
||
}
|
||
|
||
.annual-investment-table {
|
||
width: 100%;
|
||
}
|
||
|
||
.annual-investment-table :deep(.el-table__body-wrapper) {
|
||
overflow-x: auto;
|
||
}
|
||
|
||
/* 必填字段标记 - 在标题前添加红色星号 */
|
||
.required-field::before {
|
||
content: '*';
|
||
color: var(--el-color-danger);
|
||
margin-right: 4px;
|
||
}
|
||
|
||
/* 错误状态样式 - 输入框红色边框 */
|
||
.annual-investment-table :deep(.is-error .el-input__wrapper) {
|
||
border-color: var(--el-color-danger) !important;
|
||
box-shadow: 0 0 0 1px var(--el-color-danger) inset !important;
|
||
}
|
||
</style>
|