lsf-dev
commit
99d9008627
|
|
@ -24,7 +24,7 @@ export const DrpRealPromise = new CachePromise(
|
|||
|
||||
() => fetch(`${process.env.PUBLIC_URL}/data3/drpReal.json`)
|
||||
.then((response) => response.json())
|
||||
.then(data=>{
|
||||
.then(data => {
|
||||
return data.filter(o=>o.state===1)
|
||||
})
|
||||
.catch(() => null),
|
||||
|
|
|
|||
|
|
@ -148,7 +148,7 @@ const map = {
|
|||
setView(id) {
|
||||
let layerVisible = {};
|
||||
const map = window.__mapref
|
||||
if (id === 1 || id == 503) {
|
||||
if (id === 1 || id == 503) {
|
||||
layerVisible = {
|
||||
RealDrpLayer: true,
|
||||
RealHDLayer: true,
|
||||
|
|
@ -171,8 +171,8 @@ const map = {
|
|||
YuwaiLayer: false,
|
||||
AdcdLayer: true,
|
||||
WataLayer: false,
|
||||
RealSkLayerQ2:true,
|
||||
RealHDLayerQ2:true,
|
||||
RealSkLayerQ2: true,
|
||||
RealHDLayerQ2: true,
|
||||
}
|
||||
Object.keys(DCPJ_TYPES).forEach(key => {
|
||||
layerVisible['Dcpj_' + key + 'Layer'] = false;
|
||||
|
|
@ -187,8 +187,8 @@ const map = {
|
|||
YuwaiLayer: false,
|
||||
AdcdLayer: true,
|
||||
WataLayer: false,
|
||||
RealSkLayerQ2:true,
|
||||
RealHDLayerQ2:true,
|
||||
RealSkLayerQ2: true,
|
||||
RealHDLayerQ2: true,
|
||||
}
|
||||
Object.keys(DCPJ_TYPES).forEach(key => {
|
||||
layerVisible['Dcpj_' + key + 'Layer'] = false;
|
||||
|
|
@ -228,7 +228,7 @@ const map = {
|
|||
Object.keys(DCPJ_TYPES).forEach(key => {
|
||||
layerVisible['Dcpj_' + key + 'Layer'] = false;
|
||||
});
|
||||
}else if (id === 5) {
|
||||
} else if (id === 5) {
|
||||
layerVisible = {
|
||||
RealDrpLayer: true,
|
||||
RealHDLayer: false,
|
||||
|
|
@ -246,8 +246,8 @@ const map = {
|
|||
RealDrpLayer: false,
|
||||
RealHDLayer: false,
|
||||
RealSkLayer: false,
|
||||
RainDrpLayer:true,
|
||||
ShuikuLayer:false,
|
||||
RainDrpLayer: true,
|
||||
ShuikuLayer: false,
|
||||
BxSkLayer: true,
|
||||
FzdxLayer: false,
|
||||
WataLayer: false,
|
||||
|
|
@ -255,7 +255,7 @@ const map = {
|
|||
RoadLayer: true,
|
||||
RivlLayer: true,
|
||||
RealHDLayerQ2: true,
|
||||
RealSkLayerQ2:true
|
||||
RealSkLayerQ2: true
|
||||
};
|
||||
Object.keys(DCPJ_TYPES).forEach(key => {
|
||||
layerVisible['Dcpj_' + key + 'Layer'] = false;
|
||||
|
|
@ -316,11 +316,17 @@ const map = {
|
|||
AdcdLayer: true,
|
||||
RoadLayer: true,
|
||||
RivlLayer: true,
|
||||
BxjcLayer: true,
|
||||
SyjcLayer: true,
|
||||
SljcLayer: true,
|
||||
ByjcLayer:true
|
||||
BxjcLayer: false,
|
||||
SyjcLayer: false,
|
||||
SljcLayer: false,
|
||||
ByjcLayer: false
|
||||
};
|
||||
dispatch.runtime.setCameraTarget({
|
||||
center: [114.88069, 31.171967],
|
||||
zoom: 12,
|
||||
pitch: 60,
|
||||
bearing: 0
|
||||
});
|
||||
Object.keys(DCPJ_TYPES).forEach(key => {
|
||||
layerVisible['Dcpj_' + key + 'Layer'] = false;
|
||||
});
|
||||
|
|
@ -361,7 +367,7 @@ const map = {
|
|||
RealHDLayer: false,
|
||||
RealSkLayer: false,
|
||||
BxSkLayer: false,
|
||||
XunchaLayer:true,
|
||||
XunchaLayer: true,
|
||||
FzdxLayer: false,
|
||||
WataLayer: false,
|
||||
AdcdLayer: true,
|
||||
|
|
@ -397,8 +403,8 @@ const map = {
|
|||
AdcdLayer: true,
|
||||
RoadLayer: true,
|
||||
RivlLayer: true,
|
||||
ShuichangLayer:true,
|
||||
ShuiyuandiLayer:false,
|
||||
ShuichangLayer: true,
|
||||
ShuiyuandiLayer: false,
|
||||
};
|
||||
Object.keys(DCPJ_TYPES).forEach(key => {
|
||||
layerVisible['Dcpj_' + key + 'Layer'] = false;
|
||||
|
|
@ -414,10 +420,10 @@ const map = {
|
|||
AdcdLayer: true,
|
||||
RoadLayer: true,
|
||||
RivlLayer: true,
|
||||
ShuichangLayer:true,
|
||||
ShuichangLayer: true,
|
||||
ShuichangQLayer: true,
|
||||
ShuiyuandiQLayer:true,
|
||||
ShuizhiLayer:true,
|
||||
ShuiyuandiQLayer: true,
|
||||
ShuizhiLayer: true,
|
||||
ShuiyuandiLayer: true,
|
||||
};
|
||||
Object.keys(DCPJ_TYPES).forEach(key => {
|
||||
|
|
@ -434,13 +440,13 @@ const map = {
|
|||
AdcdLayer: true,
|
||||
RoadLayer: true,
|
||||
RivlLayer: true,
|
||||
ShuichangLayer:true,
|
||||
ShuichangLayer: true,
|
||||
ShuichangQLayer: true,
|
||||
};
|
||||
Object.keys(DCPJ_TYPES).forEach(key => {
|
||||
layerVisible['Dcpj_' + key + 'Layer'] = false;
|
||||
});
|
||||
} else if ( id === 303 || id === 306 || id === 305) {
|
||||
} else if (id === 303 || id === 306 || id === 305) {
|
||||
layerVisible = {
|
||||
RealDrpLayer: false,
|
||||
RealHDLayer: false,
|
||||
|
|
@ -455,7 +461,7 @@ const map = {
|
|||
Object.keys(DCPJ_TYPES).forEach(key => {
|
||||
layerVisible['Dcpj_' + key + 'Layer'] = false;
|
||||
});
|
||||
}else if ( id === 307) {
|
||||
} else if (id === 307) {
|
||||
layerVisible = {
|
||||
RealDrpLayer: false,
|
||||
RealHDLayer: true,
|
||||
|
|
@ -487,7 +493,7 @@ const map = {
|
|||
Object.keys(DCPJ_TYPES).forEach(key => {
|
||||
layerVisible['Dcpj_' + key + 'Layer'] = false;
|
||||
});
|
||||
}else if (id == 504) {
|
||||
} else if (id == 504) {
|
||||
layerVisible = {
|
||||
RealDrpLayer: true,
|
||||
TrsqLayer: true,
|
||||
|
|
@ -497,7 +503,7 @@ const map = {
|
|||
Object.keys(DCPJ_TYPES).forEach(key => {
|
||||
layerVisible['Dcpj_' + key + 'Layer'] = false;
|
||||
});
|
||||
}else if (id == 505) {
|
||||
} else if (id == 505) {
|
||||
layerVisible = {
|
||||
BzLayer: true,
|
||||
SbLayer: true,
|
||||
|
|
@ -509,7 +515,7 @@ const map = {
|
|||
Object.keys(DCPJ_TYPES).forEach(key => {
|
||||
layerVisible['Dcpj_' + key + 'Layer'] = false;
|
||||
});
|
||||
}else if (id == 506 || id == 507) {
|
||||
} else if (id == 506 || id == 507) {
|
||||
layerVisible = {
|
||||
AdcdLayer: true,
|
||||
RivlLayer: true,
|
||||
|
|
@ -519,7 +525,7 @@ const map = {
|
|||
layerVisible['Dcpj_' + key + 'Layer'] = true;
|
||||
} else {
|
||||
layerVisible['Dcpj_' + key + 'Layer'] = false;
|
||||
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
|
|
@ -529,9 +535,9 @@ const map = {
|
|||
dispatch.runtime.setFeaturePop(null);
|
||||
|
||||
|
||||
if (id === 8){
|
||||
if (id === 8) {
|
||||
dispatch.rcview.showRealContour('h24')
|
||||
}else{
|
||||
} else {
|
||||
dispatch.runtime.setLayerSetting({ contour: null, dem: undefined });
|
||||
dispatch.runtime.setLayerSetting({ planeArea: null });
|
||||
dispatch.map.setLayerVisible({ ContourLayer: false });
|
||||
|
|
@ -573,10 +579,192 @@ const map = {
|
|||
dispatch.map.setLayerSetting({ dom: true });
|
||||
// map.setLayoutProperty('卫星图', 'visibility', 'visible');
|
||||
} else {
|
||||
dispatch.map.setLayerSetting({dom: false});
|
||||
dispatch.map.setLayerSetting({ dom: false });
|
||||
// map.setLayoutProperty('卫星图', 'visibility', 'none');
|
||||
}
|
||||
if (id == 203) {
|
||||
const skdata = [
|
||||
{
|
||||
"stcd": "61614200",
|
||||
"type": "sk",
|
||||
"hasRz": true,
|
||||
"stnm": "浮桥河水库",
|
||||
"adcd": "421181100000",
|
||||
"wscd": null,
|
||||
"importancy": 0,
|
||||
"lgtd": 114.875,
|
||||
"lttd": 31.166667,
|
||||
"elev": 0,
|
||||
"damel": 71.33,
|
||||
"dsflz": 68.04,
|
||||
"fsltdz": 64.89,
|
||||
"ddz": 51.78,
|
||||
"zcxsw": 64.89,
|
||||
"drpTm": "2025-06-03T02:00:00.000Z",
|
||||
"today": 0,
|
||||
"h1": 5,
|
||||
"h3": 6,
|
||||
"h6": 7.5,
|
||||
"h12": 8,
|
||||
"h24": 9,
|
||||
"h48": 26,
|
||||
"drpState": 1,
|
||||
"rz": 60.71,
|
||||
"w": 162.8,
|
||||
"a_fsltdz": -4.18,
|
||||
"rzTm": "2025-06-03T02:00:00.000Z",
|
||||
"rzWarning": 0,
|
||||
"rzState": 1,
|
||||
"aRz": -4.18
|
||||
},
|
||||
{
|
||||
"stcd": "61613010",
|
||||
"type": "sk",
|
||||
"hasRz": true,
|
||||
"stnm": "明山水库",
|
||||
"adcd": "421181103000",
|
||||
"wscd": null,
|
||||
"importancy": 0,
|
||||
"lgtd": 115.066667,
|
||||
"lttd": 31.016667,
|
||||
"elev": 0,
|
||||
"damel": 98.7,
|
||||
"dsflz": 96.07,
|
||||
"fsltdz": 93,
|
||||
"ddz": 78.02,
|
||||
"zcxsw": 93,
|
||||
"drpTm": "2025-06-03T02:00:00.000Z",
|
||||
"today": 0,
|
||||
"h1": 7,
|
||||
"h3": 8.4,
|
||||
"h6": 10.5,
|
||||
"h12": 11.200000000000001,
|
||||
"h24": 12.6,
|
||||
"h48": 25.799999999999997,
|
||||
"drpState": 1,
|
||||
"rz": 84.43,
|
||||
"w": 49.5,
|
||||
"a_fsltdz": -8.569999999999993,
|
||||
"rzTm": "2025-06-03T02:00:00.000Z",
|
||||
"rzWarning": 0,
|
||||
"rzState": 1,
|
||||
"aRz": -8.57
|
||||
},
|
||||
{
|
||||
"stcd": "61612610",
|
||||
"type": "sk",
|
||||
"hasRz": true,
|
||||
"stnm": "三河口水库",
|
||||
"adcd": "421181109000",
|
||||
"wscd": null,
|
||||
"importancy": 0,
|
||||
"lgtd": 115.166667,
|
||||
"lttd": 31.333333,
|
||||
"elev": 0,
|
||||
"damel": 156.8,
|
||||
"dsflz": 154.99,
|
||||
"fsltdz": 149,
|
||||
"ddz": 124,
|
||||
"zcxsw": 149,
|
||||
"drpTm": "2025-06-03T02:00:00.000Z",
|
||||
"today": 0,
|
||||
"h1": 7,
|
||||
"h3": 8.4,
|
||||
"h6": 10.5,
|
||||
"h12": 11.200000000000001,
|
||||
"h24": 12.6,
|
||||
"h48": 25.799999999999997,
|
||||
"drpState": 1,
|
||||
"rz": 141.45,
|
||||
"w": 77.8,
|
||||
"a_fsltdz": -7.550000000000011,
|
||||
"rzTm": "2025-06-03T01:00:00.000Z",
|
||||
"rzWarning": 0,
|
||||
"rzState": 1,
|
||||
"aRz": -7.55
|
||||
},
|
||||
{
|
||||
"stcd": "61612700",
|
||||
"type": "sk",
|
||||
"hasRz": true,
|
||||
"stnm": "碧绿河水库",
|
||||
"adcd": "421181109000",
|
||||
"wscd": null,
|
||||
"importancy": 0,
|
||||
"lgtd": 115.214444,
|
||||
"lttd": 31.299722,
|
||||
"elev": 0,
|
||||
"damel": 142.9,
|
||||
"dsflz": 139.08,
|
||||
"fsltdz": 137,
|
||||
"ddz": 105,
|
||||
"zcxsw": 137,
|
||||
"drpTm": "2025-06-03T02:00:00.000Z",
|
||||
"today": 0,
|
||||
"h1": 4,
|
||||
"h3": 4.8,
|
||||
"h6": 6,
|
||||
"h12": 6.4,
|
||||
"h24": 7.2,
|
||||
"h48": 22.6,
|
||||
"drpState": 1,
|
||||
"rz": 119.6,
|
||||
"w": 13.15,
|
||||
"a_fsltdz": -17.400000000000006,
|
||||
"rzTm": "2025-06-03T00:00:00.000Z",
|
||||
"rzWarning": 0,
|
||||
"rzState": 2,
|
||||
"aRz": -17.4
|
||||
}
|
||||
]
|
||||
const layer = map.getLayer('关联站点')
|
||||
if (layer) {
|
||||
map.removeLayer('关联站点');
|
||||
map.removeSource('关联站点');
|
||||
}
|
||||
map.addLayer({
|
||||
'id': '关联站点',//+new Date().getTime(),
|
||||
'type': 'symbol',
|
||||
'source': {
|
||||
'type': 'geojson',
|
||||
'data': {
|
||||
'type': 'FeatureCollection',
|
||||
'features': [],
|
||||
},
|
||||
},
|
||||
'layout': {
|
||||
'icon-allow-overlap': true,
|
||||
'text-allow-overlap': true,
|
||||
'icon-image': '水库-离线',
|
||||
'icon-size': [
|
||||
'interpolate', ['linear'], ['zoom'],
|
||||
10, 0.4,
|
||||
14, 0.8,
|
||||
],
|
||||
'text-allow-overlap': true,
|
||||
'text-size': [
|
||||
'interpolate', ['linear'], ['zoom'],
|
||||
10, 10,
|
||||
14, 14,
|
||||
],
|
||||
'text-font': ['Roboto Black'],
|
||||
'text-field': [
|
||||
'step',
|
||||
['zoom'],
|
||||
'',
|
||||
12, ['get', 'stnm']
|
||||
],
|
||||
'text-anchor': 'top',
|
||||
'text-offset': [0, 1],
|
||||
|
||||
},
|
||||
'paint': {
|
||||
'text-color': '#fff'
|
||||
},
|
||||
'visibility': 'visible',
|
||||
});
|
||||
map.getSource('关联站点').setData(parseGeoJSON(skdata))
|
||||
}
|
||||
|
||||
if(id!==200&&id!==203&&id!==205&&id!==206){
|
||||
const layer = map.getLayer('临时水库tz')
|
||||
|
|
|
|||
|
|
@ -82,9 +82,8 @@ export default function calcLayout(view, rightStack, hidePanels) {
|
|||
} else if (view === 203) {
|
||||
left = [
|
||||
{ key: '天气' },
|
||||
{ key: '变形监测', style: { height: '20rem', flexGrow: 1 } },
|
||||
{ key: '渗压监测', style: { height: '20rem', flexGrow: 1 } },
|
||||
{ key: '渗流监测', style: { height: '20rem', flexGrow: 1 } },
|
||||
{ key: '关联站点',style: { height: '15rem', flexGrow: 1 } },
|
||||
{ key: '水库水量统计',style: { height: '22rem' } },
|
||||
// { key: '安全监测', style: { height: '20rem', flexGrow: 1 } },
|
||||
];
|
||||
leftFullHeight = true;
|
||||
|
|
|
|||
|
|
@ -40,6 +40,7 @@ function HDStDlg({ record, onClose }) {
|
|||
<TableHead>
|
||||
<TableRow>
|
||||
<DpTableCell align="center">序号</DpTableCell>
|
||||
<DpTableCell align="center">水库名称</DpTableCell>
|
||||
<DpTableCell align="center">预警时间</DpTableCell>
|
||||
<DpTableCell align="center">测点编号</DpTableCell>
|
||||
<DpTableCell align="center">预警级别</DpTableCell>
|
||||
|
|
@ -53,6 +54,7 @@ function HDStDlg({ record, onClose }) {
|
|||
<DpTableCell align="center">
|
||||
<div className="table-ellipsis cursor-pointer" >1</div>
|
||||
</DpTableCell>
|
||||
<DpTableCell align="center">浮桥河水库</DpTableCell>
|
||||
<DpTableCell align="center">2025-5-20 10:00:00</DpTableCell>
|
||||
<DpTableCell align="center">GN1</DpTableCell>
|
||||
<DpTableCell align="center">红色</DpTableCell>
|
||||
|
|
|
|||
|
|
@ -134,8 +134,19 @@ export default function MapCtrl({ initParams, onLoad }) {
|
|||
}
|
||||
dispatch.runtime.setFeaturePop({ type: record.layerPop, properties: record, coordinates: [record.lgtd, record.lttd] });
|
||||
}
|
||||
if(feature.layer.id==='关联站点'){
|
||||
if (feature.layer.id === '关联站点') {
|
||||
const record = feature.properties
|
||||
if (record.cd_nm == 'GN1') {
|
||||
dispatch?.runtime.setInfoDlg({ layerId: 'BxjcLayer', properties: record })
|
||||
}else if (record.cd_nm == 'UPD1') {
|
||||
dispatch?.runtime.setInfoDlg({ layerId: 'SyjcLayer', properties: record })
|
||||
}else if (record.cd_nm == 'WE1') {
|
||||
dispatch?.runtime.setInfoDlg({ layerId: 'SljcLayer', properties: record })
|
||||
}else if (record.cd_nm == '0EA5DE') {
|
||||
dispatch?.runtime.setInfoDlg({ layerId: 'ByjcLayer', properties: record })
|
||||
}else if (record.stnm == '浮桥河水库') {
|
||||
dispatch?.runtime.setInfoDlg({ layerId: 'RealSkLayer', properties: record })
|
||||
}
|
||||
// dispatch.runtime.setFeaturePop({ type: 'RealSkPop', properties: record, coordinates: [record.lgtd, record.lttd] });
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -46,8 +46,8 @@ const ShapeStyle = {
|
|||
const page1 = [
|
||||
{
|
||||
"res_cd": "42118140035",
|
||||
"res_lon": 114.875,
|
||||
"res_lat": 31.166667,
|
||||
"res_lon": 114.88089,
|
||||
"res_lat": 31.171467,
|
||||
"cd": "01",
|
||||
"cd_nm": "GN1",
|
||||
"stnm": "GN1",
|
||||
|
|
|
|||
|
|
@ -72,36 +72,44 @@ export default class ByjcLayer extends BaseLayer {
|
|||
let data =
|
||||
// await PicStPromise.get();
|
||||
[
|
||||
{
|
||||
"res_cd": "42118140004",
|
||||
"res_nm": "永丰水库",
|
||||
{
|
||||
"cd": "1",
|
||||
"cd_nm": "UPD1",
|
||||
"ch": "0+060",
|
||||
"res_reg_cd": "42118140011-A4",
|
||||
"res_cd": "42118140038",
|
||||
"res_nm": "浮桥河水库",
|
||||
"res_lon": 114.88299,
|
||||
"res_lat": 31.172700,
|
||||
"stnm": "UPD1",
|
||||
"province_cd": "420000000000",
|
||||
"province_nm": "湖北省",
|
||||
stnm:'0FA5DE',
|
||||
"province_nm": "湖北省",
|
||||
"city_cd": "421100000000",
|
||||
"city_nm": "黄冈市",
|
||||
"county_cd": "421181000000",
|
||||
"county_nm": "麻城市",
|
||||
"town_cd": "421181003000",
|
||||
"town_nm": "南湖办事处",
|
||||
"rv_name": "举水",
|
||||
"town_cd": "421181113000",
|
||||
"town_nm": "乘马岗镇",
|
||||
"bas_guid": "鄂东五河片区",
|
||||
"res_lon": 115.05541,
|
||||
"res_lat": 31.11106,
|
||||
"res_reg_cd": "42118140042-A4",
|
||||
"eng_scal": "小(1)型",
|
||||
"eng_g": "IV",
|
||||
"children": [
|
||||
{
|
||||
"res_cd": "42118140004",
|
||||
"res_nm": "永丰水库",
|
||||
"cd": 5821,
|
||||
"cd_nm": "永丰水库",
|
||||
"termite_status": "n",
|
||||
"tm": "2025-05-21 09:18:28",
|
||||
"is_main_cd": "y"
|
||||
}
|
||||
]
|
||||
"danger_stat": "非病险水库",
|
||||
"label": "2023高标准",
|
||||
"value": 164.8742,
|
||||
"diff_value": -0.0275,
|
||||
"trend": -1,
|
||||
"is_has_data": "y",
|
||||
"diff_rz": -0.6958,
|
||||
"stcd": "4239",
|
||||
"diff_rz_cd": 5.0554,
|
||||
"max_cd_value": -0.0225,
|
||||
"rz": 165.57,
|
||||
"dt": "2025-05-20",
|
||||
"diff5_value": -0.0737,
|
||||
"trend5": -1,
|
||||
"diff10_value": -0.1204,
|
||||
"trend10": -1,
|
||||
"diff30_value": -0.0633,
|
||||
"trend30": -1
|
||||
},
|
||||
{
|
||||
"res_cd": "42118140015",
|
||||
|
|
|
|||
|
|
@ -71,16 +71,17 @@ export default class SljcLayer extends BaseLayer {
|
|||
|
||||
let data =
|
||||
// await PicStPromise.get();
|
||||
[{
|
||||
[
|
||||
{
|
||||
"cd": "1",
|
||||
"cd_nm": "WE",
|
||||
"ch": "1",
|
||||
'stnm':'WE',
|
||||
"res_reg_cd": "42118140042-A4",
|
||||
"res_cd": "42118140004",
|
||||
"res_nm": "永丰水库",
|
||||
"res_lon": 115.05541,
|
||||
"res_lat": 31.11106,
|
||||
"res_nm": "浮桥河水库",
|
||||
"res_lon": 114.88429,
|
||||
"res_lat": 31.172700,
|
||||
"province_cd": "420000000000",
|
||||
"province_nm": "湖北省",
|
||||
"city_cd": "421100000000",
|
||||
|
|
|
|||
|
|
@ -78,9 +78,9 @@ export default class SyjcLayer extends BaseLayer {
|
|||
"ch": "0+060",
|
||||
"res_reg_cd": "42118140011-A4",
|
||||
"res_cd": "42118140038",
|
||||
"res_lon": 115.01664,
|
||||
"res_lat": 31.40681,
|
||||
"res_nm": "蛤蟆岗水库",
|
||||
"res_nm": "浮桥河水库",
|
||||
"res_lon": 114.87929,
|
||||
"res_lat": 31.171467,
|
||||
"stnm": "UPD1",
|
||||
"province_cd": "420000000000",
|
||||
"province_nm": "湖北省",
|
||||
|
|
|
|||
|
|
@ -16,8 +16,8 @@ import { renderDrp } from '../../../../utils/renutils';
|
|||
const data1 = [
|
||||
{
|
||||
"res_cd": "42118140035",
|
||||
"res_lon": 114.875,
|
||||
"res_lat": 31.166667,
|
||||
"res_lon": 114.88089,
|
||||
"res_lat": 31.171467,
|
||||
"cd": "01",
|
||||
"cd_nm": "GN1",
|
||||
"stnm": "GN1",
|
||||
|
|
@ -613,7 +613,7 @@ function DrpReal({ style }) {
|
|||
if (lgtd && lttd) {
|
||||
dispatch.runtime.setCameraTarget({
|
||||
center: [lgtd, lttd],
|
||||
zoom: 15,
|
||||
zoom: 17,
|
||||
pitch: 60,
|
||||
bearing: 0
|
||||
});
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -24,6 +24,7 @@ const DRP_COLORS = [
|
|||
'rgb(136, 11, 29)',
|
||||
]
|
||||
|
||||
|
||||
const data1 = [
|
||||
{
|
||||
"stcd": "61612150",
|
||||
|
|
@ -887,14 +888,16 @@ function DrpReal({ style }) {
|
|||
}
|
||||
}
|
||||
},[skObj])
|
||||
|
||||
|
||||
const [showDrp, setShowdDrp] = useState(0)
|
||||
const [showHd, setShowdHd] = useState(0)
|
||||
useEffect(()=>{
|
||||
const map = window.__mapref;
|
||||
if(map){
|
||||
if(tab==='1'&&drpData){
|
||||
if(tab==='1'&&drpData && showDrp){
|
||||
setLayer(drpData,'drp')
|
||||
}
|
||||
if(tab==='2'&&hdData){
|
||||
if(tab==='2'&&hdData && showHd){
|
||||
setLayer(hdData,'hd')
|
||||
}
|
||||
if(tab==='3'&&data3){
|
||||
|
|
@ -916,7 +919,7 @@ function DrpReal({ style }) {
|
|||
}, 500);
|
||||
}
|
||||
|
||||
},[drpData,hdData,skObj,tab])
|
||||
},[drpData,hdData,skObj,tab,showDrp,showHd])
|
||||
|
||||
|
||||
|
||||
|
|
@ -940,7 +943,8 @@ function DrpReal({ style }) {
|
|||
}
|
||||
});
|
||||
}
|
||||
setDrpData(data)
|
||||
const newData = [data[1],data[0]]
|
||||
setDrpData(newData)
|
||||
}
|
||||
|
||||
const getHd = async(skObj)=>{
|
||||
|
|
@ -963,7 +967,8 @@ function DrpReal({ style }) {
|
|||
}
|
||||
});
|
||||
}
|
||||
setHdData(data)
|
||||
const newData = [data[1],data[0]]
|
||||
setHdData(newData)
|
||||
}
|
||||
|
||||
const setLayer = (data=[],type)=>{
|
||||
|
|
@ -1208,21 +1213,32 @@ function DrpReal({ style }) {
|
|||
map.getSource('关联站点').setData(parseGeoJSON(data))
|
||||
}
|
||||
|
||||
// useEffect(() => {
|
||||
// setLayer(skdata,"sk")
|
||||
|
||||
// }, [])
|
||||
useEffect(() => {
|
||||
setShowdHd(0)
|
||||
setShowdDrp(0)
|
||||
|
||||
}, [tab])
|
||||
|
||||
|
||||
return (
|
||||
<PanelBox
|
||||
style={style}
|
||||
title="关联站点"
|
||||
title="水雨情监测"
|
||||
color="green"
|
||||
tabs={
|
||||
<span className="button-group">
|
||||
<span className={clsx({ active: tab==='1' })} onClick={() => {
|
||||
setTab('1')
|
||||
|
||||
}}>雨量站</span>
|
||||
<span className={clsx({ active: tab==='2' })} onClick={() => {
|
||||
setTab('2')
|
||||
}}>水位站</span>
|
||||
<span className={clsx({ active: tab==='3' })} onClick={() => {
|
||||
{/* <span className={clsx({ active: tab==='3' })} onClick={() => {
|
||||
setTab('3')
|
||||
}}>流量站</span>
|
||||
<span className={clsx({ active: tab==='4' })} onClick={() => {
|
||||
|
|
@ -1230,7 +1246,7 @@ function DrpReal({ style }) {
|
|||
}}>图像站</span>
|
||||
<span className={clsx({ active: tab==='5' })} onClick={() => {
|
||||
setTab('5')
|
||||
}}>视频站</span>
|
||||
}}>视频站</span> */}
|
||||
</span>
|
||||
}
|
||||
>
|
||||
|
|
@ -1254,14 +1270,17 @@ function DrpReal({ style }) {
|
|||
<DpTableCell component="th" scope="row">
|
||||
<div className="table-ellipsis cursor-pointer" onClick={() => {
|
||||
const { lgtd, lttd } = row;
|
||||
if (lgtd && lttd) {
|
||||
dispatch.runtime.setFeaturePop({ type: 'RealDrpPop', properties: row, coordinates: [row.lgtd, row.lttd] });
|
||||
dispatch.runtime.setCameraTarget({
|
||||
center: [lgtd, lttd],
|
||||
zoom: 15,
|
||||
pitch: 60,
|
||||
bearing: 0
|
||||
});
|
||||
if (row.stnm == '浮桥河') {
|
||||
setShowdDrp(1)
|
||||
if (lgtd && lttd) {
|
||||
dispatch.runtime.setFeaturePop({ type: 'RealDrpPop', properties: row, coordinates: [row.lgtd, row.lttd] });
|
||||
dispatch.runtime.setCameraTarget({
|
||||
center: [lgtd, lttd],
|
||||
zoom: 15,
|
||||
pitch: 60,
|
||||
bearing: 0
|
||||
});
|
||||
}
|
||||
}
|
||||
}}>{row.stnm}</div>
|
||||
</DpTableCell>
|
||||
|
|
@ -1289,14 +1308,17 @@ function DrpReal({ style }) {
|
|||
<DpTableCell component="th" scope="row">
|
||||
<div className="table-ellipsis cursor-pointer" onClick={() => {
|
||||
const { lgtd, lttd } = row;
|
||||
if (lgtd && lttd) {
|
||||
dispatch.runtime.setFeaturePop({ type: 'RealHDPop', properties: row, coordinates: [row.lgtd, row.lttd] });
|
||||
dispatch.runtime.setCameraTarget({
|
||||
center: [lgtd, lttd],
|
||||
zoom: 15,
|
||||
pitch: 60,
|
||||
bearing: 0
|
||||
});
|
||||
if (row.stnm == '浮桥河') {
|
||||
setShowdHd(1)
|
||||
if (lgtd && lttd) {
|
||||
dispatch.runtime.setFeaturePop({ type: 'RealHDPop', properties: row, coordinates: [row.lgtd, row.lttd] });
|
||||
dispatch.runtime.setCameraTarget({
|
||||
center: [lgtd, lttd],
|
||||
zoom: 15,
|
||||
pitch: 60,
|
||||
bearing: 0
|
||||
});
|
||||
}
|
||||
}
|
||||
}}>{row.stnm}</div>
|
||||
</DpTableCell>
|
||||
|
|
|
|||
|
|
@ -202,7 +202,7 @@ function DrpReal({ style }) {
|
|||
return (
|
||||
<PanelBox
|
||||
style={style}
|
||||
title="水量统计"
|
||||
title="水资源利用"
|
||||
color="green"
|
||||
extra={
|
||||
<>
|
||||
|
|
@ -214,20 +214,20 @@ function DrpReal({ style }) {
|
|||
// dispatch.map.setLayerVisible({'ByjcLayer':false});
|
||||
setTab('生态')
|
||||
}}>生态</span>
|
||||
<span className={clsx({ active: tab==='灌溉' })} onClick={() => {
|
||||
<span className={clsx({ active: tab==='灌溉发电' })} onClick={() => {
|
||||
// dispatch.map.setLayerVisible({'BxjcLayer':false});
|
||||
// dispatch.map.setLayerVisible({'SyjcLayer':true});
|
||||
// dispatch.map.setLayerVisible({'SljcLayer':false});
|
||||
// dispatch.map.setLayerVisible({'ByjcLayer':false});
|
||||
setTab('灌溉')
|
||||
}}>灌溉</span>
|
||||
<span className={clsx({ active: tab==='发电' })} onClick={() => {
|
||||
setTab('灌溉发电')
|
||||
}}>灌溉发电</span>
|
||||
{/* <span className={clsx({ active: tab==='发电' })} onClick={() => {
|
||||
// dispatch.map.setLayerVisible({'BxjcLayer':false});
|
||||
// dispatch.map.setLayerVisible({'SyjcLayer':false});
|
||||
// dispatch.map.setLayerVisible({'SljcLayer':true});
|
||||
// dispatch.map.setLayerVisible({'ByjcLayer':false});
|
||||
setTab('发电')
|
||||
}}>发电</span>
|
||||
}}>发电</span> */}
|
||||
<span className={clsx({ active: tab==='泄洪' })} onClick={() => {
|
||||
// dispatch.map.setLayerVisible({'BxjcLayer':false});
|
||||
// dispatch.map.setLayerVisible({'SyjcLayer':false});
|
||||
|
|
|
|||
|
|
@ -12,34 +12,35 @@ import DpTableCell from '../../../../layouts/mui/DpTableCell';
|
|||
import DpTableRow from '../../../../layouts/mui/DpTableRow';
|
||||
import clsx from 'clsx';
|
||||
import { renderDrp } from '../../../../utils/renutils';
|
||||
const data3 = [{
|
||||
"cd": "1",
|
||||
"cd_nm": "WE",
|
||||
"ch": "1",
|
||||
"res_reg_cd": "42118140042-A4",
|
||||
"res_cd": "42118140004",
|
||||
"res_nm": "永丰水库",
|
||||
"res_lon": 115.05541,
|
||||
"res_lat": 31.11106,
|
||||
"province_cd": "420000000000",
|
||||
"province_nm": "湖北省",
|
||||
"city_cd": "421100000000",
|
||||
"city_nm": "黄冈市",
|
||||
"county_cd": "421181000000",
|
||||
"county_nm": "麻城市",
|
||||
"town_cd": "421181003000",
|
||||
"town_nm": "南湖办事处",
|
||||
"danger_stat": "非病险水库",
|
||||
"bas_guid": "鄂东五河片区",
|
||||
"label": "2023高标准",
|
||||
"eng_scal": "小(1)型",
|
||||
"value": 0.3,
|
||||
"diff_value": -0.02,
|
||||
"trend": -1,
|
||||
"dt": "2025-05-20",
|
||||
"is_has_data": "y",
|
||||
"max_value": 0.3
|
||||
}]
|
||||
const data3 =[{
|
||||
"cd": "1",
|
||||
"cd_nm": "WE",
|
||||
"ch": "1",
|
||||
'stnm':'WE',
|
||||
"res_reg_cd": "42118140042-A4",
|
||||
"res_cd": "42118140004",
|
||||
"res_nm": "浮桥河水库",
|
||||
"res_lon": 114.88429,
|
||||
"res_lat": 31.172700,
|
||||
"province_cd": "420000000000",
|
||||
"province_nm": "湖北省",
|
||||
"city_cd": "421100000000",
|
||||
"city_nm": "黄冈市",
|
||||
"county_cd": "421181000000",
|
||||
"county_nm": "麻城市",
|
||||
"town_cd": "421181003000",
|
||||
"town_nm": "南湖办事处",
|
||||
"danger_stat": "非病险水库",
|
||||
"bas_guid": "鄂东五河片区",
|
||||
"label": "2023高标准",
|
||||
"eng_scal": "小(1)型",
|
||||
"value": 0.3,
|
||||
"diff_value": -0.02,
|
||||
"trend": -1,
|
||||
"dt": "2025-05-20",
|
||||
"is_has_data": "y",
|
||||
"max_value": 0.3
|
||||
}]
|
||||
|
||||
|
||||
function DrpReal({ style }) {
|
||||
|
|
@ -73,7 +74,7 @@ function DrpReal({ style }) {
|
|||
if (lgtd && lttd) {
|
||||
dispatch.runtime.setCameraTarget({
|
||||
center: [lgtd- 0.0029, lttd],
|
||||
zoom: 15,
|
||||
zoom: 17,
|
||||
pitch: 60,
|
||||
bearing: 0
|
||||
});
|
||||
|
|
|
|||
|
|
@ -19,9 +19,9 @@ const data2 = [
|
|||
"ch": "0+060",
|
||||
"res_reg_cd": "42118140011-A4",
|
||||
"res_cd": "42118140038",
|
||||
"res_lon": 115.01664,
|
||||
"res_lat": 31.40681,
|
||||
"res_nm": "蛤蟆岗水库",
|
||||
"res_lon": 114.87929,
|
||||
"res_lat": 31.171467,
|
||||
"res_nm": "浮桥河水库",
|
||||
"province_cd": "420000000000",
|
||||
"province_nm": "湖北省",
|
||||
"city_cd": "421100000000",
|
||||
|
|
@ -730,14 +730,16 @@ function DrpReal({ style }) {
|
|||
<DpTableRow key={row.stcd}>
|
||||
<DpTableCell component="th" scope="row">
|
||||
<div className="table-ellipsis cursor-pointer" onClick={() => {
|
||||
const { res_lon:lgtd, res_lat:lttd } = row;
|
||||
if (lgtd && lttd) {
|
||||
dispatch.runtime.setCameraTarget({
|
||||
center: [lgtd + 0.0019, lttd],
|
||||
zoom: 15,
|
||||
pitch: 60,
|
||||
bearing: 0
|
||||
});
|
||||
const { res_lon: lgtd, res_lat: lttd,res_nm:stnm } = row;
|
||||
if (stnm == '浮桥河水库') {
|
||||
if (lgtd && lttd) {
|
||||
dispatch.runtime.setCameraTarget({
|
||||
center: [lgtd+ 0.0019, lttd],
|
||||
zoom: 17,
|
||||
pitch: 60,
|
||||
bearing: 0
|
||||
});
|
||||
}
|
||||
}
|
||||
}}>{row.res_nm}</div>
|
||||
</DpTableCell>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,67 @@
|
|||
import React, { useState, useEffect } from 'react';
|
||||
import './index.less';
|
||||
|
||||
const WaterLevelAlert = () => {
|
||||
const [position, setPosition] = useState(0);
|
||||
|
||||
const alerts = [
|
||||
{
|
||||
reservoir: '浮桥河水库',
|
||||
time: '06月08日02时',
|
||||
level: '65.01',
|
||||
overLimit: '0.12',
|
||||
},
|
||||
{
|
||||
reservoir: '浮桥河水库',
|
||||
time: '06月08日02时',
|
||||
level: '93.4',
|
||||
overLimit: '0.40',
|
||||
}
|
||||
];
|
||||
|
||||
useEffect(() => {
|
||||
const height = 24; // 每个项目的高度
|
||||
const totalHeight = height * alerts.length;
|
||||
let currentPosition = 0;
|
||||
|
||||
const animate = () => {
|
||||
currentPosition += height;
|
||||
if (currentPosition >= totalHeight) {
|
||||
currentPosition = 0;
|
||||
}
|
||||
setPosition(currentPosition);
|
||||
};
|
||||
|
||||
const timer = setInterval(animate, 3000);
|
||||
return () => clearInterval(timer);
|
||||
}, []);
|
||||
|
||||
// 复制一份数据用于无缝滚动
|
||||
const displayAlerts = [...alerts, ...alerts];
|
||||
|
||||
return (
|
||||
<div className="water-level-alert">
|
||||
<div className="alert-container">
|
||||
<div
|
||||
className="alert-wrapper"
|
||||
style={{
|
||||
transform: `translateY(-${position}px)`,
|
||||
transition: position === 0 ? 'none' : 'transform 0.5s ease-in-out'
|
||||
}}
|
||||
>
|
||||
{displayAlerts.map((alert, index) => (
|
||||
<div key={index} className="alert-item">
|
||||
<span className="alert-text">
|
||||
预计{alert.reservoir}于 {alert.time}水位将上涨至
|
||||
{alert.level} m (超汛限水位{alert.overLimit}m),
|
||||
请做好防范
|
||||
</span>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default WaterLevelAlert;
|
||||
|
|
@ -0,0 +1,32 @@
|
|||
.water-level-alert {
|
||||
background: rgba(0, 32, 51, 0.9);
|
||||
padding: 10px 20px;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #0088cc;
|
||||
|
||||
.alert-container {
|
||||
height: 24px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.alert-wrapper {
|
||||
will-change: transform;
|
||||
}
|
||||
|
||||
.alert-item {
|
||||
height: 24px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.alert-text {
|
||||
color: #ffffff;
|
||||
font-size: 14px;
|
||||
white-space: nowrap;
|
||||
|
||||
&::before {
|
||||
content: '⚠️';
|
||||
margin-right: 8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -19,6 +19,7 @@ import { RadioGroup, Radio, Switch, FormControlLabel, InputLabel, Select, MenuIt
|
|||
import { backgroundColor } from 'echarts/lib/theme/dark';
|
||||
import { Description } from '@material-ui/icons';
|
||||
import DescriptionItem from '../../components/DescrptionItem';
|
||||
import WaterLevelAlert from './WaterLevelAlert'
|
||||
export default function Warn({ style }) {
|
||||
const dispatch = useDispatch();
|
||||
const res = useSelector(s => s.runtime.yyObj)
|
||||
|
|
@ -168,6 +169,10 @@ export default function Warn({ style }) {
|
|||
<img src={`${process.env.PUBLIC_URL}/assets/sl.jpg`} alt="" style={{ width: 421}} />
|
||||
</div> */}
|
||||
</div>}
|
||||
|
||||
<div style={{ color: "#fff", position: 'absolute', top: 90, right: 600 }}>
|
||||
<WaterLevelAlert />
|
||||
</div>
|
||||
</div>
|
||||
</PanelBox>
|
||||
)
|
||||
|
|
|
|||
Loading…
Reference in New Issue