feat(): 山洪预警增加数据

src/models/map/index.js

@@ -211,9 +211,9 @@ const map = {
         });
       } else if (id === 6) {
         layerVisible = {
-          RealDrpLayer: false,
+          RealDrpLayer: true,
-          RealHDLayer: false,
+          RealHDLayer: true,
-          RealSkLayer: false,
+          RealSkLayer: true,
           BxSkLayer: true,
           FzdxLayer: false,
           WataLayer: false,

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: 'special', name: '特大暴雨站点', count: 0, color: 'blue1' },
-    { id: 'heavy', name: '大暴雨站点', count: 0, color: 'blue' },
+    { id: 'heavy', name: '大暴雨站点', count: 0, color: 'blue2' },
     { id: 'storm', name: '暴雨站点', count: 0, color: 'green' }
   ];
 
@@ -178,7 +187,10 @@ export default function Overall({ style }) {
             <TableBody>
               {stations.map((station) => (
                 <React.Fragment key={station.id}>
-                  <TableRow className={classes.stationRow}>
+                  <TableRow
+                    // className={classes.stationRow}
+                    className={`${classes.warningRow} ${station.color}`}
+                  >
                     <TableCell>
                       <Box display="flex" alignItems="center">
                         <IconButton

src/views/Home/panels/FzjcLayers/index.js

@@ -244,10 +244,10 @@ function FzjcLayers({ style }) {
         <FormControlLabel value="xz" control={<Radio />} label="行政村" />
       </RadioGroup>
     </StyledFormControl>
-            <CustomTextField
+            {/* <CustomTextField
             label="预案查询"
             style={{width:'150px'}}
-      onChange={(e) => console.log(e.target.value)}/>
+      onChange={(e) => console.log(e.target.value)}/> */}
         </div>
             {
         type == 'sh' ?

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: {

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 (
     <PanelBox
       style={style}
@@ -216,7 +234,25 @@ export default function Overall({ style }) {
                       <Collapse in={expanded[row.type]} timeout="auto" unmountOnExit>
                         <Box className={classes.expandedContent}>
                           {/* 这里可以添加展开后显示的详细内容 */}
-                          <Typography>暂无详细信息</Typography>
+                          {/* <Typography>暂无详细信息</Typography> */}
+                          {
+                            row.type == 'immediate' ? zyData.map(item => (
+                              <TableRow>
+                                <TableCell style={{ width: '30%' }}><div
+                                  className="table-ellipsis cursor-pointer"
+                                >{item.adnm}</div></TableCell>
+                                <TableCell style={{ width: '40%' }}><div
+                                  className="table-ellipsis cursor-pointer"
+                                >{item.tm}</div></TableCell>
+                                <TableCell style={{ width: '30%' }}><div
+                                  className="table-ellipsis cursor-pointer"
+                                >{item.status}</div></TableCell>
+                              </TableRow>
+                            ))
+
+                              :
+                              <Typography>暂无详细信息</Typography>
+                          }
                         </Box>
                       </Collapse>
                     </TableCell>
@@ -229,15 +265,15 @@ export default function Overall({ style }) {
 
         <Box className={classes.statsSection}>
           <Typography variant="h6" className={classes.statsTitle}>
-            预警统计: 共 0 条
+            预警统计: 共 3 条
           </Typography>
           <Box className={classes.warningStats}>
             {warningData.map((stat) => (
               <Box key={stat.type} className={classes.statItem}>
                 <div style={{ display: 'flex' }}>
                   <div>
-                  <WarningIcon className={`${classes.warningIcon} ${stat.type}`} />
+                    <WarningIcon className={`${classes.warningIcon} ${stat.type}`} />
-                  <Typography>{stat.label}</Typography>
+                    <Typography>{stat.label}</Typography>
                   </div>
                   <Typography variant="h6" style={{ color: '#fff' }}>{stat.count}</Typography>
                 </div>

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: '420981001', name: '龙池桥街道',
-        { id: '420981003', name: '黄土岗镇',lgtd:115.07167872,lttd:31.37496863,count:2 },
+          children: [{ id: '4209810011', name: '园林社区居民委员会山洪灾害防御预案', lgtd: 115.02073188, lttd: 31.18672346 },
-        { id: '420981004', name: '宋埠镇',lgtd:114.8003577,lttd:31.07316308,count:2 },
+            { id: '4209810012', name: '城西社区居民委员会山洪灾害防御预案', lgtd: 115.02073188, lttd: 31.18672346 }
-        { id: '420981005', name: '南湖街道',lgtd:114.99464754,lttd:31.16857964,count:2},
+          ]
+         },
+        {
+          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({
     <Box className={classes.labelRoot}>
       <FolderIcon className={classes.labelIcon} />
       <Box className={classes.labelText}>{nodes.name}</Box>
-          <Box className={classes.numberText}>{!nodes.children ? `(${nodes.count})`:''}</Box>
+          {/* <Box className={classes.numberText}>{!nodes.children ? `(${nodes.count})`:''}</Box> */}
     </Box>
     );
     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])}
       </TreeView>
-        <div style={{ color: "#fff",marginBottom:20}}>预案列表</div>
+        {/* <div style={{ color: "#fff",marginBottom:20}}>预案列表</div>
          <TableContainer style={{ height: '100%' }}>
         <Table size="small" stickyHeader>
           <TableHead>
             <TableRow>
               <DpTableCell style={{ width: '100%' }} align="left">预案名称</DpTableCell>
-              {/* <DpTableCell align="right">警戒水位</DpTableCell> */}
             </TableRow>
           </TableHead>
           <TableBody>
@@ -198,7 +234,7 @@ const useStyles = makeStyles({
             ))}
           </TableBody>
         </Table>
-      </TableContainer>
+      </TableContainer> */}
       </div>
     </PanelBox>
   )

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 (
     <PanelBox
       style={style}
@@ -119,7 +192,7 @@ export default function Overall({ style }) {
       color="green"
     >
       <Box className={classes.root}>
-        <Box className={classes.typeSection}>
+        {/* <Box className={classes.typeSection}>
           <Typography component="span">类型：</Typography>
           <FormControlLabel
             control={<Checkbox checked={types.water} onChange={handleTypeChange} name="water" />}
@@ -129,23 +202,24 @@ export default function Overall({ style }) {
             control={<Checkbox checked={types.reservoir} onChange={handleTypeChange} name="reservoir" />}
             label="水库"
           />
-        </Box>
+        </Box> */}
-  
+
 
         <TableContainer>
           <Table className={classes.table}>
             <TableHead>
               <TableRow>
-                <TableCell style={{ width: '50%' }}>站名</TableCell>
+                <TableCell style={{ width: '40%' }}>站名</TableCell>
-                <TableCell style={{ width: '20%' }}>水位(mm)</TableCell>
+                <TableCell style={{ width: '14%' }}>水位(mm)</TableCell>
                 <TableCell style={{ width: '15%' }}>所属政区</TableCell>
                 <TableCell style={{ width: '15%' }}>所属流域</TableCell>
+                <TableCell style={{ width: '16%' }}>预案</TableCell>
               </TableRow>
             </TableHead>
             <TableBody>
               {stations.map((station) => (
                 <React.Fragment key={station.id}>
-                  <TableRow className={classes.stationRow}>
+                  <TableRow className={`${classes.warningRow} ${station.color}`}>
                     <TableCell>
                       <Box display="flex" alignItems="center">
                         <IconButton
@@ -161,18 +235,32 @@ export default function Overall({ style }) {
                     <TableCell></TableCell>
                     <TableCell></TableCell>
                     <TableCell></TableCell>
+                    <TableCell></TableCell>
                   </TableRow>
                   <TableRow>
-                    <TableCell colSpan={4} style={{ padding: 0 }}>
+                    <TableCell colSpan={5} style={{ padding: 0 }}>
                       <Collapse in={expanded[station.id]} timeout="auto" unmountOnExit>
                         <Box className={`${classes.expandedRow} ${station.color}`}>
                           {/* 展开的详细内容可以在这里添加 */}
-                          {/* <TableRow>
+                          {
-                            <TableCell style={{ width: '25%' }}>站名</TableCell>
+                            station.id == "cxx" && <TableRow onClick={() => flyTo()}>
-                            <TableCell style={{ width: '20%' }}>水位(m)</TableCell>
+                              <TableCell style={{ width: '20%' }}><div
-                            <TableCell style={{ width: '25%' }}>所属政区</TableCell>
+                                className="table-ellipsis cursor-pointer"
-                            <TableCell style={{ width: '30%' }}>所属流域</TableCell>
+                              >永红水库</div></TableCell>
-                          </TableRow> */}
+                              <TableCell style={{ width: '20%' }}>119.15(0.24)</TableCell>
+                              <TableCell style={{ width: '20%' }}><div
+                                className="table-ellipsis cursor-pointer"
+                              >阎家河镇</div></TableCell>
+                              <TableCell style={{ width: '20%' }}>阎家河</TableCell>
+                              <TableCell style={{ width: '20%' }}><a
+                                className="table-ellipsis cursor-pointer"
+                                onClick={() => {
+                                dispatch?.runtime.setInfoDlg({ layerId: 'PdfLayer', properties: {planName:'麻城市山洪灾害防御预案'} })
+                                }}
+                              >麻城市山洪灾害防御预案</a></TableCell>
+                            </TableRow>
+                          }
+
                         </Box>
                       </Collapse>
                     </TableCell>