114 lines
5.8 KiB
JavaScript
114 lines
5.8 KiB
JavaScript
import React, {useEffect, useState} from 'react';
|
|
import {Descriptions,Table} from "antd";
|
|
import {drainage,dam,transport} from "../../../../../service/sssq";
|
|
|
|
|
|
|
|
function Jzw({record}) {
|
|
|
|
const columns1 = [
|
|
{title: '建筑物名称', key: 'name', dataIndex: 'name', align: 'center',},
|
|
{title: '型式', key: 'buildType', dataIndex: 'buildType', align: 'center'},
|
|
{title: '工作阀门型式', key: 'valveType', dataIndex: 'valveType', align: 'center'},
|
|
{title: '堰顶高程', key: 'crestEle', dataIndex: 'crestEle', align: 'center'},
|
|
{title: '溢流段长或堰顶宽(m)', key: 'buildSize', dataIndex: 'buildSize', align: 'center'},
|
|
{title: '设计泄洪流量(m³/s)', key: 'desQ', dataIndex: 'desQ', align: 'center'},
|
|
{title: '校核泄洪流量(m³/s)', key: 'caliQ', dataIndex: 'caliQ', align: 'center'},
|
|
{title: '启闭方式', key: 'ocMethod', dataIndex: 'ocMethod', align: 'center'},
|
|
{title: '消能方式', key: 'elimMethod', dataIndex: 'elimMethod', align: 'center'},
|
|
];
|
|
const columns2 = [
|
|
{title: '建筑物名称', key: 'name', dataIndex: 'name', align: 'center',},
|
|
{title: '型式', key: 'buildType', dataIndex: 'buildType', align: 'center'},
|
|
{title: '堰顶高程', key: 'crestEle', dataIndex: 'crestEle', align: 'center'},
|
|
{title: '溢流段长或堰顶宽(m)', key: 'buildSize', dataIndex: 'buildSize', align: 'center'},
|
|
{title: '设计泄洪流量(m³/s)', key: 'desQ', dataIndex: 'desQ', align: 'center'},
|
|
{title: '校核泄洪流量(m³/s)', key: 'caliQ', dataIndex: 'caliQ', align: 'center'},
|
|
{title: '启用标准', key: 'enableCriteria', dataIndex: 'enableCriteria', align: 'center'},
|
|
];
|
|
const columns3 = [
|
|
{title: '建筑物名称', key: 'name', dataIndex: 'name', align: 'center',},
|
|
{title: '洞(孔)身型式', key: 'buildType', dataIndex: 'buildType', align: 'center'},
|
|
{title: '断面尺寸', key: 'sectionSize', dataIndex: 'sectionSize', align: 'center'},
|
|
{title: '数量(条或孔)', key: 'num', dataIndex: 'num', align: 'center'},
|
|
{title: '进口底槛高程(m)', key: 'inletEle', dataIndex: 'inletEle', align: 'center'},
|
|
{title: '设计泄洪流量(m³/s)', key: 'desQ', dataIndex: 'desQ', align: 'center'},
|
|
{title: '校核泄洪流量(m³/s)', key: 'caliQ', dataIndex: 'caliQ', align: 'center'},
|
|
{title: '工作阀门型式', key: 'valveType', dataIndex: 'valveType', align: 'center'},
|
|
{title: '启闭方式', key: 'ocMethod', dataIndex: 'ocMethod', align: 'center'},
|
|
{title: '消能方式', key: 'elimMethod', dataIndex: 'elimMethod', align: 'center'},
|
|
];
|
|
const columns4 = [
|
|
{title: '设计流量(m³/s)', key: 'desQ', dataIndex: 'desQ', align: 'center'},
|
|
{title: '输水道型式', key: 'transType', dataIndex: 'transType', align: 'center',},
|
|
{title: '断面尺寸', key: 'sectionSize', dataIndex: 'sectionSize', align: 'center'},
|
|
{title: '输水道长度(m)', key: 'transLeng', dataIndex: 'transLeng', align: 'center'},
|
|
{title: '座教', key: 'num', dataIndex: 'num', align: 'center'},
|
|
];
|
|
|
|
const [tableDataDs, setTableDataDs] = useState([])
|
|
const [tableDataXs, setTableDataXs] = useState({})
|
|
const [tableDataSs, setTableDataSs] = useState([])
|
|
|
|
const getData=async (params)=>{
|
|
setTableDataDs(await dam(params))
|
|
setTableDataXs(await drainage(params))
|
|
setTableDataSs(await transport(params))
|
|
}
|
|
useEffect(() => {
|
|
getData({resCode:record.resCode})
|
|
}, [record]);
|
|
|
|
return (
|
|
<div style={{maxHeight:"60vh",overflow:"auto"}}>
|
|
<div className="des-title" style={{fontWeight:"bold",padding:"4px"}}>挡水建筑物</div>
|
|
<Descriptions bordered size="small" column={3}>
|
|
<Descriptions.Item label="坝型" style={{ width: '16.5%' }}>{tableDataDs[0]?.damType}</Descriptions.Item>
|
|
<Descriptions.Item label="最大坝高(m)" style={{ width: '16.5%' }}>{tableDataDs[0]?.damMaxHeig}</Descriptions.Item>
|
|
<Descriptions.Item label="坝顶高程(m)" style={{ width: '16.5%' }}>{tableDataDs[0]?.damTopElev}</Descriptions.Item>
|
|
<Descriptions.Item label="坝顶长度(m)">{tableDataDs[0]?.damTopLen}</Descriptions.Item>
|
|
<Descriptions.Item label="坝顶宽度(m)">{tableDataDs[0]?.damTopWid}</Descriptions.Item>
|
|
<Descriptions.Item label="坝基防渗体型式">{tableDataDs[0]?.damImpermeableType}</Descriptions.Item>
|
|
<Descriptions.Item label="副坝座数">{tableDataDs[0]?.subDamNum}</Descriptions.Item>
|
|
<Descriptions.Item label="副坝总长度(m)">{tableDataDs[0]?.subDamLen}</Descriptions.Item>
|
|
<Descriptions.Item label="副坝最大坝高(m)">{tableDataDs[0]?.subDamMaxHeig}</Descriptions.Item>
|
|
</Descriptions>
|
|
<div className="des-title" style={{fontWeight:"bold",padding:"4px"}}>泄水建筑物</div>
|
|
<div className="table-title" style={{padding:"4px"}}>☆正常溢洪道</div>
|
|
<Table rowKey="inx"
|
|
sticky
|
|
size="small"
|
|
columns={columns1}
|
|
pagination={false}
|
|
dataSource={tableDataXs.normalSpillwayList}
|
|
/>
|
|
<div className="table-title" style={{padding:"4px"}}>☆非常溢洪道</div>
|
|
<Table rowKey="key"
|
|
sticky
|
|
size="small"
|
|
columns={columns2}
|
|
pagination={false}
|
|
dataSource={tableDataXs.emergencySpillwayList}
|
|
/>
|
|
<div className="table-title" style={{padding:"4px"}}>☆泄洪洞</div>
|
|
<Table rowKey="key"
|
|
sticky
|
|
size="small"
|
|
columns={columns3}
|
|
pagination={false}
|
|
dataSource={tableDataXs.sluiceGateList}
|
|
/>
|
|
<div className="des-title" style={{fontWeight:"bold",padding:"4px"}}>输水建筑物</div>
|
|
<Table rowKey="key"
|
|
sticky
|
|
size="small "
|
|
columns={columns4}
|
|
pagination={false}
|
|
dataSource={tableDataSs}
|
|
/>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default Jzw;
|