mcfxkh-Web/src/views/Home/panels/Bxjc/index.js

671 lines
19 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

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 data1 = [
{
"res_cd": "42118140035",
"res_lon": 115.14137,
"res_lat": 31.55095,
"cd": "01",
"cd_nm": "GN1",
"res_reg_cd": "42118140006-A4",
"ch": "0+000",
"province_cd": "420000000000",
"province_nm": "湖北省",
"city_cd": "421100000000",
"city_nm": "黄冈市",
"county_cd": "421181000000",
"county_nm": "麻城市",
"town_cd": "421181112000",
"town_nm": "福田河镇",
"bas_guid": "鄂东五河片区",
"eng_scal": "小1型",
"danger_stat": "非病险水库",
"label": "2023高标准",
"res_nm": "大堰口水库",
"de_value": -4.2885,
"dn_value": -13.5384,
"du_value": 132.4892,
"de_trend": null,
"dn_trend": null,
"du_trend": null,
"max_de": 1.0981,
"max_dn": -2.3255,
"max_du": 132.4892,
"dt": "2025-05-20",
"is_has_data": "y"
},
{
"res_cd": "42118140035",
"res_lon": 115.14137,
"res_lat": 31.55095,
"cd": "03",
"cd_nm": "GN3",
"res_reg_cd": "42118140006-A4",
"ch": "0+000",
"province_cd": "420000000000",
"province_nm": "湖北省",
"city_cd": "421100000000",
"city_nm": "黄冈市",
"county_cd": "421181000000",
"county_nm": "麻城市",
"town_cd": "421181112000",
"town_nm": "福田河镇",
"bas_guid": "鄂东五河片区",
"eng_scal": "小1型",
"danger_stat": "非病险水库",
"label": "2023高标准",
"res_nm": "大堰口水库",
"de_value": -10.73,
"dn_value": -9.8975,
"du_value": 121.3495,
"de_trend": null,
"dn_trend": null,
"du_trend": null,
"max_de": 1.0981,
"max_dn": -2.3255,
"max_du": 132.4892,
"dt": "2025-05-20",
"is_has_data": "y"
},
{
"res_cd": "42118140035",
"res_lon": 115.14137,
"res_lat": 31.55095,
"cd": "02",
"cd_nm": "GN2",
"res_reg_cd": "42118140006-A4",
"ch": "0+000",
"province_cd": "420000000000",
"province_nm": "湖北省",
"city_cd": "421100000000",
"city_nm": "黄冈市",
"county_cd": "421181000000",
"county_nm": "麻城市",
"town_cd": "421181112000",
"town_nm": "福田河镇",
"bas_guid": "鄂东五河片区",
"eng_scal": "小1型",
"danger_stat": "非病险水库",
"label": "2023高标准",
"res_nm": "大堰口水库",
"de_value": 1.0981,
"dn_value": -7.0736,
"du_value": 75.4661,
"de_trend": null,
"dn_trend": null,
"du_trend": null,
"max_de": 1.0981,
"max_dn": -2.3255,
"max_du": 132.4892,
"dt": "2025-05-20",
"is_has_data": "y"
},
{
"res_cd": "42118140035",
"res_lon": 115.14137,
"res_lat": 31.55095,
"cd": "04",
"cd_nm": "GN4",
"res_reg_cd": "42118140006-A4",
"ch": "0+000",
"province_cd": "420000000000",
"province_nm": "湖北省",
"city_cd": "421100000000",
"city_nm": "黄冈市",
"county_cd": "421181000000",
"county_nm": "麻城市",
"town_cd": "421181112000",
"town_nm": "福田河镇",
"bas_guid": "鄂东五河片区",
"eng_scal": "小1型",
"danger_stat": "非病险水库",
"label": "2023高标准",
"res_nm": "大堰口水库",
"de_value": -6.469,
"dn_value": -2.3255,
"du_value": 47.1633,
"de_trend": null,
"dn_trend": null,
"du_trend": null,
"max_de": 1.0981,
"max_dn": -2.3255,
"max_du": 132.4892,
"dt": "2025-05-20",
"is_has_data": "y"
},
{
"res_cd": "42118140011",
"res_lon": 115.11878,
"res_lat": 30.88904,
"cd": "01",
"cd_nm": "GN1",
"res_reg_cd": "42118140019-A4",
"ch": "0+000",
"province_cd": "420000000000",
"province_nm": "湖北省",
"city_cd": "421100000000",
"city_nm": "黄冈市",
"county_cd": "421181000000",
"county_nm": "麻城市",
"town_cd": "421181104000",
"town_nm": "夫子河镇",
"bas_guid": "鄂东五河片区",
"eng_scal": "小1型",
"danger_stat": "非病险水库",
"label": "2023高标准",
"res_nm": "黄麻坳水库",
"de_value": -5.5809,
"dn_value": 4.6055,
"du_value": -13.083,
"de_trend": null,
"dn_trend": null,
"du_trend": null,
"max_de": -5.1079,
"max_dn": 4.6055,
"max_du": -11.1644,
"dt": "2025-05-20",
"is_has_data": "y"
},
{
"res_cd": "42118140011",
"res_lon": 115.11878,
"res_lat": 30.88904,
"cd": "02",
"cd_nm": "GN2",
"res_reg_cd": "42118140019-A4",
"ch": "0+000",
"province_cd": "420000000000",
"province_nm": "湖北省",
"city_cd": "421100000000",
"city_nm": "黄冈市",
"county_cd": "421181000000",
"county_nm": "麻城市",
"town_cd": "421181104000",
"town_nm": "夫子河镇",
"bas_guid": "鄂东五河片区",
"eng_scal": "小1型",
"danger_stat": "非病险水库",
"label": "2023高标准",
"res_nm": "黄麻坳水库",
"de_value": -5.1079,
"dn_value": 3.9064,
"du_value": -12.2936,
"de_trend": null,
"dn_trend": null,
"du_trend": null,
"max_de": -5.1079,
"max_dn": 4.6055,
"max_du": -11.1644,
"dt": "2025-05-20",
"is_has_data": "y"
},
{
"res_cd": "42118140017",
"res_lon": 115.14545,
"res_lat": 30.95398,
"cd": "03",
"cd_nm": "GN3",
"res_reg_cd": "42118140031-A4",
"ch": "0+000",
"province_cd": "420000000000",
"province_nm": "湖北省",
"city_cd": "421100000000",
"city_nm": "黄冈市",
"county_cd": "421181000000",
"county_nm": "麻城市",
"town_cd": "421181107000",
"town_nm": "盐田河镇",
"bas_guid": "鄂东五河片区",
"eng_scal": "小1型",
"danger_stat": "非病险水库",
"label": "2023高标准",
"res_nm": "群建水库",
"de_value": 1.166,
"dn_value": 2.1274,
"du_value": 11.5948,
"de_trend": null,
"dn_trend": null,
"du_trend": null,
"max_de": 2.6901,
"max_dn": 3.7945,
"max_du": 11.5948,
"dt": "2025-05-20",
"is_has_data": "y"
},
{
"res_cd": "42118140011",
"res_lon": 115.11878,
"res_lat": 30.88904,
"cd": "03",
"cd_nm": "GN3",
"res_reg_cd": "42118140019-A4",
"ch": "0+000",
"province_cd": "420000000000",
"province_nm": "湖北省",
"city_cd": "421100000000",
"city_nm": "黄冈市",
"county_cd": "421181000000",
"county_nm": "麻城市",
"town_cd": "421181104000",
"town_nm": "夫子河镇",
"bas_guid": "鄂东五河片区",
"eng_scal": "小1型",
"danger_stat": "非病险水库",
"label": "2023高标准",
"res_nm": "黄麻坳水库",
"de_value": -5.1345,
"dn_value": 3.7423,
"du_value": -11.5382,
"de_trend": null,
"dn_trend": null,
"du_trend": null,
"max_de": -5.1079,
"max_dn": 4.6055,
"max_du": -11.1644,
"dt": "2025-05-20",
"is_has_data": "y"
},
{
"res_cd": "42118140022",
"res_lon": 115.39612,
"res_lat": 31.1526,
"cd": "02",
"cd_nm": "GN2",
"res_reg_cd": "42118140014-A4",
"ch": "0+000",
"province_cd": "420000000000",
"province_nm": "湖北省",
"city_cd": "421100000000",
"city_nm": "黄冈市",
"county_cd": "421181000000",
"county_nm": "麻城市",
"town_cd": "421181109000",
"town_nm": "木子店镇",
"bas_guid": "鄂东五河片区",
"eng_scal": "小1型",
"danger_stat": "非病险水库",
"label": "2023高标准",
"res_nm": "何门咀水库",
"de_value": -0.7313,
"dn_value": 2.702,
"du_value": -11.493,
"de_trend": null,
"dn_trend": null,
"du_trend": null,
"max_de": -0.4931,
"max_dn": 4.3759,
"max_du": -10.0925,
"dt": "2025-05-20",
"is_has_data": "y"
},
{
"res_cd": "42118140011",
"res_lon": 115.11878,
"res_lat": 30.88904,
"cd": "04",
"cd_nm": "GN4",
"res_reg_cd": "42118140019-A4",
"ch": "0+000",
"province_cd": "420000000000",
"province_nm": "湖北省",
"city_cd": "421100000000",
"city_nm": "黄冈市",
"county_cd": "421181000000",
"county_nm": "麻城市",
"town_cd": "421181104000",
"town_nm": "夫子河镇",
"bas_guid": "鄂东五河片区",
"eng_scal": "小1型",
"danger_stat": "非病险水库",
"label": "2023高标准",
"res_nm": "黄麻坳水库",
"de_value": -5.7038,
"dn_value": 3.3505,
"du_value": -11.1644,
"de_trend": null,
"dn_trend": null,
"du_trend": null,
"max_de": -5.1079,
"max_dn": 4.6055,
"max_du": -11.1644,
"dt": "2025-05-20",
"is_has_data": "y"
},
{
"res_cd": "42118140017",
"res_lon": 115.14545,
"res_lat": 30.95398,
"cd": "04",
"cd_nm": "GN4",
"res_reg_cd": "42118140031-A4",
"ch": "0+000",
"province_cd": "420000000000",
"province_nm": "湖北省",
"city_cd": "421100000000",
"city_nm": "黄冈市",
"county_cd": "421181000000",
"county_nm": "麻城市",
"town_cd": "421181107000",
"town_nm": "盐田河镇",
"bas_guid": "鄂东五河片区",
"eng_scal": "小1型",
"danger_stat": "非病险水库",
"label": "2023高标准",
"res_nm": "群建水库",
"de_value": 1.3441,
"dn_value": 3.3718,
"du_value": 10.8126,
"de_trend": null,
"dn_trend": null,
"du_trend": null,
"max_de": 2.6901,
"max_dn": 3.7945,
"max_du": 11.5948,
"dt": "2025-05-20",
"is_has_data": "y"
},
{
"res_cd": "42118140022",
"res_lon": 115.39612,
"res_lat": 31.1526,
"cd": "01",
"cd_nm": "GN1",
"res_reg_cd": "42118140014-A4",
"ch": "0+000",
"province_cd": "420000000000",
"province_nm": "湖北省",
"city_cd": "421100000000",
"city_nm": "黄冈市",
"county_cd": "421181000000",
"county_nm": "麻城市",
"town_cd": "421181109000",
"town_nm": "木子店镇",
"bas_guid": "鄂东五河片区",
"eng_scal": "小1型",
"danger_stat": "非病险水库",
"label": "2023高标准",
"res_nm": "何门咀水库",
"de_value": -0.4931,
"dn_value": 4.3759,
"du_value": -10.0925,
"de_trend": null,
"dn_trend": null,
"du_trend": null,
"max_de": -0.4931,
"max_dn": 4.3759,
"max_du": -10.0925,
"dt": "2025-05-20",
"is_has_data": "y"
},
{
"res_cd": "42118140017",
"res_lon": 115.14545,
"res_lat": 30.95398,
"cd": "01",
"cd_nm": "GN1",
"res_reg_cd": "42118140031-A4",
"ch": "0+000",
"province_cd": "420000000000",
"province_nm": "湖北省",
"city_cd": "421100000000",
"city_nm": "黄冈市",
"county_cd": "421181000000",
"county_nm": "麻城市",
"town_cd": "421181107000",
"town_nm": "盐田河镇",
"bas_guid": "鄂东五河片区",
"eng_scal": "小1型",
"danger_stat": "非病险水库",
"label": "2023高标准",
"res_nm": "群建水库",
"de_value": 2.6901,
"dn_value": 3.7368,
"du_value": 8.7918,
"de_trend": null,
"dn_trend": null,
"du_trend": null,
"max_de": 2.6901,
"max_dn": 3.7945,
"max_du": 11.5948,
"dt": "2025-05-20",
"is_has_data": "y"
},
{
"res_cd": "42118140017",
"res_lon": 115.14545,
"res_lat": 30.95398,
"cd": "02",
"cd_nm": "GN2",
"res_reg_cd": "42118140031-A4",
"ch": "0+000",
"province_cd": "420000000000",
"province_nm": "湖北省",
"city_cd": "421100000000",
"city_nm": "黄冈市",
"county_cd": "421181000000",
"county_nm": "麻城市",
"town_cd": "421181107000",
"town_nm": "盐田河镇",
"bas_guid": "鄂东五河片区",
"eng_scal": "小1型",
"danger_stat": "非病险水库",
"label": "2023高标准",
"res_nm": "群建水库",
"de_value": 1.5528,
"dn_value": 3.7945,
"du_value": 7.5172,
"de_trend": null,
"dn_trend": null,
"du_trend": null,
"max_de": 2.6901,
"max_dn": 3.7945,
"max_du": 11.5948,
"dt": "2025-05-20",
"is_has_data": "y"
},
{
"res_cd": "42118140009",
"res_lon": 114.73138,
"res_lat": 31.01948,
"cd": "04",
"cd_nm": "GN4",
"res_reg_cd": "42118140028-A4",
"ch": "0+000",
"province_cd": "420000000000",
"province_nm": "湖北省",
"city_cd": "421100000000",
"city_nm": "黄冈市",
"county_cd": "421181000000",
"county_nm": "麻城市",
"town_cd": "421181102000",
"town_nm": "歧亭镇",
"bas_guid": "鄂东五河片区",
"eng_scal": "小1型",
"danger_stat": "非病险水库",
"label": "2023高标准",
"res_nm": "鲇鱼坝水库",
"de_value": -2.3116,
"dn_value": -7.9976,
"du_value": -6.8754,
"de_trend": null,
"dn_trend": null,
"du_trend": null,
"max_de": -1.4148,
"max_dn": -7.6521,
"max_du": -3.4337,
"dt": "2025-05-20",
"is_has_data": "y"
},
{
"res_cd": "42118140032",
"res_lon": 115.13073,
"res_lat": 31.35489,
"cd": "02",
"cd_nm": "GN2",
"res_reg_cd": "42118140020-A4",
"ch": "0+000",
"province_cd": "420000000000",
"province_nm": "湖北省",
"city_cd": "421100000000",
"city_nm": "黄冈市",
"county_cd": "421181000000",
"county_nm": "麻城市",
"town_cd": "421181111000",
"town_nm": "黄土岗镇",
"bas_guid": "鄂东五河片区",
"eng_scal": "小1型",
"danger_stat": "待除险加固",
"label": "2023高标准",
"res_nm": "鸡翅关水库",
"de_value": -4.2641,
"dn_value": -1.5343,
"du_value": -6.8233,
"de_trend": null,
"dn_trend": null,
"du_trend": null,
"max_de": 1.346,
"max_dn": -1.5343,
"max_du": -3.1838,
"dt": "2025-05-20",
"is_has_data": "y"
},
{
"res_cd": "42118140032",
"res_lon": 115.13073,
"res_lat": 31.35489,
"cd": "03",
"cd_nm": "GN3",
"res_reg_cd": "42118140020-A4",
"ch": "0+000",
"province_cd": "420000000000",
"province_nm": "湖北省",
"city_cd": "421100000000",
"city_nm": "黄冈市",
"county_cd": "421181000000",
"county_nm": "麻城市",
"town_cd": "421181111000",
"town_nm": "黄土岗镇",
"bas_guid": "鄂东五河片区",
"eng_scal": "小1型",
"danger_stat": "待除险加固",
"label": "2023高标准",
"res_nm": "鸡翅关水库",
"de_value": -1.1126,
"dn_value": -1.7529,
"du_value": -5.7066,
"de_trend": null,
"dn_trend": null,
"du_trend": null,
"max_de": 1.346,
"max_dn": -1.5343,
"max_du": -3.1838,
"dt": "2025-05-20",
"is_has_data": "y"
},
{
"res_cd": "42118140009",
"res_lon": 114.73138,
"res_lat": 31.01948,
"cd": "01",
"cd_nm": "GN1",
"res_reg_cd": "42118140028-A4",
"ch": "0+000",
"province_cd": "420000000000",
"province_nm": "湖北省",
"city_cd": "421100000000",
"city_nm": "黄冈市",
"county_cd": "421181000000",
"county_nm": "麻城市",
"town_cd": "421181102000",
"town_nm": "歧亭镇",
"bas_guid": "鄂东五河片区",
"eng_scal": "小1型",
"danger_stat": "非病险水库",
"label": "2023高标准",
"res_nm": "鲇鱼坝水库",
"de_value": -1.4148,
"dn_value": -10.2713,
"du_value": -5.146,
"de_trend": null,
"dn_trend": null,
"du_trend": null,
"max_de": -1.4148,
"max_dn": -7.6521,
"max_du": -3.4337,
"dt": "2025-05-20",
"is_has_data": "y"
}
]
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: '8rem' }} align="center">水库名称</DpTableCell>
<DpTableCell style={{ minWidth: '3rem' }} align="center">测点</DpTableCell>
<DpTableCell style={{ minWidth: '8rem' }} align="center">垂直位移(mm)</DpTableCell>
<DpTableCell style={{ minWidth: '6rem' }} align="center">上下游(mm)</DpTableCell>
<DpTableCell style={{ minWidth: '6rem' }} align="center">左右岸(mm)</DpTableCell>
<DpTableCell style={{ minWidth: '10rem' }} align="center">监测时间</DpTableCell>
</TableRow>
</TableHead>
<TableBody>
{data1.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, lttd],
zoom: 15,
pitch: 60,
bearing: 0
});
}
}}>{row.res_nm}</div>
</DpTableCell>
<DpTableCell align="center">{row.cd_nm}</DpTableCell>
<DpTableCell align="center">{row.du_value}</DpTableCell>
<DpTableCell align="center">{row.de_value}</DpTableCell>
<DpTableCell align="center">{row.dn_value}</DpTableCell>
<DpTableCell align="center">{row.dt}</DpTableCell>
</DpTableRow>
))}
</TableBody>
</Table>
</TableContainer>
</PanelBox>
)
}
export default DrpReal;