Compare commits
7 Commits
ba62416e42
...
94174b1097
| Author | SHA1 | Date |
|---|---|---|
 秦子超
|
94174b1097 | |
 李神峰
|
8171460dd9 | |
|
李神峰
|
79c1ec568d | |
|
秦子超
|
d5e62e17c4 | |
|
李神峰
|
30b5d17673 | |
|
李神峰
|
80a6841322 | |
|
李神峰
|
6cb42396b3 |
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 618 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 25 KiB |
|
|
@ -350,7 +350,7 @@ const map = {
|
|||
Object.keys(DCPJ_TYPES).forEach(key => {
|
||||
layerVisible['Dcpj_' + key + 'Layer'] = false;
|
||||
});
|
||||
} else if (id === 303) {
|
||||
} else if (id === 303 || id === 305 || id === 306) {
|
||||
layerVisible = {
|
||||
RealDrpLayer: false,
|
||||
RealHDLayer: false,
|
||||
|
|
@ -448,6 +448,20 @@ const map = {
|
|||
map.setLayoutProperty('热力图', 'visibility', 'none');
|
||||
}
|
||||
|
||||
if (id === 306) {
|
||||
dispatch.map.setLayerSetting({ dom: false });
|
||||
map.setLayoutProperty('管网图', 'visibility', 'visible');
|
||||
} else {
|
||||
// dispatch.map.setLayerSetting({dom: true});
|
||||
map.setLayoutProperty('管网图', 'visibility', 'none');
|
||||
}
|
||||
if (id === 503 || id == 501 || id == 504 || id == 505 || id == 506 || id == 507) {
|
||||
dispatch.map.setLayerSetting({ dom: false });
|
||||
map.setLayoutProperty('灌区图', 'visibility', 'visible');
|
||||
} else {
|
||||
// dispatch.map.setLayerSetting({dom: true});
|
||||
map.setLayoutProperty('灌区图', 'visibility', 'none');
|
||||
}
|
||||
if (id != 504) {
|
||||
dispatch.runtime.setYyfa({})
|
||||
}
|
||||
|
|
|
|||
|
|
@ -110,9 +110,9 @@ export default function calcLayout(view, rightStack, hidePanels) {
|
|||
{ key: '设备故障统计',style: { height: '18rem'} },
|
||||
];
|
||||
}else if (view === 305) {
|
||||
left = [
|
||||
{ key: '供水量统计', style: { height: '30rem', flexGrow: 1 } },
|
||||
{ key: '取水量统计', style: { height: '40rem', flexGrow: 1 } },
|
||||
left = [
|
||||
{ key: '24h用水', style: { height: '50%', flexGrow: 1 } },
|
||||
{ key: '电耗统计', style: { height: '50%', flexGrow: 1 } },
|
||||
];
|
||||
leftFullHeight = true;
|
||||
}
|
||||
|
|
@ -126,9 +126,9 @@ export default function calcLayout(view, rightStack, hidePanels) {
|
|||
}
|
||||
else if (view === 307) {
|
||||
left = [
|
||||
{ key: '预案库管理', style: { height: '40rem', flexGrow: 1 } },
|
||||
{ key: '预案库管理', style: { height: '50rem' } },
|
||||
];
|
||||
leftFullHeight = true;
|
||||
// leftFullHeight = true;
|
||||
}else if (view === 501) {
|
||||
left = [
|
||||
{ key: '天气'},
|
||||
|
|
@ -162,13 +162,17 @@ export default function calcLayout(view, rightStack, hidePanels) {
|
|||
}else if (view === 506) {
|
||||
left = [
|
||||
{ key: '天气' },
|
||||
{ key: '水政统计', style: { height: '40%', flexGrow: 1 } },
|
||||
{ key: '水政统计', style: { height: '60%'} },
|
||||
]
|
||||
leftFullHeight = true;
|
||||
|
||||
}else if (view === 507) {
|
||||
left = [
|
||||
{ key: '天气'},
|
||||
{ key: '天气' },
|
||||
{ key: '信息总览', style: { height: '60%'} },
|
||||
]
|
||||
leftFullHeight = true;
|
||||
|
||||
}
|
||||
|
||||
if (rightEx) {
|
||||
|
|
@ -276,18 +280,25 @@ export default function calcLayout(view, rightStack, hidePanels) {
|
|||
{ key: '电耗分析', style: { height: '19rem', flexGrow: 1 } },
|
||||
{ key: '药耗分析', style: { height: '21rem', flexGrow: 1 } },
|
||||
];
|
||||
}else if (view === 305) {
|
||||
right = [
|
||||
{ key: '电耗统计', style: { height: '100%', flexGrow: 1 } },
|
||||
} else if (view === 305) {
|
||||
right = [
|
||||
{ key: '供水量统计', style: { height: '30rem', flexGrow: 1 } },
|
||||
{ key: '取水量统计', style: { height: '40rem', flexGrow: 1 } },
|
||||
];
|
||||
|
||||
rightFullHeight = true;
|
||||
}
|
||||
else if (view === 306) {
|
||||
right = [
|
||||
{ key: '漏损排行榜', style: { height: '50%', flexGrow: 1 } },
|
||||
{ key: '最小流量', style: { height: '50%', flexGrow: 1 } },
|
||||
{ key: '漏损排行榜', style: { height: '40%', flexGrow: 1 } },
|
||||
{ key: '最小流量', style: { height: '60%', flexGrow: 1 } },
|
||||
];
|
||||
rightFullHeight = true;
|
||||
}else if(view === 307) {
|
||||
right = [
|
||||
{ key: '应急指挥调度', style: { height: '40rem'} },
|
||||
];
|
||||
// rightFullHeight = true;
|
||||
}
|
||||
else if (view === 501) {
|
||||
right = [
|
||||
|
|
|
|||
|
|
@ -21,15 +21,15 @@ function HDStDlg({ record, onClose }) {
|
|||
BackdropComponent={DpBackgroundDrop}
|
||||
>
|
||||
<div className="boxhead"></div>
|
||||
<DialogContent style={{ padding: 0, width: '80rem', overflowX: 'hidden',height:'80rem' }}>
|
||||
<DialogContent style={{ padding: 0, width: '60rem', overflowX: 'hidden' }}>
|
||||
<DpAppBar position="sticky">
|
||||
<DpTabs value={value} indicatorColor="primary" onChange={(_, v) => setValue(v)}>
|
||||
<DpTab label="文件预览" />
|
||||
</DpTabs>
|
||||
<DpCloseButton onClick={onClose} />
|
||||
</DpAppBar>
|
||||
<iframe src={`${process.env.PUBLIC_URL}/assets/${record.planName}.pdf`} width="100%" height="100%"></iframe>
|
||||
|
||||
<img src='/assets/报警列表.jpg' style={{width:'100%', height:'33rem',marginTop:'0rem'}}/>
|
||||
</DialogContent>
|
||||
<div className="boxfoot"></div>
|
||||
</Dialog>
|
||||
|
|
|
|||
|
|
@ -17,12 +17,22 @@ function ScStPop({ record, dispatch, view }) {
|
|||
<>
|
||||
<div className="boxhead"></div>
|
||||
<div className="featuretip-title">
|
||||
<div className="name">{view===301?'基本信息':'生产指标总览'}</div>
|
||||
<div className="name">{view===303?'生产指标总览':'基本信息'}</div>
|
||||
{/* <div className="extra cursor-pointer" onClick={viewInfo}>详细</div> */}
|
||||
</div>
|
||||
<div style={{ width: '25rem' }} className='f_14'>
|
||||
{
|
||||
view==='301'?
|
||||
view===303?
|
||||
<Grid container>
|
||||
<Grid item className={classes.title}>今日供水总量:</Grid>
|
||||
<Grid item className={classes.value}>1293.21</Grid>
|
||||
<Grid item className={classes.title}>昨日供水总量:</Grid>
|
||||
<Grid item className={classes.value}>1038.53</Grid>
|
||||
<Grid item className={classes.title}>本月供水总量:</Grid>
|
||||
<Grid item className={classes.value}>37671.45</Grid>
|
||||
<Grid item className={classes.title}>上月供水总量:</Grid>
|
||||
<Grid item className={classes.value}>39201.86</Grid>
|
||||
</Grid>:
|
||||
<Grid container>
|
||||
<Grid item className={classes.title}>水厂名称:</Grid>
|
||||
<Grid item className={classes.value}>{record.stnm.replace("水库", "水厂")}</Grid>
|
||||
|
|
@ -38,17 +48,7 @@ function ScStPop({ record, dispatch, view }) {
|
|||
<Grid item className={classes.value}>15928192211</Grid>
|
||||
<Grid item className={classes.title}>行政村:</Grid>
|
||||
<Grid item className={classes.value}>凉桥村（974人）</Grid>
|
||||
</Grid>:
|
||||
<Grid container>
|
||||
<Grid item className={classes.title}>今日供水总量:</Grid>
|
||||
<Grid item className={classes.value}>1293.21</Grid>
|
||||
<Grid item className={classes.title}>昨日供水总量:</Grid>
|
||||
<Grid item className={classes.value}>1038.53</Grid>
|
||||
<Grid item className={classes.title}>本月供水总量:</Grid>
|
||||
<Grid item className={classes.value}>37671.45</Grid>
|
||||
<Grid item className={classes.title}>上月供水总量:</Grid>
|
||||
<Grid item className={classes.value}>39201.86</Grid>
|
||||
</Grid>
|
||||
</Grid>
|
||||
}
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -97,7 +97,9 @@ export const InfoPops = ({ type, properties, dispatch, view }) => {
|
|||
return <LlsbPop record={properties} dispatch={dispatch} />
|
||||
}else if (type === '监测站') {
|
||||
return <ScjcPop record={properties} dispatch={dispatch} />
|
||||
}else if (type === 'ScStPop') {
|
||||
}else if (type === 'shuichang' && view===306) {
|
||||
return <ScjcPop record={properties} dispatch={dispatch} />
|
||||
}else if (type === 'shuichang' && (view===301||303)) {
|
||||
return <ScStPop record={properties} dispatch={dispatch} view={view} />
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -20,6 +20,28 @@ export default {
|
|||
'paint': {
|
||||
'raster-opacity': 1,
|
||||
}
|
||||
},
|
||||
gqmap: {
|
||||
'id': '灌区图',
|
||||
'type': 'raster',
|
||||
'source': 'gqmapImg',
|
||||
'layout': {
|
||||
'visibility':'none'
|
||||
},
|
||||
'paint': {
|
||||
'raster-opacity': 1,
|
||||
}
|
||||
},
|
||||
gwmap: {
|
||||
'id': '管网图',
|
||||
'type': 'raster',
|
||||
'source': 'gwImg',
|
||||
'layout': {
|
||||
'visibility':'none'
|
||||
},
|
||||
'paint': {
|
||||
'raster-opacity': 1,
|
||||
}
|
||||
},
|
||||
water: {
|
||||
'id': '水系',
|
||||
|
|
|
|||
|
|
@ -123,6 +123,8 @@ class LayerMgr {
|
|||
layers: [
|
||||
base.background,
|
||||
base.heatmap,
|
||||
base.gwmap,
|
||||
base.gqmap,
|
||||
this.layerMap.TerrainLayer.getStyle(0),
|
||||
this.layerMap.TerrainLayer.getStyle(1),
|
||||
|
||||
|
|
|
|||
|
|
@ -44,326 +44,11 @@ const ShapeStyle = {
|
|||
};
|
||||
|
||||
const page1 = [
|
||||
{
|
||||
"stcd": "716164901",
|
||||
"type": "sk",
|
||||
"hasRz": true,
|
||||
"stnm": "界岭水库",
|
||||
"adcd": "421181107000",
|
||||
"wscd": null,
|
||||
"importancy": 0,
|
||||
"lgtd": 115.450833,
|
||||
"lttd": 31.302222,
|
||||
"elev": 0,
|
||||
"damel": 385.6,
|
||||
"dsflz": 384.01,
|
||||
"fsltdz": 382.84,
|
||||
"ddz": 370.4,
|
||||
"zcxsw": 382.84,
|
||||
"drpTm": "2025-04-11T05:00:00.000Z",
|
||||
"today": 0,
|
||||
"h1": 0,
|
||||
"h3": 0,
|
||||
"h6": 0,
|
||||
"h12": 0,
|
||||
"h24": 0,
|
||||
"h48": 0,
|
||||
"drpState": 2,
|
||||
"rz": 378.57,
|
||||
"w": 0.77,
|
||||
"a_fsltdz": -4.269999999999982,
|
||||
"rzTm": "2025-04-11T05:00:00.000Z",
|
||||
"rzWarning": 0,
|
||||
"rzState": 2,
|
||||
"pic": [
|
||||
{
|
||||
"stcd": "716164901",
|
||||
"tm": "2023-03-12T07:03:00.000Z",
|
||||
"url": "http://223.75.53.106:8891/skjgimages/2023/0312/716164901/20230312150300.jpg"
|
||||
},
|
||||
{
|
||||
"stcd": "716164901",
|
||||
"tm": "2023-03-12T07:16:00.000Z",
|
||||
"url": "http://223.75.53.106:8891/skjgimages/2023/0312/716164902/20230312151600.jpg"
|
||||
}
|
||||
],
|
||||
"aRz": -4.27
|
||||
},
|
||||
{
|
||||
"stcd": "716165051",
|
||||
"type": "sk",
|
||||
"hasRz": true,
|
||||
"stnm": "蛤蟆石水库",
|
||||
"adcd": "421181107000",
|
||||
"wscd": null,
|
||||
"importancy": 0,
|
||||
"lgtd": 115.452778,
|
||||
"lttd": 31.258056,
|
||||
"elev": 0,
|
||||
"damel": 189.9,
|
||||
"dsflz": 187,
|
||||
"fsltdz": 184.52,
|
||||
"ddz": 174.9,
|
||||
"zcxsw": 184.52,
|
||||
"drpTm": "2025-04-11T05:00:00.000Z",
|
||||
"today": 0,
|
||||
"h1": 0,
|
||||
"h3": 0,
|
||||
"h6": 0,
|
||||
"h12": 0,
|
||||
"h24": 0,
|
||||
"h48": 0,
|
||||
"drpState": 2,
|
||||
"rz": 181.33,
|
||||
"w": 0.657,
|
||||
"a_fsltdz": -3.1899999999999977,
|
||||
"rzTm": "2025-04-11T05:00:00.000Z",
|
||||
"rzWarning": 0,
|
||||
"rzState": 2,
|
||||
"pic": [
|
||||
{
|
||||
"stcd": "716165051",
|
||||
"tm": "2023-03-12T07:21:00.000Z",
|
||||
"url": "http://223.75.53.106:8891/skjgimages/2023/0312/716165051/20230312152100.jpg"
|
||||
},
|
||||
{
|
||||
"stcd": "716165051",
|
||||
"tm": "2023-03-12T07:16:00.000Z",
|
||||
"url": "http://223.75.53.106:8891/skjgimages/2023/0312/716165052/20230312151600.jpg"
|
||||
}
|
||||
],
|
||||
"aRz": -3.19
|
||||
},
|
||||
{
|
||||
"stcd": "716165101",
|
||||
"type": "sk",
|
||||
"hasRz": true,
|
||||
"stnm": "游家冲水库",
|
||||
"adcd": "421181107000",
|
||||
"wscd": null,
|
||||
"importancy": 0,
|
||||
"lgtd": 115.295556,
|
||||
"lttd": 31.202778,
|
||||
"elev": 0,
|
||||
"damel": 476.62,
|
||||
"dsflz": 475.08,
|
||||
"fsltdz": 473.2,
|
||||
"ddz": 456.8,
|
||||
"zcxsw": 473.2,
|
||||
"drpTm": "2025-04-11T06:00:00.000Z",
|
||||
"today": 0,
|
||||
"h1": 0,
|
||||
"h3": 0,
|
||||
"h6": 0,
|
||||
"h12": 0,
|
||||
"h24": 0,
|
||||
"h48": 0,
|
||||
"drpState": 2,
|
||||
"rz": 464.51,
|
||||
"w": 0.668,
|
||||
"a_fsltdz": -8.689999999999998,
|
||||
"rzTm": "2025-04-11T06:00:00.000Z",
|
||||
"rzWarning": 0,
|
||||
"rzState": 2,
|
||||
"pic": [
|
||||
{
|
||||
"stcd": "716165101",
|
||||
"tm": "2023-03-12T07:03:00.000Z",
|
||||
"url": "http://223.75.53.106:8891/skjgimages/2023/0312/716165101/20230312150300.jpg"
|
||||
},
|
||||
{
|
||||
"stcd": "716165101",
|
||||
"tm": "2023-03-12T07:20:00.000Z",
|
||||
"url": "http://223.75.53.106:8891/skjgimages/2023/0312/716165102/20230312152000.jpg"
|
||||
}
|
||||
],
|
||||
"aRz": -8.69
|
||||
},
|
||||
{
|
||||
"stcd": "716167061",
|
||||
"type": "sk",
|
||||
"hasRz": true,
|
||||
"stnm": "花桥水库",
|
||||
"adcd": "421181107000",
|
||||
"wscd": null,
|
||||
"importancy": 0,
|
||||
"lgtd": 115.444444,
|
||||
"lttd": 31.274444,
|
||||
"elev": 0,
|
||||
"damel": 18,
|
||||
"dsflz": 14.58,
|
||||
"fsltdz": 269.4,
|
||||
"ddz": 4.5,
|
||||
"zcxsw": 269.4,
|
||||
"drpTm": "2025-03-22T08:00:00.000Z",
|
||||
"today": 0,
|
||||
"h1": 0,
|
||||
"h3": 0,
|
||||
"h6": 0,
|
||||
"h12": 0,
|
||||
"h24": 0,
|
||||
"h48": 0,
|
||||
"drpState": 2,
|
||||
"rz": 265.86,
|
||||
"w": 0.31,
|
||||
"a_fsltdz": -3.5399999999999636,
|
||||
"rzTm": "2025-03-22T08:00:00.000Z",
|
||||
"rzWarning": 0,
|
||||
"rzState": 2,
|
||||
"pic": [
|
||||
{
|
||||
"stcd": "716167061",
|
||||
"tm": "2025-03-06T04:13:00.000Z",
|
||||
"url": "http://223.75.53.106:8891/skjgimages/2025/0306/716167061/20250306121300.jpg"
|
||||
},
|
||||
{
|
||||
"stcd": "716167061",
|
||||
"tm": "2025-03-06T04:14:00.000Z",
|
||||
"url": "http://223.75.53.106:8891/skjgimages/2025/0306/716167062/20250306121400.jpg"
|
||||
}
|
||||
],
|
||||
"aRz": -3.54
|
||||
},
|
||||
{
|
||||
"stcd": "716130461",
|
||||
"type": "sk",
|
||||
"hasRz": true,
|
||||
"stnm": "垅下水库",
|
||||
"adcd": "421181107000",
|
||||
"wscd": null,
|
||||
"importancy": 0,
|
||||
"lgtd": 115.364722,
|
||||
"lttd": 31.218056,
|
||||
"elev": 0,
|
||||
"damel": 24.1,
|
||||
"dsflz": 22.69,
|
||||
"fsltdz": 303.2,
|
||||
"ddz": 7.4,
|
||||
"zcxsw": 303.2,
|
||||
"drpTm": "2025-04-11T05:00:00.000Z",
|
||||
"today": 0,
|
||||
"h1": 0,
|
||||
"h3": 0,
|
||||
"h6": 0,
|
||||
"h12": 0,
|
||||
"h24": 0,
|
||||
"h48": 0,
|
||||
"drpState": 2,
|
||||
"rz": 302.02,
|
||||
"w": 0.212,
|
||||
"a_fsltdz": -1.1800000000000068,
|
||||
"rzTm": "2025-04-11T05:00:00.000Z",
|
||||
"rzWarning": 0,
|
||||
"rzState": 2,
|
||||
"pic": [
|
||||
{
|
||||
"stcd": "716130461",
|
||||
"tm": "2023-03-12T07:03:00.000Z",
|
||||
"url": "http://223.75.53.106:8891/skjgimages/2023/0312/716130461/20230312150300.jpg"
|
||||
},
|
||||
{
|
||||
"stcd": "716130461",
|
||||
"tm": "2023-03-12T07:11:00.000Z",
|
||||
"url": "http://223.75.53.106:8891/skjgimages/2023/0312/716130462/20230312151100.jpg"
|
||||
}
|
||||
],
|
||||
"aRz": -1.18
|
||||
},
|
||||
{
|
||||
"stcd": "716124861",
|
||||
"type": "sk",
|
||||
"hasRz": true,
|
||||
"stnm": "鲤鱼河水库",
|
||||
"adcd": "421181003000",
|
||||
"wscd": null,
|
||||
"importancy": 0,
|
||||
"lgtd": 114.968056,
|
||||
"lttd": 31.204722,
|
||||
"elev": 0,
|
||||
"damel": 81.1,
|
||||
"dsflz": 79.02,
|
||||
"fsltdz": 78.4,
|
||||
"ddz": 71.4,
|
||||
"zcxsw": 78.4,
|
||||
"drpTm": "2025-04-11T05:00:00.000Z",
|
||||
"today": 0,
|
||||
"h1": 0,
|
||||
"h3": 0,
|
||||
"h6": 0,
|
||||
"h12": 0,
|
||||
"h24": 0,
|
||||
"h48": 0,
|
||||
"drpState": 2,
|
||||
"rz": 75.79,
|
||||
"w": 0.3,
|
||||
"a_fsltdz": -2.6099999999999994,
|
||||
"rzTm": "2025-04-11T05:00:00.000Z",
|
||||
"rzWarning": 0,
|
||||
"rzState": 2,
|
||||
"pic": [
|
||||
{
|
||||
"stcd": "716124861",
|
||||
"tm": "2023-03-12T07:02:07.000Z",
|
||||
"url": "http://223.75.53.106:8891/skjgimages/2023/0312/716124861/20230312150207.jpg"
|
||||
},
|
||||
{
|
||||
"stcd": "716124861",
|
||||
"tm": "2023-03-12T07:03:44.000Z",
|
||||
"url": "http://223.75.53.106:8891/skjgimages/2023/0312/716124862/20230312150344.jpg"
|
||||
}
|
||||
],
|
||||
"aRz": -2.61
|
||||
},
|
||||
{
|
||||
"stcd": "716112801",
|
||||
"type": "sk",
|
||||
"hasRz": true,
|
||||
"stnm": "黑龙潭水库",
|
||||
"adcd": "421181113000",
|
||||
"wscd": null,
|
||||
"importancy": 0,
|
||||
"lgtd": 114.846944,
|
||||
"lttd": 31.441944,
|
||||
"elev": 0,
|
||||
"damel": 135.91,
|
||||
"dsflz": 134.31,
|
||||
"fsltdz": 132.3,
|
||||
"ddz": 119.6,
|
||||
"zcxsw": 132.3,
|
||||
"drpTm": "2025-04-11T06:00:00.000Z",
|
||||
"today": 0,
|
||||
"h1": 0,
|
||||
"h3": 0,
|
||||
"h6": 0,
|
||||
"h12": 0,
|
||||
"h24": 0,
|
||||
"h48": 0,
|
||||
"drpState": 2,
|
||||
"rz": 125.17,
|
||||
"w": 1.092,
|
||||
"a_fsltdz": -7.13000000000001,
|
||||
"rzTm": "2025-04-11T06:00:00.000Z",
|
||||
"rzWarning": 0,
|
||||
"rzState": 2,
|
||||
"pic": [
|
||||
{
|
||||
"stcd": "716112801",
|
||||
"tm": "2023-11-03T05:05:00.000Z",
|
||||
"url": "http://223.75.53.106:8891/skjgimages/2023/1103/716112801/20231103130500.jpg"
|
||||
},
|
||||
{
|
||||
"stcd": "716112801",
|
||||
"tm": "2023-11-03T05:12:00.000Z",
|
||||
"url": "http://223.75.53.106:8891/skjgimages/2023/1103/716112802/20231103131200.jpg"
|
||||
}
|
||||
],
|
||||
"aRz": -7.13
|
||||
},
|
||||
{
|
||||
"stcd": "716113001",
|
||||
"type": "sk",
|
||||
"hasRz": true,
|
||||
"stnm": "朝阳水库",
|
||||
"stnm": "监测点9",
|
||||
"adcd": "421181113000",
|
||||
"wscd": null,
|
||||
"importancy": 0,
|
||||
|
|
@ -405,361 +90,13 @@ const page1 = [
|
|||
"aRz": -94.17
|
||||
},
|
||||
|
||||
{
|
||||
"stcd": "716121901",
|
||||
"type": "sk",
|
||||
"hasRz": true,
|
||||
"stnm": "地畈水库",
|
||||
"adcd": "421181113000",
|
||||
"wscd": null,
|
||||
"importancy": 0,
|
||||
"lgtd": 114.883056,
|
||||
"lttd": 31.417778,
|
||||
"elev": 0,
|
||||
"damel": 106.4,
|
||||
"dsflz": 105.82,
|
||||
"fsltdz": 105.09,
|
||||
"ddz": 98.19,
|
||||
"zcxsw": 105.09,
|
||||
"drpTm": "2025-04-11T06:00:00.000Z",
|
||||
"today": 0,
|
||||
"h1": 0,
|
||||
"h3": 0,
|
||||
"h6": 0,
|
||||
"h12": 0,
|
||||
"h24": 0,
|
||||
"h48": 0,
|
||||
"drpState": 2,
|
||||
"rz": 100.22,
|
||||
"w": 0.036,
|
||||
"a_fsltdz": -4.8700000000000045,
|
||||
"rzTm": "2025-04-11T06:00:00.000Z",
|
||||
"rzWarning": 0,
|
||||
"rzState": 2,
|
||||
"pic": [
|
||||
{
|
||||
"stcd": "716121901",
|
||||
"tm": "2023-11-13T05:01:00.000Z",
|
||||
"url": "http://223.75.53.106:8891/skjgimages/2023/1113/716121901/20231113130100.jpg"
|
||||
},
|
||||
{
|
||||
"stcd": "716121901",
|
||||
"tm": "2023-11-13T05:04:00.000Z",
|
||||
"url": "http://223.75.53.106:8891/skjgimages/2023/1113/716121902/20231113130400.jpg"
|
||||
}
|
||||
],
|
||||
"aRz": -4.87
|
||||
},
|
||||
{
|
||||
"stcd": "716123561",
|
||||
"type": "sk",
|
||||
"hasRz": true,
|
||||
"stnm": "大松树水库",
|
||||
"adcd": "421181113000",
|
||||
"wscd": null,
|
||||
"importancy": 0,
|
||||
"lgtd": 114.791389,
|
||||
"lttd": 31.236944,
|
||||
"elev": 0,
|
||||
"damel": 10.54,
|
||||
"dsflz": 9.12,
|
||||
"fsltdz": 78.7,
|
||||
"ddz": 6,
|
||||
"zcxsw": 78.7,
|
||||
"drpTm": "2025-04-11T06:00:00.000Z",
|
||||
"today": 0,
|
||||
"h1": 0,
|
||||
"h3": 0,
|
||||
"h6": 0,
|
||||
"h12": 0,
|
||||
"h24": 0,
|
||||
"h48": 0,
|
||||
"drpState": 2,
|
||||
"rz": 76.51,
|
||||
"w": 0.121,
|
||||
"a_fsltdz": -2.1899999999999977,
|
||||
"rzTm": "2025-04-11T06:00:00.000Z",
|
||||
"rzWarning": 0,
|
||||
"rzState": 2,
|
||||
"pic": [
|
||||
{
|
||||
"stcd": "716123561",
|
||||
"tm": "2023-11-14T06:04:00.000Z",
|
||||
"url": "http://223.75.53.106:8891/skjgimages/2023/1114/716123561/20231114140400.jpg"
|
||||
},
|
||||
{
|
||||
"stcd": "716123561",
|
||||
"tm": "2023-10-23T07:41:00.000Z",
|
||||
"url": "http://223.75.53.106:8891/skjgimages/2023/1023/716123562/20231023154100.jpg"
|
||||
}
|
||||
],
|
||||
"aRz": -2.19
|
||||
},
|
||||
{
|
||||
"stcd": "61612580",
|
||||
"type": "sk",
|
||||
"hasRz": true,
|
||||
"stnm": "芭茅河水库",
|
||||
"adcd": "421181110000",
|
||||
"wscd": null,
|
||||
"importancy": 0,
|
||||
"lgtd": 115.101389,
|
||||
"lttd": 31.307778,
|
||||
"elev": 0,
|
||||
"damel": 127.8,
|
||||
"dsflz": 125.57,
|
||||
"fsltdz": 122.44,
|
||||
"ddz": 106.94,
|
||||
"zcxsw": 122.44,
|
||||
"drpTm": "2025-05-28T06:00:00.000Z",
|
||||
"today": 8.5,
|
||||
"h1": 8.5,
|
||||
"h3": 8.5,
|
||||
"h6": 8.5,
|
||||
"h12": 8.5,
|
||||
"h24": 8.5,
|
||||
"h48": 8.5,
|
||||
"drpState": 1,
|
||||
"rz": 117.52,
|
||||
"w": 6.011,
|
||||
"a_fsltdz": -4.920000000000002,
|
||||
"rzTm": "2025-05-28T06:00:00.000Z",
|
||||
"rzWarning": 0,
|
||||
"rzState": 1,
|
||||
"aRz": -4.92
|
||||
},
|
||||
{
|
||||
"stcd": "7CS000231",
|
||||
"type": "sk",
|
||||
"hasRz": true,
|
||||
"stnm": "刘家冲水库",
|
||||
"adcd": "421181100000",
|
||||
"wscd": null,
|
||||
"importancy": 0,
|
||||
"lgtd": 115.048056,
|
||||
"lttd": 31.335556,
|
||||
"elev": 0,
|
||||
"damel": 79.6,
|
||||
"dsflz": 78.65,
|
||||
"fsltdz": 72.05,
|
||||
"ddz": 69.55,
|
||||
"zcxsw": 72.05,
|
||||
"drpTm": "2023-11-20T01:00:00.000Z",
|
||||
"today": 0,
|
||||
"h1": 0,
|
||||
"h3": 0,
|
||||
"h6": 0,
|
||||
"h12": 0,
|
||||
"h24": 0,
|
||||
"h48": 0,
|
||||
"drpState": 2,
|
||||
"rz": 76.49,
|
||||
"w": 0.049,
|
||||
"a_fsltdz": 4.439999999999998,
|
||||
"rzTm": "2025-04-11T06:00:00.000Z",
|
||||
"rzWarning": 1,
|
||||
"rzState": 2,
|
||||
"pic": [
|
||||
{
|
||||
"stcd": "7CS000231",
|
||||
"tm": "2023-11-20T01:04:18.000Z",
|
||||
"url": "http://223.75.53.106:8891/skjgimages/2023/1120/7CS000231/20231120090418.jpg"
|
||||
},
|
||||
{
|
||||
"stcd": "7CS000231",
|
||||
"tm": "2023-11-20T01:07:54.000Z",
|
||||
"url": "http://223.75.53.106:8891/skjgimages/2023/1120/7CS000232/20231120090754.jpg"
|
||||
}
|
||||
],
|
||||
"aRz": 4.44
|
||||
},
|
||||
|
||||
{
|
||||
"stcd": "716111301",
|
||||
"type": "sk",
|
||||
"hasRz": true,
|
||||
"stnm": "蛤蟆岗水库",
|
||||
"adcd": "421181112000",
|
||||
"wscd": null,
|
||||
"importancy": 0,
|
||||
"lgtd": 115.016667,
|
||||
"lttd": 31.406111,
|
||||
"elev": 0,
|
||||
"damel": 173.1,
|
||||
"dsflz": 171.11,
|
||||
"fsltdz": 170,
|
||||
"ddz": 154.5,
|
||||
"zcxsw": 170,
|
||||
"drpTm": "2025-04-11T05:00:00.000Z",
|
||||
"today": 0,
|
||||
"h1": 0,
|
||||
"h3": 0,
|
||||
"h6": 0,
|
||||
"h12": 0,
|
||||
"h24": 0,
|
||||
"h48": 0,
|
||||
"drpState": 2,
|
||||
"rz": 165.85,
|
||||
"w": 0.938,
|
||||
"a_fsltdz": -4.150000000000006,
|
||||
"rzTm": "2025-04-11T05:00:00.000Z",
|
||||
"rzWarning": 0,
|
||||
"rzState": 2,
|
||||
"pic": [
|
||||
{
|
||||
"stcd": "716111301",
|
||||
"tm": "2023-03-12T07:02:00.000Z",
|
||||
"url": "http://223.75.53.106:8891/skjgimages/2023/0312/716111301/20230312150200.jpg"
|
||||
},
|
||||
{
|
||||
"stcd": "716111301",
|
||||
"tm": "2023-03-12T07:16:00.000Z",
|
||||
"url": "http://223.75.53.106:8891/skjgimages/2023/0312/716111302/20230312151600.jpg"
|
||||
}
|
||||
],
|
||||
"aRz": -4.15
|
||||
},
|
||||
{
|
||||
"stcd": "716112161",
|
||||
"type": "sk",
|
||||
"hasRz": true,
|
||||
"stnm": "白石河水库",
|
||||
"adcd": "421181112000",
|
||||
"wscd": null,
|
||||
"importancy": 0,
|
||||
"lgtd": 114.929444,
|
||||
"lttd": 31.267222,
|
||||
"elev": 0,
|
||||
"damel": 121.3,
|
||||
"dsflz": 117.78,
|
||||
"fsltdz": 117,
|
||||
"ddz": 107,
|
||||
"zcxsw": 117,
|
||||
"drpTm": "2025-04-11T05:00:00.000Z",
|
||||
"today": 0,
|
||||
"h1": 0,
|
||||
"h3": 0,
|
||||
"h6": 0,
|
||||
"h12": 0,
|
||||
"h24": 0,
|
||||
"h48": 0,
|
||||
"drpState": 2,
|
||||
"rz": 112.76,
|
||||
"w": 2.638,
|
||||
"a_fsltdz": -4.239999999999995,
|
||||
"rzTm": "2025-04-11T05:00:00.000Z",
|
||||
"rzWarning": 0,
|
||||
"rzState": 2,
|
||||
"pic": [
|
||||
{
|
||||
"stcd": "716112161",
|
||||
"tm": "2023-03-12T07:02:00.000Z",
|
||||
"url": "http://223.75.53.106:8891/skjgimages/2023/0312/716112161/20230312150200.jpg"
|
||||
},
|
||||
{
|
||||
"stcd": "716112161",
|
||||
"tm": "2023-03-12T07:07:00.000Z",
|
||||
"url": "http://223.75.53.106:8891/skjgimages/2023/0312/716112162/20230312150700.jpg"
|
||||
}
|
||||
],
|
||||
"aRz": -4.24
|
||||
},
|
||||
{
|
||||
"stcd": "716119601",
|
||||
"type": "sk",
|
||||
"hasRz": true,
|
||||
"stnm": "江蔡河水库",
|
||||
"adcd": "421181112000",
|
||||
"wscd": null,
|
||||
"importancy": 0,
|
||||
"lgtd": 114.963333,
|
||||
"lttd": 31.492778,
|
||||
"elev": 0,
|
||||
"damel": 286,
|
||||
"dsflz": 284.36,
|
||||
"fsltdz": 282.5,
|
||||
"ddz": 275.4,
|
||||
"zcxsw": 282.5,
|
||||
"drpTm": "2025-03-12T03:00:00.000Z",
|
||||
"today": 0,
|
||||
"h1": 0,
|
||||
"h3": 0,
|
||||
"h6": 0,
|
||||
"h12": 0,
|
||||
"h24": 0,
|
||||
"h48": 0,
|
||||
"drpState": 2,
|
||||
"rz": 276.13,
|
||||
"w": 0.058,
|
||||
"a_fsltdz": -6.3700000000000045,
|
||||
"rzTm": "2025-03-12T03:00:00.000Z",
|
||||
"rzWarning": 0,
|
||||
"rzState": 2,
|
||||
"pic": [
|
||||
{
|
||||
"stcd": "716119601",
|
||||
"tm": "2025-03-12T03:03:37.000Z",
|
||||
"url": "http://223.75.53.106:8891/skjgimages/2025/0312/716119601/20250312110337.jpg"
|
||||
},
|
||||
{
|
||||
"stcd": "716119601",
|
||||
"tm": "2025-03-12T03:05:01.000Z",
|
||||
"url": "http://223.75.53.106:8891/skjgimages/2025/0312/716119602/20250312110501.jpg"
|
||||
}
|
||||
],
|
||||
"aRz": -6.37
|
||||
},
|
||||
{
|
||||
"stcd": "716122051",
|
||||
"type": "sk",
|
||||
"hasRz": true,
|
||||
"stnm": "杨树庵水库",
|
||||
"adcd": "421181112000",
|
||||
"wscd": null,
|
||||
"importancy": 0,
|
||||
"lgtd": 114.429167,
|
||||
"lttd": 31.406944,
|
||||
"elev": 0,
|
||||
"damel": 141.1,
|
||||
"dsflz": 139.94,
|
||||
"fsltdz": 138.8,
|
||||
"ddz": 132.1,
|
||||
"zcxsw": 138.8,
|
||||
"drpTm": "2025-04-11T06:00:00.000Z",
|
||||
"today": 0,
|
||||
"h1": 0,
|
||||
"h3": 0,
|
||||
"h6": 0,
|
||||
"h12": 0,
|
||||
"h24": 0,
|
||||
"h48": 0,
|
||||
"drpState": 2,
|
||||
"rz": 136.23,
|
||||
"w": 0.057,
|
||||
"a_fsltdz": -2.5700000000000216,
|
||||
"rzTm": "2025-04-11T06:00:00.000Z",
|
||||
"rzWarning": 0,
|
||||
"rzState": 2,
|
||||
"pic": [
|
||||
{
|
||||
"stcd": "716122051",
|
||||
"tm": "2023-03-12T07:04:00.000Z",
|
||||
"url": "http://223.75.53.106:8891/skjgimages/2023/0312/716122051/20230312150400.jpg"
|
||||
},
|
||||
{
|
||||
"stcd": "716122051",
|
||||
"tm": "2023-03-12T07:21:00.000Z",
|
||||
"url": "http://223.75.53.106:8891/skjgimages/2023/0312/716122052/20230312152100.jpg"
|
||||
}
|
||||
],
|
||||
"aRz": -2.57
|
||||
},
|
||||
|
||||
|
||||
{
|
||||
"stcd": "716123001",
|
||||
"type": "sk",
|
||||
"hasRz": true,
|
||||
"stnm": "正冲水库",
|
||||
"stnm": "监测点8",
|
||||
"adcd": "421181112000",
|
||||
"wscd": null,
|
||||
"importancy": 0,
|
||||
|
|
@ -804,7 +141,7 @@ const page1 = [
|
|||
"stcd": "716122901",
|
||||
"type": "sk",
|
||||
"hasRz": true,
|
||||
"stnm": "李家冲水库",
|
||||
"stnm": "监测点7",
|
||||
"adcd": "421181112000",
|
||||
"wscd": null,
|
||||
"importancy": 0,
|
||||
|
|
@ -849,7 +186,7 @@ const page1 = [
|
|||
"stcd": "716123901",
|
||||
"type": "sk",
|
||||
"hasRz": true,
|
||||
"stnm": "宗家冲水库",
|
||||
"stnm": "监测点6",
|
||||
"adcd": "421181112000",
|
||||
"wscd": null,
|
||||
"importancy": 0,
|
||||
|
|
@ -894,7 +231,7 @@ const page1 = [
|
|||
"stcd": "716115801",
|
||||
"type": "sk",
|
||||
"hasRz": true,
|
||||
"stnm": "张家凹水库",
|
||||
"stnm": "监测点5",
|
||||
"adcd": "421181112000",
|
||||
"wscd": null,
|
||||
"importancy": 0,
|
||||
|
|
@ -939,7 +276,7 @@ const page1 = [
|
|||
"stcd": "716120401",
|
||||
"type": "sk",
|
||||
"hasRz": true,
|
||||
"stnm": "江园水库",
|
||||
"stnm": "监测点4",
|
||||
"adcd": "421181112000",
|
||||
"wscd": null,
|
||||
"importancy": 0,
|
||||
|
|
@ -984,7 +321,10 @@ const page1 = [
|
|||
"stcd": "716116201",
|
||||
"type": "sk",
|
||||
"hasRz": true,
|
||||
"stnm": "戴家冲水库",
|
||||
"stnm": "监测点3",
|
||||
press: '0.91',
|
||||
flow: 200,
|
||||
hg: 90,
|
||||
"adcd": "421181112000",
|
||||
"wscd": null,
|
||||
"importancy": 0,
|
||||
|
|
@ -1029,7 +369,10 @@ const page1 = [
|
|||
"stcd": "716122701",
|
||||
"type": "sk",
|
||||
"hasRz": true,
|
||||
"stnm": "石板冲水库",
|
||||
press: '0.52',
|
||||
flow: 200,
|
||||
hg: 90,
|
||||
"stnm": "监测点2",
|
||||
"adcd": "421181112000",
|
||||
"wscd": null,
|
||||
"importancy": 0,
|
||||
|
|
@ -1074,7 +417,9 @@ const page1 = [
|
|||
"stcd": "716122601",
|
||||
"type": "sk",
|
||||
"hasRz": true,
|
||||
"stnm": "山圣庵水库",
|
||||
"stnm": "监测点1", press: '0.91',
|
||||
flow: 200,
|
||||
hg: 90,
|
||||
"adcd": "421181112000",
|
||||
"wscd": null,
|
||||
"importancy": 0,
|
||||
|
|
@ -1153,7 +498,7 @@ export default class ShuichangLayer extends BaseLayer {
|
|||
|
||||
featureClicked(properties, dispatch) {
|
||||
dispatch.runtime.setFeaturePop({
|
||||
type: 'ScStPop',
|
||||
type: 'shuichang',
|
||||
properties,
|
||||
coordinates: [properties.lgtd, properties.lttd],
|
||||
offsetPop: true,
|
||||
|
|
|
|||
|
|
@ -68,6 +68,43 @@ const sources = {
|
|||
[114.7460271999999929, 30.8613739500000008], // 左下
|
||||
],
|
||||
},
|
||||
//灌区图
|
||||
"gqmapImg": {
|
||||
'type': 'image',
|
||||
'url': `${hash}/assets/gqbg.png`,
|
||||
// 'coordinates': [
|
||||
// // 图片覆盖地图的四至点
|
||||
// [114.8510271999999929, 31.2068084090000987], // 左上
|
||||
|
||||
// [115.0357823634995805, 31.1568084090000987], // 右上
|
||||
|
||||
// [115.0707823634995805, 30.9913739500000008], // 右下
|
||||
|
||||
// [114.6660271999999929, 30.9913739500000008], // 左下
|
||||
// ],
|
||||
'coordinates': [
|
||||
[114.818962 , 31.291471], // 左上
|
||||
[115.027001, 31.231773], // 右上
|
||||
[115.0707823634995805, 30.9913739500000008], // 右下
|
||||
[114.687749, 30.963712], // 左下
|
||||
|
||||
]
|
||||
},
|
||||
// 管网图
|
||||
"gwImg": {
|
||||
'type': 'image',
|
||||
'url': `${hash}/assets/gwbg.png`,
|
||||
'coordinates': [
|
||||
// 图片覆盖地图的四至点
|
||||
[114.5510271999999929, 31.4068084090000987], // 左上
|
||||
|
||||
[115.5357823634995805, 31.4068084090000987], // 右上
|
||||
|
||||
[115.4947823634995805, 30.9713739500000288], // 右下
|
||||
|
||||
[114.9490271999999929, 30.8613739500000288], // 左下
|
||||
],
|
||||
},
|
||||
"县界": {
|
||||
"data": `${hash}/mapbox/geojson/县界.geojson`,
|
||||
"type": "geojson"
|
||||
|
|
|
|||
|
|
@ -85,6 +85,9 @@ import Yhfx from './panels/Yhfx'
|
|||
import Bjtj from './panels/Bjtj'
|
||||
import Szzddgxs from './panels/Szzddgxs'
|
||||
import Szzddjq from './panels/Szzddjq'
|
||||
import Gcxxzl from './panels/Gcxxzl'
|
||||
import Dhxs from './panels/Gwxs'
|
||||
import Yjdd from './panels/Yjdd'
|
||||
import Jsjc from './panels/Jsjc'
|
||||
import Csjc from './panels/Csjc'
|
||||
|
||||
|
|
@ -256,6 +259,8 @@ export default function PanelIndex({ name, style, ...params }) {
|
|||
return <Afjk style={style} />
|
||||
} else if (name === '电耗分析') {
|
||||
return <Dhfx style={style} />
|
||||
} else if (name === '24h用水') {
|
||||
return <Dhxs style={style} />
|
||||
} else if (name === '药耗分析') {
|
||||
return <Yhfx style={style} />
|
||||
} else if (name === '报警统计') {
|
||||
|
|
@ -266,6 +271,10 @@ export default function PanelIndex({ name, style, ...params }) {
|
|||
return <Jsjc style={style} />
|
||||
} else if (name === '出水监测') {
|
||||
return <Csjc style={style} />
|
||||
} else if (name === '信息总览') {
|
||||
return <Gcxxzl style={style} />
|
||||
} else if (name === '应急指挥调度') {
|
||||
return <Yjdd style={style} />
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -34,7 +34,7 @@ export default function Demo1() {
|
|||
}
|
||||
|
||||
{
|
||||
isSc &&<img src={`${process.env.PUBLIC_URL}/assets/scdd.jpg`} alt="" style={{ zIndex: 0.1, position: 'absolute',width:'100%',transform:`scale(1)` }} />
|
||||
isSc &&<img src={`${process.env.PUBLIC_URL}/assets/scdd.jpg`} alt="" style={{ zIndex: 0.1, position: 'absolute',width:'100%' }} />
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,149 @@
|
|||
import { Button, makeStyles } from '@material-ui/core';
|
||||
import { Email } from '@material-ui/icons';
|
||||
import React from 'react';
|
||||
import { useDispatch } from 'react-redux';
|
||||
import config from '../../../../config';
|
||||
import { bxstr, drpRealGet, skRealGet } from '../../../../models/_/real';
|
||||
import { strNumber } from '../../../../utils/tools';
|
||||
import { InfoPopNames } from '../../InfoPops';
|
||||
|
||||
const useStyles = makeStyles({
|
||||
root: {
|
||||
padding: '1.5rem 0.75rem 0.75rem 0.75rem',
|
||||
color: 'rgb(224, 246, 247)',
|
||||
fontSize: '0.9rem',
|
||||
lineHeight: '1.8rem',
|
||||
},
|
||||
|
||||
titleDate: {
|
||||
fontSize: '1.2rem',
|
||||
margin: '0.2rem',
|
||||
color: '#00deff',
|
||||
},
|
||||
|
||||
number: {
|
||||
color: '#ffd220',
|
||||
fontSize: '1.2rem',
|
||||
margin: '0.2rem',
|
||||
},
|
||||
|
||||
sttype: {
|
||||
color: '#92f0ff',
|
||||
},
|
||||
stname: {
|
||||
fontWeight: 'bold',
|
||||
fontSize: '1rem',
|
||||
margin: '0.25rem',
|
||||
cursor: 'pointer'
|
||||
},
|
||||
|
||||
grid: {
|
||||
display: 'flex',
|
||||
justifyContent: 'space-around',
|
||||
marginBottom: '1rem',
|
||||
textAlign: 'center',
|
||||
|
||||
'& .value': {
|
||||
fontSize: '1.8rem',
|
||||
color: '#6fe9fd',
|
||||
lineHeight: '2rem'
|
||||
},
|
||||
|
||||
|
||||
'& .key': {
|
||||
fontSize: '0.8rem',
|
||||
color: '#aaa',
|
||||
},
|
||||
},
|
||||
|
||||
action: {
|
||||
textAlign: 'right',
|
||||
color: '#fff',
|
||||
}
|
||||
})
|
||||
|
||||
export default function OverallContent({ data }) {
|
||||
const classes = useStyles();
|
||||
const dispatch = useDispatch();
|
||||
|
||||
const {
|
||||
drpInfo,
|
||||
skInfo,
|
||||
tm1, tm2,
|
||||
} = data || {};
|
||||
|
||||
const { h24, h1, h3, h6 } = drpInfo || {};
|
||||
|
||||
const _showRecord = (record, poptype) => {
|
||||
if (record) {
|
||||
const { lgtd, lttd } = record;
|
||||
if (lgtd && lttd) {
|
||||
dispatch.runtime.setFeaturePop({ type: poptype, properties: record, coordinates: [lgtd, lttd] });
|
||||
dispatch.runtime.setCameraTarget({
|
||||
center: [lgtd, lttd],
|
||||
zoom: 15,
|
||||
pitch: config.poiPitch,
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const showRecord = (obj) => {
|
||||
if (!obj) {
|
||||
return;
|
||||
}
|
||||
|
||||
const { type } = obj;
|
||||
if (type === 'sk') {
|
||||
skRealGet(obj.stcd).then((record) => {
|
||||
_showRecord(record, InfoPopNames.RealSkPop)
|
||||
})
|
||||
} else {
|
||||
drpRealGet(obj).then((record) => {
|
||||
_showRecord(record, InfoPopNames.RealDrpPop)
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
const doBx = () => {
|
||||
bxstr().then((data) => {
|
||||
dispatch.runtime.setInfoDlg({
|
||||
layerId: 'OverallSmtp',
|
||||
properties: { txt: data }
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
return (
|
||||
<div className={classes.root}>
|
||||
<div className={classes.grid} style={{flexWrap:'wrap',justifyContent:'start',columnGap:10}}>
|
||||
<div style={{ padding: 15, background: "linear-gradient(to bottom, #001529, #003366)" }}>
|
||||
<div className="key" style={{ color: '#fff', fontSize: 16 }}>累计巡查次数</div>
|
||||
<div className="value" style={{ color: '#5ecd45' }}>32</div>
|
||||
</div>
|
||||
<div style={{ padding: 15, background: "linear-gradient(to bottom, #001529, #003366)" }}>
|
||||
<div className="key" style={{ color: '#fff', fontSize: 16 }}>本月巡查次数</div>
|
||||
<div className="value" style={{ color: '#5ecd45' }}>5</div>
|
||||
</div>
|
||||
<div style={{ padding: 15, background: "linear-gradient(to bottom, #001529, #003366)" }}>
|
||||
<div className="key" style={{ color: '#fff', fontSize: 16 }}>累计事件数量</div>
|
||||
<div
|
||||
className="value"
|
||||
style={{ cursor: 'pointer', color: '#5ecd45' }}
|
||||
>
|
||||
1
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div style={{ padding: 15, background: "linear-gradient(to bottom, #001529, #003366)" }}>
|
||||
<div className="key" style={{ color: '#fff', fontSize: 16 }}>本月事件数量</div>
|
||||
<div className="value" style={{ color: '#5ecd45' }}>50</div>
|
||||
</div>
|
||||
<div style={{ padding: 20, background: "linear-gradient(to bottom, #001529, #003366)" }}>
|
||||
<div className="key" style={{ color: '#fff', fontSize: 16 }}>处理中事件</div>
|
||||
<div className="value" style={{ color: '#ba292a' }}>24</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,62 @@
|
|||
import React from 'react';
|
||||
import { OverallPromise } from '../../../../models/_/real';
|
||||
import useRequest from '../../../../utils/useRequest';
|
||||
import PanelBox from '../../components/PanelBox';
|
||||
import OverallContent from './OverallContent';
|
||||
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';
|
||||
export default function Overall({ style }) {
|
||||
|
||||
const { data } = useRequest(OverallPromise.get);
|
||||
const showData = [
|
||||
{
|
||||
unit: '浮桥河灌区',
|
||||
inspectionCount: '大型',
|
||||
eventCount: 31.96,
|
||||
processingCount: '--'
|
||||
},
|
||||
]
|
||||
return (
|
||||
<PanelBox
|
||||
style={style}
|
||||
title="信息总览"
|
||||
color="green"
|
||||
>
|
||||
{/* <OverallContent data={data} /> */}
|
||||
<img src={`${process.env.PUBLIC_URL}/assets/xxzl.jpg`} alt="" style={{width:421}}/>
|
||||
<TableContainer style={{ height: '30%',marginTop:'10px' }}>
|
||||
<Table size="small" stickyHeader>
|
||||
<TableHead>
|
||||
<TableRow >
|
||||
<DpTableCell style={{ width: '25%' }} align="center">灌区名称</DpTableCell>
|
||||
<DpTableCell style={{ width: '25%' }} align="center">灌区类型</DpTableCell>
|
||||
<DpTableCell align="center" style={{ width: '25%' }}>灌溉面积(万亩)</DpTableCell>
|
||||
<DpTableCell align="center" style={{ width: '25%' }}>受益人口</DpTableCell>
|
||||
</TableRow>
|
||||
</TableHead>
|
||||
<TableBody>
|
||||
{showData.map((row) => (
|
||||
<DpTableRow key={row.id}>
|
||||
<DpTableCell align="center">
|
||||
<div
|
||||
className="table-ellipsis cursor-pointer"
|
||||
>{row.unit}</div>
|
||||
</DpTableCell>
|
||||
<DpTableCell align="center">{row.inspectionCount}</DpTableCell>
|
||||
<DpTableCell align="center"><div className="table-ellipsis cursor-pointer">{row.eventCount}</div></DpTableCell>
|
||||
<DpTableCell align="center">{row.processingCount}</DpTableCell>
|
||||
{/* {rzRender(row.rz, row.grz)}
|
||||
{rzRender(row.rz, row.wrz)} */}
|
||||
</DpTableRow>
|
||||
))}
|
||||
</TableBody>
|
||||
</Table>
|
||||
</TableContainer>
|
||||
</PanelBox>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
.dppanel-overall {
|
||||
padding: 0.75rem;
|
||||
color: rgb(224, 246, 247);
|
||||
font-size: 0.8rem;
|
||||
line-height: 1.8rem;
|
||||
|
||||
.title-date {
|
||||
font-size: 1.2rem;
|
||||
margin: 0.2rem;
|
||||
color: #00deff;
|
||||
}
|
||||
|
||||
.number {
|
||||
color: #ffd220;
|
||||
font-size: 1.2rem;
|
||||
margin: 0.2rem;
|
||||
}
|
||||
|
||||
.sttype {
|
||||
color: #92f0ff;
|
||||
}
|
||||
.stname {
|
||||
font-weight: bold;
|
||||
font-size: 1rem;
|
||||
margin: 0.25rem;
|
||||
}
|
||||
|
||||
.sycm {
|
||||
height: 5rem;
|
||||
padding-top: 0.75rem;
|
||||
ul{ margin-left:-.5rem;margin-right:-.5rem; padding: .16rem 0;}
|
||||
li{ float: left; width: 33.33%; text-align: center; position: relative}
|
||||
li:before{ position:absolute; content: ""; height:30%; width: 1px; background: rgba(255,255,255,.1); right: 0; top: 15%;}
|
||||
li:last-child:before{ width: 0;}
|
||||
li h2{ font-size:2rem; color: #6fe9fd; margin: 0; font-family: 'electronicFont';margin-bottom: 0.5rem;}
|
||||
li span{ font-size:1rem; color: #fff; opacity: .5;}
|
||||
}
|
||||
}
|
||||
|
|
@ -17,7 +17,7 @@ import { renderHDRz } from '../../../../utils/renutils';
|
|||
import Setting from './Setting';
|
||||
import { InfoPopNames } from '../../InfoPops';
|
||||
import config from '../../../../config';
|
||||
import { Switch, FormControlLabel,InputLabel, Select, MenuItem,FormControl } from '@material-ui/core/index'
|
||||
import { Switch, FormControlLabel, InputLabel, Select, MenuItem, FormControl } from '@material-ui/core/index'
|
||||
import { styled } from '@material-ui/styles';
|
||||
|
||||
function HDReal({ style }) {
|
||||
|
|
@ -81,28 +81,42 @@ function HDReal({ style }) {
|
|||
}
|
||||
|
||||
const CustomSwitch = styled(Switch)({
|
||||
'& .MuiSwitch-switchBase': {
|
||||
color: '#fff',
|
||||
'&.Mui-checked': {
|
||||
color: '#1890ff',
|
||||
'& + .MuiSwitch-track': {
|
||||
backgroundColor: '#1890ff',
|
||||
opacity: 0.5,
|
||||
'& .MuiSwitch-switchBase': {
|
||||
color: '#fff',
|
||||
'&.Mui-checked': {
|
||||
color: '#1890ff',
|
||||
'& + .MuiSwitch-track': {
|
||||
backgroundColor: '#1890ff',
|
||||
opacity: 0.5,
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
'& .MuiSwitch-track': {
|
||||
backgroundColor: 'rgba(255, 255, 255, 0.3)',
|
||||
},
|
||||
});
|
||||
'& .MuiSwitch-track': {
|
||||
backgroundColor: 'rgba(255, 255, 255, 0.3)',
|
||||
},
|
||||
});
|
||||
|
||||
const StyledFormControlLabel = styled(FormControlLabel)({
|
||||
'& .MuiFormControlLabel-label': {
|
||||
color: '#fff'
|
||||
const StyledFormControlLabel = styled(FormControlLabel)({
|
||||
'& .MuiFormControlLabel-label': {
|
||||
color: '#fff'
|
||||
}
|
||||
});
|
||||
const [dimension, setDimension] = useState('fqh');
|
||||
|
||||
const switchChange = (e) => {
|
||||
const val = e.target.checked
|
||||
setChecked(val)
|
||||
if (val) {
|
||||
dispatch.runtime.setCameraTarget({
|
||||
center: [114.81944, 31.12068],
|
||||
zoom: 13,
|
||||
pitch: 60,
|
||||
});
|
||||
} else {
|
||||
dispatch.runtime.setHome();
|
||||
|
||||
}
|
||||
}
|
||||
});
|
||||
const [dimension, setDimension] =useState('fqh');
|
||||
|
||||
|
||||
return (
|
||||
<PanelBox
|
||||
|
|
@ -152,54 +166,54 @@ const StyledFormControlLabel = styled(FormControlLabel)({
|
|||
))}
|
||||
</TableBody>
|
||||
</Table>
|
||||
|
||||
|
||||
</TableContainer>
|
||||
{
|
||||
setting && <Setting onClose={() => showSetting(false)} />
|
||||
}
|
||||
<div style={{ position: 'absolute',color:'#fff',top:70,left:-280,display:'flex',alignItems:'center' }}>
|
||||
|
||||
<StyledFormControlLabel
|
||||
control={
|
||||
<CustomSwitch
|
||||
<div style={{ position: 'absolute', color: '#fff', top: 70, left: -280, display: 'flex', alignItems: 'center' }}>
|
||||
|
||||
<StyledFormControlLabel
|
||||
control={
|
||||
<CustomSwitch
|
||||
checked={checked}
|
||||
onChange={(e) => setChecked(e.target.checked)}
|
||||
onChange={switchChange}
|
||||
/>
|
||||
}
|
||||
label="多灌区模式"
|
||||
/>
|
||||
}
|
||||
label="多灌区模式"
|
||||
/>
|
||||
{checked &&<div style={{marginTop:"-15px"}}>
|
||||
{checked && <div style={{ marginTop: "-15px" }}>
|
||||
<FormControl sx={{ minWidth: 200, marginBottom: 2 }}>
|
||||
<InputLabel id="analysis-select-label"></InputLabel>
|
||||
<Select
|
||||
labelId="analysis-select-label"
|
||||
value={dimension}
|
||||
label=""
|
||||
onChange={(event) => {
|
||||
const value = event.target.value;
|
||||
setDimension(value);
|
||||
}}
|
||||
sx={{
|
||||
color: '#fff',
|
||||
'.MuiOutlinedInput-notchedOutline': {
|
||||
borderColor: 'rgba(255, 255, 255, 0.3)',
|
||||
},
|
||||
'&:hover .MuiOutlinedInput-notchedOutline': {
|
||||
borderColor: 'rgba(255, 255, 255, 0.6)',
|
||||
},
|
||||
'&.Mui-focused .MuiOutlinedInput-notchedOutline': {
|
||||
borderColor: '#fff',
|
||||
}
|
||||
}}
|
||||
>
|
||||
<MenuItem value="fqh">浮桥河灌区</MenuItem>
|
||||
<MenuItem value="shk">三河口水库灌区</MenuItem>
|
||||
<MenuItem value="qjs">群建水库灌区</MenuItem>
|
||||
<MenuItem value="dsb">大石板灌区</MenuItem>
|
||||
</Select>
|
||||
<InputLabel id="analysis-select-label"></InputLabel>
|
||||
<Select
|
||||
labelId="analysis-select-label"
|
||||
value={dimension}
|
||||
label=""
|
||||
onChange={(event) => {
|
||||
const value = event.target.value;
|
||||
|
||||
}}
|
||||
sx={{
|
||||
color: '#fff',
|
||||
'.MuiOutlinedInput-notchedOutline': {
|
||||
borderColor: 'rgba(255, 255, 255, 0.3)',
|
||||
},
|
||||
'&:hover .MuiOutlinedInput-notchedOutline': {
|
||||
borderColor: 'rgba(255, 255, 255, 0.6)',
|
||||
},
|
||||
'&.Mui-focused .MuiOutlinedInput-notchedOutline': {
|
||||
borderColor: '#fff',
|
||||
}
|
||||
}}
|
||||
>
|
||||
<MenuItem value="fqh">浮桥河灌区</MenuItem>
|
||||
<MenuItem value="shk">三河口水库灌区</MenuItem>
|
||||
<MenuItem value="qjs">群建水库灌区</MenuItem>
|
||||
<MenuItem value="dsb">大石板灌区</MenuItem>
|
||||
</Select>
|
||||
</FormControl>
|
||||
</div>}
|
||||
</div>
|
||||
</div>
|
||||
</PanelBox>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -53,40 +53,40 @@ function HDReal({ style }) {
|
|||
// }, [data, tableRzFilter]);
|
||||
const randomMinutes = Math.floor(Math.random() * 60) + 1;
|
||||
const format = 'YYYY-MM-DD HH:mm';
|
||||
|
||||
|
||||
const showData = [
|
||||
{
|
||||
stnm: '监测点1',
|
||||
press: '0.91',
|
||||
flow: 200,
|
||||
hg: 90,
|
||||
"lttd": 30.8456 +0.2002,
|
||||
"lgtd": 112.2321 +2.9619,
|
||||
|
||||
"lgtd": 114.891667,
|
||||
"lttd": 31.346944,
|
||||
|
||||
},
|
||||
{
|
||||
{
|
||||
stnm: '监测点2',
|
||||
press: '0.52',
|
||||
flow: 200,
|
||||
hg: 90,
|
||||
"lttd": 30.8446 +0.2002,
|
||||
"lgtd": 112.203 +2.9619,
|
||||
|
||||
},{
|
||||
hg: 90,
|
||||
"lgtd": 114.908889,
|
||||
"lttd": 31.334167,
|
||||
|
||||
}, {
|
||||
stnm: '监测点3',
|
||||
press: '0.52',
|
||||
flow: 200,
|
||||
hg: 20,
|
||||
"lttd": 30.8866 +0.2002,
|
||||
"lgtd": 112.2006 +2.9619,
|
||||
|
||||
hg: 20,
|
||||
"lgtd": 115.024444,
|
||||
"lttd": 31.232222,
|
||||
|
||||
}
|
||||
]
|
||||
|
||||
const flyTo = (record) => {
|
||||
const { lgtd, lttd } = record;
|
||||
if (lgtd && lttd) {
|
||||
dispatch.runtime.setFeaturePop({ type: '监测站', properties: record, coordinates: [lgtd, lttd] });
|
||||
dispatch.runtime.setFeaturePop({ type: 'shuichang', properties: record, coordinates: [lgtd, lttd] });
|
||||
dispatch.runtime.setCameraTarget({
|
||||
center: [lgtd, lttd + config.poiPositionOffsetY.hd],
|
||||
zoom: config.poiPositionZoom.hd,
|
||||
|
|
@ -130,15 +130,15 @@ function HDReal({ style }) {
|
|||
<TableRow>
|
||||
<DpTableCell style={{ width: '20%' }} align="center">监测点</DpTableCell>
|
||||
<DpTableCell style={{ width: '30%' }} align="center">压力(Mpa)</DpTableCell>
|
||||
<DpTableCell align="center" style={{ width: '30%' }}>流量(m³/h)</DpTableCell>
|
||||
<DpTableCell align="center" style={{ width: '20%' }}>水质合格率(%)</DpTableCell>
|
||||
<DpTableCell align="center" style={{ width: '20%' }}>流量(m³/h)</DpTableCell>
|
||||
<DpTableCell align="center" style={{ width: '30%' }}>水质合格率(%)</DpTableCell>
|
||||
{/* <DpTableCell align="right">警戒水位</DpTableCell> */}
|
||||
</TableRow>
|
||||
</TableHead>
|
||||
<TableBody>
|
||||
{showData.map((row) => (
|
||||
<DpTableRow key={row.id} onClick={() => flyTo(row)}>
|
||||
<DpTableCell align="center">
|
||||
<DpTableCell align="center">
|
||||
<div
|
||||
className="table-ellipsis cursor-pointer"
|
||||
>{row.stnm}</div>
|
||||
|
|
@ -146,10 +146,10 @@ function HDReal({ style }) {
|
|||
<DpTableCell align="center">
|
||||
<div
|
||||
className="table-ellipsis cursor-pointer"
|
||||
style={{color:row.press > 0.8 ? 'orange':''}}>{row.press}</div>
|
||||
style={{ color: row.press > 0.8 ? 'orange' : '' }}>{row.press}</div>
|
||||
</DpTableCell>
|
||||
<DpTableCell align="center">{row.flow}</DpTableCell>
|
||||
<DpTableCell align="center"><div style={{color:row.hg <80? 'orange':''}}>{row.hg}</div></DpTableCell>
|
||||
<DpTableCell align="center"><div style={{ color: row.hg < 80 ? 'orange' : '' }}>{row.hg}</div></DpTableCell>
|
||||
{/* {rzRender(row.rz, row.grz)}
|
||||
{rzRender(row.rz, row.wrz)} */}
|
||||
</DpTableRow>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,51 @@
|
|||
import React from 'react';
|
||||
|
||||
import Dialog from '@material-ui/core/Dialog';
|
||||
import DialogContent from '@material-ui/core/DialogContent';
|
||||
import DpPaperComponent from '../../../../layouts/mui/DpPaperCompanent';
|
||||
import { FormGroup, MenuItem, Select, Switch, Typography } from '@material-ui/core';
|
||||
import DpDialogTitle from '../../../../layouts/mui/DpDialogTitle';
|
||||
import { useDispatch, useSelector } from 'react-redux';
|
||||
import { getLayerSetting, getLayerVisible } from '../../../../models/map/selectors';
|
||||
import DpBackgroundDrop from '../../../../layouts/mui/DpBackdrop';
|
||||
|
||||
|
||||
function Setting({ onClose }) {
|
||||
const layerVisible = useSelector(getLayerVisible);
|
||||
const layerSetting = useSelector(getLayerSetting);
|
||||
|
||||
const dispath = useDispatch();
|
||||
|
||||
return (
|
||||
<Dialog
|
||||
open={true}
|
||||
onClose={onClose}
|
||||
maxWidth="xl"
|
||||
style={{ borderRadius: 0 }}
|
||||
PaperComponent={DpPaperComponent}
|
||||
BackdropComponent={DpBackgroundDrop}
|
||||
>
|
||||
<div className="boxhead"></div>
|
||||
|
||||
<DpDialogTitle>河道水位显示设置</DpDialogTitle>
|
||||
<DialogContent>
|
||||
<div style={{ width: 320, padding: '1rem 0' }}>
|
||||
<FormGroup>
|
||||
<div style={{ marginBottom: '1rem' }}>
|
||||
<Typography variant="subtitle2">显示河道水位图层</Typography>
|
||||
<Switch
|
||||
checked={!!layerVisible.RealHDLayer}
|
||||
color="primary"
|
||||
edge="start"
|
||||
onChange={(e) => dispath.map.setLayerVisible({ RealHDLayer: e.target.checked })}
|
||||
/>
|
||||
</div>
|
||||
</FormGroup>
|
||||
</div>
|
||||
</DialogContent>
|
||||
<div className="boxfoot"></div>
|
||||
</Dialog>
|
||||
)
|
||||
}
|
||||
|
||||
export default Setting;
|
||||
|
|
@ -0,0 +1,286 @@
|
|||
import React, { useMemo, useState,useEffect } from 'react';
|
||||
import useRequest from '../../../../utils/useRequest';
|
||||
import PanelBox from '../../components/PanelBox';
|
||||
|
||||
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 { useDispatch, useSelector } from 'react-redux';
|
||||
import useRefresh from '../../../../utils/useRefresh';
|
||||
import { HDRealPromise } from '../../../../models/_/real';
|
||||
import clsx from 'clsx';
|
||||
import { renderHDRz } from '../../../../utils/renutils';
|
||||
import Setting from './Setting';
|
||||
import { InfoPopNames } from '../../InfoPops';
|
||||
import config from '../../../../config';
|
||||
import { DatePicker } from 'antd';
|
||||
import moment from 'moment';
|
||||
import './index.less'
|
||||
import ReactEcharts from 'echarts-for-react';
|
||||
|
||||
import { Switch, FormControlLabel,InputLabel, Select, MenuItem,FormControl } from '@material-ui/core/index'
|
||||
const { RangePicker } = DatePicker;
|
||||
|
||||
function rzRender(rz, base) {
|
||||
return (
|
||||
<DpTableCell align="right" style={{ color: rz >= base ? 'red' : '#fff' }}>
|
||||
{typeof base === 'number' ? base.toFixed(2) : ''}
|
||||
</DpTableCell>
|
||||
);
|
||||
}
|
||||
|
||||
function HDReal({ style }) {
|
||||
const dispatch = useDispatch();
|
||||
const tableRzFilter = useSelector(s => s.realview.tableRzFilter);
|
||||
const hdAutoRefresh = useSelector(s => s.realview.hdAutoRefresh);
|
||||
// const t = useRefresh(hdAutoRefresh ? 60 * 1000 : 0);
|
||||
// let { data } = useRequest(HDRealPromise.get, t);
|
||||
const [setting, showSetting] = useState(false);
|
||||
const [dimension, setDimension] =useState('ft');
|
||||
|
||||
// const showData = useMemo(() => {
|
||||
// if (!data) {
|
||||
// return [];
|
||||
// }
|
||||
// let ret = [];
|
||||
// data.forEach(o => {
|
||||
// if (!tableRzFilter[o.type]) {
|
||||
// return;
|
||||
// }
|
||||
// o.status = Math.floor(Math.random() * (4 - 0 + 1)) + 0
|
||||
// o.kd = (Math.random() * 100).toFixed(2);
|
||||
// o.ll = (Math.random() * 100).toFixed(1);
|
||||
// ret.push(o);
|
||||
// });
|
||||
// return ret;
|
||||
// }, [data, tableRzFilter]);
|
||||
|
||||
const showData = Array(1).fill(0).map((o,i) => ({
|
||||
date: '2025-05-26',
|
||||
event: '侵占河道',
|
||||
type: '侵占河道',
|
||||
status: '待处理',
|
||||
place:'浮桥河灌区'
|
||||
}))
|
||||
|
||||
const flyTo = (record) => {
|
||||
const { lgtd, lttd } = record;
|
||||
if (lgtd && lttd) {
|
||||
dispatch.runtime.setFeaturePop({ type: InfoPopNames.RealHDPop, properties: record, coordinates: [lgtd, lttd] });
|
||||
dispatch.runtime.setCameraTarget({
|
||||
center: [lgtd, lttd + config.poiPositionOffsetY.hd],
|
||||
zoom: config.poiPositionZoom.hd,
|
||||
pitch: config.poiPitch,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
const data = [
|
||||
{ town: '宋埠镇', waterUsage: 440, supplyCapacity: 380 },
|
||||
{ town: '龟山镇', waterUsage: 430, supplyCapacity: 380 },
|
||||
{ town: '黄土岗镇', waterUsage: 320, supplyCapacity: 300 },
|
||||
{ town: '白果镇', waterUsage: 310, supplyCapacity: 300 },
|
||||
{ town: '福田河镇', waterUsage: 380, supplyCapacity: 480 },
|
||||
{ town: '张家畈镇', waterUsage: 380, supplyCapacity: 460 },
|
||||
{ town: '乘马岗镇', waterUsage: 280, supplyCapacity: 340 },
|
||||
{ town: '木子店镇', waterUsage: 370, supplyCapacity: 450 },
|
||||
{ town: '盐田河镇', waterUsage: 360, supplyCapacity: 430 }
|
||||
];
|
||||
const option = {
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'shadow'
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
data: ['未来24小时用水', '供水能力'],
|
||||
textStyle: {
|
||||
color: '#fff'
|
||||
},
|
||||
top: 10
|
||||
},
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '10%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
data: data.map(item => item.town),
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: '#fff'
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
color: '#fff'
|
||||
}
|
||||
}
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value',
|
||||
name: '水量 (吨/小时)',
|
||||
nameTextStyle: {
|
||||
color: '#fff'
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: '#fff'
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
color: '#fff'
|
||||
},
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
color: 'rgba(255, 255, 255, 0.1)'
|
||||
}
|
||||
}
|
||||
}
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: '未来24小时用水',
|
||||
type: 'bar',
|
||||
barWidth: '20%',
|
||||
data: data.map(item => item.waterUsage),
|
||||
itemStyle: {
|
||||
color: '#87CEEB'
|
||||
}
|
||||
},
|
||||
{
|
||||
name: '供水能力',
|
||||
type: 'bar',
|
||||
barWidth: '20%',
|
||||
data: data.map(item => item.supplyCapacity),
|
||||
itemStyle: {
|
||||
color: '#0066CC'
|
||||
}
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
const toggleStType = (type) => {
|
||||
const visible = !tableRzFilter[type];
|
||||
dispatch.realview.setTableRzFilter({ [type]: visible });
|
||||
}
|
||||
const [params, setParams] = useState({ tm: [] })
|
||||
const toggleAutoRefresh = () => {
|
||||
dispatch.realview.setHdAutoRefresh(!hdAutoRefresh);
|
||||
}
|
||||
|
||||
const searchTm = (e) => {
|
||||
setParams({
|
||||
...params,
|
||||
stm: e[0].format("YYYY-MM-DD HH:mm"),
|
||||
etm: e[1].format("YYYY-MM-DD HH:mm"),
|
||||
tm:e,
|
||||
})
|
||||
};
|
||||
useEffect(() => {
|
||||
let options = "";
|
||||
options = {
|
||||
etm: moment().add(1, 'hour').set({minute: 0, second: 0}).format("YYYY-MM-DD HH:mm"),
|
||||
stm: moment().subtract(7, 'days').add(1, 'hour').set({minute: 0, second: 0}).format("YYYY-MM-DD HH:mm"),
|
||||
tm: [
|
||||
moment().subtract(7, 'days').add(1, 'hour').set({ minute: 0, second: 0 }),
|
||||
moment().add(1, 'hour').set({ minute: 0, second: 0 }),
|
||||
],
|
||||
}
|
||||
|
||||
setParams(options)
|
||||
|
||||
}, [])
|
||||
return (
|
||||
<PanelBox
|
||||
style={style}
|
||||
title="未来24小时用水"
|
||||
color="green"
|
||||
// tabs={
|
||||
// <span className="button-group">
|
||||
// <span className={clsx({ active: tableRzFilter.sh })} onClick={() => toggleStType('sh')}>山洪</span>
|
||||
// <span className={clsx({ active: tableRzFilter.sw })} onClick={() => toggleStType('sw')}>水文</span>
|
||||
// </span>
|
||||
// }
|
||||
extra={
|
||||
<>
|
||||
{/* <i style={{ marginRight: '0.5rem', color: hdAutoRefresh ? '#00deff' : '#aaa' }} className="ionicons loop cursor-pointer" onClick={toggleAutoRefresh}></i> */}
|
||||
{/* <i className="ionicons gear cursor-pointer" onClick={() => showSetting(true)}></i> */}
|
||||
</>
|
||||
}
|
||||
>
|
||||
<div style={{display:'flex',columnGap:10}}>
|
||||
<div className='tm' style={{ position: "relative", zIndex: 999999, color: "#fff", width: "60%", margin: '10px' }}>
|
||||
<RangePicker
|
||||
// width="100%"
|
||||
className='time-picker'
|
||||
style={{
|
||||
flex: 1,
|
||||
background: "transparent",
|
||||
border: "none",
|
||||
color: "#fff",
|
||||
}}
|
||||
onChange={searchTm}
|
||||
allowClear
|
||||
format="YYYY-MM-DD HH:mm"
|
||||
showTime={{
|
||||
format: 'HH:mm',
|
||||
}}
|
||||
value={params.tm}
|
||||
getPopupContainer={trigger => trigger.parentElement}
|
||||
/>
|
||||
</div>
|
||||
<div style={{marginBottom:10}}>
|
||||
<FormControl sx={{ minWidth: 200, marginBottom: 2 }}>
|
||||
<InputLabel id="analysis-select-label"></InputLabel>
|
||||
<Select
|
||||
labelId="analysis-select-label"
|
||||
value={dimension}
|
||||
label=""
|
||||
onChange={(event) => {
|
||||
const value = event.target.value;
|
||||
setDimension(value);
|
||||
}}
|
||||
sx={{
|
||||
color: '#fff',
|
||||
'.MuiOutlinedInput-notchedOutline': {
|
||||
borderColor: 'rgba(255, 255, 255, 0.3)',
|
||||
},
|
||||
'&:hover .MuiOutlinedInput-notchedOutline': {
|
||||
borderColor: 'rgba(255, 255, 255, 0.6)',
|
||||
},
|
||||
'&.Mui-focused .MuiOutlinedInput-notchedOutline': {
|
||||
borderColor: '#fff',
|
||||
}
|
||||
}}
|
||||
>
|
||||
<MenuItem value="ft">时间序列</MenuItem>
|
||||
<MenuItem value="lc">回归分析</MenuItem>
|
||||
<MenuItem value="mz">机器学习</MenuItem>
|
||||
<MenuItem value="sb">混合模型</MenuItem>
|
||||
<MenuItem value="htg">深度学习</MenuItem>
|
||||
</Select>
|
||||
</FormControl>
|
||||
</div>
|
||||
</div>
|
||||
<ReactEcharts
|
||||
option={option}
|
||||
style={{ height: '100%', width: '100%' }}
|
||||
/>
|
||||
{
|
||||
setting && <Setting onClose={() => showSetting(false)} />
|
||||
}
|
||||
</PanelBox>
|
||||
)
|
||||
}
|
||||
|
||||
export default HDReal;
|
||||
|
|
@ -0,0 +1,90 @@
|
|||
|
||||
.tm{
|
||||
width: 40%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
border-radius: 2px;
|
||||
color: #fff;
|
||||
background: linear-gradient(270deg,rgba(65,76,217,.4),rgba(58,85,218,.2) 14%,rgba(54,90,218,0) 49%,rgba(51,94,218,.2) 86%,rgba(44,102,219,.4));
|
||||
border: 1px solid #0e4e93;
|
||||
|
||||
.MuiInput-underline:before{
|
||||
border: 0px;
|
||||
}
|
||||
.time-picker{
|
||||
.ant-picker-input > input{
|
||||
color: #fff;
|
||||
}
|
||||
.ant-picker-separator{
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
.time-type {
|
||||
margin-left: 10rem;
|
||||
display: flex;
|
||||
cursor: pointer;
|
||||
background-color: #393e45;
|
||||
border-radius: 5%;
|
||||
padding: 0.01% !important;
|
||||
border: 1px solid #585e64;
|
||||
div {
|
||||
width: 80px;
|
||||
border-radius: 5%;
|
||||
text-align: center;
|
||||
border: 1px solid #585e64;
|
||||
padding: 4px 0;
|
||||
}
|
||||
|
||||
.active {
|
||||
color: #5FB7FF;
|
||||
// background: #F0F7FF;
|
||||
border: 1px solid #5FB7FF;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.ant-picker-panel-container{
|
||||
background-color: rgba(36, 46, 92,1) !important;
|
||||
|
||||
}
|
||||
.ant-picker-header,.ant-picker-body{
|
||||
color: #fff !important;
|
||||
border-color: #242e5c;
|
||||
}
|
||||
.ant-picker-content th{
|
||||
color: #fff !important;
|
||||
}
|
||||
.ant-picker-cell,
|
||||
.ant-picker-header-super-prev-btn,
|
||||
.ant-picker-header-prev-btn,
|
||||
.ant-picker-header-next-btn,
|
||||
.ant-picker-header-super-next-btn
|
||||
{
|
||||
color: #fff !important;
|
||||
}
|
||||
.ant-picker-cell:hover:not(.ant-picker-cell-selected):not(.ant-picker-cell-range-start):not(.ant-picker-cell-range-end):not(.ant-picker-cell-range-hover-start):not(.ant-picker-cell-range-hover-end) .ant-picker-cell-inner{
|
||||
// background: transparent !important;
|
||||
color: #000;
|
||||
}
|
||||
.ant-picker-cell-in-view.ant-picker-cell-in-range::before,
|
||||
.ant-picker-cell-in-view.ant-picker-cell-range-end:not(.ant-picker-cell-range-end-single)::before,
|
||||
.ant-picker-cell-in-view.ant-picker-cell-range-start:not(.ant-picker-cell-range-start-single)::before
|
||||
{
|
||||
background-color:transparent !important;
|
||||
}
|
||||
.ant-picker-time-panel-column > li.ant-picker-time-panel-cell-selected .ant-picker-time-panel-cell-inner{
|
||||
background-color: #1890ff !important;
|
||||
}
|
||||
.ant-picker-time-panel-column > li.ant-picker-time-panel-cell .ant-picker-time-panel-cell-inner:hover{
|
||||
// background-color:transparent !important;
|
||||
color: #000 !important;
|
||||
}
|
||||
.ant-picker-header-super-next-btn,.ant-picker-time-panel-cell-inner
|
||||
{
|
||||
color: #fff !important;
|
||||
}
|
||||
|
|
@ -20,7 +20,8 @@ import config from '../../../../config';
|
|||
import moment from 'moment';
|
||||
import showData from './constant'
|
||||
import ReactECharts from 'echarts-for-react';
|
||||
|
||||
import {TextField} from '@material-ui/core/index';
|
||||
import { styled } from '@material-ui/styles';
|
||||
function rzRender(rz, base) {
|
||||
return (
|
||||
<DpTableCell align="right" style={{ color: rz >= base ? 'red' : '#fff' }}>
|
||||
|
|
@ -30,6 +31,37 @@ function rzRender(rz, base) {
|
|||
}
|
||||
|
||||
function HDReal({ style }) {
|
||||
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}
|
||||
/>
|
||||
);
|
||||
};
|
||||
const dispatch = useDispatch();
|
||||
const tableRzFilter = useSelector(s => s.realview.tableRzFilter);
|
||||
const hdAutoRefresh = useSelector(s => s.realview.hdAutoRefresh);
|
||||
|
|
@ -124,7 +156,7 @@ const option = {
|
|||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
name: '流量',
|
||||
name: '流量m³/h',
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
type: 'dashed',
|
||||
|
|
@ -193,6 +225,12 @@ const option = {
|
|||
</>
|
||||
}
|
||||
>
|
||||
<div style={{width:'80%',margin:'10px'}}>
|
||||
<CustomTextField
|
||||
label="DMA分区查询"
|
||||
onChange={(e) => console.log(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
<ReactECharts
|
||||
option={option}
|
||||
style={{ height: '400px', width: '100%' }}
|
||||
|
|
|
|||
|
|
@ -18,6 +18,8 @@ import Setting from './Setting';
|
|||
import { InfoPopNames } from '../../InfoPops';
|
||||
import config from '../../../../config';
|
||||
import moment from 'moment';
|
||||
import { Switch, FormControlLabel,InputLabel, Select, MenuItem,FormControl } from '@material-ui/core/index'
|
||||
import { styled } from '@material-ui/styles';
|
||||
|
||||
function rzRender(rz, base) {
|
||||
return (
|
||||
|
|
@ -31,6 +33,29 @@ function HDReal({ style }) {
|
|||
const dispatch = useDispatch();
|
||||
const tableRzFilter = useSelector(s => s.realview.tableRzFilter);
|
||||
const hdAutoRefresh = useSelector(s => s.realview.hdAutoRefresh);
|
||||
const CustomSwitch = styled(Switch)({
|
||||
'& .MuiSwitch-switchBase': {
|
||||
color: '#fff',
|
||||
'&.Mui-checked': {
|
||||
color: '#1890ff',
|
||||
'& + .MuiSwitch-track': {
|
||||
backgroundColor: '#1890ff',
|
||||
opacity: 0.5,
|
||||
},
|
||||
},
|
||||
},
|
||||
'& .MuiSwitch-track': {
|
||||
backgroundColor: 'rgba(255, 255, 255, 0.3)',
|
||||
},
|
||||
});
|
||||
|
||||
const StyledFormControlLabel = styled(FormControlLabel)({
|
||||
'& .MuiFormControlLabel-label': {
|
||||
color: '#fff'
|
||||
}
|
||||
});
|
||||
const [dimension, setDimension] = useState('fqh');
|
||||
const [checked, setChecked] = React.useState(false);
|
||||
// const t = useRefresh(hdAutoRefresh ? 60 * 1000 : 0);
|
||||
// let { data } = useRequest(HDRealPromise.get, t);
|
||||
const [setting, showSetting] = useState(false);
|
||||
|
|
@ -82,7 +107,20 @@ function HDReal({ style }) {
|
|||
dispatch.realview.setHdAutoRefresh(!hdAutoRefresh);
|
||||
}
|
||||
|
||||
const switchChange = (e) => {
|
||||
const val = e.target.checked
|
||||
setChecked(val)
|
||||
if (val) {
|
||||
dispatch.runtime.setCameraTarget({
|
||||
center: [114.81944, 31.12068],
|
||||
zoom: 13,
|
||||
pitch: 60,
|
||||
});
|
||||
} else {
|
||||
dispatch.runtime.setHome();
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<PanelBox
|
||||
|
|
@ -122,6 +160,49 @@ function HDReal({ style }) {
|
|||
</TableBody>
|
||||
</Table>
|
||||
</TableContainer>
|
||||
<div style={{ position: 'absolute', color: '#fff', top: 70, left: -280, display: 'flex', alignItems: 'center' }}>
|
||||
|
||||
<StyledFormControlLabel
|
||||
control={
|
||||
<CustomSwitch
|
||||
checked={checked}
|
||||
onChange={switchChange}
|
||||
/>
|
||||
}
|
||||
label="多灌区模式"
|
||||
/>
|
||||
{checked && <div style={{ marginTop: "-15px" }}>
|
||||
<FormControl sx={{ minWidth: 200, marginBottom: 2 }}>
|
||||
<InputLabel id="analysis-select-label"></InputLabel>
|
||||
<Select
|
||||
labelId="analysis-select-label"
|
||||
value={dimension}
|
||||
label=""
|
||||
onChange={(event) => {
|
||||
const value = event.target.value;
|
||||
setDimension(value);
|
||||
}}
|
||||
sx={{
|
||||
color: '#fff',
|
||||
'.MuiOutlinedInput-notchedOutline': {
|
||||
borderColor: 'rgba(255, 255, 255, 0.3)',
|
||||
},
|
||||
'&:hover .MuiOutlinedInput-notchedOutline': {
|
||||
borderColor: 'rgba(255, 255, 255, 0.6)',
|
||||
},
|
||||
'&.Mui-focused .MuiOutlinedInput-notchedOutline': {
|
||||
borderColor: '#fff',
|
||||
}
|
||||
}}
|
||||
>
|
||||
<MenuItem value="fqh">浮桥河灌区</MenuItem>
|
||||
<MenuItem value="shk">三河口水库灌区</MenuItem>
|
||||
<MenuItem value="qjs">群建水库灌区</MenuItem>
|
||||
<MenuItem value="dsb">大石板灌区</MenuItem>
|
||||
</Select>
|
||||
</FormControl>
|
||||
</div>}
|
||||
</div>
|
||||
</PanelBox>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -18,6 +18,9 @@ import Setting from './Setting';
|
|||
import { InfoPopNames } from '../../InfoPops';
|
||||
import config from '../../../../config';
|
||||
import moment from 'moment';
|
||||
import { styled } from '@material-ui/styles';
|
||||
|
||||
import { Switch, FormControlLabel,InputLabel, Select, MenuItem,FormControl } from '@material-ui/core/index'
|
||||
import { DatePicker } from 'antd';
|
||||
const { RangePicker } = DatePicker;
|
||||
|
||||
|
|
@ -33,6 +36,29 @@ function HDReal({ style }) {
|
|||
const dispatch = useDispatch();
|
||||
const tableRzFilter = useSelector(s => s.realview.tableRzFilter);
|
||||
const hdAutoRefresh = useSelector(s => s.realview.hdAutoRefresh);
|
||||
const CustomSwitch = styled(Switch)({
|
||||
'& .MuiSwitch-switchBase': {
|
||||
color: '#fff',
|
||||
'&.Mui-checked': {
|
||||
color: '#1890ff',
|
||||
'& + .MuiSwitch-track': {
|
||||
backgroundColor: '#1890ff',
|
||||
opacity: 0.5,
|
||||
},
|
||||
},
|
||||
},
|
||||
'& .MuiSwitch-track': {
|
||||
backgroundColor: 'rgba(255, 255, 255, 0.3)',
|
||||
},
|
||||
});
|
||||
|
||||
const StyledFormControlLabel = styled(FormControlLabel)({
|
||||
'& .MuiFormControlLabel-label': {
|
||||
color: '#fff'
|
||||
}
|
||||
});
|
||||
const [dimension, setDimension] = useState('fqh');
|
||||
const [checked, setChecked] = React.useState(false);
|
||||
// const t = useRefresh(hdAutoRefresh ? 60 * 1000 : 0);
|
||||
// let { data } = useRequest(HDRealPromise.get, t);
|
||||
const [setting, showSetting] = useState(false);
|
||||
|
|
@ -83,6 +109,21 @@ function HDReal({ style }) {
|
|||
const toggleAutoRefresh = () => {
|
||||
dispatch.realview.setHdAutoRefresh(!hdAutoRefresh);
|
||||
}
|
||||
const switchChange = (e) => {
|
||||
const val = e.target.checked
|
||||
setChecked(val)
|
||||
if (val) {
|
||||
dispatch.runtime.setCameraTarget({
|
||||
center: [114.81944, 31.12068],
|
||||
zoom: 13,
|
||||
pitch: 60,
|
||||
});
|
||||
} else {
|
||||
dispatch.runtime.setHome();
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
const [params, setParams] = useState({ tm: [] })
|
||||
|
||||
const searchTm = (e) => {
|
||||
|
|
@ -180,6 +221,49 @@ function HDReal({ style }) {
|
|||
{
|
||||
setting && <Setting onClose={() => showSetting(false)} />
|
||||
}
|
||||
<div style={{ position: 'absolute', color: '#fff', top: 70, left: -280, display: 'flex', alignItems: 'center' }}>
|
||||
|
||||
<StyledFormControlLabel
|
||||
control={
|
||||
<CustomSwitch
|
||||
checked={checked}
|
||||
onChange={switchChange}
|
||||
/>
|
||||
}
|
||||
label="多灌区模式"
|
||||
/>
|
||||
{checked && <div style={{ marginTop: "-15px" }}>
|
||||
<FormControl sx={{ minWidth: 200, marginBottom: 2 }}>
|
||||
<InputLabel id="analysis-select-label"></InputLabel>
|
||||
<Select
|
||||
labelId="analysis-select-label"
|
||||
value={dimension}
|
||||
label=""
|
||||
onChange={(event) => {
|
||||
const value = event.target.value;
|
||||
setDimension(value);
|
||||
}}
|
||||
sx={{
|
||||
color: '#fff',
|
||||
'.MuiOutlinedInput-notchedOutline': {
|
||||
borderColor: 'rgba(255, 255, 255, 0.3)',
|
||||
},
|
||||
'&:hover .MuiOutlinedInput-notchedOutline': {
|
||||
borderColor: 'rgba(255, 255, 255, 0.6)',
|
||||
},
|
||||
'&.Mui-focused .MuiOutlinedInput-notchedOutline': {
|
||||
borderColor: '#fff',
|
||||
}
|
||||
}}
|
||||
>
|
||||
<MenuItem value="fqh">浮桥河灌区</MenuItem>
|
||||
<MenuItem value="shk">三河口水库灌区</MenuItem>
|
||||
<MenuItem value="qjs">群建水库灌区</MenuItem>
|
||||
<MenuItem value="dsb">大石板灌区</MenuItem>
|
||||
</Select>
|
||||
</FormControl>
|
||||
</div>}
|
||||
</div>
|
||||
</PanelBox>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,9 +4,11 @@ import MiniSinglePie from './MiniSinglePie'
|
|||
import clsx from 'clsx';
|
||||
import { Switch, FormControlLabel,InputLabel, Select, MenuItem,FormControl } from '@material-ui/core/index'
|
||||
import { styled } from '@material-ui/styles';
|
||||
|
||||
import { useDispatch, useSelector } from 'react-redux';
|
||||
|
||||
export default function GQ({ style }) {
|
||||
const dispatch = useDispatch();
|
||||
|
||||
const v1 = 20;
|
||||
const v2 = 32;
|
||||
const r = (v1 * 100 / v2).toFixed(1);
|
||||
|
|
@ -38,7 +40,20 @@ export default function GQ({ style }) {
|
|||
});
|
||||
const [dimension, setDimension] = useState('fqh');
|
||||
const [checked, setChecked] = React.useState(false);
|
||||
|
||||
const switchChange = (e) => {
|
||||
const val = e.target.checked
|
||||
setChecked(val)
|
||||
if (val) {
|
||||
dispatch.runtime.setCameraTarget({
|
||||
center: [114.81944, 31.12068],
|
||||
zoom: 13,
|
||||
pitch: 60,
|
||||
});
|
||||
} else {
|
||||
dispatch.runtime.setHome();
|
||||
|
||||
}
|
||||
}
|
||||
return (
|
||||
<PanelBox
|
||||
style={style}
|
||||
|
|
@ -97,7 +112,7 @@ export default function GQ({ style }) {
|
|||
control={
|
||||
<CustomSwitch
|
||||
checked={checked}
|
||||
onChange={(e) => setChecked(e.target.checked)}
|
||||
onChange={switchChange}
|
||||
/>
|
||||
}
|
||||
label="多灌区模式"
|
||||
|
|
|
|||
|
|
@ -64,7 +64,7 @@ export default function GQ({ style }) {
|
|||
</Select>
|
||||
</FormControl>
|
||||
</div> */}
|
||||
<img src={`${process.env.PUBLIC_URL}/assets/lyhq.png`} alt="" style={{width:421,height:'50%'}}/>
|
||||
<img src={`${process.env.PUBLIC_URL}/assets/lyhq.png`} alt="" style={{width:421,height:'50%',marginTop:-20}}/>
|
||||
<img src={`${process.env.PUBLIC_URL}/assets/dswgj.png`} alt="" style={{width:421,height:'50%'}}/>
|
||||
</div>
|
||||
</PanelBox>
|
||||
|
|
|
|||
|
|
@ -1,13 +1,53 @@
|
|||
import React from 'react';
|
||||
import React , { useState }from 'react';
|
||||
import { OverallPromise } from '../../../../models/_/real';
|
||||
import useRequest from '../../../../utils/useRequest';
|
||||
import PanelBox from '../../components/PanelBox';
|
||||
import OverallContent from './OverallContent';
|
||||
import { Switch, FormControlLabel,InputLabel, Select, MenuItem,FormControl } from '@material-ui/core/index'
|
||||
import { styled } from '@material-ui/styles';
|
||||
import { useDispatch, useSelector } from 'react-redux';
|
||||
|
||||
export default function Overall({ style }) {
|
||||
const dispatch = useDispatch();
|
||||
|
||||
const { data } = useRequest(OverallPromise.get);
|
||||
const CustomSwitch = styled(Switch)({
|
||||
'& .MuiSwitch-switchBase': {
|
||||
color: '#fff',
|
||||
'&.Mui-checked': {
|
||||
color: '#1890ff',
|
||||
'& + .MuiSwitch-track': {
|
||||
backgroundColor: '#1890ff',
|
||||
opacity: 0.5,
|
||||
},
|
||||
},
|
||||
},
|
||||
'& .MuiSwitch-track': {
|
||||
backgroundColor: 'rgba(255, 255, 255, 0.3)',
|
||||
},
|
||||
});
|
||||
|
||||
const StyledFormControlLabel = styled(FormControlLabel)({
|
||||
'& .MuiFormControlLabel-label': {
|
||||
color: '#fff'
|
||||
}
|
||||
});
|
||||
const [dimension, setDimension] = useState('fqh');
|
||||
const [checked, setChecked] = React.useState(false);
|
||||
const switchChange = (e) => {
|
||||
const val = e.target.checked
|
||||
setChecked(val)
|
||||
if (val) {
|
||||
dispatch.runtime.setCameraTarget({
|
||||
center: [114.81944, 31.12068],
|
||||
zoom: 13,
|
||||
pitch: 60,
|
||||
});
|
||||
} else {
|
||||
dispatch.runtime.setHome();
|
||||
|
||||
}
|
||||
}
|
||||
return (
|
||||
<PanelBox
|
||||
style={style}
|
||||
|
|
@ -15,6 +55,49 @@ export default function Overall({ style }) {
|
|||
color="green"
|
||||
>
|
||||
<OverallContent data={data} />
|
||||
<div style={{ position: 'absolute', color: '#fff', top: 70, left: -280, display: 'flex', alignItems: 'center' }}>
|
||||
|
||||
<StyledFormControlLabel
|
||||
control={
|
||||
<CustomSwitch
|
||||
checked={checked}
|
||||
onChange={switchChange}
|
||||
/>
|
||||
}
|
||||
label="多灌区模式"
|
||||
/>
|
||||
{checked && <div style={{ marginTop: "-15px" }}>
|
||||
<FormControl sx={{ minWidth: 200, marginBottom: 2 }}>
|
||||
<InputLabel id="analysis-select-label"></InputLabel>
|
||||
<Select
|
||||
labelId="analysis-select-label"
|
||||
value={dimension}
|
||||
label=""
|
||||
onChange={(event) => {
|
||||
const value = event.target.value;
|
||||
setDimension(value);
|
||||
}}
|
||||
sx={{
|
||||
color: '#fff',
|
||||
'.MuiOutlinedInput-notchedOutline': {
|
||||
borderColor: 'rgba(255, 255, 255, 0.3)',
|
||||
},
|
||||
'&:hover .MuiOutlinedInput-notchedOutline': {
|
||||
borderColor: 'rgba(255, 255, 255, 0.6)',
|
||||
},
|
||||
'&.Mui-focused .MuiOutlinedInput-notchedOutline': {
|
||||
borderColor: '#fff',
|
||||
}
|
||||
}}
|
||||
>
|
||||
<MenuItem value="fqh">浮桥河灌区</MenuItem>
|
||||
<MenuItem value="shk">三河口水库灌区</MenuItem>
|
||||
<MenuItem value="qjs">群建水库灌区</MenuItem>
|
||||
<MenuItem value="dsb">大石板灌区</MenuItem>
|
||||
</Select>
|
||||
</FormControl>
|
||||
</div>}
|
||||
</div>
|
||||
</PanelBox>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -96,7 +96,7 @@ const showData = Array(1).fill(0).map((o, i) => ({
|
|||
return (
|
||||
<PanelBox
|
||||
style={style}
|
||||
title="统计分析"
|
||||
title="巡查维护清单"
|
||||
color="green"
|
||||
tabs={
|
||||
<span className="button-group">
|
||||
|
|
|
|||
|
|
@ -1937,10 +1937,192 @@ const data4 = [
|
|||
}
|
||||
]
|
||||
|
||||
const data5 = [
|
||||
{
|
||||
"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-15 10:01:56",
|
||||
"del": "0",
|
||||
"planId": "421181001000000",
|
||||
"planName": "宋埠镇洪涝天气水厂防淹应急调度与推演预案",
|
||||
"levels": "1",
|
||||
"year": "2025",
|
||||
"adnm": "龙池桥街道",
|
||||
"adcd": "421181001000000",
|
||||
"attachUpdateTime": "2025-05-15 10:01:55",
|
||||
"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-15 15:35:33",
|
||||
"del": "0",
|
||||
"planId": "421181001001000",
|
||||
"planName": "木子店镇水质污染应急切换水源与推演预案",
|
||||
"levels": "0",
|
||||
"year": "2025",
|
||||
"adnm": "园林社区居民委员会",
|
||||
"adcd": "421181001001000",
|
||||
"attachUpdateTime": "2025-05-15 15:35:33",
|
||||
"status": 0,
|
||||
"uploadAttachStatus": "1",
|
||||
"padNm": "421181001001000",
|
||||
"url": "dplan/2025/421181001001000/园林社区居民委员会山洪灾害防御预案.pdf"
|
||||
},
|
||||
{
|
||||
"id": 125975,
|
||||
"reviewStatus": "2",
|
||||
"createTime": "2025-05-03 21:25:23",
|
||||
"updateId": "187",
|
||||
"updateName": "麻城市",
|
||||
"updateTime": "2025-05-15 15:35:33",
|
||||
"del": "0",
|
||||
"planId": "421181001001000",
|
||||
"planName": "龙池桥镇水质污染应急切换水源与推演预案",
|
||||
"levels": "0",
|
||||
"year": "2025",
|
||||
"adnm": "园林社区居民委员会",
|
||||
"adcd": "421181001001000",
|
||||
"attachUpdateTime": "2025-05-15 15:35:33",
|
||||
"status": 0,
|
||||
"uploadAttachStatus": "1",
|
||||
"padNm": "421181001001000",
|
||||
"url": "dplan/2025/421181001001000/园林社区居民委员会山洪灾害防御预案.pdf"
|
||||
}, {
|
||||
"id": 125975,
|
||||
"reviewStatus": "2",
|
||||
"createTime": "2025-05-03 21:25:23",
|
||||
"updateId": "187",
|
||||
"updateName": "麻城市",
|
||||
"updateTime": "2025-05-15 15:35:33",
|
||||
"del": "0",
|
||||
"planId": "421181001001000",
|
||||
"planName": "福田镇水质污染应急切换水源与推演预案",
|
||||
"levels": "0",
|
||||
"year": "2025",
|
||||
"adnm": "园林社区居民委员会",
|
||||
"adcd": "421181001001000",
|
||||
"attachUpdateTime": "2025-05-15 15:35:33",
|
||||
"status": 0,
|
||||
"uploadAttachStatus": "1",
|
||||
"padNm": "421181001001000",
|
||||
"url": "dplan/2025/421181001001000/园林社区居民委员会山洪灾害防御预案.pdf"
|
||||
},
|
||||
]
|
||||
const country =['中馆驿镇', '宋埠镇', '歧亭镇', '白果镇', '夫子河镇', '阎家河镇', '龟山镇', '盐田河镇', '张家畈镇', '木子店镇', '三河口镇', '黄土岗镇', '福田河镇', '乘马岗镇', '顺河镇'];
|
||||
const ghData = Array(13).fill(0).map((item,i) => (
|
||||
{
|
||||
"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": `麻城市山洪灾害防御预案`,
|
||||
"planName1": `${country[i]}干旱天气供水应急调度与推演预案`,
|
||||
"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"
|
||||
}
|
||||
))
|
||||
|
||||
const hlData = Array(13).fill(0).map((item,i) => (
|
||||
{
|
||||
"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": `麻城市山洪灾害防御预案`,
|
||||
"planName1": `${country[i]}洪涝天气水厂防淹应急调度与推演预案`,
|
||||
"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"
|
||||
}
|
||||
))
|
||||
const szData = Array(13).fill(0).map((item,i) => (
|
||||
{
|
||||
"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": `麻城市山洪灾害防御预案`,
|
||||
"planName1": `${country[i]}水质污染应急切换水源与推演预案`,
|
||||
"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"
|
||||
}
|
||||
))
|
||||
function DrpReal({ style }) {
|
||||
const [tab,setTab] = useState('1')
|
||||
const dispatch = useDispatch();
|
||||
|
||||
const rep = useMemo(() => {
|
||||
if (tab == 1) {
|
||||
return ghData;
|
||||
} else if (tab == 2) {
|
||||
return hlData
|
||||
} else if (tab == 3) {
|
||||
return szData
|
||||
} else {
|
||||
return [];
|
||||
}
|
||||
},[tab])
|
||||
return (
|
||||
<PanelBox
|
||||
style={style}
|
||||
|
|
@ -1966,13 +2148,13 @@ function DrpReal({ style }) {
|
|||
</TableRow>
|
||||
</TableHead>
|
||||
<TableBody>
|
||||
{data4.map((row,index) => (
|
||||
{rep.map((row,index) => (
|
||||
<DpTableRow key={row.stcd}>
|
||||
<DpTableCell align="center">{index+1}</DpTableCell>
|
||||
<DpTableCell component="th" scope="row">
|
||||
<div className="table-ellipsis cursor-pointer" onClick={() => {
|
||||
dispatch?.runtime.setInfoDlg({ layerId: 'PdfLayer', properties: row })
|
||||
}}>{row.planName}</div>
|
||||
}}>{row.planName1}</div>
|
||||
</DpTableCell>
|
||||
<DpTableCell align="center">{row.updateTime.slice(0,10)}</DpTableCell>
|
||||
</DpTableRow>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,67 @@
|
|||
import React from 'react';
|
||||
|
||||
import Dialog from '@material-ui/core/Dialog';
|
||||
import DialogContent from '@material-ui/core/DialogContent';
|
||||
import DpPaperComponent from '../../../../layouts/mui/DpPaperCompanent';
|
||||
import { FormGroup, MenuItem, Select, Switch, Typography } from '@material-ui/core';
|
||||
import DpDialogTitle from '../../../../layouts/mui/DpDialogTitle';
|
||||
import { useDispatch, useSelector } from 'react-redux';
|
||||
import { getLayerSetting, getLayerVisible } from '../../../../models/map/selectors';
|
||||
import DpBackgroundDrop from '../../../../layouts/mui/DpBackdrop';
|
||||
|
||||
|
||||
function Setting({ onClose }) {
|
||||
const layerVisible = useSelector(getLayerVisible);
|
||||
const layerSetting = useSelector(getLayerSetting);
|
||||
|
||||
const dispath = useDispatch();
|
||||
|
||||
return (
|
||||
<Dialog
|
||||
open={true}
|
||||
onClose={onClose}
|
||||
maxWidth="xl"
|
||||
style={{ borderRadius: 0 }}
|
||||
PaperComponent={DpPaperComponent}
|
||||
BackdropComponent={DpBackgroundDrop}
|
||||
>
|
||||
<div className="boxhead"></div>
|
||||
|
||||
<DpDialogTitle>实时雨量显示设置</DpDialogTitle>
|
||||
<DialogContent>
|
||||
<div style={{ width: 320, padding: '1rem 0' }}>
|
||||
<FormGroup>
|
||||
<div style={{ marginBottom: '2rem' }}>
|
||||
<Typography variant="subtitle2">地图实时雨量显示雨量时段</Typography>
|
||||
<Select
|
||||
style={{ fontSize: '1.2rem' }}
|
||||
fullWidth
|
||||
value={layerSetting.drplabel}
|
||||
onChange={(event) => dispath.map.setLayerSetting({ drplabel: event.target.value })}
|
||||
>
|
||||
<MenuItem value="h1">小时雨量</MenuItem>
|
||||
<MenuItem value="h3">3小时雨量</MenuItem>
|
||||
<MenuItem value="h6">6小时雨量</MenuItem>
|
||||
<MenuItem value="h12">12小时雨量</MenuItem>
|
||||
<MenuItem value="h24">24小时雨量</MenuItem>
|
||||
<MenuItem value="h48">48小时雨量</MenuItem>
|
||||
</Select>
|
||||
</div>
|
||||
<div style={{ marginBottom: '1rem' }}>
|
||||
<Typography variant="subtitle2">显示实时雨量图层</Typography>
|
||||
<Switch
|
||||
checked={!!layerVisible.RealDrpLayer}
|
||||
color="primary"
|
||||
edge="start"
|
||||
onChange={(e) => dispath.map.setLayerVisible({ RealDrpLayer: e.target.checked })}
|
||||
/>
|
||||
</div>
|
||||
</FormGroup>
|
||||
</div>
|
||||
</DialogContent>
|
||||
<div className="boxfoot"></div>
|
||||
</Dialog>
|
||||
)
|
||||
}
|
||||
|
||||
export default Setting;
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -15,11 +15,10 @@ import Shqx from './Shqx';
|
|||
import ShYj from './ShYj';
|
||||
import { styled } from '@material-ui/styles';
|
||||
|
||||
import { RadioGroup, FormControlLabel, Radio, FormControl, FormLabel } from '@material-ui/core/index';
|
||||
import { RadioGroup,Radio, Switch, FormControlLabel,InputLabel, Select, MenuItem,FormControl } from '@material-ui/core/index';
|
||||
import { backgroundColor } from 'echarts/lib/theme/dark';
|
||||
import { Description } from '@material-ui/icons';
|
||||
import DescriptionItem from '../../components/DescrptionItem';
|
||||
import { log } from '@craco/craco/lib/logger';
|
||||
export default function Warn({ style }) {
|
||||
const dispatch = useDispatch();
|
||||
const res = useSelector(s=>s.runtime.yyObj)
|
||||
|
|
@ -41,6 +40,29 @@ const [yyValue, setYyValue] = React.useState(false);
|
|||
}
|
||||
});
|
||||
|
||||
const CustomSwitch = styled(Switch)({
|
||||
'& .MuiSwitch-switchBase': {
|
||||
color: '#fff',
|
||||
'&.Mui-checked': {
|
||||
color: '#1890ff',
|
||||
'& + .MuiSwitch-track': {
|
||||
backgroundColor: '#1890ff',
|
||||
opacity: 0.5,
|
||||
},
|
||||
},
|
||||
},
|
||||
'& .MuiSwitch-track': {
|
||||
backgroundColor: 'rgba(255, 255, 255, 0.3)',
|
||||
},
|
||||
});
|
||||
|
||||
const StyledFormControlLabel1 = styled(FormControlLabel)({
|
||||
'& .MuiFormControlLabel-label': {
|
||||
color: '#fff'
|
||||
}
|
||||
});
|
||||
const [dimension, setDimension] = useState('fqh');
|
||||
const [checked, setChecked] = React.useState(false);
|
||||
const fayy = () => {
|
||||
setYyValue(true)
|
||||
if (value) {
|
||||
|
|
@ -50,7 +72,20 @@ const [yyValue, setYyValue] = React.useState(false);
|
|||
useEffect(() => {
|
||||
setValue(res.yy)
|
||||
}, [res])
|
||||
|
||||
const switchChange = (e) => {
|
||||
const val = e.target.checked
|
||||
setChecked(val)
|
||||
if (val) {
|
||||
dispatch.runtime.setCameraTarget({
|
||||
center: [114.81944, 31.12068],
|
||||
zoom: 13,
|
||||
pitch: 60,
|
||||
});
|
||||
} else {
|
||||
dispatch.runtime.setHome();
|
||||
|
||||
}
|
||||
}
|
||||
return (
|
||||
<PanelBox
|
||||
style={{...style,position:'relative'}}
|
||||
|
|
@ -83,7 +118,51 @@ const [yyValue, setYyValue] = React.useState(false);
|
|||
{/* <div>
|
||||
<img src={`${process.env.PUBLIC_URL}/assets/sl.jpg`} alt="" style={{ width: 421}} />
|
||||
</div> */}
|
||||
</div>}
|
||||
</div>}
|
||||
|
||||
<div style={{ position: 'absolute', color: '#fff', top: 70, left: -280, display: 'flex', alignItems: 'center' }}>
|
||||
|
||||
<StyledFormControlLabel1
|
||||
control={
|
||||
<CustomSwitch
|
||||
checked={checked}
|
||||
onChange={switchChange}
|
||||
/>
|
||||
}
|
||||
label="多灌区模式"
|
||||
/>
|
||||
{checked && <div style={{ marginTop: "-15px" }}>
|
||||
<FormControl sx={{ minWidth: 200, marginBottom: 2 }}>
|
||||
<InputLabel id="analysis-select-label"></InputLabel>
|
||||
<Select
|
||||
labelId="analysis-select-label"
|
||||
value={dimension}
|
||||
label=""
|
||||
onChange={(event) => {
|
||||
const value = event.target.value;
|
||||
setDimension(value);
|
||||
}}
|
||||
sx={{
|
||||
color: '#fff',
|
||||
'.MuiOutlinedInput-notchedOutline': {
|
||||
borderColor: 'rgba(255, 255, 255, 0.3)',
|
||||
},
|
||||
'&:hover .MuiOutlinedInput-notchedOutline': {
|
||||
borderColor: 'rgba(255, 255, 255, 0.6)',
|
||||
},
|
||||
'&.Mui-focused .MuiOutlinedInput-notchedOutline': {
|
||||
borderColor: '#fff',
|
||||
}
|
||||
}}
|
||||
>
|
||||
<MenuItem value="fqh">浮桥河灌区</MenuItem>
|
||||
<MenuItem value="shk">三河口水库灌区</MenuItem>
|
||||
<MenuItem value="qjs">群建水库灌区</MenuItem>
|
||||
<MenuItem value="dsb">大石板灌区</MenuItem>
|
||||
</Select>
|
||||
</FormControl>
|
||||
</div>}
|
||||
</div>
|
||||
</div>
|
||||
</PanelBox>
|
||||
)
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
import React, { useMemo, useState,useEffect } from 'react';
|
||||
import React, { useMemo, useState, useEffect } from 'react';
|
||||
import useRequest from '../../../../utils/useRequest';
|
||||
import PanelBox from '../../components/PanelBox';
|
||||
|
||||
|
|
@ -55,12 +55,12 @@ function HDReal({ style }) {
|
|||
// return ret;
|
||||
// }, [data, tableRzFilter]);
|
||||
|
||||
const showData = Array(1).fill(0).map((o,i) => ({
|
||||
const showData = Array(1).fill(0).map((o, i) => ({
|
||||
date: '2025-05-26',
|
||||
event: '侵占河道',
|
||||
type: '侵占河道',
|
||||
status: '待处理',
|
||||
place:'浮桥河灌区'
|
||||
place: '浮桥河灌区'
|
||||
}))
|
||||
|
||||
const flyTo = (record) => {
|
||||
|
|
@ -76,7 +76,7 @@ function HDReal({ style }) {
|
|||
}
|
||||
|
||||
|
||||
const data = [
|
||||
const data = [
|
||||
{ name: '福田镇中心区', leakage: '1258.6', supply: '3526.8', rate: 35.6 },
|
||||
{ name: '木子店镇区', leakage: '986.3', supply: '2832.7', rate: 34.8 },
|
||||
{ name: '龙池桥镇区', leakage: '1485.5', supply: '4482.5', rate: 33.1 },
|
||||
|
|
@ -97,28 +97,28 @@ function HDReal({ style }) {
|
|||
dispatch.realview.setHdAutoRefresh(!hdAutoRefresh);
|
||||
}
|
||||
|
||||
const searchTm = (e) => {
|
||||
setParams({
|
||||
...params,
|
||||
stm: e[0].format("YYYY-MM-DD HH:mm"),
|
||||
etm: e[1].format("YYYY-MM-DD HH:mm"),
|
||||
tm:e,
|
||||
})
|
||||
};
|
||||
useEffect(() => {
|
||||
let options = "";
|
||||
options = {
|
||||
etm: moment().add(1, 'hour').set({minute: 0, second: 0}).format("YYYY-MM-DD HH:mm"),
|
||||
stm: moment().subtract(7, 'days').add(1, 'hour').set({minute: 0, second: 0}).format("YYYY-MM-DD HH:mm"),
|
||||
tm: [
|
||||
moment().subtract(7, 'days').add(1, 'hour').set({ minute: 0, second: 0 }),
|
||||
moment().add(1, 'hour').set({ minute: 0, second: 0 }),
|
||||
],
|
||||
}
|
||||
|
||||
setParams(options)
|
||||
|
||||
}, [])
|
||||
const searchTm = (e) => {
|
||||
setParams({
|
||||
...params,
|
||||
stm: e[0].format("YYYY-MM-DD HH:mm"),
|
||||
etm: e[1].format("YYYY-MM-DD HH:mm"),
|
||||
tm: e,
|
||||
})
|
||||
};
|
||||
useEffect(() => {
|
||||
let options = "";
|
||||
options = {
|
||||
etm: moment().add(1, 'hour').set({ minute: 0, second: 0 }).format("YYYY-MM-DD HH:mm"),
|
||||
stm: moment().subtract(7, 'days').add(1, 'hour').set({ minute: 0, second: 0 }).format("YYYY-MM-DD HH:mm"),
|
||||
tm: [
|
||||
moment().subtract(7, 'days').add(1, 'hour').set({ minute: 0, second: 0 }),
|
||||
moment().add(1, 'hour').set({ minute: 0, second: 0 }),
|
||||
],
|
||||
}
|
||||
|
||||
setParams(options)
|
||||
|
||||
}, [])
|
||||
return (
|
||||
<PanelBox
|
||||
style={style}
|
||||
|
|
@ -137,33 +137,33 @@ function HDReal({ style }) {
|
|||
</>
|
||||
}
|
||||
>
|
||||
<div className='tm' style={{position:"relative",zIndex:999999,color:"#fff",width:"60%",margin:'10px'}}>
|
||||
<RangePicker
|
||||
// width="100%"
|
||||
className='time-picker'
|
||||
style={{
|
||||
flex:1,
|
||||
background: "transparent",
|
||||
border: "none",
|
||||
color: "#fff",
|
||||
}}
|
||||
onChange={searchTm}
|
||||
allowClear
|
||||
format="YYYY-MM-DD HH:mm"
|
||||
showTime={{
|
||||
format: 'HH:mm',
|
||||
}}
|
||||
value={params.tm}
|
||||
getPopupContainer={trigger => trigger.parentElement}
|
||||
/>
|
||||
</div>
|
||||
<TableContainer style={{ height: '80%',marginTop:'10px' }}>
|
||||
<div className='tm' style={{ position: "relative", zIndex: 999999, color: "#fff", width: "60%", margin: '10px' }}>
|
||||
<RangePicker
|
||||
// width="100%"
|
||||
className='time-picker'
|
||||
style={{
|
||||
flex: 1,
|
||||
background: "transparent",
|
||||
border: "none",
|
||||
color: "#fff",
|
||||
}}
|
||||
onChange={searchTm}
|
||||
allowClear
|
||||
format="YYYY-MM-DD HH:mm"
|
||||
showTime={{
|
||||
format: 'HH:mm',
|
||||
}}
|
||||
value={params.tm}
|
||||
getPopupContainer={trigger => trigger.parentElement}
|
||||
/>
|
||||
</div>
|
||||
<TableContainer style={{ height: '80%', marginTop: '10px' }}>
|
||||
<Table size="small" stickyHeader>
|
||||
<TableHead>
|
||||
<TableRow >
|
||||
<DpTableCell style={{ width: '30%' }} align="center">DMA分区名称</DpTableCell>
|
||||
<DpTableCell style={{ width: '25%' }} align="center">漏水量(㎡)</DpTableCell>
|
||||
<DpTableCell align="center" style={{ width: '25%' }}>供水量</DpTableCell>
|
||||
<DpTableCell align="center" style={{ width: '25%' }}>供水量(m³)</DpTableCell>
|
||||
<DpTableCell align="center" style={{ width: '20%' }}>漏损率(%)</DpTableCell>
|
||||
</TableRow>
|
||||
</TableHead>
|
||||
|
|
@ -188,6 +188,7 @@ function HDReal({ style }) {
|
|||
{
|
||||
setting && <Setting onClose={() => showSetting(false)} />
|
||||
}
|
||||
<img src={`${process.env.PUBLIC_URL}/assets/tl.png`} alt="" style={{position:'absolute',width:130,height:220,left:-200,top:670}}/>
|
||||
</PanelBox>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue