修改水库

lsf-dev
秦子超 2025-06-23 13:14:22 +08:00
parent 8f9f1bbdfd
commit c1d226acab
14 changed files with 74 additions and 36 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.

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

@ -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

@ -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

@ -8,7 +8,7 @@ export default function Warn({ style }) {
return (
<PanelBox
style={style}
title="超汛水库"
title="超汛水库"
color="green"
>
<ARzSk />

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>