lishenfeng
/
mcfxkh-Web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(): 预案修改

lsf-dev
李神峰 2025-06-03 11:01:04 +08:00
parent 94174b1097
commit b19c5a1558
2 changed files with 454 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/views/Home/components/ActionDock/index.js
View File

@ -12,7 +12,7 @@ const VIEWS = [
{ id: 1, title: '实时数据', img: '/assets/menu/实时数据.png' },
{ id: 6, title: '水库调度', img: '/assets/menu/病险水库.png' },
{ id: 2, title: '水利设施', img: '/assets/menu/水利设施.png' },
{ id: 3, title: '辅助决策', img: '/assets/menu/辅助决策.png' },
{ id: 3, title: '预案', img: '/assets/menu/辅助决策.png' },
{ id: 4, title: '降雨中心', img: '/assets/menu/预警分析.png' },
{ id: 5, title: '天气预报', img: '/assets/menu/降雨中心.png' },
]

459
src/views/Home/panels/FzjcLayers/index.js
View File

@ -1,18 +1,47 @@
import React from 'react';
import React,{useState} from 'react';
import PanelBox from '../../components/PanelBox';
import { useDispatch, useSelector } from 'react-redux';
import { getLayerVisible } from '../../../../models/map/selectors';
import RowItem from './RowItem';
import { makeStyles } from '@material-ui/core';
import Table from '@material-ui/core/Table';
import TableContainer from '@material-ui/core/TableContainer';
import TableBody from '@material-ui/core/TableBody';
import TableHead from '@material-ui/core/TableHead';
import TableRow from '@material-ui/core/TableRow';
import DpTableCell from '../../../../layouts/mui/DpTableCell';
import DpTableRow from '../../../../layouts/mui/DpTableRow';
import { Button, Checkbox, FormControl, FormControlLabel, FormGroup, FormLabel, InputLabel, makeStyles, MenuItem, Radio, RadioGroup, Select, TextField } from '@material-ui/core';
import { styled } from '@material-ui/styles';
import clsx from 'clsx'
const useStyles = makeStyles({
root: {
padding: '0.5rem',
}
});
const StyledFormControl = styled(FormControl)({
'& .MuiFormLabel-root': {
color: 'rgba(255, 255, 255, 0.7)',
'&.Mui-focused': {
color: '#1976d2'
}
},
'& .MuiRadio-root': {
color: 'rgba(255, 255, 255, 0.7)',
'&.Mui-checked': {
color: '#1976d2'
}
},
'& .MuiFormControlLabel-label': {
color: '#fff'
}
});
function FzjcLayers({ style }) {
const [value, setValue] = useState('');
const handleChange = (event) => {
setValue(event.target.value);
};
const classes = useStyles();
const layerVisible = useSelector(getLayerVisible);
@ -28,13 +57,355 @@ function FzjcLayers({ style }) {
dispath.fzjcview.setListType(type);
}
const shData =[
{
"id": 125973,
"reviewStatus": "2",
"createTime": "2025-05-03 21:25:23",
"updateId": "187",
"updateName": "麻城市",
"updateTime": "2025-05-15 16:09:53",
"del": "0",
"planId": "421181000000000",
"planName": "麻城市山洪灾害防御预案",
"levels": "2",
"year": "2025",
"adnm": "麻城市",
"adcd": "421181000000000",
"attachUpdateTime": "2025-05-15 16:09:53",
"status": 0,
"uploadAttachStatus": "1",
"padNm": "421181000000000",
"url": "dplan/2025/421181000000000/麻城市山洪灾害防御预案.pdf"
},
{
"id": 125974,
"reviewStatus": "2",
"createTime": "2025-05-03 21:25:23",
"updateId": "187",
"updateName": "麻城市",
"updateTime": "2025-05-29 11:23:16",
"del": "0",
"planId": "421181001000000",
"planName": "龙池桥街道山洪灾害防御预案",
"levels": "1",
"year": "2025",
"adnm": "龙池桥街道",
"adcd": "421181001000000",
"attachUpdateTime": "2025-05-29 11:23:16",
"status": 0,
"uploadAttachStatus": "1",
"padNm": "421181001000000",
"url": "dplan/2025/421181001000000/龙池桥街道山洪灾害防御预案.pdf"
},
{
"id": 125975,
"reviewStatus": "2",
"createTime": "2025-05-03 21:25:23",
"updateId": "187",
"updateName": "麻城市",
"updateTime": "2025-05-29 11:39:39",
"del": "0",
"planId": "421181001001000",
"planName": "园林社区居民委员会山洪灾害防御预案",
"levels": "0",
"year": "2025",
"adnm": "园林社区居民委员会",
"adcd": "421181001001000",
"attachUpdateTime": "2025-05-29 11:39:39",
"status": 0,
"uploadAttachStatus": "1",
"padNm": "421181001001000",
"url": "dplan/2025/421181001001000/园林社区居民委员会山洪灾害防御预案.pdf"
},
{
"id": 125976,
"reviewStatus": "2",
"createTime": "2025-05-03 21:25:23",
"updateTime": "2025-05-14 09:53:14",
"del": "0",
"planId": "421181001001000",
"planName": "园林社区居民委员会一页纸预案",
"levels": "6",
"year": "2025",
"adnm": "园林社区居民委员会",
"adcd": "421181001001000",
"status": 0,
"uploadAttachStatus": "0",
"padNm": "421181001001000",
"url": "dplan/2025/421181001001000/园林社区居民委员会一页纸预案.pdf"
},
{
"id": 125977,
"reviewStatus": "2",
"createTime": "2025-05-03 21:25:23",
"updateId": "187",
"updateName": "麻城市",
"updateTime": "2025-05-29 11:40:08",
"del": "0",
"planId": "421181001002000",
"planName": "城西社区居民委员会山洪灾害防御预案",
"levels": "0",
"year": "2025",
"adnm": "城西社区居民委员会",
"adcd": "421181001002000",
"attachUpdateTime": "2025-05-29 11:40:08",
"status": 0,
"uploadAttachStatus": "1",
"padNm": "421181001002000",
"url": "dplan/2025/421181001002000/城西社区居民委员会山洪灾害防御预案.pdf"
},
{
"id": 125978,
"reviewStatus": "2",
"createTime": "2025-05-03 21:25:24",
"updateTime": "2025-05-14 09:53:14",
"del": "0",
"planId": "421181001002000",
"planName": "城西社区居民委员会一页纸预案",
"levels": "6",
"year": "2025",
"adnm": "城西社区居民委员会",
"adcd": "421181001002000",
"status": 0,
"uploadAttachStatus": "0",
"padNm": "421181001002000",
"url": "dplan/2025/421181001002000/城西社区居民委员会一页纸预案.pdf"
},
{
"id": 125979,
"reviewStatus": "2",
"createTime": "2025-05-03 21:25:24",
"updateId": "187",
"updateName": "麻城市",
"updateTime": "2025-05-29 11:40:34",
"del": "0",
"planId": "421181001007000",
"planName": "黄狮岗社区居民委员会山洪灾害防御预案",
"levels": "0",
"year": "2025",
"adnm": "黄狮岗社区居民委员会",
"adcd": "421181001007000",
"attachUpdateTime": "2025-05-29 11:40:34",
"status": 0,
"uploadAttachStatus": "1",
"padNm": "421181001007000",
"url": "dplan/2025/421181001007000/黄狮岗社区居民委员会山洪灾害防御预案.pdf"
},
{
"id": 125980,
"reviewStatus": "2",
"createTime": "2025-05-03 21:25:24",
"updateTime": "2025-05-14 09:53:14",
"del": "0",
"planId": "421181001007000",
"planName": "黄狮岗社区居民委员会一页纸预案",
"levels": "6",
"year": "2025",
"adnm": "黄狮岗社区居民委员会",
"adcd": "421181001007000",
"status": 0,
"uploadAttachStatus": "0",
"padNm": "421181001007000",
"url": "dplan/2025/421181001007000/黄狮岗社区居民委员会一页纸预案.pdf"
},
{
"id": 125981,
"reviewStatus": "2",
"createTime": "2025-05-03 21:25:24",
"updateId": "187",
"updateName": "麻城市",
"updateTime": "2025-05-29 11:40:50",
"del": "0",
"planId": "421181001008000",
"planName": "宋家河社区居民委员会山洪灾害防御预案",
"levels": "0",
"year": "2025",
"adnm": "宋家河社区居民委员会",
"adcd": "421181001008000",
"attachUpdateTime": "2025-05-29 11:40:49",
"status": 0,
"uploadAttachStatus": "1",
"padNm": "421181001008000",
"url": "dplan/2025/421181001008000/宋家河社区居民委员会山洪灾害防御预案.pdf"
},
{
"id": 125982,
"reviewStatus": "2",
"createTime": "2025-05-03 21:25:24",
"updateTime": "2025-05-14 09:53:14",
"del": "0",
"planId": "421181001008000",
"planName": "宋家河社区居民委员会一页纸预案",
"levels": "6",
"year": "2025",
"adnm": "宋家河社区居民委员会",
"adcd": "421181001008000",
"status": 0,
"uploadAttachStatus": "0",
"padNm": "421181001008000",
"url": "dplan/2025/421181001008000/宋家河社区居民委员会一页纸预案.pdf"
},
{
"id": 125983,
"reviewStatus": "2",
"createTime": "2025-05-03 21:25:24",
"updateId": "187",
"updateName": "麻城市",
"updateTime": "2025-05-29 11:41:03",
"del": "0",
"planId": "421181001010000",
"planName": "松鹤社区居民委员会山洪灾害防御预案",
"levels": "0",
"year": "2025",
"adnm": "松鹤社区居民委员会",
"adcd": "421181001010000",
"attachUpdateTime": "2025-05-29 11:41:02",
"status": 0,
"uploadAttachStatus": "1",
"padNm": "421181001010000",
"url": "dplan/2025/421181001010000/松鹤社区居民委员会山洪灾害防御预案.pdf"
},
{
"id": 125984,
"reviewStatus": "2",
"createTime": "2025-05-03 21:25:24",
"updateTime": "2025-05-14 09:53:14",
"del": "0",
"planId": "421181001010000",
"planName": "松鹤社区居民委员会一页纸预案",
"levels": "6",
"year": "2025",
"adnm": "松鹤社区居民委员会",
"adcd": "421181001010000",
"status": 0,
"uploadAttachStatus": "0",
"padNm": "421181001010000",
"url": "dplan/2025/421181001010000/松鹤社区居民委员会一页纸预案.pdf"
},
{
"id": 125985,
"reviewStatus": "2",
"createTime": "2025-05-03 21:25:24",
"updateId": "187",
"updateName": "麻城市",
"updateTime": "2025-05-29 11:41:21",
"del": "0",
"planId": "421181001011000",
"planName": "龙池桥社区居民委员会山洪灾害防御预案",
"levels": "0",
"year": "2025",
"adnm": "龙池桥社区居民委员会",
"adcd": "421181001011000",
"attachUpdateTime": "2025-05-29 11:41:20",
"status": 0,
"uploadAttachStatus": "1",
"padNm": "421181001011000",
"url": "dplan/2025/421181001011000/龙池桥社区居民委员会山洪灾害防御预案.pdf"
},
{
"id": 125986,
"reviewStatus": "2",
"createTime": "2025-05-03 21:25:24",
"updateTime": "2025-05-14 09:53:14",
"del": "0",
"planId": "421181001011000",
"planName": "龙池桥社区居民委员会一页纸预案",
"levels": "6",
"year": "2025",
"adnm": "龙池桥社区居民委员会",
"adcd": "421181001011000",
"status": 0,
"uploadAttachStatus": "0",
"padNm": "421181001011000",
"url": "dplan/2025/421181001011000/龙池桥社区居民委员会一页纸预案.pdf"
},
{
"id": 125987,
"reviewStatus": "2",
"createTime": "2025-05-03 21:25:24",
"updateId": "187",
"updateName": "麻城市",
"updateTime": "2025-05-29 11:41:34",
"del": "0",
"planId": "421181001204000",
"planName": "七里桥村村民委员会山洪灾害防御预案",
"levels": "0",
"year": "2025",
"adnm": "七里桥村村民委员会",
"adcd": "421181001204000",
"attachUpdateTime": "2025-05-29 11:41:33",
"status": 0,
"uploadAttachStatus": "1",
"padNm": "421181001204000",
"url": "dplan/2025/421181001204000/七里桥村村民委员会山洪灾害防御预案.pdf"
}
]
const dispatch = useDispatch();
const zt = {
0: '村', 1: '乡镇', 2: '区县', 3: '市', 4: '省'
}
const [type, setType] = useState('sh')
const toggleStType = (type) => {
// if (type == 'sz') {
// dispatch.map.setLayerVisible({'ShuiZhaLayer':true})
// dispatch.map.setLayerVisible({'BzLayer':false})
// } else {
// dispatch.map.setLayerVisible({'ShuiZhaLayer':false})
// dispatch.map.setLayerVisible({'BzLayer':true})
// }
setType(type)
}
const flyTo = (row) => {
dispatch?.runtime.setInfoDlg({ layerId: 'PdfLayer', properties: row })
}
const StyledTextField = styled(TextField)({
'& .MuiOutlinedInput-root': {
'& fieldset': {
borderColor: 'rgba(255, 255, 255, 0.23)',
},
'&:hover fieldset': {
borderColor: 'rgba(255, 255, 255, 0.5)',
},
'&.Mui-focused fieldset': {
borderColor: '#1976d2',
},
},
'& .MuiInputLabel-root': {
color: 'rgba(255, 255, 255, 0.7)',
'&.Mui-focused': {
color: '#1976d2',
},
},
'& .MuiInputBase-input': {
color: '#fff',
},
});
const CustomTextField = (props) => {
return (
<StyledTextField
variant="outlined"
// fullWidth
{...props}
/>
);
};
return (
<PanelBox
style={style}
title="辅助决策图层"
title="预案列表"
color="orange"
tabs={
<span className="button-group">
<span className={clsx({ active: type == 'sh' })} onClick={() => toggleStType('sh')}>山洪</span>
<span className={clsx({ active: type == 'sk' })} onClick={() => toggleStType('sk')}>水库</span>
</span>
}
>
<div className={classes.root}>
{/* <div className={classes.root}>
<RowItem type="placement" layerVisible={layerVisible} layerVisibleChanged={layerVisibleChanged} showList={showList} />
<RowItem type="transfer" layerVisible={layerVisible} layerVisibleChanged={layerVisibleChanged} showList={showList} />
<RowItem type="bsnssinfo" layerVisible={layerVisible} layerVisibleChanged={layerVisibleChanged} showList={showList} />
@ -42,6 +413,82 @@ function FzjcLayers({ style }) {
<RowItem type="danad" layerVisible={layerVisible} layerVisibleChanged={layerVisibleChanged} showList={showList} />
<RowItem type="wata" name="分级流域" layerName="WataLayer" layerVisible={layerVisible} layerVisibleChanged={layerVisibleChanged} showList={showList} />
<RowItem type="fzdx" name="防灾对象" layerName="FzdxLayer" layerVisible={layerVisible} layerVisibleChanged={layerVisibleChanged} showList={showList} />
</div> */}
<div className={classes.root}>
<div style={{display:'flex',columnGap:10,alignItems:'center'}}>
<StyledFormControl>
<RadioGroup
row
value={value}
onChange={handleChange}
>
<FormControlLabel value="xian" control={<Radio />} label="县" />
<FormControlLabel value="zhen" control={<Radio />} label="镇" />
<FormControlLabel value="xz" control={<Radio />} label="行政村" />
</RadioGroup>
</StyledFormControl>
<CustomTextField
label="预案查询"
style={{width:'150px'}}
onChange={(e) => console.log(e.target.value)}/>
</div>
{
type == 'sh' ?
<TableContainer style={{ height: '100%' }}>
<Table size="small" stickyHeader>
<TableHead>
<TableRow>
<DpTableCell style={{ width: '50%' }} align="center">预案名称</DpTableCell>
<DpTableCell style={{ width: '20%' }} align="center">预案级别</DpTableCell>
<DpTableCell align="center" style={{ width: '30%' }}>更新时间</DpTableCell>
{/* <DpTableCell align="right">警戒水位</DpTableCell> */}
</TableRow>
</TableHead>
<TableBody>
{shData.map((row) => (
<DpTableRow key={row.id} onClick={() => flyTo(row,'sz')}>
<DpTableCell align="center">
<div
className="table-ellipsis cursor-pointer"
>{row.planName}</div>
</DpTableCell>
<DpTableCell align="center">
{zt[row.levels]}
</DpTableCell>
<DpTableCell align="center">{row.updateTime}</DpTableCell>
</DpTableRow>
))}
</TableBody>
</Table>
</TableContainer>
:
<TableContainer style={{ height: '100%' }}>
<Table size="small" stickyHeader>
<TableHead>
<TableRow>
<DpTableCell style={{ width: '60%' }} align="center">预案名称</DpTableCell>
<DpTableCell align="center" style={{ width: '30%' }}>更新时间</DpTableCell>
</TableRow>
</TableHead>
<TableBody>
{shData.map((row) => (
<DpTableRow key={row.id} onClick={() => flyTo(row,'bz')}>
<DpTableCell align="center">
<div
className="table-ellipsis cursor-pointer"
>{row.planName}</div>
</DpTableCell>
<DpTableCell align="center">
{row.pustType}
</DpTableCell>
<DpTableCell align="center">{row.irrCode_dictText}</DpTableCell>
</DpTableRow>
))}
</TableBody>
</Table>
</TableContainer>
}
</div>
</PanelBox>
)