diff --git a/src/models/map/index.js b/src/models/map/index.js index 9e2cdfb..9591fb6 100644 --- a/src/models/map/index.js +++ b/src/models/map/index.js @@ -211,9 +211,9 @@ const map = { }); } else if (id === 6) { layerVisible = { - RealDrpLayer: false, - RealHDLayer: false, - RealSkLayer: false, + RealDrpLayer: true, + RealHDLayer: true, + RealSkLayer: true, BxSkLayer: true, FzdxLayer: false, WataLayer: false, diff --git a/src/views/Home/panels/Drpfx/index.js b/src/views/Home/panels/Drpfx/index.js index 31f0463..7815a6a 100644 --- a/src/views/Home/panels/Drpfx/index.js +++ b/src/views/Home/panels/Drpfx/index.js @@ -73,6 +73,15 @@ const useStyles = makeStyles((theme) => ({ backgroundColor: 'rgba(255,255,255,0.1)' } }, + warningRow: { + '&.pink': { backgroundColor: 'rgba(255,192,203,0.5)' }, + '&.purple': { backgroundColor: 'rgba(147,112,219,0.5)' }, + '&.blue': { backgroundColor: 'rgba(135,206,235,0.5)' }, + '&.blue1': { backgroundColor: 'rgba(135,206,235,0.4)' }, + '&.blue2': { backgroundColor: 'rgba(135,206,235,0.3)' }, + '&.green': { backgroundColor: 'rgba(144,238,144,0.5)' } + }, + expandedRow: { '&.pink': { backgroundColor: 'rgba(255,192,203,0.1)' }, '&.purple': { backgroundColor: 'rgba(147,112,219,0.1)' }, @@ -103,8 +112,8 @@ export default function Overall({ style }) { { id: 'history', name: '历史极值站点', count: 0, color: 'pink' }, { id: '100year', name: '100年一遇以上站点', count: 0, color: 'purple' }, { id: '50year', name: '50年一遇以上站点', count: 0, color: 'blue' }, - { id: 'special', name: '特大暴雨站点', count: 0, color: 'blue' }, - { id: 'heavy', name: '大暴雨站点', count: 0, color: 'blue' }, + { id: 'special', name: '特大暴雨站点', count: 0, color: 'blue1' }, + { id: 'heavy', name: '大暴雨站点', count: 0, color: 'blue2' }, { id: 'storm', name: '暴雨站点', count: 0, color: 'green' } ]; @@ -178,7 +187,10 @@ export default function Overall({ style }) { {stations.map((station) => ( - + } label="行政村" /> - console.log(e.target.value)}/> + onChange={(e) => console.log(e.target.value)}/> */} { type == 'sh' ? diff --git a/src/views/Home/panels/HdWarning/index.js b/src/views/Home/panels/HdWarning/index.js index 58a1047..6ca8d6b 100644 --- a/src/views/Home/panels/HdWarning/index.js +++ b/src/views/Home/panels/HdWarning/index.js @@ -75,10 +75,10 @@ const useStyles = makeStyles((theme) => ({ }, warningRow: { '&.pink': { - backgroundColor: '#fed4db' + backgroundColor: 'rgba(254, 212, 219,0.5)' }, '&.purple': { - backgroundColor: '#fceccf' + backgroundColor: 'rgba(252, 236, 207,0.5)' } }, expandedRow: { diff --git a/src/views/Home/panels/ShWarning/index.js b/src/views/Home/panels/ShWarning/index.js index ae7011b..6292d06 100644 --- a/src/views/Home/panels/ShWarning/index.js +++ b/src/views/Home/panels/ShWarning/index.js @@ -42,10 +42,10 @@ const useStyles = makeStyles((theme) => ({ }, warningRow: { '&.immediate': { - backgroundColor: '#d32f2f' + backgroundColor: 'rgba(211, 47, 47,0.5)' }, '&.prepare': { - backgroundColor: '#ed6c02' + backgroundColor: 'rgba(237, 108, 2,0.5)' } }, expandIcon: { @@ -103,7 +103,7 @@ export default function Overall({ style }) { { type: 'immediate', label: '立即转移', - count: 0, + count: 3, details: [] // 这里可以添加详细信息的数组 }, { @@ -146,6 +146,24 @@ export default function Overall({ style }) { }, []) + const zyData = [ + { + adnm: '石桥湾村', + tm: '2025-05-22 12:03:00', + status: '关闭预警' + }, + { + adnm: '凉亭村', + tm: '2025-05-22 12:03:00', + status: '关闭预警' + }, + { + adnm: '古城村', + tm: '2025-05-22 12:03:00', + status: '关闭预警' + } + ] + return ( {/* 这里可以添加展开后显示的详细内容 */} - 暂无详细信息 + {/* 暂无详细信息 */} + { + row.type == 'immediate' ? zyData.map(item => ( + +
{item.adnm}
+
{item.tm}
+
{item.status}
+
+ )) + + : + 暂无详细信息 + }
@@ -229,15 +265,15 @@ export default function Overall({ style }) { - 预警统计: 共 0 条 + 预警统计: 共 3 条 {warningData.map((stat) => (
- - {stat.label} + + {stat.label}
{stat.count}
diff --git a/src/views/Home/panels/Shksh/index.js b/src/views/Home/panels/Shksh/index.js index 1309672..b066511 100644 --- a/src/views/Home/panels/Shksh/index.js +++ b/src/views/Home/panels/Shksh/index.js @@ -25,11 +25,28 @@ function HDReal({ style, onSelect }) { id: '420981', name: '麻城市', children: [ - { id: '420981001', name: '龙池桥街道',lgtd:115.02073188,lttd:31.18672346,count:2 }, - { id: '420981002', name: '木子店镇',lgtd:115.36181316,lttd:31.1908325,count:2}, - { id: '420981003', name: '黄土岗镇',lgtd:115.07167872,lttd:31.37496863,count:2 }, - { id: '420981004', name: '宋埠镇',lgtd:114.8003577,lttd:31.07316308,count:2 }, - { id: '420981005', name: '南湖街道',lgtd:114.99464754,lttd:31.16857964,count:2}, + { + id: '420981001', name: '龙池桥街道', + children: [{ id: '4209810011', name: '园林社区居民委员会山洪灾害防御预案', lgtd: 115.02073188, lttd: 31.18672346 }, + { id: '4209810012', name: '城西社区居民委员会山洪灾害防御预案', lgtd: 115.02073188, lttd: 31.18672346 } + ] + }, + { + id: '420981002', name: '木子店镇', + children:[{id: '4209810021', name: '木子店镇山洪灾害防御预案', lgtd: 115.36181316, lttd: 31.1908325}] + }, + { + id: '420981003', name: '黄土岗镇', + children:[{id: '4209810031', name: '黄土岗镇山洪灾害防御预案', lgtd: 115.07167872, lttd: 31.3749686}] + }, + { + id: '420981004', name: '宋埠镇', + children:[], + }, + { + id: '420981005', name: '南湖街道', + children:[], + }, ], }, ]; @@ -78,6 +95,25 @@ const useStyles = makeStyles({ opacity: 0.8 } }); + const flattenArray = (data) => { + const result = []; + + const flatten = (item) => { + // 保存当前节点信息 + const { children, ...rest } = item; + result.push(rest); + + // 递归处理子节点 + if (children && children.length > 0) { + children.forEach(child => flatten(child)); + } + }; + + // 处理根节点 + data.forEach(item => flatten(item)); + + return result; +}; const classes = useStyles(); const renderTree = (nodes) => { @@ -85,7 +121,7 @@ const useStyles = makeStyles({ {nodes.name} - {!nodes.children ? `(${nodes.count})`:''} + {/* {!nodes.children ? `(${nodes.count})`:''} */} ); return ( @@ -132,7 +168,8 @@ const useStyles = makeStyles({ const [tableData, setTableData] = useState([]) const handleNodeSelect = (event, nodeId) => { setTableData(dataObj[nodeId]) - const row = machengData[0].children.find(item => item.id == nodeId) + const flatData = flattenArray(machengData); + const row = flatData.find(item => item.id == nodeId) dispatch.runtime.setShksh(row) flyTo(row) }; @@ -176,13 +213,12 @@ const useStyles = makeStyles({ > {renderTree(machengData[0])} -
预案列表
+ {/*
预案列表
预案名称 - {/* 警戒水位 */} @@ -198,7 +234,7 @@ const useStyles = makeStyles({ ))}
-
+ */} ) diff --git a/src/views/Home/panels/SkWarning/index.js b/src/views/Home/panels/SkWarning/index.js index 2072219..c638406 100644 --- a/src/views/Home/panels/SkWarning/index.js +++ b/src/views/Home/panels/SkWarning/index.js @@ -4,6 +4,8 @@ import useRequest from '../../../../utils/useRequest'; import PanelBox from '../../components/PanelBox'; import OverallContent from './OverallContent'; import { makeStyles } from '@material-ui/core/styles'; +import { InfoPopNames } from '../../InfoPops'; + import { Box, Typography, @@ -20,6 +22,9 @@ import { IconButton, Collapse } from '@material-ui/core'; +import { useDispatch, useSelector } from 'react-redux'; +import config from '../../../../config'; + import AddIcon from '@material-ui/icons/Add'; import RemoveIcon from '@material-ui/icons/Remove'; const useStyles = makeStyles((theme) => ({ @@ -73,6 +78,17 @@ const useStyles = makeStyles((theme) => ({ backgroundColor: 'rgba(255,255,255,0.1)' } }, + warningRow: { + '&.pink': { + backgroundColor: 'rgba(255,192,203,0.8)' + }, + '&.purple': { + backgroundColor: 'rgba(252, 236, 207,0.8)' + }, + '&.blue': { + backgroundColor: 'rgba(252, 236, 207,0.5)' + } + }, expandedRow: { '&.pink': { backgroundColor: 'rgba(255,192,203,0.1)' }, '&.purple': { backgroundColor: 'rgba(147,112,219,0.1)' }, @@ -81,6 +97,7 @@ const useStyles = makeStyles((theme) => ({ } })); export default function Overall({ style }) { + const dispatch = useDispatch(); const classes = useStyles(); const [types, setTypes] = useState({ @@ -102,7 +119,7 @@ export default function Overall({ style }) { const stations = [ { id: 'history', name: '超校核洪水位', count: 0, color: 'pink' }, { id: '100year', name: '超设计洪水位', count: 0, color: 'purple' }, - { id: '50year', name: '超汛限水位', count: 0, color: 'blue' }, + { id: 'cxx', name: '超汛限水位', count: 1, color: 'blue' }, ]; const toggleExpand = (id) => { @@ -112,6 +129,62 @@ export default function Overall({ style }) { })); }; + const skData = [{ + "stcd": "716113701", + "type": "sk", + "hasRz": true, + "stnm": "永红水库", + "adcd": "421181105000", + "wscd": null, + "importancy": 0, + "lgtd": 115.120278, + "lttd": 31.183611, + "elev": 0, + "damel": 131.99, + "dsflz": 130.56, + "fsltdz": 129.9, + "ddz": 113.5, + "zcxsw": 129.9, + "drpTm": "2025-04-11T06:00:00.000Z", + "today": 0, + "h1": 0, + "h3": 0, + "h6": 0, + "h12": 0, + "h24": 0, + "h48": 0, + "drpState": 2, + "rz": 119.15, + "w": 0.444, + "a_fsltdz": -10.75, + "rzTm": "2025-04-11T06:00:00.000Z", + "rzWarning": 0, + "rzState": 2, + "pic": [ + { + "stcd": "716113701", + "tm": "2023-11-16T11:19:00.000Z", + "url": "http://223.75.53.106:8891/skjgimages/2023/1116/716113701/20231116191900.jpg" + }, + { + "stcd": "716113701", + "tm": "2023-11-16T09:05:00.000Z", + "url": "http://223.75.53.106:8891/skjgimages/2023/1116/716113702/20231116170500.jpg" + } + ] + },] + const flyTo = () => { + const { lgtd, lttd } = skData[0]; + if (lgtd && lttd) { + dispatch.runtime.setFeaturePop({ type: InfoPopNames.RealSkPop, properties: skData[0], coordinates: [lgtd, lttd] }); + dispatch.runtime.setCameraTarget({ + center: [lgtd, lttd + config.poiPositionOffsetY.hd], + zoom: config.poiPositionZoom.hd, + pitch: config.poiPitch, + }); + } + } + return ( - + {/* 类型: } @@ -129,23 +202,24 @@ export default function Overall({ style }) { control={} label="水库" /> - - + */} + - 站名 - 水位(mm) + 站名 + 水位(mm) 所属政区 所属流域 + 预案 {stations.map((station) => ( - + + - + {/* 展开的详细内容可以在这里添加 */} - {/* - 站名 - 水位(m) - 所属政区 - 所属流域 - */} + { + station.id == "cxx" && flyTo()}> +
永红水库
+ 119.15(0.24) +
阎家河镇
+ 阎家河 + { + dispatch?.runtime.setInfoDlg({ layerId: 'PdfLayer', properties: {planName:'麻城市山洪灾害防御预案'} }) + }} + >麻城市山洪灾害防御预案 +
+ } +