+
影像图
diff --git a/src/views/Home/hsyy/index.js b/src/views/Home/hsyy/index.js
index 0ac975573..2f1b6a198 100644
--- a/src/views/Home/hsyy/index.js
+++ b/src/views/Home/hsyy/index.js
@@ -4,21 +4,105 @@ import { useDispatch, useSelector } from 'react-redux'
import { Collapse, DatePicker, Input, Modal, message } from 'antd';
import './index.less'
import Ybfa from './ybfa'
+import Ymtj from './ymtj'
+import Demo3D from '../../Home/MapCtrl/Map3D/demo'
+const { Cesium } = window;
const Page = ({ showPanels }) => {
const dispatch = useDispatch();
let mapObj = useSelector(s => s.map.map)
+ const [ map, setMap ] = useState(null)
+ const [ ctx, setCtx ] = useState({mode:'预报方案',data:{}})
+ useEffect(()=>{
+ },[])
+
+ useEffect(() => {
+ dispatch.map.setLayerVisible({
+ RealDrpLayer: true,
+ PicStLayer: true,
+ ShuiKuLayer: true,
+ GongShuiLayer: true,
+ AZDLayer: true,
+ QSYDWLayer: true,
+ YHJMHLayer: true
+ });
+ const { mode } = ctx
+ //当前map对象是cesium
+ if(!mapObj?._cesiumWidget){
+ return
+ }
+
+ if(mode==='淹没统计'){
+ mapObj.camera.setView({
+ destination: Cesium.Cartesian3.fromDegrees(114.786546000,31.496518000,1500),
+ orientation: {
+ heading: Cesium.Math.toRadians(-90),
+ pitch: Cesium.Math.toRadians(-35.0),
+ roll: 0.0
+ }
+ });
+
+ const demo = new Demo3D()
+ demo.getCzml2(mapObj)
+ }else{
+ mapObj.dataSources._dataSources.forEach(dataSource => {
+ if (dataSource.name === 'CZML1111') { // 确保你知道你想要移除的数据源名称
+ mapObj.dataSources.remove(dataSource);
+ }
+ });
+
+ mapObj.camera.setView({
+ destination: Cesium.Cartesian3.fromDegrees(114.771546000,31.497518000,650),
+ orientation: {
+ heading: Cesium.Math.toRadians(-90),
+ pitch: Cesium.Math.toRadians(-45.0),
+ roll: 0.0
+ }
+ });
+ }
+
+
+
+
+ // demo.getCzml2(mapObj)//demo
+ // const tm = {
+ // "dayNumber": 2460957,
+ // "secondsOfDay": 75115.485
+ // }
+ // debugger
+ // setTimeout(() => {
+ // mapObj.clock.currentTime = tm;
+ // }, 10000);
+ // this.demo.getDem(viewer) //地形图
+ // this.demo.getGltf(viewer) //模型
+ // this.demo.getWater(viewer)//简单淹没分析
+ // this.demo.getWater2(viewer)
+ // this.demo.getRlt2(viewer)
+ // this.demo.getRlt3(viewer) //热力图
+ // this.demo.getCzml(viewer) //czml模型
+
+ return ()=>{
+ dispatch.map.setLayerVisible({
+ RealDrpLayer: false,
+ PicStLayer: false,
+ ShuiKuLayer: false,
+ GongShuiLayer: false,
+ AZDLayer: false,
+ QSYDWLayer: false,
+ YHJMHLayer: false
+ });
+ }
+ }, [mapObj,ctx])
- useEffect(() => {
- }, [])
return (
)
diff --git a/src/views/Home/hsyy/index.less b/src/views/Home/hsyy/index.less
index 6f9ab7254..11d921206 100644
--- a/src/views/Home/hsyy/index.less
+++ b/src/views/Home/hsyy/index.less
@@ -396,7 +396,7 @@
padding: 8px;
-
+
.hsyylistBox{
padding: 10px;
margin-bottom: 10px;
@@ -441,4 +441,48 @@
}
}
}
-}
\ No newline at end of file
+
+ .ymtjBox{
+ height: 100%;
+ display: flex;
+ flex-direction: row;
+ flex-wrap: wrap;
+ padding: 10px;
+
+
+ .ymtjBoxItem{
+ background-color: #eee;
+ border-radius: 5px;
+ width: 108px;
+ margin: 5px;
+ padding: 10px 0px;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+
+ .text1{
+ font-size: 22px;
+ font-weight: 500;
+ height: 30px;
+ .dw{
+ display: inline-block;
+ font-size: 12px;
+ font-weight: 500;
+ color: #000000;
+ margin-left: 2px;
+ }
+ }
+ .text2{
+ font-size: 12px;
+ font-weight: 500;
+ }
+ }
+ }
+
+
+ .hsyyScrollBox{
+ height: 68vh;
+ overflow-y: scroll;
+ }
+}
diff --git a/src/views/Home/hsyy/information/fack.js b/src/views/Home/hsyy/information/fack.js
new file mode 100644
index 000000000..2ad6ddfff
--- /dev/null
+++ b/src/views/Home/hsyy/information/fack.js
@@ -0,0 +1,78 @@
+import React, { useEffect, useState, useRef } from 'react';
+import { Form, Input, Button, Table, Radio, Tabs } from 'antd';
+import {CloseOutlined} from '@ant-design/icons';
+import BasicCrudModal from '../../../../components/crud/BasicCrudModal';
+import ReactEcharts from 'echarts-for-react';
+import drpOption from './drpOption';
+import './index.less'
+import { httpget2, httppost2 } from '../../../../utils/request';
+import apiurl from '../../../../service/apiurl';
+
+const Page = ({data}) => {
+ const [tab,setTab] = useState('1')
+
+ const columns = [
+ { title: '序号', key: 'inx', dataIndex: 'inx', align:"center",render: (text, rec, index) => index + 1 },
+ { title: '时间', key: 'tm', dataIndex: 'tm', align:"center", width:180,render:v=>v.slice(0, 16)},
+ { title: '降雨量(mm)', key: 'drp', dataIndex: 'drp', align:"center", width:100,render:(v,row)=>{
+ const val = v===null?'-':Number(v).toFixed(2)
+ return
setOpen(false)} destroyOnClose={true}>
- setOpen(false)} show={show}/>
+
+
)
diff --git a/src/views/Home/hsyy/ymtj.js b/src/views/Home/hsyy/ymtj.js
new file mode 100644
index 000000000..f57514723
--- /dev/null
+++ b/src/views/Home/hsyy/ymtj.js
@@ -0,0 +1,140 @@
+import React, { useEffect, useState, useRef } from 'react'
+import { useLocation } from 'react-router'
+import { useDispatch, useSelector } from 'react-redux'
+import {Form, Input, DatePicker, Popover, Collapse , Button, message, Table, Col, Modal} from 'antd';
+import { RollbackOutlined, ArrowLeftOutlined } from '@ant-design/icons';
+import apiurl from '../../../service/apiurl';
+import ModalForm from './information';
+import { httppost2 } from '../../../utils/request';
+
+
+const { RangePicker } = DatePicker
+
+
+const Page = ({ ctx, setCtx }) => {
+ const dispatch = useDispatch();
+ let mapObj = useSelector(s => s.map.map)
+ const [data1,setData1] = useState([
+ {
+ cz:'檀树岗村',
+ rk:10,
+ sd:15,
+ sj:'2025-08-04 18:00:00',
+ },
+ {
+ cz:'檀树岗村',
+ rk:10,
+ sd:15,
+ sj:20,
+ },
+ {
+ cz:'檀树岗村',
+ rk:10,
+ sd:15,
+ sj:20,
+ },
+ ])
+ const [data2,setData2] = useState([
+ {
+ dwmc:'七里坪镇檀树中学',
+ rk:10,
+ sd:15,
+ sj:20,
+ }
+ ])
+
+
+ const columns = [
+ { title: '受灾村庄', key: 'cz', dataIndex: 'cz', align:"center"},
+ { title: '受灾人口(人)', key: 'rk', dataIndex: 'rk', width:'80px', align:"center"},
+ { title: '最高淹没深度(m)', key: 'sd', dataIndex: 'sd', width:'100px', align:"center"},
+ { title: '洪峰时间', key: 'sj', dataIndex: 'sj', align:"center"},
+ ];
+ const columns2 = [
+ { title: '单位名称', key: 'dwmc', dataIndex: 'dwmc', align:"center"},
+ { title: '影响人口(人)', key: 'rk', dataIndex: 'rk', width:'80px', align:"center"},
+ { title: '最高淹没深度(m)', key: 'sd', dataIndex: 'sd', width:'100px', align:"center"},
+ { title: '洪峰时间', key: 'sj', dataIndex: 'sj', align:"center"},
+ ];
+
+
+ useEffect(() => {
+ getData()
+ }, [])
+
+ const getData = async()=>{
+ }
+
+
+ return (
+ <>
+
+
3D图
- */}
+
3D图
-
影像图
diff --git a/src/views/Home/hsyy/index.js b/src/views/Home/hsyy/index.js
index 0ac975573..2f1b6a198 100644
--- a/src/views/Home/hsyy/index.js
+++ b/src/views/Home/hsyy/index.js
@@ -4,21 +4,105 @@ import { useDispatch, useSelector } from 'react-redux'
import { Collapse, DatePicker, Input, Modal, message } from 'antd';
import './index.less'
import Ybfa from './ybfa'
+import Ymtj from './ymtj'
+import Demo3D from '../../Home/MapCtrl/Map3D/demo'
+const { Cesium } = window;
const Page = ({ showPanels }) => {
const dispatch = useDispatch();
let mapObj = useSelector(s => s.map.map)
+ const [ map, setMap ] = useState(null)
+ const [ ctx, setCtx ] = useState({mode:'预报方案',data:{}})
+ useEffect(()=>{
+ },[])
+
+ useEffect(() => {
+ dispatch.map.setLayerVisible({
+ RealDrpLayer: true,
+ PicStLayer: true,
+ ShuiKuLayer: true,
+ GongShuiLayer: true,
+ AZDLayer: true,
+ QSYDWLayer: true,
+ YHJMHLayer: true
+ });
+ const { mode } = ctx
+ //当前map对象是cesium
+ if(!mapObj?._cesiumWidget){
+ return
+ }
+
+ if(mode==='淹没统计'){
+ mapObj.camera.setView({
+ destination: Cesium.Cartesian3.fromDegrees(114.786546000,31.496518000,1500),
+ orientation: {
+ heading: Cesium.Math.toRadians(-90),
+ pitch: Cesium.Math.toRadians(-35.0),
+ roll: 0.0
+ }
+ });
+
+ const demo = new Demo3D()
+ demo.getCzml2(mapObj)
+ }else{
+ mapObj.dataSources._dataSources.forEach(dataSource => {
+ if (dataSource.name === 'CZML1111') { // 确保你知道你想要移除的数据源名称
+ mapObj.dataSources.remove(dataSource);
+ }
+ });
+
+ mapObj.camera.setView({
+ destination: Cesium.Cartesian3.fromDegrees(114.771546000,31.497518000,650),
+ orientation: {
+ heading: Cesium.Math.toRadians(-90),
+ pitch: Cesium.Math.toRadians(-45.0),
+ roll: 0.0
+ }
+ });
+ }
+
+
+
+
+ // demo.getCzml2(mapObj)//demo
+ // const tm = {
+ // "dayNumber": 2460957,
+ // "secondsOfDay": 75115.485
+ // }
+ // debugger
+ // setTimeout(() => {
+ // mapObj.clock.currentTime = tm;
+ // }, 10000);
+ // this.demo.getDem(viewer) //地形图
+ // this.demo.getGltf(viewer) //模型
+ // this.demo.getWater(viewer)//简单淹没分析
+ // this.demo.getWater2(viewer)
+ // this.demo.getRlt2(viewer)
+ // this.demo.getRlt3(viewer) //热力图
+ // this.demo.getCzml(viewer) //czml模型
+
+ return ()=>{
+ dispatch.map.setLayerVisible({
+ RealDrpLayer: false,
+ PicStLayer: false,
+ ShuiKuLayer: false,
+ GongShuiLayer: false,
+ AZDLayer: false,
+ QSYDWLayer: false,
+ YHJMHLayer: false
+ });
+ }
+ }, [mapObj,ctx])
- useEffect(() => {
- }, [])
return (
- :null }
+ { ctx.mode==='淹没统计'?:null}
{val}{row.ispreDrp==='1'?
+ }},
+ { title: '实测水位(m)', key: 'realSwHValue', dataIndex: 'realSwHValue', align:"center",render:(v)=>v===null?'-':Number(v).toFixed(2)},
+ { title: '预报水位(m)', key: 'ycSwHValue', dataIndex: 'ycSwHValue', align:"center",render:(v)=>v===null?'-':Number(v).toFixed(2)},
+ { title: '入库流量(m³/s)', key: 'realRkQValue', dataIndex: 'realRkQValue', width:120, align:"center",render:(v)=>v===null?'-':Number(v).toFixed(2)},
+ { title: '预报入库流量(m³/s)', key: 'ycRkQValue', dataIndex: 'ycRkQValue', width:160, align:"center",render:(v)=>v===null?'-':Number(v).toFixed(2)},
+ { title: '实际出库流量(m³/s)', key: 'realCkQValue', dataIndex: 'realCkQValue', width:160, align:"center",render:(v)=>v===null?'-':Number(v).toFixed(2)},
+ { title: '预报出库流量(m³/s)', key: 'ycCkQValue', dataIndex: 'ycCkQValue', width:160, align:"center",render:(v)=>v===null?'-':Number(v).toFixed(2)},
+ ];
+
+ return (
+ <>
+ 预
:null}
+ 预见期(小时)：
+ {data?.tms?.forecastPeriod}
+ 预热期(天)：
+ {data?.tms?.forecastWarm}
+ 预报时间：
+ {data?.tms?.forecastTime}
+ 开始时间：
+ {data?.tms?.startTime}
+ 结束时间：
+ {data?.tms?.endTime}
+
+
+ {setTab(e.target.value)}} defaultValue="1">
+ 数据图
+ 数据表
+
+
+
+
+ 预报最高调洪水位(m):{data?.tms?.ycMaxSwH?.toFixed(2)}
+ 预报最大入库流量(m³/s):{data?.tms?.ycMaxRkQ?.toFixed(2)}
+ 预报最大下泄流量(m³/s):{data?.tms?.ycMaxCkQ?.toFixed(2)}
+ 预报洪水总量(万m³):{data?.tms?.ycSumFlood?.toFixed(2)}
+
+ {
+ tab==='1'?
+ 
+ }
+ {
+ tab==='2'?
+
+
+ );
+}
+
+export default Page;
\ No newline at end of file
diff --git a/src/views/Home/hsyy/information/index.js b/src/views/Home/hsyy/information/index.js
index 4e9f02bf1..4be2d3d02 100644
--- a/src/views/Home/hsyy/information/index.js
+++ b/src/views/Home/hsyy/information/index.js
@@ -4,38 +4,16 @@ import {CloseOutlined} from '@ant-design/icons';
import BasicCrudModal from '../../../../components/crud/BasicCrudModal';
import ReactEcharts from 'echarts-for-react';
import drpOption from './drpOption';
-import moment from 'moment';
import './index.less'
-import ModalForm1 from './table1'
import { httpget2, httppost2 } from '../../../../utils/request';
import apiurl from '../../../../service/apiurl';
+import Fack from './fack'
+import Tjpz from './tjpz'
-const Page = ({projectId,onCancel,show}) => {
+const Page = ({projectId,onCancel,setCtx}) => {
const [data,setData] = useState({data:[],tms:{}})
- const [tab,setTab] = useState('1')
const [tabs, setTabsChange] = useState(0)
- const columns = [
- { title: '序号', key: 'inx', dataIndex: 'inx', align:"center",render: (text, rec, index) => index + 1 },
- { title: '时间', key: 'tm', dataIndex: 'tm', align:"center", width:180,render:v=>v.slice(0, 16)},
- { title: '降雨量(mm)', key: 'drp', dataIndex: 'drp', align:"center", width:100,render:(v,row)=>{
- const val = v===null?'-':Number(v).toFixed(2)
- return
+
+
:null
+ }
+ {val}{row.ispreDrp==='1'?
- }},
- { title: '实测水位(m)', key: 'realSwHValue', dataIndex: 'realSwHValue', align:"center",render:(v)=>v===null?'-':Number(v).toFixed(2)},
- { title: '预报水位(m)', key: 'ycSwHValue', dataIndex: 'ycSwHValue', align:"center",render:(v)=>v===null?'-':Number(v).toFixed(2)},
- { title: '入库流量(m³/s)', key: 'realRkQValue', dataIndex: 'realRkQValue', width:120, align:"center",render:(v)=>v===null?'-':Number(v).toFixed(2)},
- { title: '预报入库流量(m³/s)', key: 'ycRkQValue', dataIndex: 'ycRkQValue', width:160, align:"center",render:(v)=>v===null?'-':Number(v).toFixed(2)},
- { title: '实际出库流量(m³/s)', key: 'realCkQValue', dataIndex: 'realCkQValue', width:160, align:"center",render:(v)=>v===null?'-':Number(v).toFixed(2)},
- { title: '预报出库流量(m³/s)', key: 'ycCkQValue', dataIndex: 'ycCkQValue', width:160, align:"center",render:(v)=>v===null?'-':Number(v).toFixed(2)},
- ];
-
- const columns2 = [
- { title: '时间', key: 'tm', dataIndex: 'tm', align:"center", render:v=>v.slice(0, 16)},
- { title: '流量', key: 'realSwHValue', dataIndex: 'realSwHValue', align:"center",render:(v)=>},
- ];
-
-
useEffect(()=>{
(async()=>{
const {code , data} = await httpget2(apiurl.fxdd_xyt.hsyb.ybfagl.getData+'?projectId='+projectId)
@@ -61,7 +39,7 @@ const Page = ({projectId,onCancel,show}) => {
预
:null}
- 预报成果详情
+ 方案配置
@@ -70,76 +48,11 @@ const Page = ({projectId,onCancel,show}) => {
onChange={(e) => setTabsChange(e)}
activeKey={tabs}
style={{paddingLeft:'20px'}}
- items={[
- {label: '方案查看',key: 0},
- {label: '条件配置',key: 1},
- ]}
+ items={[{label: '方案查看',key: 0},{label: '条件配置',key: 1},]}
>
- {
- tabs===0?<>
- :null }
+ { tabs===1?:null }
);
}
diff --git a/src/views/Home/hsyy/information/table1.js b/src/views/Home/hsyy/information/table1.js
deleted file mode 100644
index aee836fd8..000000000
--- a/src/views/Home/hsyy/information/table1.js
+++ /dev/null
@@ -1,52 +0,0 @@
-import React, { useEffect, useState, useRef, useMemo } from 'react';
-import { Form, Input, Button, Table, Radio } from 'antd';
-import { EyeOutlined } from '@ant-design/icons';
-import BasicCrudModal from '../../../../components/crud/BasicCrudModal';
-import ReactEcharts from 'echarts-for-react';
-import drpOption from './drpOption';
-import moment from 'moment';
-import './index.less'
-
-
-const Page = ({record}) => {
- const columns = useMemo(()=>{
- if(record.type==='产流计算'){
- return [
- { title: '序号', key: 'inx', dataIndex: 'inx', align:"center",render: (text, rec, index) => index + 1 },
- { title: '时间', key: 'tm', dataIndex: 'tm', align:"center", width:180,render:v=>v.slice(0, 16)},
- { title: '面雨量P(mm)', key: 'drp', dataIndex: 'drp', align:"center",render:(v)=>v===null?'-':Number(v).toFixed(2)},
- { title: '土壤含水量Pa(mm)', key: 'pa', dataIndex: 'pa', align:"center",render:(v)=>v===null?'-':Number(v).toFixed(2)},
- { title: '径流深R(mm)', key: 'r', dataIndex: 'r', align:"center",render:(v)=>v===null?'-':Number(v).toFixed(2)},
- ];
- }else if(record.type==='汇流计算'){
- return [
- { title: '序号', key: 'inx', dataIndex: 'inx', align:"center",render: (text, rec, index) => index + 1 },
- { title: '时间', key: 'tm', dataIndex: 'tm', align:"center", width:180,render:v=>v.slice(0, 16)},
- { title: '预测入库流量', key: 'ycRkQValue', dataIndex: 'ycRkQValue', align:"center",render:(v)=>v===null?'-':Number(v).toFixed(2)},
- ];
- }else{
- return [
- { title: '序号', key: 'inx', dataIndex: 'inx', align:"center",render: (text, rec, index) => index + 1 },
- { title: '时间', key: 'tm', dataIndex: 'tm', align:"center", width:180,render:v=>v.slice(0, 16)},
- { title: '预测出库流量', key: 'ycCkQValue', dataIndex: 'ycCkQValue', align:"center",render:(v)=>v===null?'-':Number(v).toFixed(2)},
- ];
- }
- },[record])
-
-
- return (
- <>
-
- 预见期(小时)：
- {data?.tms?.forecastPeriod}
- 预热期(天)：
- {data?.tms?.forecastWarm}
- 预报时间：
- {data?.tms?.forecastTime}
- 开始时间：
- {data?.tms?.startTime}
- 结束时间：
- {data?.tms?.endTime}
-
-
- {setTab(e.target.value)}} defaultValue="1">
- 数据图
- 数据表
-
-
-
-
- 预报最高调洪水位(m):{data?.tms?.ycMaxSwH?.toFixed(2)}
- 预报最大入库流量(m³/s):{data?.tms?.ycMaxRkQ?.toFixed(2)}
- 预报最大下泄流量(m³/s):{data?.tms?.ycMaxCkQ?.toFixed(2)}
- 预报洪水总量(万m³):{data?.tms?.ycSumFlood?.toFixed(2)}
-
- {
- tab==='1'?
-
- :null
- }
- {
- tabs===1?<>
-
-
-
:null
- }
-
-
-
- :null
- }
-
+ { tabs===0?
-
-
-
-
-
-
- );
-}
-
-export default Page;
\ No newline at end of file
diff --git a/src/views/Home/hsyy/information/tjpz.js b/src/views/Home/hsyy/information/tjpz.js
new file mode 100644
index 000000000..ec65f0b43
--- /dev/null
+++ b/src/views/Home/hsyy/information/tjpz.js
@@ -0,0 +1,32 @@
+import React, { useEffect, useState, useRef } from 'react';
+import { Form, Input, Button, Table, Radio, Tabs } from 'antd';
+// import BasicCrudModal from '../../../../components/crud/BasicCrudModal';
+
+const Page = ({data, setCtx, onCancel}) => {
+ const columns2 = [
+ { title: '时间', key: 'tm', dataIndex: 'tm', align:"center", render:v=>v.slice(0, 16)},
+ { title: '流量', key: 'realSwHValue', dataIndex: 'realSwHValue', align:"center",render:(v)=>},
+ ];
+
+ return (
+ <>
+
+
+
+
+ );
+}
+
+export default Page;
\ No newline at end of file
diff --git a/src/views/Home/hsyy/service.js b/src/views/Home/hsyy/service.js
new file mode 100644
index 000000000..2a739248e
--- /dev/null
+++ b/src/views/Home/hsyy/service.js
@@ -0,0 +1,29 @@
+import {httppost2, httpget, httpget2,httpget3} from "../../../utils/request";
+import {message} from 'antd';
+import apiurl from '../../../service/apiurl';
+
+
+//实时水情-河道水情列表
+export async function getTableData() {
+ const params = {
+ "pageSo": {
+ "pageSize": 99999,
+ "pageNumber": 1
+ },
+ "orderField": "chtm",
+ "isAsc": false
+ }
+ const {data, code, msg} = await httppost2(apiurl.fxdd_xyt.hsyb.ybfagl.page,params) || {};
+ if (code !== 200) {
+ message.error(msg || '请求失败');
+ }
+ return data?.records||[];
+}
+
+
+
+
+
+
+
+
diff --git a/src/views/Home/hsyy/ybfa.js b/src/views/Home/hsyy/ybfa.js
index 354440cf0..eb769e202 100644
--- a/src/views/Home/hsyy/ybfa.js
+++ b/src/views/Home/hsyy/ybfa.js
@@ -1,25 +1,45 @@
-import React, { useEffect, useState, useRef } from 'react'
+import React, { useEffect, useState, useRef, useMemo } from 'react'
import { useLocation } from 'react-router'
import { useDispatch, useSelector } from 'react-redux'
import {Form, Input, DatePicker, Popover, Collapse , Button, message, Table, Col, Modal} from 'antd';
import { createCrudService } from '../../../components/crud/_';
import apiurl from '../../../service/apiurl';
import ModalForm from './information';
-import { httppost2 } from '../../../utils/request';
+import { getTableData } from './service';
+import moment from 'moment';
const { RangePicker } = DatePicker
-const Page = ({ showPanels }) => {
+const Page = ({ setCtx }) => {
const dispatch = useDispatch();
let mapObj = useSelector(s => s.map.map)
const [index,setIndex] = useState(0)
const [data,setData] = useState([])
const [projectId, setProjectId] = useState('')
const [open, setOpen] = useState(false)
- const [mode,setMode] = useState(0)
-
+ const [name, setName] = useState('')
+ const [tms,setTms] = useState([])
+ const listData = useMemo(()=>{
+ let list = [...data]
+ if(name){
+ list = list.filter((i)=>i.name.indexOf(name)>-1)
+ }
+ if(tms&&tms.length>0){
+ list = list.filter((i)=>{
+ const stm = moment(tms[0])
+ const etm = moment(tms[1])
+ const tm = moment(i.updateTm)
+ if(tm.isAfter(stm)&&etm.isAfter(tm)){
+ return true
+ }else{
+ return false
+ }
+ })
+ }
+ return list
+ },[data,name,tms])
@@ -29,127 +49,73 @@ const Page = ({ showPanels }) => {
}, [])
const getData = async()=>{
- const { code, data } = await httppost2(apiurl.fxdd_xyt.hsyb.ybfagl.page, {
- "pageSo": {
- "pageSize": 99999,
- "pageNumber": 1
- },
- "orderField": "chtm",
- "isAsc": false
- });
- if(code!==200){
- return
- }
- setData(data?.records||[])
+ const data = await getTableData()
+ setData(data)
}
- const show = (data)=>{
+
+ const openModal = (item)=>{
+ setOpen(true)
+ setProjectId(item.id)
+ }
+ const closeModal = ()=>{
setOpen(false)
- setMode(1)
+ setProjectId(null)
}
-
return (
<>
+
+
+
+
-
+
+
+
+ 
+ 预报方案
+
+
+ 预报方案
+
+
+
{
- mode===0?<>
-
-
-
- {
- data?.map((item,listIndex)=>(
- <>
-
-
- 预报方案
-
-
- 预报方案
-
-
- setIndex(listIndex)}
- >
-
-
- ))
- }
- :null
- }
-
- {
- mode===1?<>
- {(listIndex+1)+'.'+item.name}{
- listIndex===index?
- {
- setOpen(true)
- setProjectId(item.id)
- }}>方案配置:
- 方案配置
- }
- 预报时段：
- {item.startTm}至{item.endTm}
预报最高调洪水位(m)：
- -
预报最大入库流量(m³/s)：
- -
预报最大下泄流量(m³/s)：
- -
预报洪水总量(万m³)：
- -
方案制作时间：
- {item.updateTm}
-
-
-
- 卸洪结果
-
-
- 卸洪结果
- {
- setProjectId(null)
- setMode(0)
- }}>
- 返回
-
-
-
-
- 预报时段：
- {}至{}
预报最高调洪水位(m)：
- -
预报最大入库流量(m³/s)：
- -
预报最大下泄流量(m³/s)：
- -
预报洪水总量(万m³)：
- -
方案制作时间：
- {}
-
-
-
-
- 水位
-
-
- 水位
-
-
-
-
- :null
+ listData?.map((item,listIndex)=>(
+ <>
+
-
- 出入库流量
-
-
- 出入库流量
-
-
- setIndex(listIndex)}
+ >
+
+
+ ))
}
+ {(listIndex+1)+'.'+item.name}{
+ listIndex===index?
+ openModal(item)}>方案配置:
+ 方案配置
+ }
+ 预报时段：
+ {item.startTm}至{item.endTm}
预报最高调洪水位(m)：
+ {item.ycMaxSwH||'-'}
预报最大入库流量(m³/s)：
+ {item.ycMaxRkQ||'-'}
预报最大下泄流量(m³/s)：
+ {item.ycMaxCkQ||'-'}
预报洪水总量(万m³)：
+ {item.ycSumFlood||'-'}
方案制作时间：
+ {item.updateTm}
+
+
+
+
+ )
+}
+
+export default Page
+
+
+ 淹没统计
+ 淹没统计setCtx({mode:'预报方案',data:{}})}>
+ 
+
+
+
+
+
+ 
+
+
+ 2.98
+ 万m³
泄洪量
+
+ 
+
+
+ 2.8
+ m
最高淹没水深
+
+ 
+
+
+ 25
+ h
淹没历时
+
+ 
+
+
+ 1.18
+ 千m³
受灾面积
+
+ 
+
+
+ 3
+ 个
受灾村庄
+
+ 
+
+
+ 4
+ 人
受灾人口
+
+
+
+ 村庄影响情况
+
+ 村庄影响情况
+
+
+ 企事业单位影响情况
+
+ 企事业单位影响情况