1404 lines
41 KiB
Vue
1404 lines
41 KiB
Vue
<template>
|
|
<a-modal
|
|
v-model:open="visible"
|
|
:title="isAdd ? '新增电站' : '编辑电站'"
|
|
width="80vw"
|
|
:confirm-loading="confirmLoading"
|
|
@ok="handleOk"
|
|
@cancel="handleCancel"
|
|
>
|
|
<a-form
|
|
ref="formRef"
|
|
:model="formData"
|
|
:label-col="{ span: 8 }"
|
|
:wrapper-col="{ span: 16 }"
|
|
:rules="formRules"
|
|
class="max-h-[70vh] overflow-y-auto pr-4"
|
|
>
|
|
<a-row :gutter="16">
|
|
<!-- ===== 概述 ===== -->
|
|
<a-col :span="24"><div class="form-group-title">概述</div></a-col>
|
|
|
|
<a-col :span="8">
|
|
<a-form-item label="电站编码" name="stcd">
|
|
<a-input
|
|
v-model:value="formData.stcd"
|
|
placeholder="请输入电站编码"
|
|
:disabled="!isAdd"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item label="电站名称" name="ennm">
|
|
<a-input
|
|
v-model:value="formData.ennm"
|
|
placeholder="请输入电站名称"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item label="基地" name="baseId">
|
|
<a-select
|
|
v-model:value="formData.baseId"
|
|
placeholder="请选择基地"
|
|
allow-clear
|
|
show-search
|
|
:filter-option="filterOption"
|
|
@change="handleBaseIdChange"
|
|
>
|
|
<a-select-option
|
|
v-for="item in baseNameOptions"
|
|
:key="item.value"
|
|
:label="item.label"
|
|
:value="item.value"
|
|
>{{ item.label }}</a-select-option
|
|
>
|
|
</a-select>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item label="所在位置" name="addvcd">
|
|
<a-select
|
|
v-model:value="formData.addvcd"
|
|
placeholder="请选择所在位置"
|
|
allow-clear
|
|
show-search
|
|
:filter-option="filterOption"
|
|
>
|
|
<a-select-option
|
|
v-for="item in addvcdOptions"
|
|
:key="item.value"
|
|
:label="item.label"
|
|
:value="item.value"
|
|
>{{ item.label }}</a-select-option
|
|
>
|
|
</a-select>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item label="详细地址" name="stlc">
|
|
<a-input
|
|
v-model:value="formData.stlc"
|
|
placeholder="请输入详细地址"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item label="所在河段" name="reachcd">
|
|
<a-select
|
|
v-model:value="formData.reachcd"
|
|
placeholder="请选择所在河段"
|
|
allow-clear
|
|
show-search
|
|
:filter-option="filterOption"
|
|
>
|
|
<a-select-option
|
|
v-for="item in hbrvcdNameOptions"
|
|
:key="item.value"
|
|
:label="item.label"
|
|
:value="item.value"
|
|
:title="item.label"
|
|
>{{ item.label }}</a-select-option
|
|
>
|
|
</a-select>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item label="所属公司" name="hycd">
|
|
<a-select
|
|
v-model:value="formData.hycd"
|
|
placeholder="请选择所属公司"
|
|
allow-clear
|
|
show-search
|
|
:filter-option="filterOption"
|
|
>
|
|
<a-select-option
|
|
v-for="item in hycdList"
|
|
:key="item.hycd"
|
|
:label="item.hynm"
|
|
:value="item.hycd"
|
|
>{{ item.hynm }}</a-select-option
|
|
>
|
|
</a-select>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item label="所属集团" name="topHycd">
|
|
<a-select
|
|
v-model:value="formData.topHycd"
|
|
placeholder="请选择所属集团"
|
|
allow-clear
|
|
show-search
|
|
:filter-option="filterOption"
|
|
>
|
|
<a-select-option
|
|
v-for="item in topHynmList"
|
|
:key="item.hycd"
|
|
:label="item.hynm"
|
|
:value="item.hycd"
|
|
>{{ item.hynm }}</a-select-option
|
|
>
|
|
</a-select>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item label="建设状态" name="bldsttCode">
|
|
<a-select
|
|
v-model:value="formData.bldsttCode"
|
|
placeholder="请选择建设状态"
|
|
allow-clear
|
|
>
|
|
<a-select-option
|
|
v-for="item in bldsttCodeOptions"
|
|
:key="item.value"
|
|
:value="item.value"
|
|
>{{ item.label }}</a-select-option
|
|
>
|
|
</a-select>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item label="建设时间" name="jcdt">
|
|
<a-date-picker
|
|
v-model:value="formData.jcdt"
|
|
format="YYYY-MM-DD"
|
|
value-format="YYYY-MM-DD HH:mm:ss"
|
|
placeholder="请选择建设时间"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item label="第一台机组投产时间" name="piodt">
|
|
<a-date-picker
|
|
v-model:value="formData.piodt"
|
|
format="YYYY-MM-DD"
|
|
value-format="YYYY-MM-DD HH:mm:ss"
|
|
placeholder="请选择第一台机组投产时间"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item label="全部机组投产时间" name="aiodt">
|
|
<a-date-picker
|
|
v-model:value="formData.aiodt"
|
|
format="YYYY-MM-DD"
|
|
value-format="YYYY-MM-DD HH:mm:ss"
|
|
placeholder="请选择全部机组投产时间"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
|
|
<!-- ===== 水文 ===== -->
|
|
<a-col :span="24"><div class="form-group-title">水文</div></a-col>
|
|
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="坝址以上流域面积(km²)"
|
|
:labelCol="{ span: 10 }"
|
|
name="nrupar"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.nrupar"
|
|
placeholder="请输入"
|
|
:precision="2"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="距河源距离(km)"
|
|
:labelCol="{ span: 10 }"
|
|
name="dstcrvr"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.dstcrvr"
|
|
placeholder="请输入"
|
|
:precision="2"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="多年平均降雨量(mm)"
|
|
:labelCol="{ span: 10 }"
|
|
name="avyrp"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.avyrp"
|
|
placeholder="请输入"
|
|
:precision="2"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="多年平均年径流量(亿m³)"
|
|
:labelCol="{ span: 10 }"
|
|
name="avw"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.avw"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="多年平均流量(m³/s)"
|
|
:labelCol="{ span: 10 }"
|
|
name="avq"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.avq"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="1月多年平均流量(m³/s)"
|
|
:labelCol="{ span: 10 }"
|
|
name="avq01"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.avq01"
|
|
placeholder="请输入"
|
|
:precision="0"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="2月多年平均流量(m³/s)"
|
|
:labelCol="{ span: 10 }"
|
|
name="avq02"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.avq02"
|
|
placeholder="请输入"
|
|
:precision="0"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="3月多年平均流量(m³/s)"
|
|
:labelCol="{ span: 10 }"
|
|
name="avq03"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.avq03"
|
|
placeholder="请输入"
|
|
:precision="0"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="4月多年平均流量(m³/s)"
|
|
:labelCol="{ span: 10 }"
|
|
name="avq04"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.avq04"
|
|
placeholder="请输入"
|
|
:precision="0"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="5月多年平均流量(m³/s)"
|
|
:labelCol="{ span: 10 }"
|
|
name="avq05"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.avq05"
|
|
placeholder="请输入"
|
|
:precision="0"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="6月多年平均流量(m³/s)"
|
|
:labelCol="{ span: 10 }"
|
|
name="avq06"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.avq06"
|
|
placeholder="请输入"
|
|
:precision="0"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="7月多年平均流量(m³/s)"
|
|
:labelCol="{ span: 10 }"
|
|
name="avq07"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.avq07"
|
|
placeholder="请输入"
|
|
:precision="0"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="8月多年平均流量(m³/s)"
|
|
:labelCol="{ span: 10 }"
|
|
name="avq08"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.avq08"
|
|
placeholder="请输入"
|
|
:precision="0"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="9月多年平均流量(m³/s)"
|
|
:labelCol="{ span: 10 }"
|
|
name="avq09"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.avq09"
|
|
placeholder="请输入"
|
|
:precision="0"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="10月多年平均流量(m³/s)"
|
|
:labelCol="{ span: 10 }"
|
|
name="avq10"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.avq10"
|
|
placeholder="请输入"
|
|
:precision="0"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="11月多年平均流量(m³/s)"
|
|
:labelCol="{ span: 10 }"
|
|
name="avq11"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.avq11"
|
|
placeholder="请输入"
|
|
:precision="0"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="12月多年平均流量(m³/s)"
|
|
:labelCol="{ span: 10 }"
|
|
name="avq12"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.avq12"
|
|
placeholder="请输入"
|
|
:precision="0"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="实测最大流量(m³/s)"
|
|
:labelCol="{ span: 10 }"
|
|
name="obmxq"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.obmxq"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="实测最小流量(m³/s)"
|
|
:labelCol="{ span: 10 }"
|
|
name="obmnq"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.obmnq"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="调查历史最大流量(m³/s)"
|
|
:labelCol="{ span: 10 }"
|
|
name="hmxq"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.hmxq"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="设计入库洪水流量(m³/s)"
|
|
:labelCol="{ span: 10 }"
|
|
name="dsnfqfrq"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.dsnfqfrq"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="设计洪水重现期(年)"
|
|
:labelCol="{ span: 10 }"
|
|
name="dsrcin"
|
|
>
|
|
<a-input v-model:value="formData.dsrcin" placeholder="请输入" />
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="校核入库洪水流量(m³/s)"
|
|
:labelCol="{ span: 10 }"
|
|
name="ckfqfqr"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.ckfqfqr"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="校核洪水重现期(年)"
|
|
:labelCol="{ span: 10 }"
|
|
name="chrcin"
|
|
>
|
|
<a-input v-model:value="formData.chrcin" placeholder="请输入" />
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="实测最大洪量（三天）(亿m³)"
|
|
:labelCol="{ span: 10 }"
|
|
name="obmxw3"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.obmxw3"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="设计洪量（三天）(亿m³)"
|
|
:labelCol="{ span: 10 }"
|
|
name="dsw3"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.dsw3"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="校核洪量（三天）(亿m³)"
|
|
:labelCol="{ span: 10 }"
|
|
name="ckw3"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.ckw3"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="多年平均输沙量(万t)"
|
|
:labelCol="{ span: 10 }"
|
|
name="avsd"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.avsd"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="多年平均含沙量(kg/m³)"
|
|
:labelCol="{ span: 10 }"
|
|
name="avs"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.avs"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="实测最大含沙量(kg/m³)"
|
|
:labelCol="{ span: 10 }"
|
|
name="obmxs"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.obmxs"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
|
|
<!-- ===== 水库 ===== -->
|
|
<a-col :span="24"><div class="form-group-title">水库</div></a-col>
|
|
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="校核洪水位(m)"
|
|
:labelCol="{ span: 10 }"
|
|
name="ckflz"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.ckflz"
|
|
placeholder="请输入"
|
|
:precision="2"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="设计洪水位(m)"
|
|
:labelCol="{ span: 10 }"
|
|
name="dsflz"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.dsflz"
|
|
placeholder="请输入"
|
|
:precision="2"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="正常蓄水位(m)"
|
|
:labelCol="{ span: 10 }"
|
|
name="normz"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.normz"
|
|
placeholder="请输入"
|
|
:precision="2"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="防洪高水位(m)"
|
|
:labelCol="{ span: 10 }"
|
|
name="uzfc"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.uzfc"
|
|
placeholder="请输入"
|
|
:precision="2"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="防洪限制水位(m)"
|
|
:labelCol="{ span: 10 }"
|
|
name="fsltdz"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.fsltdz"
|
|
placeholder="请输入"
|
|
:precision="2"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="年消落水位(m)"
|
|
:labelCol="{ span: 10 }"
|
|
name="ydownz"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.ydownz"
|
|
placeholder="请输入"
|
|
:precision="2"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item label="死水位(m)" :labelCol="{ span: 10 }" name="ddz">
|
|
<a-input-number
|
|
v-model:value="formData.ddz"
|
|
placeholder="请输入"
|
|
:precision="2"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="正常蓄水位水库面积(km²)"
|
|
name="nrzar"
|
|
:labelCol="{ span: 10 }"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.nrzar"
|
|
placeholder="请输入"
|
|
:precision="2"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="回水长度(km)"
|
|
:labelCol="{ span: 10 }"
|
|
name="bcklen"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.bcklen"
|
|
placeholder="请输入"
|
|
:precision="2"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="总库容(亿m³)"
|
|
:labelCol="{ span: 10 }"
|
|
name="ttcp"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.ttcp"
|
|
placeholder="请输入"
|
|
:precision="2"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="正常蓄水位以下库容(亿m³)"
|
|
:labelCol="{ span: 10 }"
|
|
name="nmzcp"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.nmzcp"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="防洪库容(亿m³)"
|
|
:labelCol="{ span: 10 }"
|
|
name="fldcp"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.fldcp"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="调节库容(亿m³)"
|
|
:labelCol="{ span: 10 }"
|
|
name="actcp"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.actcp"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="死库容(亿m³)"
|
|
:labelCol="{ span: 10 }"
|
|
name="ddcp"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.ddcp"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item label="库容系数(%)" :labelCol="{ span: 10 }" name="cpsc">
|
|
<a-input-number
|
|
v-model:value="formData.cpsc"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item label="调节性能" :labelCol="{ span: 10 }" name="rgcp">
|
|
<a-select
|
|
v-model:value="formData.rgcp"
|
|
placeholder="请选择调节性能"
|
|
allow-clear
|
|
>
|
|
<a-select-option
|
|
v-for="item in rgcpNameOptions"
|
|
:key="item.value"
|
|
:value="item.value"
|
|
>{{ item.label }}</a-select-option
|
|
>
|
|
</a-select>
|
|
</a-form-item>
|
|
</a-col>
|
|
|
|
<!-- ===== 下泄流量及相应下游水位 ===== -->
|
|
<a-col :span="24"
|
|
><div class="form-group-title">下泄流量及相应下游水位</div></a-col
|
|
>
|
|
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="设计洪水位时最大下泄流量(m³/s)"
|
|
:labelCol="{ span: 12 }"
|
|
name="dsflzmxq"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.dsflzmxq"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="设计洪水位时最大下泄流量相应下游水位(m)"
|
|
:labelCol="{ span: 14 }"
|
|
name="dsflzxyz"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.dsflzxyz"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="校核洪水位时最大下泄流量(m³/s)"
|
|
:labelCol="{ span: 12 }"
|
|
name="ckflzmxq"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.ckflzmxq"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="校核洪水位时最大下泄流量相应下游水位(m)"
|
|
:labelCol="{ span: 14 }"
|
|
name="ckflzxyz"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.ckflzxyz"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="枯水期调节流量(m³/s)"
|
|
:labelCol="{ span: 12 }"
|
|
name="ksqadjq"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.ksqadjq"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="枯水期调节流量相应下游水位(m)"
|
|
:labelCol="{ span: 12 }"
|
|
name="ksqxyz"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.ksqxyz"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="发电最大引用流量(m³/s)"
|
|
:labelCol="{ span: 12 }"
|
|
name="gemaxrq"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.gemaxrq"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item
|
|
label="发电最大引用流量相应下游水位(m)"
|
|
:labelCol="{ span: 12 }"
|
|
name="mxgeqxyz"
|
|
>
|
|
<a-input-number
|
|
v-model:value="formData.mxgeqxyz"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
|
|
<!-- ===== 工程效益指标 ===== -->
|
|
<a-col :span="24"
|
|
><div class="form-group-title">工程效益指标</div></a-col
|
|
>
|
|
|
|
<a-col :span="8">
|
|
<a-form-item label="装机容量(万kW)" name="ttpwr">
|
|
<a-input-number
|
|
v-model:value="formData.ttpwr"
|
|
placeholder="请输入"
|
|
:precision="2"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item label="装机台数(台)" name="gncnt">
|
|
<a-input-number
|
|
v-model:value="formData.gncnt"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item label="容量构成(台*MW)" name="gntp">
|
|
<a-input v-model:value="formData.gntp" placeholder="请输入" />
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item label="保证出力(MW)" name="grntpwr">
|
|
<a-input-number
|
|
v-model:value="formData.grntpwr"
|
|
placeholder="请输入"
|
|
:precision="2"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item label="多年平均年发电量(亿kW·h)" name="yrge">
|
|
<a-input-number
|
|
v-model:value="formData.yrge"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item label="年利用小时数(h)" name="ushr">
|
|
<a-input-number
|
|
v-model:value="formData.ushr"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item label="机组综合出力系数" name="k">
|
|
<a-input-number
|
|
v-model:value="formData.k"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
|
|
<!-- ===== 大坝 ===== -->
|
|
<a-col :span="24"><div class="form-group-title">大坝</div></a-col>
|
|
|
|
<a-col :span="8">
|
|
<a-form-item label="坝型" name="dmtp">
|
|
<a-input
|
|
v-model:value="formData.dmtp"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item label="坝顶高程(m)" name="dmcrel">
|
|
<a-input-number
|
|
v-model:value="formData.dmcrel"
|
|
placeholder="请输入"
|
|
:precision="2"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item label="最大坝高(m)" name="mxdmhg">
|
|
<a-input-number
|
|
v-model:value="formData.mxdmhg"
|
|
placeholder="请输入"
|
|
:precision="2"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item label="坝顶长度(m)" name="dmlen">
|
|
<a-input-number
|
|
v-model:value="formData.dmlen"
|
|
placeholder="请输入"
|
|
:precision="2"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
|
|
<!-- ===== 其他 ===== -->
|
|
<a-col :span="24"><div class="form-group-title">其他</div></a-col>
|
|
|
|
<a-col :span="8">
|
|
<a-form-item label="单独年发电量(亿kW·h)" name="sgyge">
|
|
<a-input-number
|
|
v-model:value="formData.sgyge"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item label="联合年发电量(亿kW·h)" name="unyge">
|
|
<a-input-number
|
|
v-model:value="formData.unyge"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item label="利用落差(m)" name="gap">
|
|
<a-input-number
|
|
v-model:value="formData.gap"
|
|
placeholder="请输入"
|
|
style="width: 100%"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="8">
|
|
<a-form-item label="开发方式" name="dvtp">
|
|
<a-select
|
|
v-model:value="formData.dvtp"
|
|
placeholder="请选择开发方式"
|
|
allow-clear
|
|
>
|
|
<a-select-option
|
|
v-for="item in dvtpList"
|
|
:key="item.value"
|
|
:value="item.value"
|
|
>{{ item.label }}</a-select-option
|
|
>
|
|
</a-select>
|
|
</a-form-item>
|
|
</a-col>
|
|
</a-row>
|
|
</a-form>
|
|
</a-modal>
|
|
|
|
<ConfirmModal
|
|
v-model:open="confirmModalVisible"
|
|
:diff-list="diffList"
|
|
:confirm-loading="confirmLoading"
|
|
@confirm="handleConfirmSubmit"
|
|
@cancel="handleConfirmCancel"
|
|
/>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { ref, computed, watch } from 'vue';
|
|
import { message } from 'ant-design-vue';
|
|
import { addPowerInfo, updatePowerInfo } from '@/api/DataQueryMenuModule';
|
|
import { BasicColumns } from '@/components/MapModal/column.config';
|
|
import { getRvcdDropdown, getAddvcdDropdown } from '@/api/select';
|
|
import { useJidiSelectEventStore } from '@/store/modules/jidiSelectEvent';
|
|
import ConfirmModal from '@/components/ConfirmModal/index.vue';
|
|
import { useDraggable } from '@/utils/drag';
|
|
|
|
const props = defineProps<{
|
|
open: boolean;
|
|
record?: any;
|
|
isAdd?: boolean;
|
|
topHynmList?: any[];
|
|
hycdList?: any[];
|
|
dvtpList?: any[];
|
|
}>();
|
|
|
|
const emit = defineEmits(['update:open', 'success']);
|
|
const jidiSelectEventStore = useJidiSelectEventStore();
|
|
|
|
const visible = computed({
|
|
get: () => props.open,
|
|
set: val => emit('update:open', val)
|
|
});
|
|
useDraggable(visible, { boundary: true, resetOnOpen: true });
|
|
watch(
|
|
() => props.open,
|
|
val => {
|
|
if (val) {
|
|
initRvcdDropdown();
|
|
initAddvcdDropdown();
|
|
}
|
|
}
|
|
);
|
|
|
|
const formRef = ref();
|
|
const confirmLoading = ref(false);
|
|
const formData = ref<any>({});
|
|
const originalRecord = ref<any>({});
|
|
const formRules = computed(() => ({
|
|
stcd: props.isAdd
|
|
? [{ required: true, message: '请输入电站编码', trigger: 'blur' }]
|
|
: [],
|
|
ennm: [{ required: true, message: '请输入电站名称', trigger: 'blur' }],
|
|
baseId: [{ required: true, message: '请选择基地', trigger: 'change' }],
|
|
reachcd: [{ required: true, message: '请选择所在河段', trigger: 'change' }]
|
|
}));
|
|
|
|
// 确认弹框状态
|
|
const confirmModalVisible = ref(false);
|
|
|
|
// 字段名 → 中文名映射
|
|
const fieldLabelMap: Record<string, string> = {};
|
|
BasicColumns.forEach(col => {
|
|
if (col.filed && col.name && col.visible) {
|
|
fieldLabelMap[col.filed] = col.name;
|
|
}
|
|
});
|
|
// 表单字段名与 BasicColumns 字段名不一致时的手动映射
|
|
const fieldLabelOverrides: Record<string, string> = {
|
|
ennm: '电站名称',
|
|
baseId: '基地',
|
|
reachcd: '所在河段',
|
|
bldsttCode: '建设状态',
|
|
rgcp: '调节性能',
|
|
dmtp: '坝型'
|
|
};
|
|
Object.assign(fieldLabelMap, fieldLabelOverrides);
|
|
|
|
// select 选项映射（用于在 diff 中显示中文名）
|
|
const selectOptionsMap: Record<string, () => any[]> = {
|
|
baseId: () => baseNameOptions.value,
|
|
reachcd: () => hbrvcdNameOptions.value,
|
|
addvcd: () => addvcdOptions.value,
|
|
bldsttCode: () => bldsttCodeOptions.value,
|
|
rgcp: () => rgcpNameOptions.value,
|
|
dvtp: () => props.dvtpList || []
|
|
};
|
|
|
|
const resolveSelectLabel = (field: string, value: any): string => {
|
|
if (value === null || value === undefined || value === '') return '空';
|
|
const getOptions = selectOptionsMap[field];
|
|
if (getOptions) {
|
|
const opt = getOptions().find(
|
|
(o: any) => String(o.value) === String(value)
|
|
);
|
|
if (opt) return opt.label;
|
|
}
|
|
return String(value);
|
|
};
|
|
|
|
// 按修改顺序记录变更
|
|
const changeOrder = ref<
|
|
{ field: string; label: string; oldValue: string; newValue: string }[]
|
|
>([]);
|
|
const diffList = changeOrder;
|
|
|
|
// ===== select 选项数据（接口后续补充） =====
|
|
const bldsttCodeOptions = ref<any[]>([
|
|
{ label: '未建', value: 0 },
|
|
{ label: '在建', value: 1 },
|
|
{ label: '已建', value: 2 }
|
|
]); // TODO: 建设状态接口
|
|
|
|
const baseNameOptions = ref<any[]>(
|
|
jidiSelectEventStore.jidiData
|
|
.filter(item => item.wbsCode !== 'all') // 过滤掉"当前全部"
|
|
.map(item => ({
|
|
label: item.wbsName,
|
|
value: item.wbsCode
|
|
}))
|
|
); // TODO: 基地接口
|
|
const addvcdOptions = ref<any[]>([]); // TODO: 所在位置接口
|
|
const hbrvcdNameOptions = ref<any[]>([]); // TODO: 所在河段接口
|
|
const rgcpNameOptions = ref<any[]>([
|
|
{ label: '多年调节', value: '1' },
|
|
{ label: '年调节', value: '2' },
|
|
{ label: '不完全年调节', value: '3' },
|
|
{ label: '径流式（无调节）', value: '4' },
|
|
{ label: '季调节', value: '5' },
|
|
{ label: '月调节', value: '6' },
|
|
{ label: '周调节', value: '7' },
|
|
{ label: '日调节', value: '8' },
|
|
{ label: '其他', value: '9' }
|
|
]); // TODO: 调节性能接口
|
|
|
|
const filterOption = (inputValue: string, option: any) => {
|
|
const label = option.label || option.value;
|
|
const keyword = inputValue || '';
|
|
return label.includes(keyword);
|
|
};
|
|
|
|
// 将值中的"-"转换为null
|
|
const convertDashToNull = (obj: any) => {
|
|
const result: any = {};
|
|
for (const key in obj) {
|
|
if (obj[key] === '-' || obj[key] === '') {
|
|
result[key] = null;
|
|
} else {
|
|
result[key] = obj[key];
|
|
}
|
|
}
|
|
return result;
|
|
};
|
|
|
|
// 监听 formData 变化，按顺序记录修改
|
|
watch(
|
|
() => formData.value,
|
|
newData => {
|
|
const original = originalRecord.value;
|
|
for (const key in newData) {
|
|
const oldVal = original[key];
|
|
const newVal = newData[key];
|
|
if (oldVal !== newVal) {
|
|
const existingIdx = changeOrder.value.findIndex(c => c.field === key);
|
|
const oldNorm =
|
|
oldVal === null || oldVal === undefined || oldVal === '-'
|
|
? null
|
|
: oldVal;
|
|
const newNorm = newVal === null || newVal === undefined ? null : newVal;
|
|
if (oldNorm === newNorm) continue;
|
|
if (
|
|
oldNorm !== null &&
|
|
newNorm !== null &&
|
|
!isNaN(Number(oldNorm)) &&
|
|
!isNaN(Number(newNorm)) &&
|
|
Number(oldNorm) === Number(newNorm)
|
|
)
|
|
continue;
|
|
const isSelect = !!selectOptionsMap[key];
|
|
const oldDisplay = isSelect
|
|
? resolveSelectLabel(key, oldNorm)
|
|
: oldNorm === null
|
|
? '空'
|
|
: String(oldNorm);
|
|
const newDisplay = isSelect
|
|
? resolveSelectLabel(key, newNorm)
|
|
: newNorm === null
|
|
? '空'
|
|
: String(newNorm);
|
|
const entry = {
|
|
field: key,
|
|
label: fieldLabelMap[key] || key,
|
|
oldValue: oldDisplay,
|
|
newValue: newDisplay
|
|
};
|
|
if (existingIdx >= 0) {
|
|
changeOrder.value[existingIdx] = entry;
|
|
} else {
|
|
changeOrder.value.push(entry);
|
|
}
|
|
} else {
|
|
changeOrder.value = changeOrder.value.filter(c => c.field !== key);
|
|
}
|
|
}
|
|
},
|
|
{ deep: true }
|
|
);
|
|
|
|
// 监听 record 变化，填充表单
|
|
watch(
|
|
() => props.record,
|
|
newRecord => {
|
|
if (newRecord) {
|
|
const converted = convertDashToNull({ ...newRecord });
|
|
originalRecord.value = { ...converted };
|
|
formData.value = { ...converted };
|
|
changeOrder.value = [];
|
|
}
|
|
},
|
|
{ deep: true }
|
|
);
|
|
const initRvcdDropdown = (value: any) => {
|
|
getRvcdDropdown({ rvcd: value }).then(res => {
|
|
hbrvcdNameOptions.value = res.data.map(item => ({
|
|
label: item.rvnm,
|
|
value: item.rvcd
|
|
}));
|
|
});
|
|
};
|
|
const initAddvcdDropdown = () => {
|
|
getAddvcdDropdown({ grd: 1 }).then(res => {
|
|
addvcdOptions.value = res.data.map(item => ({
|
|
label: item.addvnm,
|
|
value: item.addvcd
|
|
}));
|
|
});
|
|
};
|
|
const handleBaseIdChange = (value: any) => {
|
|
// initRvcdDropdown(value);
|
|
};
|
|
handleBaseIdChange;
|
|
const handleOk = async () => {
|
|
try {
|
|
await formRef.value?.validateFields();
|
|
|
|
if (!props.isAdd && changeOrder.value.length === 0) {
|
|
message.info('未检测到任何修改');
|
|
return;
|
|
}
|
|
|
|
// 显示确认弹框
|
|
confirmModalVisible.value = true;
|
|
} catch (error) {
|
|
console.error('验证失败:', error);
|
|
}
|
|
};
|
|
|
|
const handleConfirmSubmit = async (source: string) => {
|
|
confirmLoading.value = true;
|
|
try {
|
|
let res: any;
|
|
if (props.isAdd) {
|
|
// 新增时提交所有字段
|
|
const engInfo: Record<string, any> = {};
|
|
Object.assign(engInfo, formData.value);
|
|
res = await addPowerInfo({
|
|
engInfo,
|
|
source: source.trim() || '新增'
|
|
});
|
|
} else {
|
|
// 编辑时只传修改过的字段 + stcd
|
|
const engInfo: Record<string, any> = {
|
|
stcd: formData.value.stcd
|
|
};
|
|
changeOrder.value.forEach(item => {
|
|
engInfo[item.field] = formData.value[item.field];
|
|
});
|
|
res = await updatePowerInfo({
|
|
engInfo,
|
|
source: source.trim()
|
|
});
|
|
}
|
|
if (res?.code == 0 || res?.success) {
|
|
message.success(props.isAdd ? '新增成功' : '编辑成功');
|
|
confirmModalVisible.value = false;
|
|
visible.value = false;
|
|
emit('success');
|
|
} else {
|
|
message.error(res?.msg || (props.isAdd ? '新增失败' : '编辑失败'));
|
|
}
|
|
} catch (error) {
|
|
console.error('提交失败:', error);
|
|
} finally {
|
|
confirmLoading.value = false;
|
|
}
|
|
};
|
|
|
|
const handleConfirmCancel = () => {
|
|
confirmModalVisible.value = false;
|
|
};
|
|
|
|
const handleCancel = () => {
|
|
visible.value = false;
|
|
confirmModalVisible.value = false;
|
|
formRef.value?.resetFields();
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.form-group-title {
|
|
font-size: 16px;
|
|
font-weight: 600;
|
|
color: #333;
|
|
padding: 12px 0;
|
|
border-bottom: 1px solid #e8e8e8;
|
|
margin-bottom: 16px;
|
|
}
|
|
</style>
|