96 lines
3.2 KiB
JavaScript
96 lines
3.2 KiB
JavaScript
|
import React, { useMemo, useState } from 'react';
|
|||
|
|
import useRequest from '../../../../utils/useRequest';
|
|||
|
|
import { useDispatch, useSelector } from 'react-redux';
|
|||
|
|
import PanelBox from '../../components/PanelBox';
|
|||
|
|
|
|||
|
|
import Table from '@material-ui/core/Table';
|
|||
|
|
import TableContainer from '@material-ui/core/TableContainer';
|
|||
|
|
import TableBody from '@material-ui/core/TableBody';
|
|||
|
|
import TableHead from '@material-ui/core/TableHead';
|
|||
|
|
import TableRow from '@material-ui/core/TableRow';
|
|||
|
|
import DpTableCell from '../../../../layouts/mui/DpTableCell';
|
|||
|
|
import DpTableRow from '../../../../layouts/mui/DpTableRow';
|
|||
|
|
import clsx from 'clsx';
|
|||
|
|
import { renderDrp } from '../../../../utils/renutils';
|
|||
|
|
const data3 = [{
|
|||
|
|
"cd": "1",
|
|||
|
|
"cd_nm": "WE",
|
|||
|
|
"ch": "1",
|
|||
|
|
"res_reg_cd": "42118140042-A4",
|
|||
|
|
"res_cd": "42118140004",
|
|||
|
|
"res_nm": "永丰水库",
|
|||
|
|
"res_lon": 115.05541,
|
|||
|
|
"res_lat": 31.11106,
|
|||
|
|
"province_cd": "420000000000",
|
|||
|
|
"province_nm": "湖北省",
|
|||
|
|
"city_cd": "421100000000",
|
|||
|
|
"city_nm": "黄冈市",
|
|||
|
|
"county_cd": "421181000000",
|
|||
|
|
"county_nm": "麻城市",
|
|||
|
|
"town_cd": "421181003000",
|
|||
|
|
"town_nm": "南湖办事处",
|
|||
|
|
"danger_stat": "非病险水库",
|
|||
|
|
"bas_guid": "鄂东五河片区",
|
|||
|
|
"label": "2023高标准",
|
|||
|
|
"eng_scal": "小（1）型",
|
|||
|
|
"value": 0.3,
|
|||
|
|
"diff_value": -0.02,
|
|||
|
|
"trend": -1,
|
|||
|
|
"dt": "2025-05-20",
|
|||
|
|
"is_has_data": "y",
|
|||
|
|
"max_value": 0.3
|
|||
|
|
}]
|
|||
|
|
|
|||
|
|
|
|||
|
|
function DrpReal({ style }) {
|
|||
|
|
const [tab,setTab] = useState('1')
|
|||
|
|
const dispatch = useDispatch();
|
|||
|
|
|
|||
|
|
|
|||
|
|
return (
|
|||
|
|
<PanelBox
|
|||
|
|
style={style}
|
|||
|
|
title="渗流监测"
|
|||
|
|
color="green"
|
|||
|
|
>
|
|||
|
|
|
|||
|
|
<TableContainer style={{ height: '100%' }}>
|
|||
|
|
<Table size="small" stickyHeader>
|
|||
|
|
<TableHead>
|
|||
|
|
<TableRow>
|
|||
|
|
<DpTableCell style={{ minWidth: '6rem' }} align="center">水库名称</DpTableCell>
|
|||
|
|
<DpTableCell style={{ minWidth: '4rem' }} align="center">测点</DpTableCell>
|
|||
|
|
<DpTableCell style={{ minWidth: '6rem' }} align="center">渗流量(L/s)</DpTableCell>
|
|||
|
|
<DpTableCell style={{ minWidth: '8rem' }} align="center">监测时间</DpTableCell>
|
|||
|
|
</TableRow>
|
|||
|
|
</TableHead>
|
|||
|
|
<TableBody>
|
|||
|
|
{data3.map((row,index) => (
|
|||
|
|
<DpTableRow key={row.stcd}>
|
|||
|
|
<DpTableCell component="th" scope="row">
|
|||
|
|
<div className="table-ellipsis cursor-pointer" onClick={() => {
|
|||
|
|
const { res_lon:lgtd, res_lat:lttd } = row;
|
|||
|
|
if (lgtd && lttd) {
|
|||
|
|
dispatch.runtime.setCameraTarget({
|
|||
|
|
center: [lgtd- 0.0029, lttd],
|
|||
|
|
zoom: 15,
|
|||
|
|
pitch: 60,
|
|||
|
|
bearing: 0
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
}}>{row.res_nm}</div>
|
|||
|
|
</DpTableCell>
|
|||
|
|
<DpTableCell align="center">{row.cd_nm}</DpTableCell>
|
|||
|
|
<DpTableCell align="center">{row.value}</DpTableCell>
|
|||
|
|
<DpTableCell align="center">{row.dt}</DpTableCell>
|
|||
|
|
</DpTableRow>
|
|||
|
|
))}
|
|||
|
|
</TableBody>
|
|||
|
|
</Table>
|
|||
|
|
</TableContainer>
|
|||
|
|
</PanelBox>
|
|||
|
|
)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
export default DrpReal;
|