Merge branch 'qzc-dev'

lsf-dev
秦子超 2025-06-23 14:16:41 +08:00
commit 0996ef169a
20 changed files with 207 additions and 46 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 87 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 87 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 87 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 187 KiB

Binary file not shown.

Binary file not shown.

After

Width:  |  Height:  |  Size: 87 KiB

View File

@ -400,7 +400,7 @@ const map = {
Object.keys(DCPJ_TYPES).forEach(key => {
layerVisible['Dcpj_' + key + 'Layer'] = false;
});
} else if (id === 200) {
} else if (id === 207) {
layerVisible = {
RealDrpLayer: false,
RealHDLayer: false,
@ -626,7 +626,7 @@ const map = {
|| id === 203
|| id === 205
|| id === 206
|| id === 200
|| id === 207
) {
dispatch.map.setLayerSetting({ dom: true });
// if(map){
@ -640,7 +640,7 @@ const map = {
// // }
// }
if(id!==200&&id!==203&&id!==205&&id!==206){
if(id!==207&&id!==203&&id!==205&&id!==206){
if(map){
const layer = map.getLayer('临时水库tz')
if(layer){

View File

@ -114,7 +114,7 @@ export default function calcLayout(view, rightStack, hidePanels) {
{ key: '巡查任务总览', style: { height: '40rem', flexGrow: 1 } },
];
leftFullHeight = true;
} else if (view === 200) {
} else if (view === 207) {
left = [
{ key: '天气' },
{ key: '水库总览', style: { height: '30rem', flexGrow: 1 } },
@ -333,12 +333,13 @@ export default function calcLayout(view, rightStack, hidePanels) {
{ key: '巡查问题看板', style: { height: '70%', flexGrow: 1 } },
{ key: '水库管护', style: { height: '10rem', flexGrow: 1 } },
];
} else if (view === 200) {
} else if (view === 207) {
right = [
{ key: '警报' },
{ key: '超汛水库', style: { height: '15rem'} },
{ key: '站点统计', style: { height: '17rem'} },
{ key: '监测告警总', style: { height: '21rem'} },
// { key: '警报' },
{ key: '库容蓄水量统计', style: { height: '17rem'} },
{ key: '超汛限水库', style: { height: '16rem'} },
// { key: '站点统计', style: { height: '17rem'} },
{ key: '监测告警总', style: { height: '22rem'} },
// { key: '关联站点',style: { height: '15rem', flexGrow: 1 } },
// { key: '水库水量统计',style: { height: '22rem' } },
// { key: '洪水防御',style: { height: '18rem', flexGrow: 1 } },

View File

@ -0,0 +1,109 @@
import React from 'react';
import DpTab from '../../../../layouts/mui/DpTab';
import Dialog from '@material-ui/core/Dialog';
import DialogContent from '@material-ui/core/DialogContent';
import DpPaperComponent from '../../../../layouts/mui/DpPaperCompanent';
import DpTabs from '../../../../layouts/mui/DpTabs';
import DpAppBar from '../../../../layouts/mui/DpAppBar';
import { useDispatch, useSelector } from 'react-redux';
import DpBackgroundDrop from '../../../../layouts/mui/DpBackdrop';
import DpCloseButton from '../../../../layouts/mui/DpCloseButton';
function HDStDlg({ record, onClose }) {
const [value, setValue] = React.useState(0);
const dispatch = useDispatch();
const data = {
"stcd": "716129061",
"type": "sk",
"hasRz": true,
"stnm": "仰天窝水库",
"adcd": "421181201000",
"wscd": null,
"importancy": 0,
"lgtd": 115.106667,
"lttd": 31.126389,
"elev": 0,
"damel": 325.08,
"dsflz": 324.18,
"fsltdz": 323.5,
"ddz": 319.5,
"zcxsw": 323.5,
"drpTm": "2025-04-11T05:00:00.000Z",
"today": 0,
"h1": 0,
"h3": 0,
"h6": 0,
"h12": 0,
"h24": 0,
"h48": 0,
"drpState": 2,
"rz": 325.16,
"w": 0.132,
"a_fsltdz": 4.660000000000025,
"rzTm": "2025-04-11T05:00:00.000Z",
"rzWarning": 1,
"rzState": 2,
"pic": [
{
"stcd": "716129061",
"tm": "2023-03-12T06:05:00.000Z",
"url": "http://223.75.53.106:8891/skjgimages/2023/0312/716129061/20230312140500.jpg"
},
{
"stcd": "716129061",
"tm": "2023-03-12T07:25:00.000Z",
"url": "http://223.75.53.106:8891/skjgimages/2023/0312/716129062/20230312152500.jpg"
}
],
"layer": "RealSkLayer",
"layerPop": "RealSkPop",
"aRz": 4.66,
"strarz": "4.66"
}
const flyTo = (row) => {
onClose()
dispatch?.runtime.setInfoDlg({ layerId: 'RealSkLayer', properties: row })
// const { lgtd, lttd } = row;
// if (lgtd && lttd) {
// // dispatch.runtime.setFeaturePop({ type: 'RealSkPop', properties: row, coordinates: [row.lgtd, row.lttd] });
// dispatch.runtime.setCameraTarget({
// center: [lgtd, lttd + 0.005],
// zoom: 15,
// pitch: 50,
// bearing: 0
// });
// }
}
return (
<Dialog
open={true}
onClose={onClose}
maxWidth="xl"
style={{ borderRadius: 0 }}
PaperComponent={DpPaperComponent}
BackdropComponent={DpBackgroundDrop}
>
<div className="boxhead"></div>
<DialogContent style={{ padding: 0, width: '80rem', overflowX: 'hidden' }}>
<DpAppBar position="sticky">
<DpTabs value={value} indicatorColor="primary" onChange={(_, v) => setValue(v)}>
<DpTab label="水库" />
</DpTabs>
<DpCloseButton onClick={onClose} />
</DpAppBar>
<div style={{position:'relative'}}>
<img src={process.env.PUBLIC_URL+'/assets/13291750658674_.pic.jpg'} style={{width:'100%',marginTop:'0rem'}}/>
<div style={{position:'absolute',width:'4rem',height:'20px',background:'transparent',top:'9rem',left:'8rem',cursor:'pointer',zIndex:999}}
onClick={()=>flyTo(data)}
></div>
</div>
</DialogContent>
<div className="boxfoot"></div>
</Dialog>
)
}
export default React.memo(HDStDlg);

View File

@ -47,6 +47,7 @@ import ShuiBengDlg from './ShuiBengDlg'
import ShuichangguanwangDlg from './ShuichangguanwangDlg';
import FlowjcDlg from './FlowjcDlg'
import EditFaDlg from './EditFaDlg'
import AllSkDlg from './AllSkDlg'
function InfoDlg() {
const infoDlg = useSelector(getInfoDlg);
const dispatch = useDispatch();
@ -152,6 +153,8 @@ function InfoDlg() {
return <FlowjcDlg record={properties} onClose={handleClose} />
}else if (layerId === 'editFaLayer') {
return <EditFaDlg record={properties} onClose={handleClose} />
}else if (layerId === 'allSkFaLayer') {
return <AllSkDlg record={properties} onClose={handleClose} />
}

View File

@ -184,11 +184,11 @@ function RealSkTip({ record, dispatch,view }) {
<div className="featuretip-title">
<div className="name">{record.stnm}
{record.stnm == '浮桥河水库' ?
record?.setView&&view===200?
record?.setView&&view===207?
<span style={{cursor:'pointer',color:'#50b1f9',marginLeft:20}} onClick={()=>{
dispatch.map.setView(203)
sessionStorage.setItem('lastCenter',JSON.stringify(record))
}}> 进入水库模块</span>
}}> 进入水库</span>
: null :
record.stnm == '小玉潭水库' ?
<span style={{ cursor: 'pointer', color: '#50b1f9',marginLeft:20 }} onClick={openSw}>

View File

@ -119,6 +119,7 @@ import JbqkLeft from './panels/JbqkLeft'
import FhxsYq2 from './panels/FhxsYq2'
import Zdgzsq from './panels/Zdgzsq'
import Czdbl from './panels/Czdbl'
import Krxsltj from './panels/Krxsltj'
import Skyb from './panels/Skyb'
@ -410,7 +411,7 @@ export default function PanelIndex({ name, style, ...params }) {
return <Sbyj style={style} />
} else if (name === '供水负荷曲线') {
return <Gsfhqx style={style} />
} else if (name === '超汛水库') {
} else if (name === '超汛水库') {
return <Cxsk style={style} />
} else if (name === '站点统计') {
return <Zdtj style={style} />
@ -426,9 +427,13 @@ export default function PanelIndex({ name, style, ...params }) {
return <Zdgzsq style={style} />
} else if (name === '测站到报率') {
return <Czdbl style={style} />
} else if (name === '单个预案') {
} else if (name === '单个预案') {
return <Yuanan style={style} />
} else if (name === '库容蓄水量统计') {
return <Krxsltj style={style} />
}
return (
<PanelBox style={style} title={name} color="red">
<p>not impl</p>

View File

@ -20,16 +20,16 @@ const VIEWS = [
// { id: 7, title: '调度', img: process.env.PUBLIC_URL+'/assets/menu/辅助决策.png' },
]
},
// { id: 200, title: '水库', img: process.env.PUBLIC_URL+'/assets/menu/水库专题.png',children:[
// { id: 207, title: '水库总览', img: process.env.PUBLIC_URL+'/assets/menu/水库管理.png' },
// // { id: 201, title: '雨情监测', img: process.env.PUBLIC_URL+'/assets/menu/雨情监测.png' },
// // { id: 202, title: '水情监测', img: process.env.PUBLIC_URL+'/assets/menu/水情监测.png' },
// { id: 203, title: '水库监测', img: process.env.PUBLIC_URL+'/assets/menu/安全监测.png' },
// // { id: 204, title: '视频监视', img: process.env.PUBLIC_URL+'/assets/menu/视频监视.png' },
// { id: 205, title: '防汛调度', img: process.env.PUBLIC_URL+'/assets/menu/防汛调度.png' },
// { id: 206, title: '巡查维养', img: process.env.PUBLIC_URL+'/assets/menu/水库管理.png' },
// ] },
{ id: 200, title: '水库', img: process.env.PUBLIC_URL+'/assets/menu/水库专题.png'},
{ id: 200, title: '水库', img: process.env.PUBLIC_URL+'/assets/menu/水库专题.png',children:[
{ id: 207, title: '水库总览', img: process.env.PUBLIC_URL+'/assets/menu/水库管理.png' },
// { id: 201, title: '雨情监测', img: process.env.PUBLIC_URL+'/assets/menu/雨情监测.png' },
// { id: 202, title: '水情监测', img: process.env.PUBLIC_URL+'/assets/menu/水情监测.png' },
{ id: 203, title: '水库监测', img: process.env.PUBLIC_URL+'/assets/menu/安全监测.png' },
// { id: 204, title: '视频监视', img: process.env.PUBLIC_URL+'/assets/menu/视频监视.png' },
{ id: 205, title: '防汛调度', img: process.env.PUBLIC_URL+'/assets/menu/防汛调度.png' },
{ id: 206, title: '巡查维养', img: process.env.PUBLIC_URL+'/assets/menu/水库管理.png' },
] },
// { id: 200, title: '水库', img: process.env.PUBLIC_URL+'/assets/menu/水库专题.png'},
{
id: 300, title: '水厂', img: process.env.PUBLIC_URL+'/assets/menu/水利设施.png', children: [
{ id: 301, title: '供水态势', img: process.env.PUBLIC_URL+'/assets/menu/降雨中心.png' },
@ -147,7 +147,8 @@ export default function ActionDock({ }) {
removePoint()
}
}}>
<div className={clsx('button', { active: o.id===200?(view===207||view===203||view===205||view===206||view===200):view === o.id })}>
{/* <div className={clsx('button', { active: o.id===200?(view===207||view===203||view===205||view===206||view===200):view === o.id })}> */}
<div className={clsx('button', { active: view === o.id })}>
<img width={32} height={32} src={o.img} />
</div>
</div>

View File

@ -155,7 +155,7 @@ export default function Title() {
</div>
</div>:null
}
{
{/* {
(view===203||view===205||view===206)?
<div style={{position:'absolute',left:'27.8rem',top:'7.6rem',transform:'translate(0px, 0px)',display:'flex',flexDirection:'column'}}>
{
@ -198,7 +198,7 @@ export default function Title() {
)
}
</div>:null
}
} */}
</div>
)
}

View File

@ -187,7 +187,7 @@ function ARzSk({data}) {
<TableRow>
<DpTableCell style={{ minWidth: '4rem' }} align="left">水库名称</DpTableCell>
<DpTableCell style={{ minWidth: '5rem' }} align="center">类型</DpTableCell>
<DpTableCell style={{ minWidth: '3rem' }} align="center">水位(m)</DpTableCell>
<DpTableCell style={{ minWidth: '3rem' }} align="center">当前水位(m)</DpTableCell>
<DpTableCell style={{ minWidth: '6rem' }} align="center">监测时间</DpTableCell>
</TableRow>
</TableHead>
@ -204,8 +204,11 @@ function ARzSk({data}) {
</div>
</DpTableCell>
<DpTableCell align="center" >(2)</DpTableCell>
<DpTableCell align="center" >{tableRow.rz}</DpTableCell>
<DpTableCell align="center" >{moment(tableRow.tm).format('YYYY-MM-DD HH:mm:ss')}</DpTableCell>
<DpTableCell align="center" >
{tableRow.rz}
<span style={{color:'red',marginLeft:'0.5rem'}}>+{(tableRow.rz-tableRow.fsltdz).toFixed(2)}</span>
</DpTableCell>
<DpTableCell align="center" >{moment(tableRow.tm).format('MM-DD mm:ss')}</DpTableCell>
</DpTableRow>
</TableBody>
)

View File

@ -2,14 +2,25 @@ import clsx from 'clsx';
import React from 'react';
import PanelBox from '../../components/PanelBox';
import ARzSk from './ARzSk';
import { useDispatch, useSelector } from 'react-redux';
export default function Warn({ style }) {
const dispatch = useDispatch();
return (
<PanelBox
style={style}
title="超汛水库"
title="超汛水库"
color="green"
extra={
<>
<div style={{cursor:'pointer',color:'#1890ff'}} onClick={()=>{
dispatch?.runtime.setInfoDlg({ layerId: 'allSkFaLayer', properties: {} })
}}>详情</div>
</>
}
>
<ARzSk />
</PanelBox>

View File

@ -61,16 +61,16 @@ function HDReal({ style }) {
<div style={{ display: 'flex', padding: '10px 5px',marginLeft:30, justifyContent: 'space-between', flexWrap: 'wrap' }}>
<div>
<img src={`${process.env.PUBLIC_URL}/assets/s3.png`} alt="" style={{ width: 180,cursor:'pointer' }} onClick={handleBxDlg}/>
<img src={`${process.env.PUBLIC_URL}/assets/s2.png`} alt="" style={{ width: 180 }} />
</div>
<div style={{ margin: '5px 0' }}>
<img src={`${process.env.PUBLIC_URL}/assets/s1.png`} alt="" style={{ width: 180 }} />
<img src={`${process.env.PUBLIC_URL}/assets/s4.png`} alt="" style={{ width: 180 }} />
</div>
<div >
<div style={{ margin: '5px 0' }}>
<img src={`${process.env.PUBLIC_URL}/assets/s5.png`} alt="" style={{ width: 180 }} />
<img src={`${process.env.PUBLIC_URL}/assets/s1.png`} alt="" style={{ width: 180 }} />
</div>
<div >
<img src={`${process.env.PUBLIC_URL}/assets/s2.png`} alt="" style={{ width: 180 }} />
<img src={`${process.env.PUBLIC_URL}/assets/s6.png`} alt="" style={{ width: 180 }} />
</div>
<img src={`${process.env.PUBLIC_URL}/assets/s7.png`} alt="" style={{ width: 180,marginTop:5 }} />

View File

@ -0,0 +1,20 @@
import React, { useMemo, useState } from 'react';
import PanelBox from '../../components/PanelBox';
function DrpReal({ style }) {
return (
<PanelBox
style={style}
title="库容蓄水量统计"
color="green"
>
<img src={process.env.PUBLIC_URL+'/assets/13231750650433_.pic.jpg'} style={{width:'26rem',marginLeft:'0.2rem',marginTop:'-0.2rem'}} onClick={()=>{
}}/>
</PanelBox>
)
}
export default DrpReal;

View File

@ -4,22 +4,22 @@ function Page({ style }) {
return (
<div style={{width:'100%',display:'flex'}}>
<div style={{width:'100%',display:'flex',alignItems:'flex-start',padding:'0.5rem 0',justifyContent:'space-around'}}>
<div style={{width:'24%',display:'flex',flexDirection:'column',alignItems:'center',border:'1px solid rgba(36, 136, 223, 0.4)',paddingTop:'0.2rem',background:'#132a4b'}}>
<div style={{width:'24%',display:'flex',flexDirection:'column',alignItems:'center',border:'1px solid rgba(36, 136, 223, 0.4)',paddingTop:'0.2rem',paddingBottom:'0.1rem',background:'#132a4b'}}>
<img src={`${process.env.PUBLIC_URL}/assets/icon/大型水库.png`} width={20} alt=""/>
<div style={{color:'#ffffff',fontSize:'0.8rem',marginTop:'0.1rem'}}>大型水库</div>
<div style={{color:'#ffffff',fontSize:'0.8rem',lineHeight:'1rem'}}><span style={{color:'#7dd188',fontSize:'1.2rem'}}>3</span> </div>
</div>
<div style={{width:'24%',display:'flex',flexDirection:'column',alignItems:'center',border:'1px solid rgba(36, 136, 223, 0.4)',paddingTop:'0.2rem',background:'#132a4b'}}>
<div style={{width:'24%',display:'flex',flexDirection:'column',alignItems:'center',border:'1px solid rgba(36, 136, 223, 0.4)',paddingTop:'0.2rem',paddingBottom:'0.1rem',background:'#132a4b'}}>
<img src={`${process.env.PUBLIC_URL}/assets/icon/中.png`} width={20} alt=""/>
<div style={{color:'#ffffff',fontSize:'0.8rem',marginTop:'0.1rem'}}>中型水库</div>
<div style={{color:'#ffffff',fontSize:'0.8rem',lineHeight:'1rem'}}><span style={{color:'#7dd188',fontSize:'1.2rem'}}>7</span> </div>
</div>
<div style={{width:'24%',display:'flex',flexDirection:'column',alignItems:'center',border:'1px solid rgba(36, 136, 223, 0.4)',paddingTop:'0.2rem',background:'#132a4b'}}>
<div style={{width:'24%',display:'flex',flexDirection:'column',alignItems:'center',border:'1px solid rgba(36, 136, 223, 0.4)',paddingTop:'0.2rem',paddingBottom:'0.1rem',background:'#132a4b'}}>
<img src={`${process.env.PUBLIC_URL}/assets/icon/小1.png`} width={20} alt=""/>
<div style={{color:'#ffffff',fontSize:'0.8rem',marginTop:'0.1rem'}}>(1)型水库</div>
<div style={{color:'#ffffff',fontSize:'0.8rem',lineHeight:'1rem'}}><span style={{color:'#7dd188',fontSize:'1.2rem'}}>44</span> </div>
</div>
<div style={{width:'24%',display:'flex',flexDirection:'column',alignItems:'center',border:'1px solid rgba(36, 136, 223, 0.4)',paddingTop:'0.2rem',background:'#132a4b'}}>
<div style={{width:'24%',display:'flex',flexDirection:'column',alignItems:'center',border:'1px solid rgba(36, 136, 223, 0.4)',paddingTop:'0.2rem',paddingBottom:'0.1rem',background:'#132a4b'}}>
<img src={`${process.env.PUBLIC_URL}/assets/icon/小1.png`} width={20} alt=""/>
<div style={{color:'#ffffff',fontSize:'0.8rem',marginTop:'0.1rem'}}>(2)型水库</div>
<div style={{color:'#ffffff',fontSize:'0.8rem',lineHeight:'1rem'}}><span style={{color:'#7dd188',fontSize:'1.2rem'}}>207</span> </div>

View File

@ -126,6 +126,14 @@ function DrpReal({ style }) {
map.getSource('临时水库tz').setData(parseGeoJSON(data))
}
const getBxx = (a,b)=>{
if(typeof a === 'number' && typeof b === 'number' ){
return (a-b).toFixed(2)
}else{
return '-'
}
}
return (
<PanelBox
style={style}
@ -136,7 +144,7 @@ function DrpReal({ style }) {
{
skTypeObj.map((item) =>
(<>
<CollapsePage type={item.type} name={item.name} num1={item.num1} num2={`${item.num2}/${item.num3}`} skType={skType} setSkType={setSkType} icon={item.icon} />
<CollapsePage type={item.type} name={item.name} num1={item.num1} num2={`${item.num3}`} skType={skType} setSkType={setSkType} icon={item.icon} />
<Collapse in={skType === item.type} timeout="auto" unmountOnExit>
<TableContainer style={{ maxHeight: 'calc( 100vh - 28.2rem )' }}>
<Table size="small" stickyHeader>
@ -144,15 +152,15 @@ function DrpReal({ style }) {
<TableRow>
<DpTableCell style={{ minWidth: '3rem' }} align="left">序号</DpTableCell>
<DpTableCell style={{ minWidth: '8rem' }} align="center">水库名称</DpTableCell>
<DpTableCell style={{ minWidth: '8rem' }} align="center">类型</DpTableCell>
<DpTableCell style={{ minWidth: '8rem' }} align="center">
{/* <DpTableCell style={{ minWidth: '8rem' }} align="center">类型</DpTableCell> */}
<DpTableCell style={{ minWidth: '6rem' }} align="center">
{/* <TableSortLabel
onClick={() => setSort1(!sort1)}
active={true}
direction={sort1?'desc':'asc'}>
{'蓄水量(万m³)'}
</TableSortLabel> */}
蓄水量(万m³)
当前水位 (m)
</DpTableCell>
<DpTableCell style={{ minWidth: '8rem' }} align="center">
<TableSortLabel
@ -177,8 +185,8 @@ function DrpReal({ style }) {
{tableRow.stnm}
</div>
</DpTableCell>
<DpTableCell align="center" >{item.name}</DpTableCell>
<DpTableCell align="center" >{tableRow.xs}</DpTableCell>
{/* <DpTableCell align="center" >{item.name}</DpTableCell> */}
<DpTableCell align="right" >{`${tableRow.rz} (${getBxx(tableRow.rz,tableRow.fsltdz)})`}</DpTableCell>
<DpTableCell align="center" >{tableRow.w}</DpTableCell>
</DpTableRow>
</TableBody>