Compare commits
21 Commits
9b29aa1d3e
...
b37ff83c10
| Author | SHA1 | Date |
|---|---|---|
|
|
b37ff83c10 | |
|
|
2783cab920 | |
|
|
f092d0c834 | |
|
|
3695d95bc8 | |
|
|
766c49cebc | |
|
|
704557e995 | |
|
|
21de3667bb | |
|
|
13868ee323 | |
|
|
258560d5b4 | |
|
|
abcdb74259 | |
|
|
014b388ee2 | |
|
|
e7a1415f0c | |
|
|
bcdfb529c4 | |
|
|
502760e2fd | |
|
|
a1fd78d9c8 | |
|
|
758bbdd949 | |
|
|
afcb324911 | |
|
|
fa9121b76e | |
|
|
dce41ebac5 | |
|
|
8f395012e9 | |
|
|
12f3fa0878 |
|
|
@ -0,0 +1 @@
|
||||||
|
PUBLIC_URL=/mcfxkh
|
||||||
|
|
@ -1 +1,2 @@
|
||||||
|
PUBLIC_URL=/mcfxkh
|
||||||
GENERATE_SOURCEMAP=false
|
GENERATE_SOURCEMAP=false
|
||||||
Binary file not shown.
|
Before Width: | Height: | Size: 64 KiB After Width: | Height: | Size: 80 KiB |
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 26 KiB |
File diff suppressed because it is too large
Load Diff
|
|
@ -9,7 +9,7 @@
|
||||||
"tempcolumn": 0,
|
"tempcolumn": 0,
|
||||||
"warnid": 1128,
|
"warnid": 1128,
|
||||||
"isauto": "0",
|
"isauto": "0",
|
||||||
"lgtd": 115.01083,
|
"lgtd": 115.02083,
|
||||||
"lttd": 31.041152,
|
"lttd": 31.041152,
|
||||||
"warnnm": "白果镇山洪准备转移",
|
"warnnm": "白果镇山洪准备转移",
|
||||||
"adnm": "白果镇",
|
"adnm": "白果镇",
|
||||||
|
|
@ -30,7 +30,7 @@
|
||||||
"warnnm": "夫子河镇北门村山洪准备转移",
|
"warnnm": "夫子河镇北门村山洪准备转移",
|
||||||
"adnm": "夫子河镇北门村",
|
"adnm": "夫子河镇北门村",
|
||||||
"adcd": "421181104001000",
|
"adcd": "421181104001000",
|
||||||
"lgtd": 115.01986,
|
"lgtd": 115.02986,
|
||||||
"lttd": 30.968793,
|
"lttd": 30.968793,
|
||||||
"warntypeid": 10,
|
"warntypeid": 10,
|
||||||
"temprownumber": 2
|
"temprownumber": 2
|
||||||
|
|
@ -48,7 +48,7 @@
|
||||||
"warnnm": "夫子河镇山洪准备转移",
|
"warnnm": "夫子河镇山洪准备转移",
|
||||||
"adnm": "夫子河镇",
|
"adnm": "夫子河镇",
|
||||||
"adcd": "421181104000000",
|
"adcd": "421181104000000",
|
||||||
"lgtd": 115.026944,
|
"lgtd": 115.036944,
|
||||||
"lttd": 30.959121,
|
"lttd": 30.959121,
|
||||||
"warntypeid": 10,
|
"warntypeid": 10,
|
||||||
"temprownumber": 3
|
"temprownumber": 3
|
||||||
|
|
@ -66,7 +66,7 @@
|
||||||
"warnnm": "福田河镇山洪准备转移",
|
"warnnm": "福田河镇山洪准备转移",
|
||||||
"adnm": "福田河镇",
|
"adnm": "福田河镇",
|
||||||
"adcd": "421181111000000",
|
"adcd": "421181111000000",
|
||||||
"lgtd": 115.075433,
|
"lgtd": 115.085433,
|
||||||
"lttd": 31.384331,
|
"lttd": 31.384331,
|
||||||
"warntypeid": 10,
|
"warntypeid": 10,
|
||||||
"temprownumber": 4
|
"temprownumber": 4
|
||||||
|
|
@ -84,7 +84,7 @@
|
||||||
"warnnm": "木子店镇山洪准备转移",
|
"warnnm": "木子店镇山洪准备转移",
|
||||||
"adnm": "木子店镇",
|
"adnm": "木子店镇",
|
||||||
"adcd": "421181107000000",
|
"adcd": "421181107000000",
|
||||||
"lgtd": 115.172808,
|
"lgtd": 115.182808,
|
||||||
"lttd": 30.963342,
|
"lttd": 30.963342,
|
||||||
"warntypeid": 10,
|
"warntypeid": 10,
|
||||||
"temprownumber": 5
|
"temprownumber": 5
|
||||||
|
|
@ -102,7 +102,7 @@
|
||||||
"warnnm": "白果镇山洪准备转移",
|
"warnnm": "白果镇山洪准备转移",
|
||||||
"adnm": "白果镇",
|
"adnm": "白果镇",
|
||||||
"adcd": "421181103000000",
|
"adcd": "421181103000000",
|
||||||
"lgtd": 115.01083,
|
"lgtd": 115.02083,
|
||||||
"lttd": 31.041152,
|
"lttd": 31.041152,
|
||||||
"warntypeid": 10,
|
"warntypeid": 10,
|
||||||
"temprownumber": 6
|
"temprownumber": 6
|
||||||
|
|
|
||||||
|
|
@ -52,7 +52,7 @@ const config = {
|
||||||
h: 720 / 2
|
h: 720 / 2
|
||||||
},
|
},
|
||||||
|
|
||||||
homePitch: 60,
|
homePitch: 0,
|
||||||
poiPitch: 60,
|
poiPitch: 60,
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -6,35 +6,36 @@ const pubapi = 'http://owrsvr.cloudowr.cn/pubapi';
|
||||||
const DEBUG_YJ = config.isShYjDebug ? '?debug=1' : '?debug=0';
|
const DEBUG_YJ = config.isShYjDebug ? '?debug=1' : '?debug=0';
|
||||||
|
|
||||||
const yj_folder_test = './yj_folder';
|
const yj_folder_test = './yj_folder';
|
||||||
|
const Url = 'http://mcfxkh3.cloudowr.cn'
|
||||||
|
|
||||||
const apiurl = {
|
const apiurl = {
|
||||||
yj_folder_test,
|
yj_folder_test,
|
||||||
yj_folder: '/service/yj_folder',
|
yj_folder: Url+'/service/yj_folder',
|
||||||
|
|
||||||
upgramurl: {
|
upgramurl: {
|
||||||
login: {
|
login: {
|
||||||
auth: '/service/sys/users/login',
|
auth: Url+'/service/sys/users/login',
|
||||||
},
|
},
|
||||||
|
|
||||||
sysuser: {
|
sysuser: {
|
||||||
get: '/service/sys/users/get',
|
get: Url+'/service/sys/users/get',
|
||||||
find: '/service/sys/users/find',
|
find: Url+'/service/sys/users/find',
|
||||||
save: '/service/sys/users/save',
|
save: Url+'/service/sys/users/save',
|
||||||
edit: '/service/sys/users/edit',
|
edit: Url+'/service/sys/users/edit',
|
||||||
del: '/service/sys/users/del',
|
del: Url+'/service/sys/users/del',
|
||||||
modpw: '/service/sys/users/modpw',
|
modpw: Url+'/service/sys/users/modpw',
|
||||||
},
|
},
|
||||||
|
|
||||||
loginlog: {
|
loginlog: {
|
||||||
find: '/service/sys/loginlog/find',
|
find: Url+'/service/sys/loginlog/find',
|
||||||
},
|
},
|
||||||
|
|
||||||
smtplog: {
|
smtplog: {
|
||||||
find: '/service/sys/smtplog/find',
|
find: Url+'/service/sys/smtplog/find',
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
sendSmtp: '/service/sys/sendsmtp',
|
sendSmtp: Url+'/service/sys/sendsmtp',
|
||||||
|
|
||||||
geoserver: {
|
geoserver: {
|
||||||
wfs: 'http://geo.cloudowr.cn/geoserver/yichang/ows',
|
wfs: 'http://geo.cloudowr.cn/geoserver/yichang/ows',
|
||||||
|
|
@ -45,245 +46,245 @@ const apiurl = {
|
||||||
pubapi,
|
pubapi,
|
||||||
|
|
||||||
adcd: {
|
adcd: {
|
||||||
list: '/service/adcd/list',
|
list: Url+'/service/adcd/list',
|
||||||
info: '/service/adcd/info',
|
info: Url+'/service/adcd/info',
|
||||||
},
|
},
|
||||||
ws: {
|
ws: {
|
||||||
list: '/service/ws/list',
|
list: Url+'/service/ws/list',
|
||||||
wataGet: '/service/ws/wata/get',
|
wataGet: Url+'/service/ws/wata/get',
|
||||||
stat: '/service/ws/stat',
|
stat: Url+'/service/ws/stat',
|
||||||
statIndex: '/service/ws/stat/index',
|
statIndex: Url+'/service/ws/stat/index',
|
||||||
},
|
},
|
||||||
// moved to dcpj
|
// moved to dcpj
|
||||||
fzdx: {
|
fzdx: {
|
||||||
list: '/service/fzdx/list',
|
list: Url+'/service/fzdx/list',
|
||||||
get: '/service/fzdx/get',
|
get: Url+'/service/fzdx/get',
|
||||||
},
|
},
|
||||||
picst: {
|
picst: {
|
||||||
list: '/service/st/pic/list',
|
list: Url+'/service/st/pic/list',
|
||||||
},
|
},
|
||||||
dcpj: {
|
dcpj: {
|
||||||
fzdx: {
|
fzdx: {
|
||||||
list: '/service/fzdx/list',
|
list: Url+'/service/fzdx/list',
|
||||||
get: '/service/fzdx/get',
|
get: Url+'/service/fzdx/get',
|
||||||
},
|
},
|
||||||
bridge: {
|
bridge: {
|
||||||
list: '/service/dcpj/bridge/list',
|
list: Url+'/service/dcpj/bridge/list',
|
||||||
get: '/service/dcpj/bridge/get',
|
get: Url+'/service/dcpj/bridge/get',
|
||||||
find: '/service/dcpj/bridge/find',
|
find: Url+'/service/dcpj/bridge/find',
|
||||||
save: '/service/dcpj/bridge/save',
|
save: Url+'/service/dcpj/bridge/save',
|
||||||
edit: '/service/dcpj/bridge/edit',
|
edit: Url+'/service/dcpj/bridge/edit',
|
||||||
del: '/service/dcpj/bridge/del',
|
del: Url+'/service/dcpj/bridge/del',
|
||||||
},
|
},
|
||||||
culvert: {
|
culvert: {
|
||||||
list: '/service/dcpj/culvert/list',
|
list: Url+'/service/dcpj/culvert/list',
|
||||||
get: '/service/dcpj/culvert/get',
|
get: Url+'/service/dcpj/culvert/get',
|
||||||
find: '/service/dcpj/culvert/find',
|
find: Url+'/service/dcpj/culvert/find',
|
||||||
save: '/service/dcpj/culvert/save',
|
save: Url+'/service/dcpj/culvert/save',
|
||||||
edit: '/service/dcpj/culvert/edit',
|
edit: Url+'/service/dcpj/culvert/edit',
|
||||||
del: '/service/dcpj/culvert/del',
|
del: Url+'/service/dcpj/culvert/del',
|
||||||
},
|
},
|
||||||
sluice: {
|
sluice: {
|
||||||
list: '/service/dcpj/sluice/list',
|
list: Url+'/service/dcpj/sluice/list',
|
||||||
get: '/service/dcpj/sluice/get',
|
get: Url+'/service/dcpj/sluice/get',
|
||||||
find: '/service/dcpj/sluice/find',
|
find: Url+'/service/dcpj/sluice/find',
|
||||||
save: '/service/dcpj/sluice/save',
|
save: Url+'/service/dcpj/sluice/save',
|
||||||
edit: '/service/dcpj/sluice/edit',
|
edit: Url+'/service/dcpj/sluice/edit',
|
||||||
del: '/service/dcpj/sluice/del',
|
del: Url+'/service/dcpj/sluice/del',
|
||||||
},
|
},
|
||||||
reservoir: {
|
reservoir: {
|
||||||
list: '/service/st/sk/list',
|
list: Url+'/service/st/sk/list',
|
||||||
},
|
},
|
||||||
daminfo: {
|
daminfo: {
|
||||||
list: '/service/dcpj/daminfo/list',
|
list: Url+'/service/dcpj/daminfo/list',
|
||||||
get: '/service/dcpj/daminfo/get',
|
get: Url+'/service/dcpj/daminfo/get',
|
||||||
find: '/service/dcpj/daminfo/find',
|
find: Url+'/service/dcpj/daminfo/find',
|
||||||
save: '/service/dcpj/daminfo/save',
|
save: Url+'/service/dcpj/daminfo/save',
|
||||||
edit: '/service/dcpj/daminfo/edit',
|
edit: Url+'/service/dcpj/daminfo/edit',
|
||||||
del: '/service/dcpj/daminfo/del',
|
del: Url+'/service/dcpj/daminfo/del',
|
||||||
},
|
},
|
||||||
dike: {
|
dike: {
|
||||||
list: '/service/dcpj/dike/list',
|
list: Url+'/service/dcpj/dike/list',
|
||||||
get: '/service/dcpj/dike/get',
|
get: Url+'/service/dcpj/dike/get',
|
||||||
find: '/service/dcpj/dike/find',
|
find: Url+'/service/dcpj/dike/find',
|
||||||
save: '/service/dcpj/dike/save',
|
save: Url+'/service/dcpj/dike/save',
|
||||||
edit: '/service/dcpj/dike/edit',
|
edit: Url+'/service/dcpj/dike/edit',
|
||||||
del: '/service/dcpj/dike/del',
|
del: Url+'/service/dcpj/dike/del',
|
||||||
},
|
},
|
||||||
srstinfo: {
|
srstinfo: {
|
||||||
list: '/service/dcpj/srstinfo/list',
|
list: Url+'/service/dcpj/srstinfo/list',
|
||||||
get: '/service/dcpj/srstinfo/get',
|
get: Url+'/service/dcpj/srstinfo/get',
|
||||||
find: '/service/dcpj/srstinfo/find',
|
find: Url+'/service/dcpj/srstinfo/find',
|
||||||
save: '/service/dcpj/srstinfo/save',
|
save: Url+'/service/dcpj/srstinfo/save',
|
||||||
edit: '/service/dcpj/srstinfo/edit',
|
edit: Url+'/service/dcpj/srstinfo/edit',
|
||||||
del: '/service/dcpj/srstinfo/del',
|
del: Url+'/service/dcpj/srstinfo/del',
|
||||||
},
|
},
|
||||||
stinfo: {
|
stinfo: {
|
||||||
list: '/service/dcpj/stinfo/list',
|
list: Url+'/service/dcpj/stinfo/list',
|
||||||
get: '/service/dcpj/stinfo/get',
|
get: Url+'/service/dcpj/stinfo/get',
|
||||||
find: '/service/dcpj/stinfo/find',
|
find: Url+'/service/dcpj/stinfo/find',
|
||||||
save: '/service/dcpj/stinfo/save',
|
save: Url+'/service/dcpj/stinfo/save',
|
||||||
edit: '/service/dcpj/stinfo/edit',
|
edit: Url+'/service/dcpj/stinfo/edit',
|
||||||
del: '/service/dcpj/stinfo/del',
|
del: Url+'/service/dcpj/stinfo/del',
|
||||||
},
|
},
|
||||||
swstinfo: {
|
swstinfo: {
|
||||||
list: '/service/dcpj/swstinfo/list',
|
list: Url+'/service/dcpj/swstinfo/list',
|
||||||
get: '/service/dcpj/swstinfo/get',
|
get: Url+'/service/dcpj/swstinfo/get',
|
||||||
find: '/service/dcpj/swstinfo/find',
|
find: Url+'/service/dcpj/swstinfo/find',
|
||||||
save: '/service/dcpj/swstinfo/save',
|
save: Url+'/service/dcpj/swstinfo/save',
|
||||||
edit: '/service/dcpj/swstinfo/edit',
|
edit: Url+'/service/dcpj/swstinfo/edit',
|
||||||
del: '/service/dcpj/swstinfo/del',
|
del: Url+'/service/dcpj/swstinfo/del',
|
||||||
},
|
},
|
||||||
wbrinfo: {
|
wbrinfo: {
|
||||||
list: '/service/dcpj/wbrinfo/list',
|
list: Url+'/service/dcpj/wbrinfo/list',
|
||||||
get: '/service/dcpj/wbrinfo/get',
|
get: Url+'/service/dcpj/wbrinfo/get',
|
||||||
find: '/service/dcpj/wbrinfo/find',
|
find: Url+'/service/dcpj/wbrinfo/find',
|
||||||
save: '/service/dcpj/wbrinfo/save',
|
save: Url+'/service/dcpj/wbrinfo/save',
|
||||||
edit: '/service/dcpj/wbrinfo/edit',
|
edit: Url+'/service/dcpj/wbrinfo/edit',
|
||||||
del: '/service/dcpj/wbrinfo/del',
|
del: Url+'/service/dcpj/wbrinfo/del',
|
||||||
},
|
},
|
||||||
bsnssinfo: {
|
bsnssinfo: {
|
||||||
list: '/service/dcpj/bsnssinfo/list',
|
list: Url+'/service/dcpj/bsnssinfo/list',
|
||||||
get: '/service/dcpj/bsnssinfo/get',
|
get: Url+'/service/dcpj/bsnssinfo/get',
|
||||||
find: '/service/dcpj/bsnssinfo/find',
|
find: Url+'/service/dcpj/bsnssinfo/find',
|
||||||
save: '/service/dcpj/bsnssinfo/save',
|
save: Url+'/service/dcpj/bsnssinfo/save',
|
||||||
edit: '/service/dcpj/bsnssinfo/edit',
|
edit: Url+'/service/dcpj/bsnssinfo/edit',
|
||||||
del: '/service/dcpj/bsnssinfo/del',
|
del: Url+'/service/dcpj/bsnssinfo/del',
|
||||||
},
|
},
|
||||||
dtresident: {
|
dtresident: {
|
||||||
list: '/service/dcpj/dtresident/list',
|
list: Url+'/service/dcpj/dtresident/list',
|
||||||
get: '/service/dcpj/dtresident/get',
|
get: Url+'/service/dcpj/dtresident/get',
|
||||||
find: '/service/dcpj/dtresident/find',
|
find: Url+'/service/dcpj/dtresident/find',
|
||||||
save: '/service/dcpj/dtresident/save',
|
save: Url+'/service/dcpj/dtresident/save',
|
||||||
edit: '/service/dcpj/dtresident/edit',
|
edit: Url+'/service/dcpj/dtresident/edit',
|
||||||
del: '/service/dcpj/dtresident/del',
|
del: Url+'/service/dcpj/dtresident/del',
|
||||||
},
|
},
|
||||||
flrvvlg: {
|
flrvvlg: {
|
||||||
list: '/service/dcpj/flrvvlg/list',
|
list: Url+'/service/dcpj/flrvvlg/list',
|
||||||
get: '/service/dcpj/flrvvlg/get',
|
get: Url+'/service/dcpj/flrvvlg/get',
|
||||||
find: '/service/dcpj/flrvvlg/find',
|
find: Url+'/service/dcpj/flrvvlg/find',
|
||||||
save: '/service/dcpj/flrvvlg/save',
|
save: Url+'/service/dcpj/flrvvlg/save',
|
||||||
edit: '/service/dcpj/flrvvlg/edit',
|
edit: Url+'/service/dcpj/flrvvlg/edit',
|
||||||
del: '/service/dcpj/flrvvlg/del',
|
del: Url+'/service/dcpj/flrvvlg/del',
|
||||||
},
|
},
|
||||||
danad: {
|
danad: {
|
||||||
list: '/service/dcpj/danad/list',
|
list: Url+'/service/dcpj/danad/list',
|
||||||
get: '/service/dcpj/danad/get',
|
get: Url+'/service/dcpj/danad/get',
|
||||||
find: '/service/dcpj/danad/find',
|
find: Url+'/service/dcpj/danad/find',
|
||||||
save: '/service/dcpj/danad/save',
|
save: Url+'/service/dcpj/danad/save',
|
||||||
edit: '/service/dcpj/danad/edit',
|
edit: Url+'/service/dcpj/danad/edit',
|
||||||
del: '/service/dcpj/danad/del',
|
del: Url+'/service/dcpj/danad/del',
|
||||||
},
|
},
|
||||||
placement: {
|
placement: {
|
||||||
list: '/service/dcpj/placement/list',
|
list: Url+'/service/dcpj/placement/list',
|
||||||
get: '/service/dcpj/placement/get',
|
get: Url+'/service/dcpj/placement/get',
|
||||||
find: '/service/dcpj/placement/find',
|
find: Url+'/service/dcpj/placement/find',
|
||||||
save: '/service/dcpj/placement/save',
|
save: Url+'/service/dcpj/placement/save',
|
||||||
edit: '/service/dcpj/placement/edit',
|
edit: Url+'/service/dcpj/placement/edit',
|
||||||
del: '/service/dcpj/placement/del',
|
del: Url+'/service/dcpj/placement/del',
|
||||||
},
|
},
|
||||||
transfer: {
|
transfer: {
|
||||||
list: '/service/dcpj/transfer/list',
|
list: Url+'/service/dcpj/transfer/list',
|
||||||
get: '/service/dcpj/transfer/get',
|
get: Url+'/service/dcpj/transfer/get',
|
||||||
find: '/service/dcpj/transfer/find',
|
find: Url+'/service/dcpj/transfer/find',
|
||||||
save: '/service/dcpj/transfer/save',
|
save: Url+'/service/dcpj/transfer/save',
|
||||||
edit: '/service/dcpj/transfer/edit',
|
edit: Url+'/service/dcpj/transfer/edit',
|
||||||
del: '/service/dcpj/transfer/del',
|
del: Url+'/service/dcpj/transfer/del',
|
||||||
},
|
},
|
||||||
hdm: {
|
hdm: {
|
||||||
list: '/service/dcpj/hdm/list',
|
list: Url+'/service/dcpj/hdm/list',
|
||||||
get: '/service/dcpj/hdm/get',
|
get: Url+'/service/dcpj/hdm/get',
|
||||||
namelist: '/service/dcpj/hdm/namelist',
|
namelist: Url+'/service/dcpj/hdm/namelist',
|
||||||
},
|
},
|
||||||
hfdfts: {
|
hfdfts: {
|
||||||
list: '/service/dcpj/hfdfts/list',
|
list: Url+'/service/dcpj/hfdfts/list',
|
||||||
get: '/service/dcpj/hfdfts/get',
|
get: Url+'/service/dcpj/hfdfts/get',
|
||||||
find: '/service/dcpj/hfdfts/find',
|
find: Url+'/service/dcpj/hfdfts/find',
|
||||||
save: '/service/dcpj/hfdfts/save',
|
save: Url+'/service/dcpj/hfdfts/save',
|
||||||
edit: '/service/dcpj/hfdfts/edit',
|
edit: Url+'/service/dcpj/hfdfts/edit',
|
||||||
del: '/service/dcpj/hfdfts/del',
|
del: Url+'/service/dcpj/hfdfts/del',
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
personel: {
|
personel: {
|
||||||
listByType: '/service/personel/list',
|
listByType: Url+'/service/personel/list',
|
||||||
get: '/service/personel/get',
|
get: Url+'/service/personel/get',
|
||||||
find: '/service/personel/find',
|
find: Url+'/service/personel/find',
|
||||||
save: '/service/personel/save',
|
save: Url+'/service/personel/save',
|
||||||
edit: '/service/personel/edit',
|
edit: Url+'/service/personel/edit',
|
||||||
del: '/service/personel/del',
|
del: Url+'/service/personel/del',
|
||||||
},
|
},
|
||||||
|
|
||||||
skPersonel: {
|
skPersonel: {
|
||||||
listByStcd: '/service/st/sk/personel/list',
|
listByStcd: Url+'/service/st/sk/personel/list',
|
||||||
get: '/service/st/sk/personel/get',
|
get: Url+'/service/st/sk/personel/get',
|
||||||
save: '/service/st/sk/personel/save',
|
save: Url+'/service/st/sk/personel/save',
|
||||||
edit: '/service/st/sk/personel/edit',
|
edit: Url+'/service/st/sk/personel/edit',
|
||||||
del: '/service/st/sk/personel/del',
|
del: Url+'/service/st/sk/personel/del',
|
||||||
},
|
},
|
||||||
sk: {
|
sk: {
|
||||||
info: '/service/st/sk/info',
|
info: Url+'/service/st/sk/info',
|
||||||
savePlan: '/service/st/sk/plan/save',
|
savePlan: Url+'/service/st/sk/plan/save',
|
||||||
},
|
},
|
||||||
|
|
||||||
plan: {
|
plan: {
|
||||||
get: '/service/plan/get',
|
get: Url+'/service/plan/get',
|
||||||
find: '/service/plan/find',
|
find: Url+'/service/plan/find',
|
||||||
save: '/service/plan/save',
|
save: Url+'/service/plan/save',
|
||||||
edit: '/service/plan/edit',
|
edit: Url+'/service/plan/edit',
|
||||||
del: '/service/plan/del',
|
del: Url+'/service/plan/del',
|
||||||
},
|
},
|
||||||
|
|
||||||
zbap: {
|
zbap: {
|
||||||
get: '/service/zbap/get',
|
get: Url+'/service/zbap/get',
|
||||||
find: '/service/zbap/find',
|
find: Url+'/service/zbap/find',
|
||||||
save: '/service/zbap/save',
|
save: Url+'/service/zbap/save',
|
||||||
edit: '/service/zbap/edit',
|
edit: Url+'/service/zbap/edit',
|
||||||
del: '/service/zbap/del',
|
del: Url+'/service/zbap/del',
|
||||||
list: '/service/zbap/list',
|
list: Url+'/service/zbap/list',
|
||||||
upload: '/service/zbap/upload',
|
upload: Url+'/service/zbap/upload',
|
||||||
today: '/service/zbap/today',
|
today: Url+'/service/zbap/today',
|
||||||
},
|
},
|
||||||
|
|
||||||
real: {
|
real: {
|
||||||
shdrp: '/service/real/drp/sh',
|
shdrp: Url+'/service/real/drp/sh',
|
||||||
swdrp: '/service/real/drp/sw',
|
swdrp: Url+'/service/real/drp/sw',
|
||||||
skdrp: '/service/real/drp/sk',
|
skdrp: Url+'/service/real/drp/sk',
|
||||||
qxdrp: '/service/real/drp/qx',
|
qxdrp: Url+'/service/real/drp/qx',
|
||||||
shrz: '/service/real/rz/sh',
|
shrz: Url+'/service/real/rz/sh',
|
||||||
swrz: '/service/real/rz/sw',
|
swrz: Url+'/service/real/rz/sw',
|
||||||
sk: '/service/real/sk',
|
sk: Url+'/service/real/sk',
|
||||||
skPicGet: '/service/real/sk/pic/get',
|
skPicGet: Url+'/service/real/sk/pic/get',
|
||||||
drp: '/service/real/drp',
|
drp: Url+'/service/real/drp',
|
||||||
drpget: '/service/real/drpget',
|
drpget: Url+'/service/real/drpget',
|
||||||
skget: '/service/real/skget',
|
skget: Url+'/service/real/skget',
|
||||||
rz: '/service/real/rz',
|
rz: Url+'/service/real/rz',
|
||||||
},
|
},
|
||||||
|
|
||||||
st: {
|
st: {
|
||||||
sh: '/service/st/sh/list',
|
sh: Url+'/service/st/sh/list',
|
||||||
sw: '/service/st/sw/list',
|
sw: Url+'/service/st/sw/list',
|
||||||
sk: '/service/st/sk/list',
|
sk: Url+'/service/st/sk/list',
|
||||||
qx: '/service/st/qx/list',
|
qx: Url+'/service/st/qx/list',
|
||||||
list: '/service/st/list',
|
list: Url+'/service/st/list',
|
||||||
edit: '/service/st/edit'
|
edit: Url+'/service/st/edit'
|
||||||
},
|
},
|
||||||
|
|
||||||
ex: {
|
ex: {
|
||||||
watadrp: '/service/ex/watadrp',
|
watadrp: Url+'/service/ex/watadrp',
|
||||||
bx: '/service/ex/bx',
|
bx: Url+'/service/ex/bx',
|
||||||
globalSearch: '/service/ex/globalSearch',
|
globalSearch: Url+'/service/ex/globalSearch',
|
||||||
dmcrz: '/service/ex/dmcrz',
|
dmcrz: Url+'/service/ex/dmcrz',
|
||||||
dmrz: '/service/ex/dmrz',
|
dmrz: Url+'/service/ex/dmrz',
|
||||||
},
|
},
|
||||||
|
|
||||||
skalert: {
|
skalert: {
|
||||||
find: '/service/skalert/find',
|
find: Url+'/service/skalert/find',
|
||||||
close: '/service/skalert/close',
|
close: Url+'/service/skalert/close',
|
||||||
},
|
},
|
||||||
|
|
||||||
skalertLatest: {
|
skalertLatest: {
|
||||||
find: '/service/skalert/latest',
|
find: Url+'/service/skalert/latest',
|
||||||
},
|
},
|
||||||
|
|
||||||
shyj: {
|
shyj: {
|
||||||
|
|
@ -301,52 +302,52 @@ const apiurl = {
|
||||||
|
|
||||||
|
|
||||||
yjhis: {
|
yjhis: {
|
||||||
get: '/service/shqx/grb/get',
|
get: Url+'/service/shqx/grb/get',
|
||||||
find: '/service/shqx/grb/find',
|
find: Url+'/service/shqx/grb/find',
|
||||||
latest: '/service/shqx/grb/latest',
|
latest: Url+'/service/shqx/grb/latest',
|
||||||
stat: '/service/shqx/grb/stat',
|
stat: Url+'/service/shqx/grb/stat',
|
||||||
weather: '/service/shqx/res/grblayerset',
|
weather: Url+'/service/shqx/res/grblayerset',
|
||||||
report: '/service/shqx/grb/report',
|
report: Url+'/service/shqx/grb/report',
|
||||||
rainimglist: '/service/shqx/grb/rainimglist',
|
rainimglist: Url+'/service/shqx/grb/rainimglist',
|
||||||
imglist: '/service/shqx/grb/imglist',
|
imglist: Url+'/service/shqx/grb/imglist',
|
||||||
},
|
},
|
||||||
|
|
||||||
radarhis: {
|
radarhis: {
|
||||||
get: '/service/shqx/radar/get',
|
get: Url+'/service/shqx/radar/get',
|
||||||
find: '/service/shqx/radar/find',
|
find: Url+'/service/shqx/radar/find',
|
||||||
latest: '/service/shqx/radar/latest',
|
latest: Url+'/service/shqx/radar/latest',
|
||||||
stat: '/service/shqx/radar/stat',
|
stat: Url+'/service/shqx/radar/stat',
|
||||||
weather: '/service/shqx/res/radarlayer',
|
weather: Url+'/service/shqx/res/radarlayer',
|
||||||
rainimg: '/service/shqx/radar/rainimg',
|
rainimg: Url+'/service/shqx/radar/rainimg',
|
||||||
imglist: '/service/shqx/radar/imglist',
|
imglist: Url+'/service/shqx/radar/imglist',
|
||||||
},
|
},
|
||||||
|
|
||||||
warnresprecord: {
|
warnresprecord: {
|
||||||
latest: '/service/warnresprecord/last',
|
latest: Url+'/service/warnresprecord/last',
|
||||||
save: '/service/warnresprecord/save',
|
save: Url+'/service/warnresprecord/save',
|
||||||
dispose: '/service/warnresprecord/dispose',
|
dispose: Url+'/service/warnresprecord/dispose',
|
||||||
get: '/service/warnresprecord/get',
|
get: Url+'/service/warnresprecord/get',
|
||||||
close: '/service/warnresprecord/close',
|
close: Url+'/service/warnresprecord/close',
|
||||||
delete: '/service/warnresprecord/delDispose',
|
delete: Url+'/service/warnresprecord/delDispose',
|
||||||
},
|
},
|
||||||
|
|
||||||
warnresp: {
|
warnresp: {
|
||||||
list: '/service/warnresp/list',
|
list: Url+'/service/warnresp/list',
|
||||||
},
|
},
|
||||||
|
|
||||||
stwarnrecord: {
|
stwarnrecord: {
|
||||||
unclose: '/service/stwarnrecord/unclose',
|
unclose: Url+'/service/stwarnrecord/unclose',
|
||||||
find: '/service/stwarnrecord/find',
|
find: Url+'/service/stwarnrecord/find',
|
||||||
},
|
},
|
||||||
|
|
||||||
ctrl: {
|
ctrl: {
|
||||||
cmd: '/service/ctrl/cmd',
|
cmd: Url+'/service/ctrl/cmd',
|
||||||
audio: '/service/ctrl/audio',
|
audio: Url+'/service/ctrl/audio',
|
||||||
},
|
},
|
||||||
|
|
||||||
//汛情监视
|
//汛情监视
|
||||||
xqjs: {
|
xqjs: {
|
||||||
sktp: '/service/real/sk',
|
sktp: Url+'/service/real/sk',
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -148,7 +148,7 @@ const map = {
|
||||||
setView(id) {
|
setView(id) {
|
||||||
let layerVisible = {};
|
let layerVisible = {};
|
||||||
const map = window.__mapref
|
const map = window.__mapref
|
||||||
if (id === 1 || id == 503) {
|
if ( id == 503) {
|
||||||
layerVisible = {
|
layerVisible = {
|
||||||
RealDrpLayer: true,
|
RealDrpLayer: true,
|
||||||
RealHDLayer: true,
|
RealHDLayer: true,
|
||||||
|
|
@ -161,7 +161,22 @@ const map = {
|
||||||
Object.keys(DCPJ_TYPES).forEach(key => {
|
Object.keys(DCPJ_TYPES).forEach(key => {
|
||||||
layerVisible['Dcpj_' + key + 'Layer'] = false;
|
layerVisible['Dcpj_' + key + 'Layer'] = false;
|
||||||
});
|
});
|
||||||
} else if (id === 0) {
|
}if (id === 1 ) {
|
||||||
|
layerVisible = {
|
||||||
|
RealDrpLayer: true,
|
||||||
|
RealHDLayer: false,
|
||||||
|
RealSkLayer: false,
|
||||||
|
AdcdLayer: true,
|
||||||
|
PicStLayer: false,
|
||||||
|
RivlLayer: true,
|
||||||
|
WataLayer: false,
|
||||||
|
}
|
||||||
|
Object.keys(DCPJ_TYPES).forEach(key => {
|
||||||
|
layerVisible['Dcpj_' + key + 'Layer'] = false;
|
||||||
|
});
|
||||||
|
dispatch.runtime.setHome();
|
||||||
|
}
|
||||||
|
else if (id === 0) {
|
||||||
layerVisible = {
|
layerVisible = {
|
||||||
RealDrpLayer: false,
|
RealDrpLayer: false,
|
||||||
RealHDLayer: false,
|
RealHDLayer: false,
|
||||||
|
|
@ -177,10 +192,11 @@ const map = {
|
||||||
Object.keys(DCPJ_TYPES).forEach(key => {
|
Object.keys(DCPJ_TYPES).forEach(key => {
|
||||||
layerVisible['Dcpj_' + key + 'Layer'] = false;
|
layerVisible['Dcpj_' + key + 'Layer'] = false;
|
||||||
});
|
});
|
||||||
|
dispatch.runtime.setHome();
|
||||||
} else if (id === 8) {
|
} else if (id === 8) {
|
||||||
layerVisible = {
|
layerVisible = {
|
||||||
RealDrpLayer: false,
|
RealDrpLayer: true,
|
||||||
RealHDLayer: false,
|
RealHDLayer: true,
|
||||||
RealSkLayer: false,
|
RealSkLayer: false,
|
||||||
PicStLayer: false,
|
PicStLayer: false,
|
||||||
RivlLayer: true,
|
RivlLayer: true,
|
||||||
|
|
@ -194,6 +210,7 @@ const map = {
|
||||||
Object.keys(DCPJ_TYPES).forEach(key => {
|
Object.keys(DCPJ_TYPES).forEach(key => {
|
||||||
layerVisible['Dcpj_' + key + 'Layer'] = false;
|
layerVisible['Dcpj_' + key + 'Layer'] = false;
|
||||||
});
|
});
|
||||||
|
dispatch.runtime.setHome();
|
||||||
} else if (id === 2) {
|
} else if (id === 2) {
|
||||||
layerVisible = {
|
layerVisible = {
|
||||||
AdcdLayer: true,
|
AdcdLayer: true,
|
||||||
|
|
@ -217,6 +234,7 @@ const map = {
|
||||||
Object.keys(DCPJ_TYPES).forEach(key => {
|
Object.keys(DCPJ_TYPES).forEach(key => {
|
||||||
layerVisible['Dcpj_' + key + 'Layer'] = !SLGC_TYPES[key];
|
layerVisible['Dcpj_' + key + 'Layer'] = !SLGC_TYPES[key];
|
||||||
});
|
});
|
||||||
|
dispatch.runtime.setHome();
|
||||||
} else if (id === 4) {
|
} else if (id === 4) {
|
||||||
layerVisible = {
|
layerVisible = {
|
||||||
RealDrpLayer: false,
|
RealDrpLayer: false,
|
||||||
|
|
@ -229,19 +247,22 @@ const map = {
|
||||||
Object.keys(DCPJ_TYPES).forEach(key => {
|
Object.keys(DCPJ_TYPES).forEach(key => {
|
||||||
layerVisible['Dcpj_' + key + 'Layer'] = false;
|
layerVisible['Dcpj_' + key + 'Layer'] = false;
|
||||||
});
|
});
|
||||||
|
dispatch.runtime.setHome();
|
||||||
} else if (id === 5) {
|
} else if (id === 5) {
|
||||||
layerVisible = {
|
layerVisible = {
|
||||||
RealDrpLayer: true,
|
RealDrpLayer: false,
|
||||||
RealHDLayer: false,
|
RealHDLayer: false,
|
||||||
RealSkLayer: true,
|
RealSkLayer: false,
|
||||||
FzdxLayer: false,
|
FzdxLayer: false,
|
||||||
WataLayer: false,
|
WataLayer: false,
|
||||||
AdcdLayer: true,
|
AdcdLayer: true,
|
||||||
|
// AdcdLayer2: true,
|
||||||
RivlLayer: true,
|
RivlLayer: true,
|
||||||
};
|
};
|
||||||
Object.keys(DCPJ_TYPES).forEach(key => {
|
Object.keys(DCPJ_TYPES).forEach(key => {
|
||||||
layerVisible['Dcpj_' + key + 'Layer'] = false;
|
layerVisible['Dcpj_' + key + 'Layer'] = false;
|
||||||
});
|
});
|
||||||
|
dispatch.runtime.setHome();
|
||||||
} else if (id === 6) {
|
} else if (id === 6) {
|
||||||
layerVisible = {
|
layerVisible = {
|
||||||
RealDrpLayer: false,
|
RealDrpLayer: false,
|
||||||
|
|
@ -249,7 +270,7 @@ const map = {
|
||||||
RealSkLayer: false,
|
RealSkLayer: false,
|
||||||
RainDrpLayer: true,
|
RainDrpLayer: true,
|
||||||
ShuikuLayer: false,
|
ShuikuLayer: false,
|
||||||
BxSkLayer: true,
|
BxSkLayer: false,
|
||||||
FzdxLayer: false,
|
FzdxLayer: false,
|
||||||
WataLayer: false,
|
WataLayer: false,
|
||||||
AdcdLayer: true,
|
AdcdLayer: true,
|
||||||
|
|
@ -261,6 +282,7 @@ const map = {
|
||||||
Object.keys(DCPJ_TYPES).forEach(key => {
|
Object.keys(DCPJ_TYPES).forEach(key => {
|
||||||
layerVisible['Dcpj_' + key + 'Layer'] = false;
|
layerVisible['Dcpj_' + key + 'Layer'] = false;
|
||||||
});
|
});
|
||||||
|
dispatch.runtime.setHome();
|
||||||
} else if (id === 7) {
|
} else if (id === 7) {
|
||||||
layerVisible = {
|
layerVisible = {
|
||||||
RealDrpLayer: false,
|
RealDrpLayer: false,
|
||||||
|
|
@ -579,12 +601,26 @@ const map = {
|
||||||
map.setLayoutProperty('灌区图', 'visibility', 'none');
|
map.setLayoutProperty('灌区图', 'visibility', 'none');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
// if(id === 5){
|
||||||
|
// if(map){
|
||||||
|
// map.setLayoutProperty('网格雨量', 'visibility', 'visible');
|
||||||
|
// }
|
||||||
|
// }else{
|
||||||
|
// if(map){
|
||||||
|
// map.setLayoutProperty('网格雨量', 'visibility', 'none');
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
|
||||||
|
|
||||||
if (id != 504) {
|
if (id != 504) {
|
||||||
dispatch.runtime.setYyfa({})
|
dispatch.runtime.setYyfa({})
|
||||||
}
|
}
|
||||||
|
|
||||||
if (
|
if (
|
||||||
id === 3
|
id === 3
|
||||||
|
|| id === 0
|
||||||
|
|| id === 1
|
||||||
|
|| id === 5
|
||||||
|| id === 8
|
|| id === 8
|
||||||
|| id === 203
|
|| id === 203
|
||||||
|| id === 205
|
|| id === 205
|
||||||
|
|
@ -595,12 +631,13 @@ const map = {
|
||||||
// if(map){
|
// if(map){
|
||||||
// map.setLayoutProperty('卫星图', 'visibility', 'visible');
|
// map.setLayoutProperty('卫星图', 'visibility', 'visible');
|
||||||
// }
|
// }
|
||||||
} else {
|
|
||||||
dispatch.map.setLayerSetting({ dom: false });
|
|
||||||
// if(map){
|
|
||||||
// map.setLayoutProperty('卫星图', 'visibility', 'none');
|
|
||||||
// }
|
|
||||||
}
|
}
|
||||||
|
// else {
|
||||||
|
// dispatch.map.setLayerSetting({ dom: false });
|
||||||
|
// // if(map){
|
||||||
|
// // map.setLayoutProperty('卫星图', 'visibility', 'none');
|
||||||
|
// // }
|
||||||
|
// }
|
||||||
|
|
||||||
if(id!==200&&id!==203&&id!==205&&id!==206){
|
if(id!==200&&id!==203&&id!==205&&id!==206){
|
||||||
if(map){
|
if(map){
|
||||||
|
|
|
||||||
|
|
@ -32,8 +32,8 @@ export default function calcLayout(view, rightStack, hidePanels) {
|
||||||
} else if (view === 1) {
|
} else if (view === 1) {
|
||||||
left = [
|
left = [
|
||||||
{ key: '天气' },
|
{ key: '天气' },
|
||||||
{ key: '河道实时水情', style: { height: '10rem', flexGrow: 1 } },
|
{ key: '雨情统计', style: { height: '29rem', flexGrow: 1 } },
|
||||||
{ key: '水库监测', style: { height: '20rem', flexGrow: 1 } },
|
{ key: '实时雨情', style: { height: '20rem', flexGrow: 1 } },
|
||||||
];
|
];
|
||||||
leftFullHeight = true;
|
leftFullHeight = true;
|
||||||
} else if (view === 2) {
|
} else if (view === 2) {
|
||||||
|
|
@ -256,8 +256,11 @@ export default function calcLayout(view, rightStack, hidePanels) {
|
||||||
rightFullHeight = true;
|
rightFullHeight = true;
|
||||||
} else if (view === 1) {
|
} else if (view === 1) {
|
||||||
right = [
|
right = [
|
||||||
{ key: '警报' },
|
// { key: '警报' },
|
||||||
{ key: '实时雨情', style: { height: '20rem', flexGrow: 1 } },
|
{ key: '水情统计', style: { height: '20rem', flexGrow: 1 } },
|
||||||
|
{ key: '河道实时水情', style: { height: '20rem', flexGrow: 1 } },
|
||||||
|
{ key: '水库监测', style: { height: '20rem', flexGrow: 1 } },
|
||||||
|
|
||||||
]
|
]
|
||||||
rightFullHeight = true;
|
rightFullHeight = true;
|
||||||
} else if (view === 2) {
|
} else if (view === 2) {
|
||||||
|
|
@ -269,6 +272,7 @@ export default function calcLayout(view, rightStack, hidePanels) {
|
||||||
} else if (view === 3) {
|
} else if (view === 3) {
|
||||||
right = [
|
right = [
|
||||||
{ key: '网格', style: { height: '40rem' } },
|
{ key: '网格', style: { height: '40rem' } },
|
||||||
|
{ key: '单个预案', style: { height: '10rem',flexGrow: 1 } },
|
||||||
]
|
]
|
||||||
//rightFullHeight = true;
|
//rightFullHeight = true;
|
||||||
} else if (view === 4) {
|
} else if (view === 4) {
|
||||||
|
|
|
||||||
|
|
@ -14,6 +14,7 @@ function initState() {
|
||||||
layerSetting: {
|
layerSetting: {
|
||||||
},
|
},
|
||||||
yyObj: {},
|
yyObj: {},
|
||||||
|
yuananType:'sh',
|
||||||
duibifxNum:[],
|
duibifxNum:[],
|
||||||
shkshObj:undefined,
|
shkshObj:undefined,
|
||||||
gwobj: undefined,
|
gwobj: undefined,
|
||||||
|
|
@ -67,6 +68,9 @@ const runtime = {
|
||||||
setInfoDlg(state, props) {
|
setInfoDlg(state, props) {
|
||||||
return { ...state, infoDlg: props }
|
return { ...state, infoDlg: props }
|
||||||
},
|
},
|
||||||
|
setYuananType(state, props) {
|
||||||
|
return { ...state, yuananType: props }
|
||||||
|
},
|
||||||
setYyfa(state, props) {
|
setYyfa(state, props) {
|
||||||
return { ...state, yyObj: props }
|
return { ...state, yyObj: props }
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -34,7 +34,7 @@ const shyjview = {
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// dispatch.runtime.setHome();
|
dispatch.runtime.setHome();
|
||||||
},
|
},
|
||||||
async showWeatherRadar(_, state) {
|
async showWeatherRadar(_, state) {
|
||||||
dispatch.map.setCalculating(true);
|
dispatch.map.setCalculating(true);
|
||||||
|
|
@ -49,7 +49,7 @@ const shyjview = {
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// dispatch.runtime.setHome();
|
dispatch.runtime.setHome();
|
||||||
},
|
},
|
||||||
|
|
||||||
async showYj24hContour(latest) {
|
async showYj24hContour(latest) {
|
||||||
|
|
|
||||||
|
|
@ -1,18 +1,18 @@
|
||||||
const { createProxyMiddleware } = require('http-proxy-middleware');
|
const { createProxyMiddleware } = require('http-proxy-middleware');
|
||||||
|
|
||||||
module.exports = function (app) {
|
module.exports = function (app) {
|
||||||
app.use(
|
// app.use(
|
||||||
'/service',
|
// '/service',
|
||||||
createProxyMiddleware({
|
// createProxyMiddleware({
|
||||||
target: 'http://mcfxkh3.cloudowr.cn/',
|
// target: 'http://mcfxkh3.cloudowr.cn/',
|
||||||
changeOrigin: true,
|
// changeOrigin: true,
|
||||||
/*
|
// /*
|
||||||
pathRewrite: {
|
// pathRewrite: {
|
||||||
'^/service': '',
|
// '^/service': '',
|
||||||
},
|
// },
|
||||||
*/
|
// */
|
||||||
})
|
// })
|
||||||
);
|
// );
|
||||||
|
|
||||||
app.use(
|
app.use(
|
||||||
'/socket.io',
|
'/socket.io',
|
||||||
|
|
|
||||||
|
|
@ -29,7 +29,7 @@ function HDStDlg({ record, onClose }) {
|
||||||
<DpCloseButton onClick={onClose} />
|
<DpCloseButton onClick={onClose} />
|
||||||
</DpAppBar>
|
</DpAppBar>
|
||||||
|
|
||||||
<img src='/assets/报警列表.jpg' style={{width:'100%', height:'33rem',marginTop:'0rem'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/报警列表.jpg'} style={{width:'100%', height:'33rem',marginTop:'0rem'}}/>
|
||||||
</DialogContent>
|
</DialogContent>
|
||||||
<div className="boxfoot"></div>
|
<div className="boxfoot"></div>
|
||||||
</Dialog>
|
</Dialog>
|
||||||
|
|
|
||||||
|
|
@ -28,7 +28,7 @@ function HDStDlg({ record, onClose }) {
|
||||||
</DpTabs>
|
</DpTabs>
|
||||||
<DpCloseButton onClick={onClose} />
|
<DpCloseButton onClick={onClose} />
|
||||||
</DpAppBar>
|
</DpAppBar>
|
||||||
<img src='/assets/ddcg.jpg' style={{width:'95vw', height:'90vh'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/ddcg.jpg'} style={{width:'95vw', height:'90vh'}}/>
|
||||||
</DialogContent>
|
</DialogContent>
|
||||||
<div className="boxfoot"></div>
|
<div className="boxfoot"></div>
|
||||||
</Dialog>
|
</Dialog>
|
||||||
|
|
|
||||||
|
|
@ -28,7 +28,7 @@ function HDStDlg({ record, onClose }) {
|
||||||
</DpTabs>
|
</DpTabs>
|
||||||
<DpCloseButton onClick={onClose} />
|
<DpCloseButton onClick={onClose} />
|
||||||
</DpAppBar>
|
</DpAppBar>
|
||||||
<img src='/assets/fadb.jpg' style={{width:'80vw', height:'80vh',marginTop:"0.5rem",marginRight:'0.5rem'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/fadb.jpg'} style={{width:'80vw', height:'80vh',marginTop:"0.5rem",marginRight:'0.5rem'}}/>
|
||||||
</DialogContent>
|
</DialogContent>
|
||||||
<div className="boxfoot"></div>
|
<div className="boxfoot"></div>
|
||||||
</Dialog>
|
</Dialog>
|
||||||
|
|
|
||||||
|
|
@ -51,7 +51,7 @@ function HDStDlg({ record, onClose }) {
|
||||||
<div style={{width:'100%',height:'25rem'}}>
|
<div style={{width:'100%',height:'25rem'}}>
|
||||||
<AreaDrpChart data={[]} />
|
<AreaDrpChart data={[]} />
|
||||||
</div>
|
</div>
|
||||||
{/* <img src='/assets/报警列表.jpg' style={{width:'100%', height:'33rem',marginTop:'0rem'}}/> */}
|
{/* <img src={process.env.PUBLIC_URL+'/assets/报警列表.jpg'} style={{width:'100%', height:'33rem',marginTop:'0rem'}}/> */}
|
||||||
|
|
||||||
<TableContainer style={{ height: '15rem',padding:'10px 10px' }}>
|
<TableContainer style={{ height: '15rem',padding:'10px 10px' }}>
|
||||||
<Table size="small" stickyHeader>
|
<Table size="small" stickyHeader>
|
||||||
|
|
|
||||||
|
|
@ -209,7 +209,7 @@ function DrpChart({ record }) {
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
drpSearch(record.type, record.stcd, 'h', resultTm, record.countycode).then((data) => {
|
drpSearch(record.type, record.stcd, 'h', resultTm, record.countycode).then((data) => {
|
||||||
const newData = record.test ? demoData : data;
|
const newData = record.test ? demoData : data;
|
||||||
setData(newData || []);
|
setData(data);
|
||||||
});
|
});
|
||||||
}, [])
|
}, [])
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -102,6 +102,6 @@ export const iconstyles = {
|
||||||
}
|
}
|
||||||
|
|
||||||
export const iconbase = {
|
export const iconbase = {
|
||||||
backgroundImage: 'url(/mapbox/sprite@2x.png)',
|
backgroundImage: 'url('+process.env.PUBLIC_URL+'/mapbox/sprite@2x.png)',
|
||||||
backgroundSize: '1600% 1450%',
|
backgroundSize: '1600% 1450%',
|
||||||
};
|
};
|
||||||
|
|
@ -147,6 +147,9 @@ export default function MapCtrl({ initParams, onLoad }) {
|
||||||
dispatch?.runtime.setInfoDlg({ layerId: 'ByjcLayer', properties: record })
|
dispatch?.runtime.setInfoDlg({ layerId: 'ByjcLayer', properties: record })
|
||||||
}else if (record.stnm == '浮桥河水库') {
|
}else if (record.stnm == '浮桥河水库') {
|
||||||
dispatch?.runtime.setInfoDlg({ layerId: 'RealSkLayer', properties: record })
|
dispatch?.runtime.setInfoDlg({ layerId: 'RealSkLayer', properties: record })
|
||||||
|
} else if (record.type == 'sw') {
|
||||||
|
dispatch?.runtime.setFeaturePop({ layerId: 'RealHDPop', properties: record,coordinates: [record.lgtd, record.lttd] })
|
||||||
|
|
||||||
}
|
}
|
||||||
// dispatch.runtime.setFeaturePop({ type: 'RealSkPop', properties: record, coordinates: [record.lgtd, record.lttd] });
|
// dispatch.runtime.setFeaturePop({ type: 'RealSkPop', properties: record, coordinates: [record.lgtd, record.lttd] });
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -36,6 +36,8 @@ const SHAPE4 = {
|
||||||
'minzoom': 1,
|
'minzoom': 1,
|
||||||
'maxzoom': 14,
|
'maxzoom': 14,
|
||||||
'layout': {
|
'layout': {
|
||||||
|
// 'icon-allow-overlap': true,
|
||||||
|
// 'text-allow-overlap': true,
|
||||||
'icon-image': 'adcd5',
|
'icon-image': 'adcd5',
|
||||||
'icon-size': 0.4,
|
'icon-size': 0.4,
|
||||||
'text-size': 13,
|
'text-size': 13,
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,150 @@
|
||||||
|
|
||||||
|
import { openRecordPop } from "../_";
|
||||||
|
import BaseLayer from "./baselayer";
|
||||||
|
|
||||||
|
const SHAPE3 = {
|
||||||
|
id: '县名称2',
|
||||||
|
type: 'symbol',
|
||||||
|
source: 'adcd2',
|
||||||
|
filter: ['==', 'level', 4],
|
||||||
|
minzoom: 1,
|
||||||
|
maxzoom: 12,
|
||||||
|
layout: {
|
||||||
|
'icon-allow-overlap': true,
|
||||||
|
'text-allow-overlap': true,
|
||||||
|
'icon-image': 'adcd4',
|
||||||
|
'icon-size': 0.6,
|
||||||
|
'text-size': 16,
|
||||||
|
'text-font': ['Roboto Black'],
|
||||||
|
'text-field': ['get', 'NAME'],
|
||||||
|
'text-offset': [0, 0.6],
|
||||||
|
'text-anchor': 'top',
|
||||||
|
'text-max-width': 6,
|
||||||
|
},
|
||||||
|
paint: {
|
||||||
|
'text-color': '#fffab8',
|
||||||
|
'text-halo-color': 'hsl(0, 0%, 20%)',
|
||||||
|
'text-halo-width': 0.5
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const SHAPE4 = {
|
||||||
|
'id': '乡镇名称2',
|
||||||
|
'type': 'symbol',
|
||||||
|
'source': 'adcd2',
|
||||||
|
filter: ['==', 'level', 5],
|
||||||
|
'minzoom': 1,
|
||||||
|
'maxzoom': 14,
|
||||||
|
'layout': {
|
||||||
|
'icon-image': 'adcd5',
|
||||||
|
'icon-size': 0.4,
|
||||||
|
// 'icon-allow-overlap': true,
|
||||||
|
// 'text-allow-overlap': true,
|
||||||
|
'text-size': 13,
|
||||||
|
'text-font': ['Roboto Black'],
|
||||||
|
'text-field': ['get', 'NAME'],
|
||||||
|
'text-offset': [0, 0.6],
|
||||||
|
'text-anchor': 'top',
|
||||||
|
'text-max-width': 6,
|
||||||
|
},
|
||||||
|
'paint': {
|
||||||
|
'text-color': '#fffab8',
|
||||||
|
'text-halo-color': '#062040',
|
||||||
|
'text-halo-width': 1
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
const SHAPE5 = {
|
||||||
|
'id': '村名称2',
|
||||||
|
'type': 'symbol',
|
||||||
|
'source': 'adcd2',
|
||||||
|
filter: ['==', 'level', 6],
|
||||||
|
'minzoom': 12,
|
||||||
|
'maxzoom': 18,
|
||||||
|
'layout': {
|
||||||
|
'icon-image': 'adcd6',
|
||||||
|
'icon-size': 0.4,
|
||||||
|
'text-size': 12,
|
||||||
|
'text-font': ['Roboto Black'],
|
||||||
|
'text-field': ['get', 'NAME'],
|
||||||
|
'text-offset': [0, 0.8],
|
||||||
|
'text-anchor': 'top',
|
||||||
|
'text-max-width': 6
|
||||||
|
},
|
||||||
|
'paint': {
|
||||||
|
'text-color': '#fff',
|
||||||
|
'text-halo-color': '#062040',
|
||||||
|
'text-halo-width': 1
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
const SHAPE6 = {
|
||||||
|
'id': '组名称2',
|
||||||
|
'type': 'symbol',
|
||||||
|
'source': 'adcd2',
|
||||||
|
filter: ['==', 'level', 7],
|
||||||
|
'minzoom': 13,
|
||||||
|
'maxzoom': 18,
|
||||||
|
'layout': {
|
||||||
|
'icon-image': 'adcd7',
|
||||||
|
'icon-size': 0.4,
|
||||||
|
'text-size': 11,
|
||||||
|
'text-font': ['Roboto Black'],
|
||||||
|
'text-field': ['get', 'NAME'],
|
||||||
|
'text-offset': [0, 0.6],
|
||||||
|
'text-anchor': 'top',
|
||||||
|
'text-max-width': 6
|
||||||
|
},
|
||||||
|
'paint': {
|
||||||
|
'text-color': '#fff',
|
||||||
|
'text-halo-color': '#062040',
|
||||||
|
'text-halo-width': 1
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
export default class AdcdLayer2 extends BaseLayer {
|
||||||
|
|
||||||
|
getStyle(index) {
|
||||||
|
let shp;
|
||||||
|
if (index === 1) {
|
||||||
|
shp = SHAPE4;
|
||||||
|
} else if (index === 2) {
|
||||||
|
shp = SHAPE5;
|
||||||
|
} else if (index === 3) {
|
||||||
|
shp = SHAPE6;
|
||||||
|
} else {
|
||||||
|
shp = SHAPE3;
|
||||||
|
}
|
||||||
|
this._setStyleVisibility(shp);
|
||||||
|
return shp;
|
||||||
|
}
|
||||||
|
|
||||||
|
getName() {
|
||||||
|
return 'AdcdLayer2';
|
||||||
|
}
|
||||||
|
|
||||||
|
getSubLayers() {
|
||||||
|
return [SHAPE3.id, SHAPE4.id, SHAPE5.id, SHAPE6.id];
|
||||||
|
}
|
||||||
|
|
||||||
|
getRefreshInterval() {
|
||||||
|
return 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
async doRefreshLayer() {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
getFeatureTip() {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
featureClicked(properties, dispatch) {
|
||||||
|
console.log(properties);
|
||||||
|
openRecordPop(dispatch, 'adcd', properties)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -66,6 +66,17 @@ export default {
|
||||||
'paint': {
|
'paint': {
|
||||||
'raster-opacity': 1,
|
'raster-opacity': 1,
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
wangge:{
|
||||||
|
'id': '网格雨量',
|
||||||
|
'type': 'raster',
|
||||||
|
'source': '网格雨量',
|
||||||
|
'layout': {
|
||||||
|
'visibility':'none'
|
||||||
|
},
|
||||||
|
'paint': {
|
||||||
|
'raster-opacity': 1,
|
||||||
|
}
|
||||||
},
|
},
|
||||||
gqmap: {
|
gqmap: {
|
||||||
'id': '灌区图',
|
'id': '灌区图',
|
||||||
|
|
|
||||||
|
|
@ -12,6 +12,7 @@ import ContourLayer from "./contourlayer";
|
||||||
import WataLayer from "./watalayer";
|
import WataLayer from "./watalayer";
|
||||||
import HighlightLayer from "./highlightlayer";
|
import HighlightLayer from "./highlightlayer";
|
||||||
import AdcdLayer from "./adcdlayer";
|
import AdcdLayer from "./adcdlayer";
|
||||||
|
import AdcdLayer2 from "./adcdlayer2"
|
||||||
import FzdxLayer from "./fzdxlayer";
|
import FzdxLayer from "./fzdxlayer";
|
||||||
import TerrainLayer from "./terrainlayer";
|
import TerrainLayer from "./terrainlayer";
|
||||||
import PlaneAreaLayer from "./planarealayer";
|
import PlaneAreaLayer from "./planarealayer";
|
||||||
|
|
@ -112,6 +113,7 @@ class LayerMgr {
|
||||||
this.layers.push(new PlaneAreaLayer());
|
this.layers.push(new PlaneAreaLayer());
|
||||||
this.layers.push(new HighlightLayer());
|
this.layers.push(new HighlightLayer());
|
||||||
this.layers.push(new AdcdLayer());
|
this.layers.push(new AdcdLayer());
|
||||||
|
this.layers.push(new AdcdLayer2());
|
||||||
this.layers.push(new FzdxLayer());
|
this.layers.push(new FzdxLayer());
|
||||||
this.layers.push(new TerrainLayer());
|
this.layers.push(new TerrainLayer());
|
||||||
this.layers.push(new RoadLayer());
|
this.layers.push(new RoadLayer());
|
||||||
|
|
@ -135,13 +137,12 @@ class LayerMgr {
|
||||||
version: 8,
|
version: 8,
|
||||||
name: "fxkh",
|
name: "fxkh",
|
||||||
metadata: {},
|
metadata: {},
|
||||||
sprite: `${window.location.origin}/mapbox/sprite`,
|
sprite: `${window.location.origin+process.env.PUBLIC_URL}/mapbox/sprite`,
|
||||||
glyphs: `${window.location.origin}/mapbox/{fontstack}/{range}.pbf`,
|
glyphs: `${window.location.origin+process.env.PUBLIC_URL}/mapbox/{fontstack}/{range}.pbf`,
|
||||||
sources,
|
sources,
|
||||||
terrain: this.layerMap.TerrainLayer.getTerrain(),
|
terrain: this.layerMap.TerrainLayer.getTerrain(),
|
||||||
layers: [
|
layers: [
|
||||||
base.background,
|
base.background,
|
||||||
base.zhenGround,
|
|
||||||
base.heatmap,
|
base.heatmap,
|
||||||
base.gwmap,
|
base.gwmap,
|
||||||
base.gqmap,
|
base.gqmap,
|
||||||
|
|
@ -151,8 +152,10 @@ class LayerMgr {
|
||||||
this.layerMap.RivlLayer.getStyle('water'),
|
this.layerMap.RivlLayer.getStyle('water'),
|
||||||
this.layerMap.RivlLayer.getStyle('rivl'),
|
this.layerMap.RivlLayer.getStyle('rivl'),
|
||||||
sources.绿色区域 && base.plantZone,
|
sources.绿色区域 && base.plantZone,
|
||||||
|
base.zhenGround,
|
||||||
base.浮桥河流域,
|
base.浮桥河流域,
|
||||||
base.浮桥河,
|
base.浮桥河,
|
||||||
|
base.wangge,
|
||||||
base.xzj.shape, base.xj.shape,
|
base.xzj.shape, base.xj.shape,
|
||||||
|
|
||||||
this.layerMap.RoadLayer.getStyle('铁路case'),
|
this.layerMap.RoadLayer.getStyle('铁路case'),
|
||||||
|
|
@ -207,6 +210,12 @@ class LayerMgr {
|
||||||
this.layerMap.AdcdLayer.getStyle(1),
|
this.layerMap.AdcdLayer.getStyle(1),
|
||||||
this.layerMap.AdcdLayer.getStyle(0),
|
this.layerMap.AdcdLayer.getStyle(0),
|
||||||
|
|
||||||
|
// this.layerMap.AdcdLayer2.getStyle(3),
|
||||||
|
// this.layerMap.AdcdLayer2.getStyle(2),
|
||||||
|
// this.layerMap.AdcdLayer2.getStyle(1),
|
||||||
|
// this.layerMap.AdcdLayer2.getStyle(0),
|
||||||
|
|
||||||
|
|
||||||
this.layerMap.FzdxLayer.getStyle(),
|
this.layerMap.FzdxLayer.getStyle(),
|
||||||
this.layerMap.BxjcLayer.getStyle(),
|
this.layerMap.BxjcLayer.getStyle(),
|
||||||
this.layerMap.SyjcLayer.getStyle(),
|
this.layerMap.SyjcLayer.getStyle(),
|
||||||
|
|
|
||||||
|
|
@ -44,29 +44,31 @@ const ShapeStyle = {
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
const page1 = [{
|
const page1 = [
|
||||||
"stcd": "61612910",
|
{
|
||||||
"stnm": "桃林河(阎河)",
|
"stcd": "Q9111",
|
||||||
test:1,
|
"stnm": "福田河",
|
||||||
"adcd": "421181000000000",
|
"adcd": "421181000000000",
|
||||||
|
'test':1,
|
||||||
"wscd": null,
|
"wscd": null,
|
||||||
"importancy": 0,
|
"importancy": 0,
|
||||||
"lgtd": 115.087777777,
|
"lgtd": 115.0944,
|
||||||
"lttd": 31.164444444,
|
"lttd": 31.4747,
|
||||||
"elev": null,
|
"elev": null,
|
||||||
"hasRz": true,
|
"hasRz": true,
|
||||||
"type": "sh",
|
"type": "qx",
|
||||||
"today": 7,
|
"today": 50.3,
|
||||||
"h1": 3,
|
"h1": 50.2,
|
||||||
"h3": 4,
|
"h3": 50.2,
|
||||||
"h6": 6,
|
"h6": 50.2,
|
||||||
"h12": 7,
|
"h12": 50.2,
|
||||||
"h24": 12,
|
"h24": 50.3,
|
||||||
"h48": 19.5,
|
"tm": "2025-06-06T22:00:00.000Z",
|
||||||
"tm": "2025-06-03T02:10:00.000Z",
|
|
||||||
"state": 1,
|
"state": 1,
|
||||||
"warning": 0
|
"warning": 0
|
||||||
}]
|
},
|
||||||
|
]
|
||||||
|
|
||||||
export default class RainDrpLayer extends BaseLayer {
|
export default class RainDrpLayer extends BaseLayer {
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -31,7 +31,7 @@ import RainDrpLayer from "./rainDrpLayer"
|
||||||
import XunchaLayer from "./xunchalayer"
|
import XunchaLayer from "./xunchalayer"
|
||||||
import shyjLayer from "./shyjLayer"
|
import shyjLayer from "./shyjLayer"
|
||||||
|
|
||||||
const hash = window.location.origin;
|
const hash = window.location.origin+process.env.PUBLIC_URL;
|
||||||
|
|
||||||
const sources = {
|
const sources = {
|
||||||
"mapbox-dem": {
|
"mapbox-dem": {
|
||||||
|
|
@ -47,14 +47,15 @@ const sources = {
|
||||||
"mapbox-dom": {
|
"mapbox-dom": {
|
||||||
'type': 'raster',
|
'type': 'raster',
|
||||||
'tiles': [
|
'tiles': [
|
||||||
`http://res3dstatic0.cloudowr.cn/${config.address}/dom2/{z}/{x}/{y}.png`,
|
// `http://res3dstatic0.cloudowr.cn/${config.address}/dom2/{z}/{x}/{y}.png`,
|
||||||
`http://res3dstatic1.cloudowr.cn/${config.address}/dom2/{z}/{x}/{y}.png`,
|
// `http://res3dstatic1.cloudowr.cn/${config.address}/dom2/{z}/{x}/{y}.png`,
|
||||||
`http://res3dstatic2.cloudowr.cn/${config.address}/dom2/{z}/{x}/{y}.png`,
|
// `http://res3dstatic2.cloudowr.cn/${config.address}/dom2/{z}/{x}/{y}.png`,
|
||||||
`http://res3dstatic3.cloudowr.cn/${config.address}/dom2/{z}/{x}/{y}.png`,
|
// `http://res3dstatic3.cloudowr.cn/${config.address}/dom2/{z}/{x}/{y}.png`,
|
||||||
`http://res3dstatic4.cloudowr.cn/${config.address}/dom2/{z}/{x}/{y}.png`,
|
// `http://res3dstatic4.cloudowr.cn/${config.address}/dom2/{z}/{x}/{y}.png`,
|
||||||
`http://res3dstatic5.cloudowr.cn/${config.address}/dom2/{z}/{x}/{y}.png`,
|
// `http://res3dstatic5.cloudowr.cn/${config.address}/dom2/{z}/{x}/{y}.png`,
|
||||||
`http://res3dstatic6.cloudowr.cn/${config.address}/dom2/{z}/{x}/{y}.png`,
|
// `http://res3dstatic6.cloudowr.cn/${config.address}/dom2/{z}/{x}/{y}.png`,
|
||||||
`http://res3dstatic7.cloudowr.cn/${config.address}/dom2/{z}/{x}/{y}.png`,
|
// `http://res3dstatic7.cloudowr.cn/${config.address}/dom2/{z}/{x}/{y}.png`,
|
||||||
|
`https://t0.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=efc861f25f96dc6e5f884f0403ebfefd`,
|
||||||
],
|
],
|
||||||
'tileSize': 256,
|
'tileSize': 256,
|
||||||
'minzoom': 1,
|
'minzoom': 1,
|
||||||
|
|
@ -92,6 +93,21 @@ const sources = {
|
||||||
[114.7460271999999929, 30.8613739500000008], // 左下
|
[114.7460271999999929, 30.8613739500000008], // 左下
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
|
//网格雨量
|
||||||
|
"网格雨量": {
|
||||||
|
'type': 'image',
|
||||||
|
'url': `${hash}/assets/画板1.png`,
|
||||||
|
'coordinates': [
|
||||||
|
// 图片覆盖地图的四至点
|
||||||
|
[114.6710271999999929, 31.6068084090000987], // 左上
|
||||||
|
|
||||||
|
[115.4657823634995805, 31.6068084090000987], // 右上
|
||||||
|
|
||||||
|
[115.4657823634995805, 30.8613739500000008], // 右下
|
||||||
|
|
||||||
|
[114.6710271999999929, 30.8613739500000008], // 左下
|
||||||
|
],
|
||||||
|
},
|
||||||
//灌区图
|
//灌区图
|
||||||
"gqmapImg": {
|
"gqmapImg": {
|
||||||
'type': 'image',
|
'type': 'image',
|
||||||
|
|
@ -149,6 +165,10 @@ const sources = {
|
||||||
"data": `${hash}/data/adcd.geojson`,
|
"data": `${hash}/data/adcd.geojson`,
|
||||||
"type": "geojson"
|
"type": "geojson"
|
||||||
},
|
},
|
||||||
|
"adcd2": {
|
||||||
|
"data": `${hash}/data/adcd2.geojson`,
|
||||||
|
"type": "geojson"
|
||||||
|
},
|
||||||
/*
|
/*
|
||||||
"绿色区域": {
|
"绿色区域": {
|
||||||
"data": `${hash}/mapbox/geojson/绿色区域.geojson`,
|
"data": `${hash}/mapbox/geojson/绿色区域.geojson`,
|
||||||
|
|
|
||||||
|
|
@ -141,7 +141,9 @@ import Sbtj from './panels/Sbtj'
|
||||||
import Sbyj from './panels/Sbyj'
|
import Sbyj from './panels/Sbyj'
|
||||||
import Gsfhqx from './panels/Gsfhqx'
|
import Gsfhqx from './panels/Gsfhqx'
|
||||||
import JbqkRight from './panels/JbqkRight'
|
import JbqkRight from './panels/JbqkRight'
|
||||||
|
import RainSta from './panels/RainSta'
|
||||||
|
import DrpSta from './panels/DrpSta'
|
||||||
|
import Yuanan from './panels/SigelYuanan'
|
||||||
export default function PanelIndex({ name, style, ...params }) {
|
export default function PanelIndex({ name, style, ...params }) {
|
||||||
if (name === '天气') {
|
if (name === '天气') {
|
||||||
return (
|
return (
|
||||||
|
|
@ -348,6 +350,10 @@ export default function PanelIndex({ name, style, ...params }) {
|
||||||
return <Yawg style={style} />
|
return <Yawg style={style} />
|
||||||
} else if (name === "降雨分析") {
|
} else if (name === "降雨分析") {
|
||||||
return <Drpfx style={style} />
|
return <Drpfx style={style} />
|
||||||
|
} else if (name === "雨情统计") {
|
||||||
|
return <RainSta style={style} />
|
||||||
|
} else if (name === "水情统计") {
|
||||||
|
return <DrpSta style={style} />
|
||||||
} else if (name === "山洪预警") {
|
} else if (name === "山洪预警") {
|
||||||
return <ShWarn style={style} />
|
return <ShWarn style={style} />
|
||||||
} else if (name === "水库预警") {
|
} else if (name === "水库预警") {
|
||||||
|
|
@ -420,6 +426,8 @@ export default function PanelIndex({ name, style, ...params }) {
|
||||||
return <Zdgzsq style={style} />
|
return <Zdgzsq style={style} />
|
||||||
} else if (name === '测站到报率') {
|
} else if (name === '测站到报率') {
|
||||||
return <Czdbl style={style} />
|
return <Czdbl style={style} />
|
||||||
|
} else if (name === '单个预案') {
|
||||||
|
return <Yuanan style={style} />
|
||||||
}
|
}
|
||||||
return (
|
return (
|
||||||
<PanelBox style={style} title={name} color="red">
|
<PanelBox style={style} title={name} color="red">
|
||||||
|
|
|
||||||
|
|
@ -7,48 +7,48 @@ import { makeStyles, Tooltip, Typography } from '@material-ui/core';
|
||||||
const VIEWS = [
|
const VIEWS = [
|
||||||
|
|
||||||
{
|
{
|
||||||
id: 100, title: '防汛', img: '/assets/menu/防洪形势.png', children: [
|
id: 100, title: '防汛', img: process.env.PUBLIC_URL+'/assets/menu/防洪形势.png', children: [
|
||||||
// { id: 0, title: '防洪形势', img: '/assets/menu/防洪形势.png' },
|
// { id: 0, title: '防洪形势', img: process.env.PUBLIC_URL+'/assets/menu/防洪形势.png' },
|
||||||
{ id: 8, title: '防洪形势', img: '/assets/menu/防洪形势.png' },
|
{ id: 8, title: '防洪形势', img: process.env.PUBLIC_URL+'/assets/menu/防洪形势.png' },
|
||||||
// { id: 9, title: '防洪形势', img: '/assets/menu/防洪形势.png' },
|
// { id: 9, title: '防洪形势', img: process.env.PUBLIC_URL+'/assets/menu/防洪形势.png' },
|
||||||
{ id: 1, title: '实时数据', img: '/assets/menu/实时数据.png' },
|
{ id: 1, title: '监测数据', img: process.env.PUBLIC_URL+'/assets/menu/实时数据.png' },
|
||||||
{ id: 2, title: '水利设施', img: '/assets/menu/水利设施.png' },
|
// { id: 2, title: '水利设施', img: process.env.PUBLIC_URL+'/assets/menu/水利设施.png' },
|
||||||
{ id: 5, title: '预报', img: '/assets/menu/降雨中心.png' },
|
{ id: 5, title: '预报', img: process.env.PUBLIC_URL+'/assets/menu/降雨中心.png' },
|
||||||
{ id: 6, title: '预警', img: '/assets/menu/病险水库.png' },
|
{ id: 6, title: '预警', img: process.env.PUBLIC_URL+'/assets/menu/病险水库.png' },
|
||||||
{ id: 4, title: '预演', img: '/assets/menu/预警分析.png' },
|
{ id: 4, title: '预演', img: process.env.PUBLIC_URL+'/assets/menu/预警分析.png' },
|
||||||
{ id: 3, title: '预案', img: '/assets/menu/辅助决策.png' },
|
{ id: 3, title: '预案', img: process.env.PUBLIC_URL+'/assets/menu/辅助决策.png' },
|
||||||
{ id: 7, title: '调度', img: '/assets/menu/辅助决策.png' },
|
// { id: 7, title: '调度', img: process.env.PUBLIC_URL+'/assets/menu/辅助决策.png' },
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
// { id: 200, title: '水库', img: '/assets/menu/水库专题.png',children:[
|
// { id: 200, title: '水库', img: process.env.PUBLIC_URL+'/assets/menu/水库专题.png',children:[
|
||||||
// { id: 207, title: '水库总览', img: '/assets/menu/水库管理.png' },
|
// { id: 207, title: '水库总览', img: process.env.PUBLIC_URL+'/assets/menu/水库管理.png' },
|
||||||
// // { id: 201, title: '雨情监测', img: '/assets/menu/雨情监测.png' },
|
// // { id: 201, title: '雨情监测', img: process.env.PUBLIC_URL+'/assets/menu/雨情监测.png' },
|
||||||
// // { id: 202, title: '水情监测', img: '/assets/menu/水情监测.png' },
|
// // { id: 202, title: '水情监测', img: process.env.PUBLIC_URL+'/assets/menu/水情监测.png' },
|
||||||
// { id: 203, title: '水库监测', img: '/assets/menu/安全监测.png' },
|
// { id: 203, title: '水库监测', img: process.env.PUBLIC_URL+'/assets/menu/安全监测.png' },
|
||||||
// // { id: 204, title: '视频监视', img: '/assets/menu/视频监视.png' },
|
// // { id: 204, title: '视频监视', img: process.env.PUBLIC_URL+'/assets/menu/视频监视.png' },
|
||||||
// { id: 205, title: '防汛调度', img: '/assets/menu/防汛调度.png' },
|
// { id: 205, title: '防汛调度', img: process.env.PUBLIC_URL+'/assets/menu/防汛调度.png' },
|
||||||
// { id: 206, title: '巡查维养', img: '/assets/menu/水库管理.png' },
|
// { id: 206, title: '巡查维养', img: process.env.PUBLIC_URL+'/assets/menu/水库管理.png' },
|
||||||
// ] },
|
// ] },
|
||||||
{ id: 200, title: '水库', img: '/assets/menu/水库专题.png'},
|
{ id: 200, title: '水库', img: process.env.PUBLIC_URL+'/assets/menu/水库专题.png'},
|
||||||
{
|
{
|
||||||
id: 300, title: '水厂', img: '/assets/menu/水利设施.png', children: [
|
id: 300, title: '水厂', img: process.env.PUBLIC_URL+'/assets/menu/水利设施.png', children: [
|
||||||
{ id: 301, title: '供水态势', img: '/assets/menu/降雨中心.png' },
|
{ id: 301, title: '供水态势', img: process.env.PUBLIC_URL+'/assets/menu/降雨中心.png' },
|
||||||
{ id: 302, title: '水质安全', img: '/assets/menu/水情监测.png' },
|
{ id: 302, title: '水质安全', img: process.env.PUBLIC_URL+'/assets/menu/水情监测.png' },
|
||||||
{ id: 303, title: '水厂运行', img: '/assets/menu/水库管理.png' },
|
{ id: 303, title: '水厂运行', img: process.env.PUBLIC_URL+'/assets/menu/水库管理.png' },
|
||||||
{ id: 306, title: '管网健康诊断', img: '/assets/menu/水利设施.png' },
|
{ id: 306, title: '管网健康诊断', img: process.env.PUBLIC_URL+'/assets/menu/水利设施.png' },
|
||||||
{ id: 307, title: '应急指挥调度', img: '/assets/menu/病险水库.png' },
|
{ id: 307, title: '应急指挥调度', img: process.env.PUBLIC_URL+'/assets/menu/病险水库.png' },
|
||||||
// { id: 305, title: '决策支持与报表', img: '/assets/menu/辅助决策.png' },
|
// { id: 305, title: '决策支持与报表', img: process.env.PUBLIC_URL+'/assets/menu/辅助决策.png' },
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 400, title: '灌区', img: '/assets/menu/预警分析.png', children: [
|
id: 400, title: '灌区', img: process.env.PUBLIC_URL+'/assets/menu/预警分析.png', children: [
|
||||||
{ id: 501, title: '灌区监测', img: '/assets/menu/防洪形势.png' },
|
{ id: 501, title: '灌区监测', img: process.env.PUBLIC_URL+'/assets/menu/防洪形势.png' },
|
||||||
{ id: 504, title: '水旱灾害防御', img: '/assets/menu/水利设施.png' },
|
{ id: 504, title: '水旱灾害防御', img: process.env.PUBLIC_URL+'/assets/menu/水利设施.png' },
|
||||||
// { id: 502, title: '预警信息管理', img: '/assets/menu/实时数据.png' },
|
// { id: 502, title: '预警信息管理', img: process.env.PUBLIC_URL+'/assets/menu/实时数据.png' },
|
||||||
{ id: 503, title: '水资源调度', img: '/assets/menu/病险水库.png' },
|
{ id: 503, title: '水资源调度', img: process.env.PUBLIC_URL+'/assets/menu/病险水库.png' },
|
||||||
{ id: 505, title: '量测水管理', img: '/assets/menu/辅助决策.png' },
|
{ id: 505, title: '量测水管理', img: process.env.PUBLIC_URL+'/assets/menu/辅助决策.png' },
|
||||||
{ id: 506, title: '水政管理', img: '/assets/menu/预警分析.png' },
|
{ id: 506, title: '水政管理', img: process.env.PUBLIC_URL+'/assets/menu/预警分析.png' },
|
||||||
{ id: 507, title: '工程管理', img: '/assets/menu/降雨中心.png' },
|
{ id: 507, title: '工程管理', img: process.env.PUBLIC_URL+'/assets/menu/降雨中心.png' },
|
||||||
// 图层控制
|
// 图层控制
|
||||||
// 灌区监测
|
// 灌区监测
|
||||||
// 预警信息管理
|
// 预警信息管理
|
||||||
|
|
@ -85,7 +85,14 @@ export default function ActionDock({ }) {
|
||||||
const viewItem = useMemo(() => viewKey ? VIEWS.filter(o => o.id === viewKey)[0].children : VIEWS, [viewKey, VIEWS])
|
const viewItem = useMemo(() => viewKey ? VIEWS.filter(o => o.id === viewKey)[0].children : VIEWS, [viewKey, VIEWS])
|
||||||
|
|
||||||
const dispatch = useDispatch();
|
const dispatch = useDispatch();
|
||||||
|
const removePoint = () => {
|
||||||
|
const map = window.__mapref;
|
||||||
|
const layer = map.getLayer('关联站点')
|
||||||
|
if (layer) {
|
||||||
|
map.removeLayer('关联站点');
|
||||||
|
map.removeSource('关联站点');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="dp-actiondock">
|
<div className="dp-actiondock">
|
||||||
|
|
@ -97,9 +104,10 @@ export default function ActionDock({ }) {
|
||||||
setViewKey(null)
|
setViewKey(null)
|
||||||
dispatch.runtime.setScya(false)
|
dispatch.runtime.setScya(false)
|
||||||
dispatch.runtime.setGwtc(false)
|
dispatch.runtime.setGwtc(false)
|
||||||
|
removePoint()
|
||||||
}}>
|
}}>
|
||||||
<div className={clsx('button', { active: false })}>
|
<div className={clsx('button', { active: false })}>
|
||||||
<img width={40} style={{ marginLeft: '5px' }} src={'/assets/pump/退出.png'} />
|
<img width={40} style={{ marginLeft: '5px' }} src={process.env.PUBLIC_URL+'/assets/pump/退出.png'} />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</BootstrapTooltip>
|
</BootstrapTooltip>
|
||||||
|
|
@ -136,6 +144,7 @@ export default function ActionDock({ }) {
|
||||||
} else {
|
} else {
|
||||||
sessionStorage.setItem('point','')
|
sessionStorage.setItem('point','')
|
||||||
}
|
}
|
||||||
|
removePoint()
|
||||||
}
|
}
|
||||||
}}>
|
}}>
|
||||||
<div className={clsx('button', { active: o.id===200?(view===207||view===203||view===205||view===206||view===200):view === o.id })}>
|
<div className={clsx('button', { active: o.id===200?(view===207||view===203||view===205||view===206||view===200):view === o.id })}>
|
||||||
|
|
|
||||||
|
|
@ -207,7 +207,7 @@ function DrpSearch({ record }) {
|
||||||
drpSearch(record.type, record.stcd, 'h', searchTm.tm).then((data) => {
|
drpSearch(record.type, record.stcd, 'h', searchTm.tm).then((data) => {
|
||||||
console.log(data,record);
|
console.log(data,record);
|
||||||
const newData = record.test ? demoData : data;
|
const newData = record.test ? demoData : data;
|
||||||
setData(newData || []);
|
setData(data);
|
||||||
// setData(data);
|
// setData(data);
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -119,35 +119,35 @@ export default function Title() {
|
||||||
view===301?
|
view===301?
|
||||||
<div style={{position:'absolute',left:'50%',top:'6rem',transform:'translate(-50%, 0px)',display:'flex'}}>
|
<div style={{position:'absolute',left:'50%',top:'6rem',transform:'translate(-50%, 0px)',display:'flex'}}>
|
||||||
<div style={{display:'flex',alignItems:'center',justifyContent:'center',marginLeft:'20px'}}>
|
<div style={{display:'flex',alignItems:'center',justifyContent:'center',marginLeft:'20px'}}>
|
||||||
<img src='/assets/title1.png' style={{width:'50px', height:'40px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/title1.png'} style={{width:'50px', height:'40px'}}/>
|
||||||
<div style={{marginLeft:'8px',}}>
|
<div style={{marginLeft:'8px',}}>
|
||||||
<div style={{color:'rgba(255, 255, 255, 0.7)',fontSize:'10px',fontWeight:'400'}}><span style={{color:'#37D0E7',fontSize:'16px',fontWeight:'blod'}}>15 </span> 个</div>
|
<div style={{color:'rgba(255, 255, 255, 0.7)',fontSize:'10px',fontWeight:'400'}}><span style={{color:'#37D0E7',fontSize:'16px',fontWeight:'blod'}}>15 </span> 个</div>
|
||||||
<div style={{color:'#ffffff',fontSize:'12px',fontWeight:'400'}}>乡镇数量</div>
|
<div style={{color:'#ffffff',fontSize:'12px',fontWeight:'400'}}>乡镇数量</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div style={{display:'flex',alignItems:'center',justifyContent:'center',marginLeft:'20px'}}>
|
<div style={{display:'flex',alignItems:'center',justifyContent:'center',marginLeft:'20px'}}>
|
||||||
<img src='/assets/title2.png' style={{width:'50px', height:'40px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/title2.png'} style={{width:'50px', height:'40px'}}/>
|
||||||
<div style={{marginLeft:'8px',}}>
|
<div style={{marginLeft:'8px',}}>
|
||||||
<div style={{color:'rgba(255, 255, 255, 0.7)',fontSize:'10px',fontWeight:'400'}}><span style={{color:'#37D0E7',fontSize:'16px',fontWeight:'blod'}}>16 </span> 个</div>
|
<div style={{color:'rgba(255, 255, 255, 0.7)',fontSize:'10px',fontWeight:'400'}}><span style={{color:'#37D0E7',fontSize:'16px',fontWeight:'blod'}}>16 </span> 个</div>
|
||||||
<div style={{color:'#ffffff',fontSize:'12px',fontWeight:'400'}}>水源地数量</div>
|
<div style={{color:'#ffffff',fontSize:'12px',fontWeight:'400'}}>水源地数量</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div style={{display:'flex',alignItems:'center',justifyContent:'center',marginLeft:'20px'}}>
|
<div style={{display:'flex',alignItems:'center',justifyContent:'center',marginLeft:'20px'}}>
|
||||||
<img src='/assets/title3.png' style={{width:'50px', height:'40px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/title3.png'} style={{width:'50px', height:'40px'}}/>
|
||||||
<div style={{marginLeft:'8px',}}>
|
<div style={{marginLeft:'8px',}}>
|
||||||
<div style={{color:'rgba(255, 255, 255, 0.7)',fontSize:'10px',fontWeight:'400'}}><span style={{color:'#37D0E7',fontSize:'16px',fontWeight:'blod'}}>221 </span> 座</div>
|
<div style={{color:'rgba(255, 255, 255, 0.7)',fontSize:'10px',fontWeight:'400'}}><span style={{color:'#37D0E7',fontSize:'16px',fontWeight:'blod'}}>221 </span> 座</div>
|
||||||
<div style={{color:'#ffffff',fontSize:'12px',fontWeight:'400'}}>水厂数量</div>
|
<div style={{color:'#ffffff',fontSize:'12px',fontWeight:'400'}}>水厂数量</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div style={{display:'flex',alignItems:'center',justifyContent:'center',marginLeft:'20px'}}>
|
<div style={{display:'flex',alignItems:'center',justifyContent:'center',marginLeft:'20px'}}>
|
||||||
<img src='/assets/title4.png' style={{width:'50px', height:'40px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/title4.png'} style={{width:'50px', height:'40px'}}/>
|
||||||
<div style={{marginLeft:'8px',}}>
|
<div style={{marginLeft:'8px',}}>
|
||||||
<div style={{color:'rgba(255, 255, 255, 0.7)',fontSize:'10px',fontWeight:'400'}}><span style={{color:'#37D0E7',fontSize:'16px',fontWeight:'blod'}}>33 </span> 万</div>
|
<div style={{color:'rgba(255, 255, 255, 0.7)',fontSize:'10px',fontWeight:'400'}}><span style={{color:'#37D0E7',fontSize:'16px',fontWeight:'blod'}}>33 </span> 万</div>
|
||||||
<div style={{color:'#ffffff',fontSize:'12px',fontWeight:'400'}}>服务人口</div>
|
<div style={{color:'#ffffff',fontSize:'12px',fontWeight:'400'}}>服务人口</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div style={{display:'flex',alignItems:'center',justifyContent:'center',marginLeft:'20px'}}>
|
<div style={{display:'flex',alignItems:'center',justifyContent:'center',marginLeft:'20px'}}>
|
||||||
<img src='/assets/title5.png' style={{width:'50px', height:'40px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/title5.png'} style={{width:'50px', height:'40px'}}/>
|
||||||
<div style={{marginLeft:'8px',}}>
|
<div style={{marginLeft:'8px',}}>
|
||||||
<div style={{color:'rgba(255, 255, 255, 0.7)',fontSize:'10px',fontWeight:'400'}}><span style={{color:'#37D0E7',fontSize:'16px',fontWeight:'blod'}}>1026 </span> 万m³</div>
|
<div style={{color:'rgba(255, 255, 255, 0.7)',fontSize:'10px',fontWeight:'400'}}><span style={{color:'#37D0E7',fontSize:'16px',fontWeight:'blod'}}>1026 </span> 万m³</div>
|
||||||
<div style={{color:'#ffffff',fontSize:'12px',fontWeight:'400'}}>年供水规模</div>
|
<div style={{color:'#ffffff',fontSize:'12px',fontWeight:'400'}}>年供水规模</div>
|
||||||
|
|
|
||||||
|
|
@ -23,6 +23,7 @@ export default function Demo1() {
|
||||||
const isSc = useSelector(s => s.runtime.scya);
|
const isSc = useSelector(s => s.runtime.scya);
|
||||||
const wg = useSelector(s => s.runtime.shkshObj)
|
const wg = useSelector(s => s.runtime.shkshObj)
|
||||||
const showGw = useSelector(s => s.runtime.showGw)
|
const showGw = useSelector(s => s.runtime.showGw)
|
||||||
|
const yuananType = useSelector(s => s.runtime.yuananType);
|
||||||
console.log('wg', wg);
|
console.log('wg', wg);
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -64,11 +65,22 @@ export default function Demo1() {
|
||||||
!hp && (
|
!hp && (
|
||||||
<TransitionGroup className={clsx('left', 'dp-panel-container', layout.leftFullHeight && 'fullheight')}>
|
<TransitionGroup className={clsx('left', 'dp-panel-container', layout.leftFullHeight && 'fullheight')}>
|
||||||
{
|
{
|
||||||
layout.left.map(({ key, ...params }) => (
|
layout.left.map(({ key, ...params }) => {
|
||||||
|
if (key != '辅助决策列表') {
|
||||||
|
return (
|
||||||
<CSSTransition key={key} unmountOnExit exit={false} timeout={500} classNames="dp-panelgroup">
|
<CSSTransition key={key} unmountOnExit exit={false} timeout={500} classNames="dp-panelgroup">
|
||||||
<PanelIndex name={key} {...params} />
|
<PanelIndex name={key} {...params} />
|
||||||
</CSSTransition>
|
</CSSTransition>
|
||||||
))
|
)
|
||||||
|
} else if (yuananType == 'sh') {
|
||||||
|
return (
|
||||||
|
<CSSTransition key={key} unmountOnExit exit={false} timeout={500} classNames="dp-panelgroup">
|
||||||
|
<PanelIndex name={key} {...params} />
|
||||||
|
</CSSTransition>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
</TransitionGroup>
|
</TransitionGroup>
|
||||||
|
|
@ -82,7 +94,7 @@ export default function Demo1() {
|
||||||
<TransitionGroup className={clsx('right', 'dp-panel-container', layout.rightFullHeight && 'fullheight')}>
|
<TransitionGroup className={clsx('right', 'dp-panel-container', layout.rightFullHeight && 'fullheight')}>
|
||||||
{
|
{
|
||||||
layout.right.map(({ key, ...params }) => {
|
layout.right.map(({ key, ...params }) => {
|
||||||
if (key != '网格') {
|
if (key != '网格' && key != '单个预案') {
|
||||||
return (
|
return (
|
||||||
<CSSTransition key={key} unmountOnExit exit={false} timeout={500} classNames="dp-panelgroup">
|
<CSSTransition key={key} unmountOnExit exit={false} timeout={500} classNames="dp-panelgroup">
|
||||||
<PanelIndex name={key} {...params} />
|
<PanelIndex name={key} {...params} />
|
||||||
|
|
|
||||||
|
|
@ -10,11 +10,11 @@ function DrpReal({ style }) {
|
||||||
color="green"
|
color="green"
|
||||||
extra={
|
extra={
|
||||||
<>
|
<>
|
||||||
<img src='/assets/镇切换.jpg' style={{width:'150px', height:'20px',marginRight:'5px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/镇切换.jpg'} style={{width:'150px', height:'20px',marginRight:'5px'}}/>
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
<img src='/assets/安防监控.jpg' style={{width:'27.5rem', height:'11rem',marginLeft:'-8px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/安防监控.jpg'} style={{width:'27.5rem', height:'11rem',marginLeft:'-8px'}}/>
|
||||||
</PanelBox>
|
</PanelBox>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -29,7 +29,7 @@ const [type, setType] = useState('sc')
|
||||||
type == 'sc' ?<AreaDrpChart />:<ShuiyuandiChart />
|
type == 'sc' ?<AreaDrpChart />:<ShuiyuandiChart />
|
||||||
}
|
}
|
||||||
|
|
||||||
{/* <img src='/assets/报警分析.jpg' style={{width:'26.5rem', height:'13.5rem',marginLeft:'0rem',marginTop:'1rem'}}/> */}
|
{/* <img src={process.env.PUBLIC_URL+'/assets/报警分析.jpg'} style={{width:'26.5rem', height:'13.5rem',marginLeft:'0rem',marginTop:'1rem'}}/> */}
|
||||||
</PanelBox>
|
</PanelBox>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -65,8 +65,8 @@ export default function OverallContent({ data, skAll }) {
|
||||||
<div>
|
<div>
|
||||||
<span className={classes.titleDate}>{start}9时</span>至<span className={classes.titleDate}>{end}9时</span>
|
<span className={classes.titleDate}>{start}9时</span>至<span className={classes.titleDate}>{end}9时</span>
|
||||||
24小时中共有<span className={classes.number}>1</span>
|
24小时中共有<span className={classes.number}>1</span>
|
||||||
个站点雨量为<span className={classes.sttype}>大暴雨</span>,雨量值
|
个站点雨量为<span className={classes.sttype}>暴雨</span>,雨量值
|
||||||
<span className={classes.number}>261mm</span>;
|
<span className={classes.number}>50.2mm</span>;
|
||||||
共产生<span className={classes.number}>3</span>个山洪预警(2个内部预警,1个外部预警),均已处置;<span className={classes.number}>1</span>个水库超汛限,已短信通知责任人;<span className={classes.number}>1</span>个超警戒河道预警。
|
共产生<span className={classes.number}>3</span>个山洪预警(2个内部预警,1个外部预警),均已处置;<span className={classes.number}>1</span>个水库超汛限,已短信通知责任人;<span className={classes.number}>1</span>个超警戒河道预警。
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -915,39 +915,47 @@ function DrpReal({ style }) {
|
||||||
"aRz": -17.4
|
"aRz": -17.4
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
|
const removePoint = () => {
|
||||||
|
const map = window.__mapref;
|
||||||
|
const layer = map.getLayer('关联站点')
|
||||||
|
dispatch?.runtime.setFeaturePop({})
|
||||||
|
if (layer) {
|
||||||
|
map.removeLayer('关联站点');
|
||||||
|
map.removeSource('关联站点');
|
||||||
|
}
|
||||||
|
}
|
||||||
const [showbx, setShowdbx] = useState(0)
|
const [showbx, setShowdbx] = useState(0)
|
||||||
const [showsy, setShowdsy] = useState(0)
|
const [showsy, setShowdsy] = useState(0)
|
||||||
const [showsl, setShowdsl] = useState(0)
|
const [showsl, setShowdsl] = useState(0)
|
||||||
const [showby, setShowdby] = useState(0)
|
const [showby, setShowdby] = useState(0)
|
||||||
useEffect(() => {
|
// useEffect(() => {
|
||||||
const map = window.__mapref;
|
// const map = window.__mapref;
|
||||||
if (map) {
|
// if (map) {
|
||||||
if (tab === '1' && data1 && showbx) {
|
// if (tab === '1' && data1 && showbx) {
|
||||||
setLayer(data1, '变形')
|
// setLayer(data1, '变形')
|
||||||
}
|
// }
|
||||||
if (tab === '2' && data2 && showsy) {
|
// if (tab === '2' && data2 && showsy) {
|
||||||
|
|
||||||
setLayer(data2, '渗压')
|
// setLayer(data2, '渗压')
|
||||||
}
|
// }
|
||||||
if (tab === '3' && data3 && showsl) {
|
// if (tab === '3' && data3 && showsl) {
|
||||||
setLayer(data3, '渗流')
|
// setLayer(data3, '渗流')
|
||||||
}
|
// }
|
||||||
if (tab === '4' && data4 && showby) {
|
// if (tab === '4' && data4 && showby) {
|
||||||
setLayer(data4, '白蚁')
|
// setLayer(data4, '白蚁')
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
else {
|
// else {
|
||||||
const dsq = setInterval(() => {
|
// const dsq = setInterval(() => {
|
||||||
const map = window.__mapref;
|
// const map = window.__mapref;
|
||||||
if (map && skdata.length > 0) {
|
// if (map && skdata.length > 0) {
|
||||||
clearInterval(dsq)
|
// clearInterval(dsq)
|
||||||
setLayer(skdata, 'sk')
|
// setLayer(skdata, 'sk')
|
||||||
}
|
// }
|
||||||
}, 500);
|
// }, 500);
|
||||||
}
|
// }
|
||||||
|
|
||||||
}, [data1, data2, data3, data4, tab, showbx, showsy, showsl, showby])
|
// }, [data1, data2, data3, data4, tab, showbx, showsy, showsl, showby])
|
||||||
|
|
||||||
const setLayer = (data = [], type) => {
|
const setLayer = (data = [], type) => {
|
||||||
const map = window.__mapref;
|
const map = window.__mapref;
|
||||||
|
|
@ -1229,8 +1237,10 @@ function DrpReal({ style }) {
|
||||||
key={row.stcd}
|
key={row.stcd}
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
const { lgtd, lttd, res_nm: stnm } = row;
|
const { lgtd, lttd, res_nm: stnm } = row;
|
||||||
|
removePoint()
|
||||||
if (stnm == '浮桥河水库') {
|
if (stnm == '浮桥河水库') {
|
||||||
setShowdbx(1)
|
setShowdbx(showbx == 1 ? 0 : 1)
|
||||||
|
setLayer([row],'变形')
|
||||||
if (lgtd && lttd) {
|
if (lgtd && lttd) {
|
||||||
dispatch.runtime.setCameraTarget({
|
dispatch.runtime.setCameraTarget({
|
||||||
center: [lgtd, lttd],
|
center: [lgtd, lttd],
|
||||||
|
|
@ -1274,8 +1284,10 @@ function DrpReal({ style }) {
|
||||||
key={row.stcd}
|
key={row.stcd}
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
const { lgtd, lttd, res_nm: stnm } = row;
|
const { lgtd, lttd, res_nm: stnm } = row;
|
||||||
|
removePoint()
|
||||||
if (stnm == '浮桥河水库') {
|
if (stnm == '浮桥河水库') {
|
||||||
setShowdsy(1)
|
setShowdsy(showsy == 1 ? 0 : 1)
|
||||||
|
setLayer([row],'渗压')
|
||||||
if (lgtd && lttd) {
|
if (lgtd && lttd) {
|
||||||
dispatch.runtime.setCameraTarget({
|
dispatch.runtime.setCameraTarget({
|
||||||
center: [lgtd, lttd],
|
center: [lgtd, lttd],
|
||||||
|
|
@ -1315,7 +1327,9 @@ function DrpReal({ style }) {
|
||||||
key={row.stcd}
|
key={row.stcd}
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
const { lgtd, lttd } = row;
|
const { lgtd, lttd } = row;
|
||||||
setShowdsl(1)
|
removePoint()
|
||||||
|
setShowdsl(showsl == 1 ? 0 : 1)
|
||||||
|
setLayer([row],'渗流')
|
||||||
if (row.cd == 1) {
|
if (row.cd == 1) {
|
||||||
if (lgtd && lttd) {
|
if (lgtd && lttd) {
|
||||||
dispatch.runtime.setCameraTarget({
|
dispatch.runtime.setCameraTarget({
|
||||||
|
|
@ -1356,8 +1370,12 @@ function DrpReal({ style }) {
|
||||||
<DpTableRow
|
<DpTableRow
|
||||||
key={row.stcd}
|
key={row.stcd}
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
|
removePoint()
|
||||||
|
|
||||||
const { lgtd, lttd } = row;
|
const { lgtd, lttd } = row;
|
||||||
setShowdby(1)
|
setShowdby(showby == 1 ? 0 : 1)
|
||||||
|
setLayer([row],'白蚁')
|
||||||
|
|
||||||
if (row.cd == '0AB3ED') {
|
if (row.cd == '0AB3ED') {
|
||||||
if (lgtd && lttd) {
|
if (lgtd && lttd) {
|
||||||
dispatch.runtime.setCameraTarget({
|
dispatch.runtime.setCameraTarget({
|
||||||
|
|
|
||||||
|
|
@ -10,8 +10,8 @@ function DrpReal({ style }) {
|
||||||
color="green"
|
color="green"
|
||||||
extra={
|
extra={
|
||||||
<>
|
<>
|
||||||
<img src='/assets/镇下拉.jpg' style={{width:'100px', height:'30px',marginRight:'10px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/镇下拉.jpg'} style={{width:'100px', height:'30px',marginRight:'10px'}}/>
|
||||||
<img src='/assets/水厂切换.jpg' style={{width:'165px', height:'20px',marginRight:'5px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/水厂切换.jpg'} style={{width:'165px', height:'20px',marginRight:'5px'}}/>
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
|
|
|
||||||
|
|
@ -9,7 +9,7 @@ function DrpReal({ style }) {
|
||||||
title="方案对比"
|
title="方案对比"
|
||||||
color="green"
|
color="green"
|
||||||
>
|
>
|
||||||
<img src='/assets/duibifenxi.png' style={{width:'429.81px', height:'254px',marginLeft:'1px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/duibifenxi.png'} style={{width:'429.81px', height:'254px',marginLeft:'1px'}}/>
|
||||||
</PanelBox>
|
</PanelBox>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -16,7 +16,7 @@ function DrpReal({ style }) {
|
||||||
color="green"
|
color="green"
|
||||||
extra={
|
extra={
|
||||||
<>
|
<>
|
||||||
{/* <img src='/assets/年下拉3.jpg' style={{width:'100px', height:'30px',marginRight:'10px'}}/> */}
|
{/* <img src={process.env.PUBLIC_URL+'/assets/年下拉3.jpg'} style={{width:'100px', height:'30px',marginRight:'10px'}}/> */}
|
||||||
<div style={{color:'#1890ff',marginRight:'10px',cursor:'pointer'}} onClick={()=>{
|
<div style={{color:'#1890ff',marginRight:'10px',cursor:'pointer'}} onClick={()=>{
|
||||||
dispatch?.runtime.setInfoDlg({ layerId: 'DdcgLayer', properties: {} })
|
dispatch?.runtime.setInfoDlg({ layerId: 'DdcgLayer', properties: {} })
|
||||||
}}>
|
}}>
|
||||||
|
|
|
||||||
|
|
@ -10,12 +10,12 @@ function DrpReal({ style }) {
|
||||||
color="green"
|
color="green"
|
||||||
extra={
|
extra={
|
||||||
<>
|
<>
|
||||||
<img src='/assets/镇下拉.jpg' style={{width:'100px', height:'30px',marginRight:'10px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/镇下拉.jpg'} style={{width:'100px', height:'30px',marginRight:'10px'}}/>
|
||||||
<img src='/assets/水厂切换.jpg' style={{width:'165px', height:'20px',marginRight:'5px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/水厂切换.jpg'} style={{width:'165px', height:'20px',marginRight:'5px'}}/>
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
<img src='/assets/电耗分析.jpg' style={{width:'26rem', height:'16rem',marginLeft:'8px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/电耗分析.jpg'} style={{width:'26rem', height:'16rem',marginLeft:'8px'}}/>
|
||||||
</PanelBox>
|
</PanelBox>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,165 @@
|
||||||
|
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}>
|
||||||
|
<div>
|
||||||
|
<div className="value">{strNumber(h24?.drpStCount?.total, '-')}</div>
|
||||||
|
<div className="key">降雨测站</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<div className="value">{strNumber(skInfo?.aRz, '-')}</div>
|
||||||
|
<div className="key">超汛限水库</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<div className="value" style={{ fontSize: '1.5rem', cursor: 'pointer' }} onClick={() => showRecord(h24?.max)}>
|
||||||
|
{h24?.max?.stnm || '--'}
|
||||||
|
</div>
|
||||||
|
<div className="key">最大降雨测站</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<span className={classes.titleDate}>{tm1 || '-'}</span>至<span className={classes.titleDate}>{tm2 || '-'}</span>
|
||||||
|
24小时中共有<span className={classes.number}>{strNumber(h24?.drpStCount?.total, '-')}</span>
|
||||||
|
个降雨测站(<span className={classes.sttype}>山洪测站</span>
|
||||||
|
<span className={classes.number}>{strNumber(h24?.drpStCount?.sh, '-')}</span>
|
||||||
|
个),其中最大降雨测站为<span onClick={() => showRecord(h24?.max)} className={classes.stname}>{h24?.max?.stnm || '-'}</span>
|
||||||
|
,降雨量<span className={classes.number}>{strNumber(h24?.max?.value, '-')}</span>mm
|
||||||
|
{h24?.cntDrp10 > 0 && (<>,<span className={classes.sttype}>10mm以下</span>测站数为<span className={classes.number}>{strNumber(h24?.cntDrp10, '-')}</span>个</>)}
|
||||||
|
{h24?.cntDrp25 > 0 && (<>,<span className={classes.sttype}>10mm至25mm</span>测站数为<span className={classes.number}>{strNumber(h24?.cntDrp25, '-')}</span>个</>)}
|
||||||
|
{h24?.cntDrp50 > 0 && (<>,<span className={classes.sttype}>25mm至50mm</span>测站数为<span className={classes.number}>{strNumber(h24?.cntDrp50, '-')}</span>个</>)}
|
||||||
|
{h24?.cntDrp100 > 0 && (<>,<span className={classes.sttype}>50mm至100mm</span>测站数为<span className={classes.number}>{strNumber(h24?.cntDrp100, '-')}</span>个</>)}
|
||||||
|
{h24?.cntDrp250 > 0 && (<>,<span className={classes.sttype}>100mm至250mm</span>测站数为<span className={classes.number}>{strNumber(h24?.cntDrp250, '-')}</span>个</>)}
|
||||||
|
{h24?.cntDrpg250 > 0 && (<>,<span className={classes.sttype}>大于250mm</span>测站数为<span className={classes.number}>{strNumber(h24?.cntDrpg250, '-')}</span>个</>)}
|
||||||
|
。
|
||||||
|
{h1?.max?.value > 0 && (<><span className={classes.sttype}>前1小时</span>最大降雨测站是<span onClick={() => showRecord(h1?.max)} className={classes.stname}>{h1?.max?.stnm}</span>({h1?.max?.value}mm),</>)}
|
||||||
|
{h3?.max?.value > 0 && (<><span className={classes.sttype}>前3小时</span>最大降雨测站是<span onClick={() => showRecord(h3?.max)} className={classes.stname}>{h3?.max?.stnm}</span>({h3?.max?.value}mm),</>)}
|
||||||
|
{h6?.max?.value > 0 && (<><span className={classes.sttype}>前6小时</span>最大降雨测站是<span onClick={() => showRecord(h6?.max)} className={classes.stname}>{h6?.max?.stnm}</span>({h6?.max?.value}mm),</>)}
|
||||||
|
{
|
||||||
|
!h1?.max?.value || !h3?.max?.value || !h6?.max?.value ? (
|
||||||
|
`前${[!h1?.max?.value ? '1' : null, !h3?.max?.value ? '3' : null, !h6?.max?.value ? '6' : null].filter(Boolean).join(',')}小时无降雨。`
|
||||||
|
) : null
|
||||||
|
}
|
||||||
|
超汛限水位水库数为<span className={classes.number}>{strNumber(skInfo?.aRz, '-')}</span>座。
|
||||||
|
</div>
|
||||||
|
<div className={classes.action}>
|
||||||
|
<Button startIcon={<Email />} onClick={doBx} style={{ color: '#fff' }} size="small">报讯</Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,585 @@
|
||||||
|
import React, { useState, useEffect } from 'react';
|
||||||
|
import { OverallPromise } from '../../../../models/_/real';
|
||||||
|
import useRequest from '../../../../utils/useRequest';
|
||||||
|
import PanelBox from '../../components/PanelBox';
|
||||||
|
import OverallContent from './OverallContent';
|
||||||
|
import { makeStyles } from '@material-ui/core/styles';
|
||||||
|
import DpTableRow from '../../../../layouts/mui/DpTableRow';
|
||||||
|
import { parseGeoJSON } from "../../../../utils/tools";
|
||||||
|
import {
|
||||||
|
Box,
|
||||||
|
Typography,
|
||||||
|
Checkbox,
|
||||||
|
FormControlLabel,
|
||||||
|
ButtonGroup,
|
||||||
|
Button,
|
||||||
|
Table,
|
||||||
|
TableBody,
|
||||||
|
TableCell,
|
||||||
|
TableContainer,
|
||||||
|
TableHead,
|
||||||
|
TableRow,
|
||||||
|
IconButton,
|
||||||
|
Collapse
|
||||||
|
} from '@material-ui/core';
|
||||||
|
import AddIcon from '@material-ui/icons/Add';
|
||||||
|
import { useDispatch, useSelector } from 'react-redux';
|
||||||
|
import DpTableCell from '../../../../layouts/mui/DpTableCell';
|
||||||
|
import clsx from 'clsx';
|
||||||
|
import RemoveIcon from '@material-ui/icons/Remove';
|
||||||
|
import config from '../../../../config';
|
||||||
|
import { InfoPopNames } from '../../InfoPops';
|
||||||
|
const useStyles = makeStyles((theme) => ({
|
||||||
|
root: {
|
||||||
|
color: '#fff',
|
||||||
|
'& .MuiTypography-root': {
|
||||||
|
color: '#fff'
|
||||||
|
},
|
||||||
|
'& .MuiCheckbox-root': {
|
||||||
|
color: '#fff',
|
||||||
|
'&.Mui-checked': {
|
||||||
|
color: '#409eff'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
'& .MuiButtonGroup-root': {
|
||||||
|
marginTop: theme.spacing(2),
|
||||||
|
marginBottom: theme.spacing(3)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
typeSection: {
|
||||||
|
marginBottom: theme.spacing(2)
|
||||||
|
},
|
||||||
|
timeButton: {
|
||||||
|
width: 210,
|
||||||
|
color: '#fff',
|
||||||
|
borderColor: 'rgba(255,255,255,0.3)',
|
||||||
|
'&.MuiButton-contained': {
|
||||||
|
backgroundColor: '#409eff',
|
||||||
|
color: '#fff',
|
||||||
|
'&:hover': {
|
||||||
|
backgroundColor: '#409eff'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
'&:hover': {
|
||||||
|
backgroundColor: 'rgba(255,255,255,0.1)'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
table: {
|
||||||
|
'& .MuiTableCell-root': {
|
||||||
|
color: '#fff',
|
||||||
|
borderColor: 'rgba(255,255,255,0.1)'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
expandButton: {
|
||||||
|
color: '#fff'
|
||||||
|
},
|
||||||
|
stationRow: {
|
||||||
|
'&:nth-of-type(odd)': {
|
||||||
|
backgroundColor: 'rgba(255,255,255,0.05)'
|
||||||
|
},
|
||||||
|
'&:hover': {
|
||||||
|
backgroundColor: 'rgba(255,255,255,0.1)'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
warningRow: {
|
||||||
|
'&.pink': { backgroundColor: 'rgba(255,192,203,0.5)' },
|
||||||
|
'&.purple': { backgroundColor: 'rgba(147,112,219,0.5)' },
|
||||||
|
'&.blue': { backgroundColor: 'rgba(135,206,235,0.5)' },
|
||||||
|
'&.blue1': { backgroundColor: 'rgba(135,206,235,0.4)' },
|
||||||
|
'&.blue2': { backgroundColor: 'rgba(135,206,235,0.3)' },
|
||||||
|
'&.green': { backgroundColor: 'rgba(144,238,144,0.5)' }
|
||||||
|
},
|
||||||
|
|
||||||
|
expandedRow: {
|
||||||
|
'&.pink': { backgroundColor: 'rgba(255,192,203,0.1)' },
|
||||||
|
'&.purple': { backgroundColor: 'rgba(147,112,219,0.1)' },
|
||||||
|
'&.blue': { backgroundColor: 'rgba(135,206,235,0.1)' },
|
||||||
|
'&.green': { backgroundColor: 'rgba(144,238,144,0.1)' }
|
||||||
|
}
|
||||||
|
}));
|
||||||
|
export default function Overall({ style }) {
|
||||||
|
const dispatch = useDispatch();
|
||||||
|
|
||||||
|
const classes = useStyles();
|
||||||
|
const [types, setTypes] = useState({
|
||||||
|
mountain: true,
|
||||||
|
water: true,
|
||||||
|
weather: true,
|
||||||
|
reservoir: true
|
||||||
|
});
|
||||||
|
const [timeRange, setTimeRange] = useState('1h');
|
||||||
|
const [expanded, setExpanded] = useState({});
|
||||||
|
|
||||||
|
const handleTypeChange = (event) => {
|
||||||
|
setTypes({
|
||||||
|
...types,
|
||||||
|
[event.target.name]: event.target.checked
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
const stations = [
|
||||||
|
{ id: 'history', name: '历史极值站点', count: 0, color: 'pink' },
|
||||||
|
{ id: '100year', name: '100年一遇以上站点', count: 0, color: 'purple' },
|
||||||
|
{ id: '50year', name: '50年一遇以上站点', count: 0, color: 'blue' },
|
||||||
|
{ id: 'special', name: '特大暴雨站点', count: 0, color: 'blue1' },
|
||||||
|
{ id: 'heavy', name: '大暴雨站点', count: 0, color: 'blue2' },
|
||||||
|
{ id: 'storm', name: '暴雨站点', count: 1, color: 'green' }
|
||||||
|
];
|
||||||
|
|
||||||
|
const toggleExpand = (id) => {
|
||||||
|
setExpanded(prev => ({
|
||||||
|
...prev,
|
||||||
|
[id]: !prev[id]
|
||||||
|
}));
|
||||||
|
};
|
||||||
|
|
||||||
|
const drpData = [
|
||||||
|
{
|
||||||
|
"stcd": "61644000",
|
||||||
|
"stnm": "浮桥河",
|
||||||
|
"adcd": null,
|
||||||
|
"wscd": null,
|
||||||
|
"importancy": 0,
|
||||||
|
"lgtd": 114.883583,
|
||||||
|
"lttd": 31.180444,
|
||||||
|
"elev": null,
|
||||||
|
"hasRz": true,
|
||||||
|
"type": "sw",
|
||||||
|
"tm": "2025-06-06T22:00:00.000Z",
|
||||||
|
"rz": 43.6,
|
||||||
|
adnm: '麻城市',
|
||||||
|
zgrz: '48.17',
|
||||||
|
time: '2025-06-11 10:14至2025-06-12 10:14',
|
||||||
|
jjrz: '47.60',
|
||||||
|
"state": 1
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"stcd": "61615300",
|
||||||
|
"stnm": "木子店",
|
||||||
|
"adcd": null,
|
||||||
|
"wscd": null,
|
||||||
|
"importancy": 1,
|
||||||
|
"lgtd": 115.3625,
|
||||||
|
"lttd": 31.190278,
|
||||||
|
"elev": null,
|
||||||
|
"hasRz": true,
|
||||||
|
"type": "sw",
|
||||||
|
"tm": "2025-06-06T21:00:00.000Z",
|
||||||
|
"rz": 133.89,
|
||||||
|
adnm: '麻城市',
|
||||||
|
zgrz: '138.20',
|
||||||
|
time: '2025-06-12 10:33',
|
||||||
|
jjrz: '137.89',
|
||||||
|
"state": 1
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"stcd": "61612500",
|
||||||
|
"stnm": "王福店",
|
||||||
|
"adcd": null,
|
||||||
|
"wscd": null,
|
||||||
|
"importancy": 0,
|
||||||
|
"lgtd": 114.986666,
|
||||||
|
"lttd": 31.352944,
|
||||||
|
"elev": null,
|
||||||
|
"hasRz": true,
|
||||||
|
"type": "sw",
|
||||||
|
"tm": "2025-06-06T22:00:00.000Z",
|
||||||
|
"rz": 73.37,
|
||||||
|
adnm: '麻城市',
|
||||||
|
zgrz: '78.20',
|
||||||
|
time: '2025-06-11 10:14至2025-06-12 10:14',
|
||||||
|
jjrz: '77.37',
|
||||||
|
"state": 1
|
||||||
|
},
|
||||||
|
|
||||||
|
]
|
||||||
|
const skData = [
|
||||||
|
{
|
||||||
|
"stcd": "61614200",
|
||||||
|
"type": "sk",
|
||||||
|
"hasRz": true,
|
||||||
|
"stnm": "浮桥河",
|
||||||
|
"adcd": "421181100000",
|
||||||
|
"wscd": null,
|
||||||
|
"importancy": 0,
|
||||||
|
adnm: '麻城市',
|
||||||
|
zgrz: '66.1',
|
||||||
|
time: '2025-06-11 10:14',
|
||||||
|
jjrz: '64.89',
|
||||||
|
"lgtd": 114.88069,
|
||||||
|
"lttd": 31.171967,
|
||||||
|
"elev": 0,
|
||||||
|
"damel": 71.33,
|
||||||
|
"dsflz": 68.04,
|
||||||
|
"fsltdz": 64.89,
|
||||||
|
"ddz": 51.78,
|
||||||
|
"zcxsw": 64.89,
|
||||||
|
"drpTm": "2025-06-06T22:00:00.000Z",
|
||||||
|
"today": 4,
|
||||||
|
"h1": 4,
|
||||||
|
"h3": 4,
|
||||||
|
"h6": 4,
|
||||||
|
"h12": 4,
|
||||||
|
"h24": 4,
|
||||||
|
"h48": 4,
|
||||||
|
"drpState": 1,
|
||||||
|
"rz": 60.7,
|
||||||
|
"w": 45490,
|
||||||
|
"xs":32133,
|
||||||
|
"a_fsltdz": -4.189999999999998,
|
||||||
|
"rzTm": "2025-06-06T22:00:00.000Z",
|
||||||
|
"rzWarning": 0,
|
||||||
|
"rzState": 1,
|
||||||
|
"layer": "RealSkLayer",
|
||||||
|
"layerPop": "RealSkPop"
|
||||||
|
},
|
||||||
|
|
||||||
|
{
|
||||||
|
"stcd": "61612700",
|
||||||
|
"type": "sk",
|
||||||
|
"hasRz": true,
|
||||||
|
"stnm": "碧绿河",
|
||||||
|
"adcd": "421181109000",
|
||||||
|
"wscd": null,
|
||||||
|
adnm: '麻城市',
|
||||||
|
zgrz: '138.2',
|
||||||
|
time: '2025-06-12 10:33',
|
||||||
|
jjrz: '137',
|
||||||
|
"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-06T22:00:00.000Z",
|
||||||
|
"today": 50,
|
||||||
|
"h1": 38,
|
||||||
|
"h3": 50,
|
||||||
|
"h6": 50,
|
||||||
|
"h12": 50,
|
||||||
|
"h24": 50,
|
||||||
|
"h48": 50,
|
||||||
|
"drpState": 1,
|
||||||
|
"rz": 120,
|
||||||
|
"w": 6015,
|
||||||
|
"xs": 1676,
|
||||||
|
"a_fsltdz": -17,
|
||||||
|
"rzTm": "2025-06-06T00:00:00.000Z",
|
||||||
|
"rzWarning": 0,
|
||||||
|
"rzState": 2,
|
||||||
|
"layer": "RealSkLayer",
|
||||||
|
"layerPop": "RealSkPop"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"stcd": "61612560",
|
||||||
|
"type": "sk",
|
||||||
|
"hasRz": true,
|
||||||
|
"stnm": "大河铺",
|
||||||
|
"adcd": "421181112000",
|
||||||
|
adnm: '麻城市',
|
||||||
|
zgrz: '161.5',
|
||||||
|
time: '2025-06-11 10:14至2025-06-12 10:14',
|
||||||
|
jjrz: '159',
|
||||||
|
"wscd": null,
|
||||||
|
"importancy": 0,
|
||||||
|
"lgtd": 114.941111,
|
||||||
|
"lttd": 31.464444,
|
||||||
|
"elev": 0,
|
||||||
|
"damel": 162.21,
|
||||||
|
"dsflz": 160.08,
|
||||||
|
"fsltdz": 159,
|
||||||
|
"ddz": 142.5,
|
||||||
|
"zcxsw": 159,
|
||||||
|
"drpTm": "2025-06-06T22:00:00.000Z",
|
||||||
|
"today": 50,
|
||||||
|
"h1": 50,
|
||||||
|
"h3": 50,
|
||||||
|
"h6": 50,
|
||||||
|
"h12": 50,
|
||||||
|
"h24": 50,
|
||||||
|
"h48": 50,
|
||||||
|
"drpState": 1,
|
||||||
|
"rz": 144.5,
|
||||||
|
"w": 1574,
|
||||||
|
"xs": "--",
|
||||||
|
"a_fsltdz": -14.5,
|
||||||
|
"rzTm": "2025-06-06T00:00:00.000Z",
|
||||||
|
"rzWarning": 0,
|
||||||
|
"rzState": 2,
|
||||||
|
"layer": "RealSkLayer",
|
||||||
|
"layerPop": "RealSkPop"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"stcd": "716460001",
|
||||||
|
"type": "sk",
|
||||||
|
"hasRz": true,
|
||||||
|
"stnm": "杉林河",
|
||||||
|
"adcd": "421181107000",
|
||||||
|
"wscd": null,
|
||||||
|
adnm: '麻城市',
|
||||||
|
zgrz: '224.31',
|
||||||
|
time: '2025-06-11 10:14至2025-06-12 10:14',
|
||||||
|
jjrz: '231',
|
||||||
|
"importancy": 0,
|
||||||
|
"lgtd": 115.433056,
|
||||||
|
"lttd": 31.304444,
|
||||||
|
"elev": 0,
|
||||||
|
"damel": 236.2,
|
||||||
|
"dsflz": 233.92,
|
||||||
|
"fsltdz": 231,
|
||||||
|
"ddz": 204,
|
||||||
|
"zcxsw": 231,
|
||||||
|
"drpTm": "2025-04-11T05:00:00.000Z",
|
||||||
|
"today": 0,
|
||||||
|
"h1": 0,
|
||||||
|
"h3": 0,
|
||||||
|
"h6": 0,
|
||||||
|
"h12": 0,
|
||||||
|
"h24": 0,
|
||||||
|
"h48": 0,
|
||||||
|
"drpState": 2,
|
||||||
|
"rz": 224.31,
|
||||||
|
"w": 1415,
|
||||||
|
"xs": 750,
|
||||||
|
"a_fsltdz": -6.689999999999998,
|
||||||
|
"rzTm": "2025-04-11T05:00:00.000Z",
|
||||||
|
"rzWarning": 0,
|
||||||
|
"rzState": 2,
|
||||||
|
"layer": "RealSkLayer",
|
||||||
|
"layerPop": "RealSkPop"
|
||||||
|
},
|
||||||
|
]
|
||||||
|
const flyTo = (row) => {
|
||||||
|
const { lgtd, lttd } = row;
|
||||||
|
if (lgtd && lttd) {
|
||||||
|
dispatch.runtime.setFeaturePop({ type: timeRange == '3h'?'RealSkPop':"RealHDPop", properties: row, coordinates: [row.lgtd, row.lttd] });
|
||||||
|
dispatch.runtime.setCameraTarget({
|
||||||
|
center: [lgtd, lttd + 0.005],
|
||||||
|
zoom: 15,
|
||||||
|
pitch: 50,
|
||||||
|
bearing: 0
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const setSkLayer = (data = []) => {
|
||||||
|
const map = window.__mapref;
|
||||||
|
const layer = map.getLayer('临时水库tz')
|
||||||
|
if (layer) {
|
||||||
|
map.removeLayer('临时水库tz');
|
||||||
|
map.removeSource('临时水库tz');
|
||||||
|
}
|
||||||
|
if (data.length === 0) { return }
|
||||||
|
map.addLayer({
|
||||||
|
'id': '临时水库tz',//+new Date().getTime(),
|
||||||
|
'type': 'symbol',
|
||||||
|
'source': {
|
||||||
|
'type': 'geojson',
|
||||||
|
'data': {
|
||||||
|
'type': 'FeatureCollection',
|
||||||
|
'features': [],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'layout': {
|
||||||
|
// 'icon-allow-overlap': true,
|
||||||
|
// 'text-allow-overlap': true,
|
||||||
|
'icon-image': '水库', // 从properties中动态读取icon字段
|
||||||
|
'icon-size': [
|
||||||
|
'interpolate', ['linear'], ['zoom'],
|
||||||
|
10, 0.8,
|
||||||
|
14, 0.8,
|
||||||
|
],
|
||||||
|
'text-size': [
|
||||||
|
'interpolate', ['linear'], ['zoom'],
|
||||||
|
5, 10,
|
||||||
|
14, 14,
|
||||||
|
],
|
||||||
|
'text-font': ['Roboto Black'],
|
||||||
|
'text-field': [
|
||||||
|
'step',
|
||||||
|
['zoom'],
|
||||||
|
'',
|
||||||
|
8, ['get', 'stnm']
|
||||||
|
],
|
||||||
|
'text-anchor': 'top',
|
||||||
|
'text-offset': [0, 1],
|
||||||
|
},
|
||||||
|
'paint': {
|
||||||
|
'text-color': '#fff'
|
||||||
|
},
|
||||||
|
'visibility': 'visible',
|
||||||
|
});
|
||||||
|
map.getSource('临时水库tz').setData(parseGeoJSON(data))
|
||||||
|
}
|
||||||
|
|
||||||
|
const setHdLayer = (data = []) => {
|
||||||
|
const map = window.__mapref;
|
||||||
|
const layer = map.getLayer('关联站点')
|
||||||
|
if (layer) {
|
||||||
|
map.removeLayer('关联站点');
|
||||||
|
map.removeSource('关联站点');
|
||||||
|
}
|
||||||
|
if (data.length === 0) { return }
|
||||||
|
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.5,
|
||||||
|
14, 1,
|
||||||
|
],
|
||||||
|
'text-size': [
|
||||||
|
'interpolate', ['linear'], ['zoom'],
|
||||||
|
10, 10,
|
||||||
|
14, 16,
|
||||||
|
],
|
||||||
|
'text-max-width': 30,
|
||||||
|
'text-font': ['Roboto Black'],
|
||||||
|
'text-field': [
|
||||||
|
'step',
|
||||||
|
['zoom'],
|
||||||
|
[
|
||||||
|
'case',
|
||||||
|
['!=', ['get', 'state'], 1], '',
|
||||||
|
['concat', ['get', 'rz'], 'm']
|
||||||
|
],
|
||||||
|
12, [
|
||||||
|
'case',
|
||||||
|
['!=', ['get', 'state'], 1], ['get', 'stnm'],
|
||||||
|
[
|
||||||
|
'format',
|
||||||
|
['get', 'stnm'], { 'font-scale': 0.8, 'text-color': '#fff' },
|
||||||
|
'\n', {},
|
||||||
|
['concat', ['get', 'rz'], 'm'], {}
|
||||||
|
]
|
||||||
|
],
|
||||||
|
],
|
||||||
|
'text-anchor': 'top',
|
||||||
|
'text-offset': [0, 1],
|
||||||
|
},
|
||||||
|
'paint': {
|
||||||
|
'text-color': [
|
||||||
|
'case',
|
||||||
|
['!=', ['get', 'state'], 1], '#888',
|
||||||
|
['==', ['get', 'warning'], 3], '#f00',
|
||||||
|
['==', ['get', 'warning'], 2], 'yellow',
|
||||||
|
['==', ['get', 'warning'], 1], 'yellow',
|
||||||
|
'#0f0'
|
||||||
|
],
|
||||||
|
'text-halo-color': '#062040',
|
||||||
|
'text-halo-width': 1
|
||||||
|
},
|
||||||
|
'visibility': 'visible',
|
||||||
|
});
|
||||||
|
|
||||||
|
map.getSource('关联站点').setData(parseGeoJSON(data))
|
||||||
|
}
|
||||||
|
const [type, setType] = useState('h24')
|
||||||
|
const [data, setData] = useState([])
|
||||||
|
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
const newArr = timeRange == '3h' ? skData : drpData;
|
||||||
|
setData(newArr)
|
||||||
|
}, [timeRange])
|
||||||
|
|
||||||
|
return (
|
||||||
|
<PanelBox
|
||||||
|
style={style}
|
||||||
|
title="水情统计"
|
||||||
|
color="green"
|
||||||
|
extra={
|
||||||
|
<span className="button-group">
|
||||||
|
{
|
||||||
|
['h1', 'h3', 'h6', 'h12', 'h24'].map(key => (
|
||||||
|
<span key={key} className={clsx({ active: type === key })} onClick={() => setType(key)}>{key}</span>
|
||||||
|
))
|
||||||
|
}
|
||||||
|
</span>
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<Box className={classes.root}>
|
||||||
|
<div style={{ display: 'flex', alignItems: 'center' }}>
|
||||||
|
<ButtonGroup variant="outlined">
|
||||||
|
{[
|
||||||
|
{ value: '1h', label: '河道水情' },
|
||||||
|
{ value: '3h', label: '水库水情' },
|
||||||
|
].map((item) => (
|
||||||
|
<Button
|
||||||
|
key={item.value}
|
||||||
|
className={classes.timeButton}
|
||||||
|
onClick={() => {
|
||||||
|
if (item.value == '1h' || item.value == '3h') {
|
||||||
|
setTimeRange(item.value)
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
variant={timeRange === item.value ? 'contained' : 'outlined'}
|
||||||
|
style={{ padding: '5px 10px' }}
|
||||||
|
>
|
||||||
|
{item.label}
|
||||||
|
</Button>
|
||||||
|
))}
|
||||||
|
</ButtonGroup>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</Box>
|
||||||
|
<TableContainer style={{ height: '70%' }}>
|
||||||
|
<Table size="small" stickyHeader>
|
||||||
|
<TableHead >
|
||||||
|
<DpTableRow>
|
||||||
|
<DpTableCell style={{ minWidth: '3rem' }} align='center'>序号</DpTableCell>
|
||||||
|
<DpTableCell style={{ minWidth: '8rem' }} align='center'>站名</DpTableCell>
|
||||||
|
<DpTableCell style={{ minWidth: '8rem' }} align='center'>政区</DpTableCell>
|
||||||
|
<DpTableCell style={{ minWidth: '8rem' }} align='center'>最高水位(m)</DpTableCell>
|
||||||
|
<DpTableCell style={{ minWidth: '16rem' }} align='center'>发生时间</DpTableCell>
|
||||||
|
<DpTableCell style={{ minWidth: '8rem' }} align='center'>{timeRange == '1h' ? "警戒水位(m)" : '汛限水位(m)'}</DpTableCell>
|
||||||
|
{/* <DpTableCell style={{ width: '15%' }}>所属政区</DpTableCell> */}
|
||||||
|
</DpTableRow>
|
||||||
|
</TableHead>
|
||||||
|
<TableBody>
|
||||||
|
{
|
||||||
|
data.map((item, i) => (
|
||||||
|
<DpTableRow key={item.stcd} onClick={() => {
|
||||||
|
flyTo(item)
|
||||||
|
if (timeRange == '3h') {
|
||||||
|
setSkLayer([item])
|
||||||
|
} else {
|
||||||
|
setHdLayer([item])
|
||||||
|
}
|
||||||
|
}}>
|
||||||
|
<DpTableCell align='center'>{i + 1}</DpTableCell>
|
||||||
|
<DpTableCell align='center'>{item.stnm}</DpTableCell>
|
||||||
|
<DpTableCell align='center'>
|
||||||
|
<div
|
||||||
|
className="table-ellipsis cursor-pointer"
|
||||||
|
title={item.adnm}
|
||||||
|
>{item.adnm}</div>
|
||||||
|
</DpTableCell>
|
||||||
|
<DpTableCell align='center'>{item.zgrz}</DpTableCell>
|
||||||
|
<DpTableCell align='center'>{item.time}</DpTableCell>
|
||||||
|
<DpTableCell align='center'>{item.jjrz}</DpTableCell>
|
||||||
|
</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;}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -119,8 +119,8 @@ export default function Overall({ style }) {
|
||||||
{ id: '100year', name: '100年一遇以上站点', count: 0, color: 'purple' },
|
{ id: '100year', name: '100年一遇以上站点', count: 0, color: 'purple' },
|
||||||
{ id: '50year', name: '50年一遇以上站点', count: 0, color: 'blue' },
|
{ id: '50year', name: '50年一遇以上站点', count: 0, color: 'blue' },
|
||||||
{ id: 'special', name: '特大暴雨站点', count: 0, color: 'blue1' },
|
{ id: 'special', name: '特大暴雨站点', count: 0, color: 'blue1' },
|
||||||
{ id: 'heavy', name: '大暴雨站点', count: 1, color: 'blue2' },
|
{ id: 'heavy', name: '大暴雨站点', count: 0, color: 'blue2' },
|
||||||
{ id: 'storm', name: '暴雨站点', count: 0, color: 'green' }
|
{ id: 'storm', name: '暴雨站点', count: 1, color: 'green' }
|
||||||
];
|
];
|
||||||
|
|
||||||
const toggleExpand = (id) => {
|
const toggleExpand = (id) => {
|
||||||
|
|
@ -132,24 +132,25 @@ export default function Overall({ style }) {
|
||||||
|
|
||||||
const drpData = [
|
const drpData = [
|
||||||
{
|
{
|
||||||
"stcd": "61612910",
|
"stcd": "Q9111",
|
||||||
"stnm": "桃林河(阎河)",
|
"stnm": "福田河",
|
||||||
"adcd": "421181000000000",
|
"adcd": "421181000000000",
|
||||||
'test':1,
|
'test':1,
|
||||||
"wscd": null,
|
"wscd": null,
|
||||||
"importancy": 0,
|
"importancy": 0,
|
||||||
"lgtd": 115.087777777,
|
"lgtd": 115.0944,
|
||||||
"lttd": 31.164444444,
|
"lttd": 31.4747,
|
||||||
"elev": null,
|
"elev": null,
|
||||||
"hasRz": true,
|
"hasRz": true,
|
||||||
"type": "sh",
|
"type": "qx",
|
||||||
"today": 7,
|
"today": 50.3,
|
||||||
"h1": 12,
|
"h1": 50.2,
|
||||||
"h3": 40,
|
"h3": 50.2,
|
||||||
"h6": 69,
|
"h6": 50.2,
|
||||||
"h12": 133,
|
"h12": 50.2,
|
||||||
"h24": 261,
|
"h24": 50.3,
|
||||||
"tm": "2025-06-03T02:10:00.000Z",
|
"tm": "2025-06-06T22:00:00.000Z",
|
||||||
|
|
||||||
"state": 1,
|
"state": 1,
|
||||||
"warning": 0
|
"warning": 0
|
||||||
},
|
},
|
||||||
|
|
@ -257,12 +258,12 @@ export default function Overall({ style }) {
|
||||||
<Collapse in={expanded[station.id]} timeout="auto" unmountOnExit>
|
<Collapse in={expanded[station.id]} timeout="auto" unmountOnExit>
|
||||||
<Box className={`${classes.expandedRow} ${station.color}`}>
|
<Box className={`${classes.expandedRow} ${station.color}`}>
|
||||||
{/* 展开的详细内容可以在这里添加 */}{
|
{/* 展开的详细内容可以在这里添加 */}{
|
||||||
station.id == 'heavy' && drpData.map(item => (
|
station.id == 'storm' && drpData.map(item => (
|
||||||
<TableRow onClick={() =>flyTo(item)}>
|
<TableRow onClick={() =>flyTo(item)}>
|
||||||
<DpTableCell style={{ width: '53%' }}>{item.stnm}</DpTableCell>
|
<DpTableCell style={{ width: '53%' }}>{item.stnm}</DpTableCell>
|
||||||
<DpTableCell style={{ width: '10%' }}>{item.today}</DpTableCell>
|
<DpTableCell style={{ width: '10%' }}>{item.today}</DpTableCell>
|
||||||
<DpTableCell style={{ width: '20%' }}>阎家河镇</DpTableCell>
|
<DpTableCell style={{ width: '20%' }}>福田河镇</DpTableCell>
|
||||||
<DpTableCell style={{ width: '27%' }}>桃林河</DpTableCell>
|
<DpTableCell style={{ width: '27%' }}>长江流域</DpTableCell>
|
||||||
</TableRow>
|
</TableRow>
|
||||||
))
|
))
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -18,7 +18,7 @@ function DrpReal({ style }) {
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
<img src='/assets/组 6.png' style={{width:'23rem',marginLeft:'1.7rem',marginTop:'0.5rem'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/组 6.png'} style={{width:'23rem',marginLeft:'1.7rem',marginTop:'0.5rem'}}/>
|
||||||
</PanelBox>
|
</PanelBox>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -148,7 +148,7 @@ function DrpReal({ style }) {
|
||||||
color="green"
|
color="green"
|
||||||
extra={
|
extra={
|
||||||
<>
|
<>
|
||||||
{/* <img src='/assets/年下拉3.jpg' style={{width:'100px', height:'30px',marginRight:'10px'}}/> */}
|
{/* <img src={process.env.PUBLIC_URL+'/assets/年下拉3.jpg'} style={{width:'100px', height:'30px',marginRight:'10px'}}/> */}
|
||||||
<div style={{height:'30px',overflow:'hidden'}}>
|
<div style={{height:'30px',overflow:'hidden'}}>
|
||||||
<Select
|
<Select
|
||||||
labelId="analysis-select-label"
|
labelId="analysis-select-label"
|
||||||
|
|
|
||||||
|
|
@ -15,7 +15,7 @@ function DrpReal({ style }) {
|
||||||
// </>
|
// </>
|
||||||
// }
|
// }
|
||||||
>
|
>
|
||||||
<img src='/assets/防汛调度天气预报.jpg' style={{width:'26rem', height:'14.5rem',marginLeft:'8px',marginTop:'0.8rem'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/防汛调度天气预报.jpg'} style={{width:'26rem', height:'14.5rem',marginLeft:'8px',marginTop:'0.8rem'}}/>
|
||||||
</PanelBox>
|
</PanelBox>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -28,21 +28,21 @@ function DrpReal({ style }) {
|
||||||
"NAME": "龙池办事处",
|
"NAME": "龙池办事处",
|
||||||
"drp": 0,
|
"drp": 0,
|
||||||
"cnt": 0,
|
"cnt": 0,
|
||||||
"av": 0
|
"av": 20
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"ADCD": "421181002000000",
|
"ADCD": "421181002000000",
|
||||||
"NAME": "鼓楼办事处",
|
"NAME": "鼓楼办事处",
|
||||||
"drp": 0,
|
"drp": 0,
|
||||||
"cnt": 0,
|
"cnt": 0,
|
||||||
"av": 0
|
"av": 27
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"ADCD": "421181003000000",
|
"ADCD": "421181003000000",
|
||||||
"NAME": "南湖办事处",
|
"NAME": "南湖办事处",
|
||||||
"drp": 0,
|
"drp": 0,
|
||||||
"cnt": 0,
|
"cnt": 0,
|
||||||
"av": 0
|
"av": 10
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"ADCD": "421181100000000",
|
"ADCD": "421181100000000",
|
||||||
|
|
@ -56,14 +56,14 @@ function DrpReal({ style }) {
|
||||||
"NAME": "宋埠镇",
|
"NAME": "宋埠镇",
|
||||||
"drp": 0,
|
"drp": 0,
|
||||||
"cnt": 0,
|
"cnt": 0,
|
||||||
"av": 0
|
"av": 13
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"ADCD": "421181102000000",
|
"ADCD": "421181102000000",
|
||||||
"NAME": "歧亭镇",
|
"NAME": "歧亭镇",
|
||||||
"drp": 0,
|
"drp": 0,
|
||||||
"cnt": 0,
|
"cnt": 0,
|
||||||
"av": 0
|
"av": 21
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"ADCD": "421181103000000",
|
"ADCD": "421181103000000",
|
||||||
|
|
@ -77,35 +77,35 @@ function DrpReal({ style }) {
|
||||||
"NAME": "夫子河镇",
|
"NAME": "夫子河镇",
|
||||||
"drp": 0,
|
"drp": 0,
|
||||||
"cnt": 0,
|
"cnt": 0,
|
||||||
"av": 0
|
"av": 6
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"ADCD": "421181105000000",
|
"ADCD": "421181105000000",
|
||||||
"NAME": "阎家河镇",
|
"NAME": "阎家河镇",
|
||||||
"drp": 0,
|
"drp": 0,
|
||||||
"cnt": 0,
|
"cnt": 0,
|
||||||
"av": 0
|
"av": 16
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"ADCD": "421181106000000",
|
"ADCD": "421181106000000",
|
||||||
"NAME": "龟山镇",
|
"NAME": "龟山镇",
|
||||||
"drp": 0,
|
"drp": 0,
|
||||||
"cnt": 0,
|
"cnt": 0,
|
||||||
"av": 0
|
"av": 9
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"ADCD": "421181107000000",
|
"ADCD": "421181107000000",
|
||||||
"NAME": "盐田河镇",
|
"NAME": "盐田河镇",
|
||||||
"drp": 0,
|
"drp": 0,
|
||||||
"cnt": 0,
|
"cnt": 0,
|
||||||
"av": 0
|
"av": 4
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"ADCD": "421181108000000",
|
"ADCD": "421181108000000",
|
||||||
"NAME": "张家畈镇",
|
"NAME": "张家畈镇",
|
||||||
"drp": 0,
|
"drp": 0,
|
||||||
"cnt": 0,
|
"cnt": 0,
|
||||||
"av": 0
|
"av":5
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"ADCD": "421181109000000",
|
"ADCD": "421181109000000",
|
||||||
|
|
@ -126,7 +126,7 @@ function DrpReal({ style }) {
|
||||||
"NAME": "黄土岗镇",
|
"NAME": "黄土岗镇",
|
||||||
"drp": 0,
|
"drp": 0,
|
||||||
"cnt": 0,
|
"cnt": 0,
|
||||||
"av": 0
|
"av": 10
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"ADCD": "421181112000000",
|
"ADCD": "421181112000000",
|
||||||
|
|
@ -140,28 +140,28 @@ function DrpReal({ style }) {
|
||||||
"NAME": "乘马岗镇",
|
"NAME": "乘马岗镇",
|
||||||
"drp": 0,
|
"drp": 0,
|
||||||
"cnt": 0,
|
"cnt": 0,
|
||||||
"av": 0
|
"av": 31
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"ADCD": "421181114000000",
|
"ADCD": "421181114000000",
|
||||||
"NAME": "顺河镇",
|
"NAME": "顺河镇",
|
||||||
"drp": 0,
|
"drp": 0,
|
||||||
"cnt": 0,
|
"cnt": 0,
|
||||||
"av": 0
|
"av": 28
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"ADCD": "421181200000000",
|
"ADCD": "421181200000000",
|
||||||
"NAME": "铁门岗乡",
|
"NAME": "铁门岗乡",
|
||||||
"drp": 0,
|
"drp": 0,
|
||||||
"cnt": 0,
|
"cnt": 0,
|
||||||
"av": 0
|
"av": 6
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"ADCD": "421181471000000",
|
"ADCD": "421181471000000",
|
||||||
"NAME": "经济开发区",
|
"NAME": "经济开发区",
|
||||||
"drp": 0,
|
"drp": 0,
|
||||||
"cnt": 0,
|
"cnt": 0,
|
||||||
"av": 0
|
"av": 3
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
const data2 = [
|
const data2 = [
|
||||||
|
|
|
||||||
|
|
@ -169,13 +169,7 @@ function FzjcLayers({ style }) {
|
||||||
}
|
}
|
||||||
const [type, setType] = useState('sh')
|
const [type, setType] = useState('sh')
|
||||||
const toggleStType = (type) => {
|
const toggleStType = (type) => {
|
||||||
// if (type == 'sz') {
|
dispatch.runtime.setYuananType(type)
|
||||||
// dispatch.map.setLayerVisible({'ShuiZhaLayer':true})
|
|
||||||
// dispatch.map.setLayerVisible({'BzLayer':false})
|
|
||||||
// } else {
|
|
||||||
// dispatch.map.setLayerVisible({'ShuiZhaLayer':false})
|
|
||||||
// dispatch.map.setLayerVisible({'BzLayer':true})
|
|
||||||
// }
|
|
||||||
setType(type)
|
setType(type)
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -892,35 +892,36 @@ function DrpReal({ style }) {
|
||||||
|
|
||||||
const [showDrp, setShowdDrp] = useState(0)
|
const [showDrp, setShowdDrp] = useState(0)
|
||||||
const [showHd, setShowdHd] = useState(0)
|
const [showHd, setShowdHd] = useState(0)
|
||||||
useEffect(() => {
|
// useEffect(() => {
|
||||||
const map = window.__mapref;
|
// const map = window.__mapref;
|
||||||
if (map) {
|
// if (map) {
|
||||||
if (tab === '1' && drpData && showDrp) {
|
// debugger
|
||||||
setLayer(drpData, 'drp')
|
// if (tab === '1' && drpData) {
|
||||||
}
|
// setLayer(drpData, 'drp')
|
||||||
if (tab === '2' && hdData && showHd) {
|
// }
|
||||||
setLayer(hdData, 'hd')
|
// if (tab === '2' && hdData ) {
|
||||||
}
|
// setLayer(hdData, 'hd')
|
||||||
if (tab === '3' && data3) {
|
// }
|
||||||
setLayer(data3, 'll')
|
// if (tab === '3' && data3) {
|
||||||
}
|
// setLayer(data3, 'll')
|
||||||
if (tab === '4' && data4) {
|
// }
|
||||||
setLayer(data4, 'tx')
|
// if (tab === '4' && data4) {
|
||||||
}
|
// setLayer(data4, 'tx')
|
||||||
if (tab === '5' && data5) {
|
// }
|
||||||
setLayer(data5, 'sk')
|
// if (tab === '5' && data5) {
|
||||||
}
|
// setLayer(data5, 'sk')
|
||||||
} else {
|
// }
|
||||||
const dsq = setInterval(() => {
|
// } else {
|
||||||
const map = window.__mapref;
|
// const dsq = setInterval(() => {
|
||||||
if (map && drpData.length > 0) {
|
// const map = window.__mapref;
|
||||||
clearInterval(dsq)
|
// if (map && drpData.length > 0) {
|
||||||
setLayer(drpData, 'drp')
|
// clearInterval(dsq)
|
||||||
}
|
// setLayer(drpData, 'drp')
|
||||||
}, 500);
|
// }
|
||||||
}
|
// }, 500);
|
||||||
|
// }
|
||||||
|
|
||||||
}, [drpData, hdData, skObj, tab, showDrp, showHd])
|
// }, [drpData, hdData, skObj, showDrp, showHd])
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -991,6 +992,7 @@ function DrpReal({ style }) {
|
||||||
'features': [],
|
'features': [],
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
'paint': {
|
'paint': {
|
||||||
'circle-color': [
|
'circle-color': [
|
||||||
'case',
|
'case',
|
||||||
|
|
@ -1064,6 +1066,29 @@ function DrpReal({ style }) {
|
||||||
10, 10,
|
10, 10,
|
||||||
14, 16,
|
14, 16,
|
||||||
],
|
],
|
||||||
|
'text-max-width': 30,
|
||||||
|
'text-font': ['Roboto Black'],
|
||||||
|
'text-field': [
|
||||||
|
'step',
|
||||||
|
['zoom'],
|
||||||
|
[
|
||||||
|
'case',
|
||||||
|
['!=', ['get', 'state'], 1], '',
|
||||||
|
['concat', ['get', 'rz'], 'm']
|
||||||
|
],
|
||||||
|
12, [
|
||||||
|
'case',
|
||||||
|
['!=', ['get', 'state'], 1], ['get', 'stnm'],
|
||||||
|
[
|
||||||
|
'format',
|
||||||
|
['get', 'stnm'], { 'font-scale': 0.8, 'text-color': '#fff' },
|
||||||
|
'\n', {},
|
||||||
|
['concat', ['get', 'rz'], 'm'], {}
|
||||||
|
]
|
||||||
|
],
|
||||||
|
],
|
||||||
|
'text-anchor': 'top',
|
||||||
|
'text-offset': [0, 1],
|
||||||
},
|
},
|
||||||
'paint': {
|
'paint': {
|
||||||
'text-color': [
|
'text-color': [
|
||||||
|
|
@ -1079,6 +1104,7 @@ function DrpReal({ style }) {
|
||||||
},
|
},
|
||||||
'visibility': 'visible',
|
'visibility': 'visible',
|
||||||
});
|
});
|
||||||
|
|
||||||
}
|
}
|
||||||
if (type === 'll') {
|
if (type === 'll') {
|
||||||
map.addLayer({
|
map.addLayer({
|
||||||
|
|
@ -1223,7 +1249,15 @@ function DrpReal({ style }) {
|
||||||
setShowdDrp(0)
|
setShowdDrp(0)
|
||||||
|
|
||||||
}, [tab])
|
}, [tab])
|
||||||
|
const removePoint = () => {
|
||||||
|
dispatch?.runtime.setFeaturePop({})
|
||||||
|
const map = window.__mapref;
|
||||||
|
const layer = map.getLayer('关联站点')
|
||||||
|
// if (layer) {
|
||||||
|
// map.removeLayer('关联站点');
|
||||||
|
// map.removeSource('关联站点');
|
||||||
|
// }
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<PanelBox
|
<PanelBox
|
||||||
|
|
@ -1270,8 +1304,10 @@ function DrpReal({ style }) {
|
||||||
key={row.stcd}
|
key={row.stcd}
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
const { lgtd, lttd } = row;
|
const { lgtd, lttd } = row;
|
||||||
|
removePoint()
|
||||||
if (row.stnm == '浮桥河') {
|
if (row.stnm == '浮桥河') {
|
||||||
setShowdDrp(1)
|
setShowdDrp(showDrp == 1 ? 0 : 1)
|
||||||
|
setLayer([row],'drp')
|
||||||
if (lgtd && lttd) {
|
if (lgtd && lttd) {
|
||||||
dispatch.runtime.setFeaturePop({ type: 'RealDrpPop', properties: row, coordinates: [row.lgtd, row.lttd] });
|
dispatch.runtime.setFeaturePop({ type: 'RealDrpPop', properties: row, coordinates: [row.lgtd, row.lttd] });
|
||||||
dispatch.runtime.setCameraTarget({
|
dispatch.runtime.setCameraTarget({
|
||||||
|
|
@ -1313,7 +1349,8 @@ function DrpReal({ style }) {
|
||||||
<div className="table-ellipsis cursor-pointer" onClick={() => {
|
<div className="table-ellipsis cursor-pointer" onClick={() => {
|
||||||
const { lgtd, lttd } = row;
|
const { lgtd, lttd } = row;
|
||||||
if (row.stnm == '浮桥河') {
|
if (row.stnm == '浮桥河') {
|
||||||
setShowdHd(1)
|
setShowdHd(showHd == 1 ? 0: 1)
|
||||||
|
setLayer([row],'hd')
|
||||||
if (lgtd && lttd) {
|
if (lgtd && lttd) {
|
||||||
dispatch.runtime.setFeaturePop({ type: 'RealHDPop', properties: row, coordinates: [row.lgtd, row.lttd] });
|
dispatch.runtime.setFeaturePop({ type: 'RealHDPop', properties: row, coordinates: [row.lgtd, row.lttd] });
|
||||||
dispatch.runtime.setCameraTarget({
|
dispatch.runtime.setCameraTarget({
|
||||||
|
|
|
||||||
|
|
@ -10,11 +10,11 @@ function DrpReal({ style }) {
|
||||||
color="green"
|
color="green"
|
||||||
extra={
|
extra={
|
||||||
<>
|
<>
|
||||||
<img src='/assets/年下拉3.jpg' style={{width:'100px', height:'30px',marginRight:'10px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/年下拉3.jpg'} style={{width:'100px', height:'30px',marginRight:'10px'}}/>
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
<img src='/assets/供水监管.jpg' style={{width:'419.81px', height:'195px',marginLeft:'1px',marginTop:'10px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/供水监管.jpg'} style={{width:'419.81px', height:'195px',marginLeft:'1px',marginTop:'10px'}}/>
|
||||||
</PanelBox>
|
</PanelBox>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -10,11 +10,11 @@ function DrpReal({ style }) {
|
||||||
color="green"
|
color="green"
|
||||||
extra={
|
extra={
|
||||||
<>
|
<>
|
||||||
<img src='/assets/镇切换.jpg' style={{width:'150px', height:'20px',marginRight:'5px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/镇切换.jpg'} style={{width:'150px', height:'20px',marginRight:'5px'}}/>
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
<img src='/assets/取水监管.jpg' style={{width:'429.81px', height:'182px',marginLeft:'1px',marginTop:'10px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/取水监管.jpg'} style={{width:'429.81px', height:'182px',marginLeft:'1px',marginTop:'10px'}}/>
|
||||||
</PanelBox>
|
</PanelBox>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,7 @@
|
||||||
import React, { useMemo, useState } from 'react';
|
import React, { useMemo, useState } from 'react';
|
||||||
import useRequest from '../../../../utils/useRequest';
|
import useRequest from '../../../../utils/useRequest';
|
||||||
import PanelBox from '../../components/PanelBox';
|
import PanelBox from '../../components/PanelBox';
|
||||||
|
import { parseGeoJSON } from "../../../../utils/tools";
|
||||||
|
|
||||||
import Table from '@material-ui/core/Table';
|
import Table from '@material-ui/core/Table';
|
||||||
import TableContainer from '@material-ui/core/TableContainer';
|
import TableContainer from '@material-ui/core/TableContainer';
|
||||||
|
|
@ -46,7 +47,7 @@ function HDReal({ style }) {
|
||||||
}
|
}
|
||||||
ret.push(o);
|
ret.push(o);
|
||||||
});
|
});
|
||||||
return ret;
|
return ret.slice(-7).reverse();
|
||||||
}, [data, tableRzFilter]);
|
}, [data, tableRzFilter]);
|
||||||
|
|
||||||
const flyTo = (record) => {
|
const flyTo = (record) => {
|
||||||
|
|
@ -69,6 +70,81 @@ function HDReal({ style }) {
|
||||||
const toggleAutoRefresh = () => {
|
const toggleAutoRefresh = () => {
|
||||||
dispatch.realview.setHdAutoRefresh(!hdAutoRefresh);
|
dispatch.realview.setHdAutoRefresh(!hdAutoRefresh);
|
||||||
}
|
}
|
||||||
|
const setLayer = (data = [], type) => {
|
||||||
|
const map = window.__mapref;
|
||||||
|
const layer = map.getLayer('关联站点')
|
||||||
|
if (layer) {
|
||||||
|
map.removeLayer('关联站点');
|
||||||
|
map.removeSource('关联站点');
|
||||||
|
}
|
||||||
|
if (data.length === 0) { return }
|
||||||
|
if (type === 'hd') {
|
||||||
|
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.5,
|
||||||
|
14, 1,
|
||||||
|
],
|
||||||
|
'text-size': [
|
||||||
|
'interpolate', ['linear'], ['zoom'],
|
||||||
|
10, 10,
|
||||||
|
14, 16,
|
||||||
|
],
|
||||||
|
'text-max-width': 30,
|
||||||
|
'text-font': ['Roboto Black'],
|
||||||
|
'text-field': [
|
||||||
|
'step',
|
||||||
|
['zoom'],
|
||||||
|
[
|
||||||
|
'case',
|
||||||
|
['!=', ['get', 'state'], 1], '',
|
||||||
|
['concat', ['get', 'rz'], 'm']
|
||||||
|
],
|
||||||
|
12, [
|
||||||
|
'case',
|
||||||
|
['!=', ['get', 'state'], 1], ['get', 'stnm'],
|
||||||
|
[
|
||||||
|
'format',
|
||||||
|
['get', 'stnm'], { 'font-scale': 0.8, 'text-color': '#fff' },
|
||||||
|
'\n', {},
|
||||||
|
['concat', ['get', 'rz'], 'm'], {}
|
||||||
|
]
|
||||||
|
],
|
||||||
|
],
|
||||||
|
'text-anchor': 'top',
|
||||||
|
'text-offset': [0, 1],
|
||||||
|
},
|
||||||
|
'paint': {
|
||||||
|
'text-color': [
|
||||||
|
'case',
|
||||||
|
['!=', ['get', 'state'], 1], '#888',
|
||||||
|
['==', ['get', 'warning'], 3], '#f00',
|
||||||
|
['==', ['get', 'warning'], 2], 'yellow',
|
||||||
|
['==', ['get', 'warning'], 1], 'yellow',
|
||||||
|
'#0f0'
|
||||||
|
],
|
||||||
|
'text-halo-color': '#062040',
|
||||||
|
'text-halo-width': 1
|
||||||
|
},
|
||||||
|
'visibility': 'visible',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
map.getSource('关联站点').setData(parseGeoJSON(data))
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<PanelBox
|
<PanelBox
|
||||||
|
|
@ -83,8 +159,8 @@ function HDReal({ style }) {
|
||||||
}
|
}
|
||||||
extra={
|
extra={
|
||||||
<>
|
<>
|
||||||
<i style={{ marginRight: '0.5rem', color: hdAutoRefresh ? '#00deff' : '#aaa' }} className="ionicons loop cursor-pointer" onClick={toggleAutoRefresh}></i>
|
{/* <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>
|
<i className="ionicons gear cursor-pointer" onClick={() => showSetting(true)}></i> */}
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
|
|
@ -94,17 +170,17 @@ function HDReal({ style }) {
|
||||||
<TableRow>
|
<TableRow>
|
||||||
<DpTableCell style={{ maxWidth: '30%' }} align="left">名称</DpTableCell>
|
<DpTableCell style={{ maxWidth: '30%' }} align="left">名称</DpTableCell>
|
||||||
<DpTableCell align="right">水位</DpTableCell>
|
<DpTableCell align="right">水位</DpTableCell>
|
||||||
<DpTableCell align="right">保证水位</DpTableCell>
|
<DpTableCell align="right">保证水位(m)</DpTableCell>
|
||||||
<DpTableCell align="right">警戒水位</DpTableCell>
|
<DpTableCell align="right">警戒水位(m)</DpTableCell>
|
||||||
</TableRow>
|
</TableRow>
|
||||||
</TableHead>
|
</TableHead>
|
||||||
<TableBody>
|
<TableBody>
|
||||||
{showData.map((row) => (
|
{showData.map((row) => (
|
||||||
<DpTableRow key={row.stcd}>
|
<DpTableRow key={row.stcd} onClick={() => { flyTo(row); setLayer([row], 'hd') }}>
|
||||||
<DpTableCell component="th" scope="row">
|
<DpTableCell component="th" scope="row">
|
||||||
<div className="table-ellipsis cursor-pointer" onClick={() => flyTo(row)}>{row.stnm}</div>
|
<div className="table-ellipsis cursor-pointer">{row.stnm}</div>
|
||||||
</DpTableCell>
|
</DpTableCell>
|
||||||
<DpTableCell align="right">{renderHDRz(row)}</DpTableCell>
|
<DpTableCell align="right">{renderHDRz(row)}{row.stnm == '浮桥河' ? '↑' : ""}</DpTableCell>
|
||||||
{rzRender(row.rz, row.rz + 5.5)}
|
{rzRender(row.rz, row.rz + 5.5)}
|
||||||
{rzRender(row.rz, row.rz + 4)}
|
{rzRender(row.rz, row.rz + 4)}
|
||||||
</DpTableRow>
|
</DpTableRow>
|
||||||
|
|
|
||||||
|
|
@ -106,7 +106,7 @@ function Page({jbqkKey}) {
|
||||||
<img src={`${process.env.PUBLIC_URL}/assets/icon/中.png`} width={18} height={18} alt=""/>
|
<img src={`${process.env.PUBLIC_URL}/assets/icon/中.png`} width={18} height={18} alt=""/>
|
||||||
{/* <div style={{width:'10px',height:'10px',borderRadius:'10px',background:'#8b4513',border:'2px solid #000000'}}></div> */}
|
{/* <div style={{width:'10px',height:'10px',borderRadius:'10px',background:'#8b4513',border:'2px solid #000000'}}></div> */}
|
||||||
<div style={{flex:1,paddingLeft:'0.8rem',marginBottom:'-0.1rem'}}>{'水库总数'}</div>
|
<div style={{flex:1,paddingLeft:'0.8rem',marginBottom:'-0.1rem'}}>{'水库总数'}</div>
|
||||||
<div style={{margin:'0 1rem -0.1rem 1rem'}}>{300}座</div>
|
<div style={{margin:'0 1rem -0.1rem 1rem'}}>{261}座</div>
|
||||||
<img src={`${process.env.PUBLIC_URL}/assets/icon/${skType===1?'收起':'展开'}.png`} style={{cursor:'pointer'}} width={20} alt="" onClick={()=>{
|
<img src={`${process.env.PUBLIC_URL}/assets/icon/${skType===1?'收起':'展开'}.png`} style={{cursor:'pointer'}} width={20} alt="" onClick={()=>{
|
||||||
setSkType(skType!==1?1:'')
|
setSkType(skType!==1?1:'')
|
||||||
}}/>
|
}}/>
|
||||||
|
|
@ -118,8 +118,8 @@ function Page({jbqkKey}) {
|
||||||
<TableRow>
|
<TableRow>
|
||||||
<DpTableCell style={{ minWidth: '1rem' }} align="left">序号</DpTableCell>
|
<DpTableCell style={{ minWidth: '1rem' }} align="left">序号</DpTableCell>
|
||||||
<DpTableCell style={{ minWidth: '5rem' }} align="center">水库名称</DpTableCell>
|
<DpTableCell style={{ minWidth: '5rem' }} align="center">水库名称</DpTableCell>
|
||||||
<DpTableCell style={{ minWidth: '8rem' }} align="center">类型</DpTableCell>
|
{/* <DpTableCell style={{ minWidth: '8rem' }} align="center">类型</DpTableCell> */}
|
||||||
<DpTableCell style={{ minWidth: '8rem' }} align="center">类型</DpTableCell>
|
<DpTableCell style={{ minWidth: '8rem' }} align="center">库容</DpTableCell>
|
||||||
</TableRow>
|
</TableRow>
|
||||||
</TableHead>
|
</TableHead>
|
||||||
{
|
{
|
||||||
|
|
@ -135,7 +135,7 @@ function Page({jbqkKey}) {
|
||||||
{tableRow.stnm}
|
{tableRow.stnm}
|
||||||
</div>
|
</div>
|
||||||
</DpTableCell>
|
</DpTableCell>
|
||||||
<DpTableCell align="center" >{tableRow.name}</DpTableCell>
|
{/* <DpTableCell align="center" >{tableRow.name}</DpTableCell> */}
|
||||||
<DpTableCell align="center" >{tableRow.w}</DpTableCell>
|
<DpTableCell align="center" >{tableRow.w}</DpTableCell>
|
||||||
</DpTableRow>
|
</DpTableRow>
|
||||||
</TableBody>
|
</TableBody>
|
||||||
|
|
|
||||||
|
|
@ -10,8 +10,8 @@ function DrpReal({ style }) {
|
||||||
color="green"
|
color="green"
|
||||||
extra={
|
extra={
|
||||||
<>
|
<>
|
||||||
<img src='/assets/镇下拉.jpg' style={{width:'100px', height:'30px',marginRight:'10px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/镇下拉.jpg'} style={{width:'100px', height:'30px',marginRight:'10px'}}/>
|
||||||
<img src='/assets/水厂切换.jpg' style={{width:'165px', height:'20px',marginRight:'5px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/水厂切换.jpg'} style={{width:'165px', height:'20px',marginRight:'5px'}}/>
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
|
|
|
||||||
|
|
@ -145,12 +145,12 @@ export default function OverallContent({ data }) {
|
||||||
<div className={classes.grid}>
|
<div className={classes.grid}>
|
||||||
<div>
|
<div>
|
||||||
<div className="value">{strNumber(h24?.drpStCount?.total, '-')}</div>
|
<div className="value">{strNumber(h24?.drpStCount?.total, '-')}</div>
|
||||||
<div className="key">降雨测站</div>
|
<div className="key">降雨测站数</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
{/* <div className="value">{strNumber(skInfo?.aRz, '-')}</div> */}
|
{/* <div className="value">{strNumber(skInfo?.aRz, '-')}</div> */}
|
||||||
<div className="value">{strNumber(1, '-')}</div>
|
<div className="value">{strNumber(1, '-')}</div>
|
||||||
<div className="key">超汛限水库</div>
|
<div className="key">超汛限水库数</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<div className="value" style={{ fontSize: '1.5rem', cursor: 'pointer' }} onClick={() => {
|
<div className="value" style={{ fontSize: '1.5rem', cursor: 'pointer' }} onClick={() => {
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,165 @@
|
||||||
|
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}>
|
||||||
|
<div>
|
||||||
|
<div className="value">{strNumber(h24?.drpStCount?.total, '-')}</div>
|
||||||
|
<div className="key">降雨测站</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<div className="value">{strNumber(skInfo?.aRz, '-')}</div>
|
||||||
|
<div className="key">超汛限水库</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<div className="value" style={{ fontSize: '1.5rem', cursor: 'pointer' }} onClick={() => showRecord(h24?.max)}>
|
||||||
|
{h24?.max?.stnm || '--'}
|
||||||
|
</div>
|
||||||
|
<div className="key">最大降雨测站</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<span className={classes.titleDate}>{tm1 || '-'}</span>至<span className={classes.titleDate}>{tm2 || '-'}</span>
|
||||||
|
24小时中共有<span className={classes.number}>{strNumber(h24?.drpStCount?.total, '-')}</span>
|
||||||
|
个降雨测站(<span className={classes.sttype}>山洪测站</span>
|
||||||
|
<span className={classes.number}>{strNumber(h24?.drpStCount?.sh, '-')}</span>
|
||||||
|
个),其中最大降雨测站为<span onClick={() => showRecord(h24?.max)} className={classes.stname}>{h24?.max?.stnm || '-'}</span>
|
||||||
|
,降雨量<span className={classes.number}>{strNumber(h24?.max?.value, '-')}</span>mm
|
||||||
|
{h24?.cntDrp10 > 0 && (<>,<span className={classes.sttype}>10mm以下</span>测站数为<span className={classes.number}>{strNumber(h24?.cntDrp10, '-')}</span>个</>)}
|
||||||
|
{h24?.cntDrp25 > 0 && (<>,<span className={classes.sttype}>10mm至25mm</span>测站数为<span className={classes.number}>{strNumber(h24?.cntDrp25, '-')}</span>个</>)}
|
||||||
|
{h24?.cntDrp50 > 0 && (<>,<span className={classes.sttype}>25mm至50mm</span>测站数为<span className={classes.number}>{strNumber(h24?.cntDrp50, '-')}</span>个</>)}
|
||||||
|
{h24?.cntDrp100 > 0 && (<>,<span className={classes.sttype}>50mm至100mm</span>测站数为<span className={classes.number}>{strNumber(h24?.cntDrp100, '-')}</span>个</>)}
|
||||||
|
{h24?.cntDrp250 > 0 && (<>,<span className={classes.sttype}>100mm至250mm</span>测站数为<span className={classes.number}>{strNumber(h24?.cntDrp250, '-')}</span>个</>)}
|
||||||
|
{h24?.cntDrpg250 > 0 && (<>,<span className={classes.sttype}>大于250mm</span>测站数为<span className={classes.number}>{strNumber(h24?.cntDrpg250, '-')}</span>个</>)}
|
||||||
|
。
|
||||||
|
{h1?.max?.value > 0 && (<><span className={classes.sttype}>前1小时</span>最大降雨测站是<span onClick={() => showRecord(h1?.max)} className={classes.stname}>{h1?.max?.stnm}</span>({h1?.max?.value}mm),</>)}
|
||||||
|
{h3?.max?.value > 0 && (<><span className={classes.sttype}>前3小时</span>最大降雨测站是<span onClick={() => showRecord(h3?.max)} className={classes.stname}>{h3?.max?.stnm}</span>({h3?.max?.value}mm),</>)}
|
||||||
|
{h6?.max?.value > 0 && (<><span className={classes.sttype}>前6小时</span>最大降雨测站是<span onClick={() => showRecord(h6?.max)} className={classes.stname}>{h6?.max?.stnm}</span>({h6?.max?.value}mm),</>)}
|
||||||
|
{
|
||||||
|
!h1?.max?.value || !h3?.max?.value || !h6?.max?.value ? (
|
||||||
|
`前${[!h1?.max?.value ? '1' : null, !h3?.max?.value ? '3' : null, !h6?.max?.value ? '6' : null].filter(Boolean).join(',')}小时无降雨。`
|
||||||
|
) : null
|
||||||
|
}
|
||||||
|
超汛限水位水库数为<span className={classes.number}>{strNumber(skInfo?.aRz, '-')}</span>座。
|
||||||
|
</div>
|
||||||
|
<div className={classes.action}>
|
||||||
|
<Button startIcon={<Email />} onClick={doBx} style={{ color: '#fff' }} size="small">报讯</Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,269 @@
|
||||||
|
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 { makeStyles } from '@material-ui/core/styles';
|
||||||
|
import { InfoPopNames } from '../../InfoPops';
|
||||||
|
import {
|
||||||
|
Box,
|
||||||
|
Typography,
|
||||||
|
Checkbox,
|
||||||
|
FormControlLabel,
|
||||||
|
ButtonGroup,
|
||||||
|
Button,
|
||||||
|
Table,
|
||||||
|
TableBody,
|
||||||
|
TableCell,
|
||||||
|
TableContainer,
|
||||||
|
TableHead,
|
||||||
|
TableRow,
|
||||||
|
IconButton,
|
||||||
|
Collapse
|
||||||
|
} from '@material-ui/core';
|
||||||
|
import AddIcon from '@material-ui/icons/Add';
|
||||||
|
import { useDispatch, useSelector } from 'react-redux';
|
||||||
|
import DpTableCell from '../../../../layouts/mui/DpTableCell';
|
||||||
|
import clsx from 'clsx';
|
||||||
|
import RemoveIcon from '@material-ui/icons/Remove';
|
||||||
|
import config from '../../../../config';
|
||||||
|
const useStyles = makeStyles((theme) => ({
|
||||||
|
root: {
|
||||||
|
color: '#fff',
|
||||||
|
'& .MuiTypography-root': {
|
||||||
|
color: '#fff'
|
||||||
|
},
|
||||||
|
'& .MuiCheckbox-root': {
|
||||||
|
color: '#fff',
|
||||||
|
'&.Mui-checked': {
|
||||||
|
color: '#409eff'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
'& .MuiButtonGroup-root': {
|
||||||
|
marginTop: theme.spacing(2),
|
||||||
|
marginBottom: theme.spacing(3)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
typeSection: {
|
||||||
|
marginBottom: theme.spacing(2)
|
||||||
|
},
|
||||||
|
timeButton: {
|
||||||
|
width:210,
|
||||||
|
color: '#fff',
|
||||||
|
borderColor: 'rgba(255,255,255,0.3)',
|
||||||
|
'&.MuiButton-contained': {
|
||||||
|
backgroundColor: '#409eff',
|
||||||
|
color: '#fff',
|
||||||
|
'&:hover': {
|
||||||
|
backgroundColor: '#409eff'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
'&:hover': {
|
||||||
|
backgroundColor: 'rgba(255,255,255,0.1)'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
table: {
|
||||||
|
'& .MuiTableCell-root': {
|
||||||
|
color: '#fff',
|
||||||
|
borderColor: 'rgba(255,255,255,0.1)'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
expandButton: {
|
||||||
|
color: '#fff'
|
||||||
|
},
|
||||||
|
stationRow: {
|
||||||
|
'&:nth-of-type(odd)': {
|
||||||
|
backgroundColor: 'rgba(255,255,255,0.05)'
|
||||||
|
},
|
||||||
|
'&:hover': {
|
||||||
|
backgroundColor: 'rgba(255,255,255,0.1)'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
warningRow: {
|
||||||
|
'&.pink': { backgroundColor: 'rgba(255,192,203,0.5)' },
|
||||||
|
'&.purple': { backgroundColor: 'rgba(147,112,219,0.5)' },
|
||||||
|
'&.blue': { backgroundColor: 'rgba(135,206,235,0.5)' },
|
||||||
|
'&.blue1': { backgroundColor: 'rgba(135,206,235,0.4)' },
|
||||||
|
'&.blue2': { backgroundColor: 'rgba(135,206,235,0.3)' },
|
||||||
|
'&.green': { backgroundColor: 'rgba(144,238,144,0.5)' }
|
||||||
|
},
|
||||||
|
|
||||||
|
expandedRow: {
|
||||||
|
'&.pink': { backgroundColor: 'rgba(255,192,203,0.1)' },
|
||||||
|
'&.purple': { backgroundColor: 'rgba(147,112,219,0.1)' },
|
||||||
|
'&.blue': { backgroundColor: 'rgba(135,206,235,0.1)' },
|
||||||
|
'&.green': { backgroundColor: 'rgba(144,238,144,0.1)' }
|
||||||
|
}
|
||||||
|
}));
|
||||||
|
export default function Overall({ style }) {
|
||||||
|
const dispatch = useDispatch();
|
||||||
|
|
||||||
|
const classes = useStyles();
|
||||||
|
const [types, setTypes] = useState({
|
||||||
|
mountain: true,
|
||||||
|
water: true,
|
||||||
|
weather: true,
|
||||||
|
reservoir: true
|
||||||
|
});
|
||||||
|
const [timeRange, setTimeRange] = useState('1h');
|
||||||
|
const [expanded, setExpanded] = useState({});
|
||||||
|
|
||||||
|
const handleTypeChange = (event) => {
|
||||||
|
setTypes({
|
||||||
|
...types,
|
||||||
|
[event.target.name]: event.target.checked
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
const stations = [
|
||||||
|
{ id: 'history', name: '历史极值站点', count: 0, color: 'pink' },
|
||||||
|
{ id: '100year', name: '100年一遇以上站点', count: 0, color: 'purple' },
|
||||||
|
{ id: '50year', name: '50年一遇以上站点', count: 0, color: 'blue' },
|
||||||
|
{ id: 'special', name: '特大暴雨站点', count: 0, color: 'blue1' },
|
||||||
|
{ id: 'heavy', name: '大暴雨站点', count: 0, color: 'blue2' },
|
||||||
|
{ id: 'storm', name: '暴雨站点', count: 1, color: 'green' }
|
||||||
|
];
|
||||||
|
|
||||||
|
const toggleExpand = (id) => {
|
||||||
|
setExpanded(prev => ({
|
||||||
|
...prev,
|
||||||
|
[id]: !prev[id]
|
||||||
|
}));
|
||||||
|
};
|
||||||
|
|
||||||
|
const drpData = [
|
||||||
|
{
|
||||||
|
"stcd": "Q9111",
|
||||||
|
"stnm": "福田河",
|
||||||
|
"adcd": "421181000000000",
|
||||||
|
'test':1,
|
||||||
|
"wscd": null,
|
||||||
|
"importancy": 0,
|
||||||
|
"lgtd": 115.0944,
|
||||||
|
"lttd": 31.4747,
|
||||||
|
"elev": null,
|
||||||
|
"hasRz": true,
|
||||||
|
"type": "qx",
|
||||||
|
"today": 50.3,
|
||||||
|
"h1": 50.2,
|
||||||
|
"h3": 50.2,
|
||||||
|
"h6": 50.2,
|
||||||
|
"h12": 50.2,
|
||||||
|
"h24": 50.3,
|
||||||
|
"tm": "2025-06-06T22:00:00.000Z",
|
||||||
|
|
||||||
|
"state": 1,
|
||||||
|
"warning": 0
|
||||||
|
},
|
||||||
|
]
|
||||||
|
const flyTo = (record) => {
|
||||||
|
const { lgtd, lttd } = record;
|
||||||
|
if (lgtd && lttd) {
|
||||||
|
dispatch.runtime.setFeaturePop({ type: InfoPopNames.RealDrpPop, properties: record, coordinates: [lgtd, lttd] });
|
||||||
|
dispatch.runtime.setCameraTarget({
|
||||||
|
center: [lgtd, lttd + config.poiPositionOffsetY.hd],
|
||||||
|
zoom: config.poiPositionZoom.hd,
|
||||||
|
pitch: config.poiPitch,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
const [type, setType] = useState('h24')
|
||||||
|
return (
|
||||||
|
<PanelBox
|
||||||
|
style={style}
|
||||||
|
title="雨情统计"
|
||||||
|
color="green"
|
||||||
|
extra={
|
||||||
|
<span className="button-group">
|
||||||
|
{
|
||||||
|
['h1', 'h3', 'h6', 'h12', 'h24'].map(key => (
|
||||||
|
<span key={key} className={clsx({ active: type === key })} onClick={() => setType(key)}>{key}</span>
|
||||||
|
))
|
||||||
|
}
|
||||||
|
</span>
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<Box className={classes.root}>
|
||||||
|
<div style={{ display: 'flex', alignItems: 'center' }}>
|
||||||
|
<ButtonGroup variant="outlined">
|
||||||
|
{[
|
||||||
|
{ value: '1h', label: '政区' },
|
||||||
|
{ value: '3h', label: '流域' },
|
||||||
|
].map((item) => (
|
||||||
|
<Button
|
||||||
|
key={item.value}
|
||||||
|
className={classes.timeButton}
|
||||||
|
onClick={() => {
|
||||||
|
if (item.value == '1h' || item.value == '3h') {
|
||||||
|
setTimeRange(item.value)
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
variant={timeRange === item.value ? 'contained' : 'outlined'}
|
||||||
|
style={{ padding: '5px 10px' }}
|
||||||
|
>
|
||||||
|
{item.label}
|
||||||
|
</Button>
|
||||||
|
))}
|
||||||
|
</ButtonGroup>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<TableContainer >
|
||||||
|
<Table stickyHeader>
|
||||||
|
<TableHead >
|
||||||
|
<TableRow>
|
||||||
|
<DpTableCell style={{ width: '51%' }}>站名</DpTableCell>
|
||||||
|
<DpTableCell style={{ width: '30%' }}>累计雨量(mm)</DpTableCell>
|
||||||
|
{/* <DpTableCell style={{ width: '15%' }}>所属政区</DpTableCell> */}
|
||||||
|
<DpTableCell style={{ width: '20%' }}>{timeRange == '1h' ? '所属政区':'所属流域'}</DpTableCell>
|
||||||
|
</TableRow>
|
||||||
|
</TableHead>
|
||||||
|
<TableBody>
|
||||||
|
{stations.map((station) => (
|
||||||
|
<React.Fragment key={station.id}>
|
||||||
|
<TableRow
|
||||||
|
// className={classes.stationRow}
|
||||||
|
className={`${classes.warningRow} ${station.color}`}
|
||||||
|
>
|
||||||
|
<DpTableCell>
|
||||||
|
<Box display="flex" alignItems="center">
|
||||||
|
<IconButton
|
||||||
|
size="small"
|
||||||
|
className={classes.expandButton}
|
||||||
|
onClick={() => toggleExpand(station.id)}
|
||||||
|
>
|
||||||
|
{expanded[station.id] ? <RemoveIcon /> : <AddIcon />}
|
||||||
|
</IconButton>
|
||||||
|
{station.name}({station.count})
|
||||||
|
</Box>
|
||||||
|
</DpTableCell>
|
||||||
|
<DpTableCell></DpTableCell>
|
||||||
|
<DpTableCell></DpTableCell>
|
||||||
|
<DpTableCell></DpTableCell>
|
||||||
|
</TableRow>
|
||||||
|
<TableRow>
|
||||||
|
<DpTableCell colSpan={4} style={{ padding: 0 }}>
|
||||||
|
<Collapse in={expanded[station.id]} timeout="auto" unmountOnExit>
|
||||||
|
<Box className={`${classes.expandedRow} ${station.color}`}>
|
||||||
|
{/* 展开的详细内容可以在这里添加 */}{
|
||||||
|
station.id == 'storm' && drpData.map(item => (
|
||||||
|
<TableRow onClick={() =>flyTo(item)}>
|
||||||
|
<DpTableCell style={{ width: '53%' }}>{item.stnm}</DpTableCell>
|
||||||
|
<DpTableCell style={{ width: timeRange == '1h' ?'27%':"28%" }}>{item.today}</DpTableCell>
|
||||||
|
<DpTableCell style={{ width: timeRange == '1h' ?'20%':'19%' }}>{timeRange == '1h' ? '福田河镇':'长江流域'}</DpTableCell>
|
||||||
|
</TableRow>
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
</Box>
|
||||||
|
</Collapse>
|
||||||
|
</DpTableCell>
|
||||||
|
</TableRow>
|
||||||
|
</React.Fragment>
|
||||||
|
))}
|
||||||
|
</TableBody>
|
||||||
|
</Table>
|
||||||
|
</TableContainer>
|
||||||
|
</Box>
|
||||||
|
</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;}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -10,12 +10,12 @@ function DrpReal({ style }) {
|
||||||
color="green"
|
color="green"
|
||||||
extra={
|
extra={
|
||||||
<>
|
<>
|
||||||
<img src='/assets/镇下拉.jpg' style={{width:'100px', height:'30px',marginRight:'10px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/镇下拉.jpg'} style={{width:'100px', height:'30px',marginRight:'10px'}}/>
|
||||||
<img src='/assets/水厂切换.jpg' style={{width:'165px', height:'20px',marginRight:'5px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/水厂切换.jpg'} style={{width:'165px', height:'20px',marginRight:'5px'}}/>
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
<img src='/assets/设备故障统计.jpg' style={{width:'26rem', height:'14rem',marginLeft:'0.3rem',marginTop:'1rem'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/设备故障统计.jpg'} style={{width:'26rem', height:'14rem',marginLeft:'0.3rem',marginTop:'1rem'}}/>
|
||||||
</PanelBox>
|
</PanelBox>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -10,12 +10,12 @@ function DrpReal({ style }) {
|
||||||
color="green"
|
color="green"
|
||||||
extra={
|
extra={
|
||||||
<>
|
<>
|
||||||
<img src='/assets/镇下拉.jpg' style={{width:'100px', height:'30px',marginRight:'10px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/镇下拉.jpg'} style={{width:'100px', height:'30px',marginRight:'10px'}}/>
|
||||||
<img src='/assets/水厂切换.jpg' style={{width:'165px', height:'20px',marginRight:'5px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/水厂切换.jpg'} style={{width:'165px', height:'20px',marginRight:'5px'}}/>
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
<img src='/assets/设备数量统计.jpg' style={{width:'26rem', height:'14rem',marginLeft:'0.3rem',marginTop:'0.5rem'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/设备数量统计.jpg'} style={{width:'26rem', height:'14rem',marginLeft:'0.3rem',marginTop:'0.5rem'}}/>
|
||||||
</PanelBox>
|
</PanelBox>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -13,7 +13,7 @@ function DrpReal({ style }) {
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
<img src='/assets/设备统计1.jpg' style={{width:'11.5rem', height:'16rem',marginLeft:'6.5rem',marginTop:'2rem'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/设备统计1.jpg'} style={{width:'11.5rem', height:'16rem',marginLeft:'6.5rem',marginTop:'2rem'}}/>
|
||||||
</PanelBox>
|
</PanelBox>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -10,12 +10,12 @@ function DrpReal({ style }) {
|
||||||
color="green"
|
color="green"
|
||||||
extra={
|
extra={
|
||||||
<>
|
<>
|
||||||
<img src='/assets/镇下拉.jpg' style={{width:'100px', height:'30px',marginRight:'10px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/镇下拉.jpg'} style={{width:'100px', height:'30px',marginRight:'10px'}}/>
|
||||||
<img src='/assets/水厂切换.jpg' style={{width:'165px', height:'20px',marginRight:'5px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/水厂切换.jpg'} style={{width:'165px', height:'20px',marginRight:'5px'}}/>
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
<img src='/assets/水厂监控.jpg' style={{width:'26rem', height:'12rem',marginLeft:'0.3rem',marginTop:'1rem'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/水厂监控.jpg'} style={{width:'26rem', height:'12rem',marginLeft:'0.3rem',marginTop:'1rem'}}/>
|
||||||
</PanelBox>
|
</PanelBox>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -12,7 +12,7 @@ function DrpReal({ style }) {
|
||||||
color="green"
|
color="green"
|
||||||
extra={
|
extra={
|
||||||
<>
|
<>
|
||||||
<img src='/assets/年下拉3.jpg' style={{width:'100px', height:'30px',marginRight:'10px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/年下拉3.jpg'} style={{width:'100px', height:'30px',marginRight:'10px'}}/>
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
|
|
|
||||||
|
|
@ -225,7 +225,7 @@ function DrpReal({ style }) {
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
<img src='/assets/jinshuigongshui.jpg' style={{width:'19.5rem', marginLeft:'3.5rem',marginTop:'0.5rem',marginBlock:'0.5rem'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/jinshuigongshui.jpg'} style={{width:'19.5rem', marginLeft:'3.5rem',marginTop:'0.5rem',marginBlock:'0.5rem'}}/>
|
||||||
<TableContainer style={{ height: '10rem' }}>
|
<TableContainer style={{ height: '10rem' }}>
|
||||||
<Table size="small" stickyHeader>
|
<Table size="small" stickyHeader>
|
||||||
<TableHead>
|
<TableHead>
|
||||||
|
|
|
||||||
|
|
@ -199,7 +199,7 @@ const useStyles = makeStyles({
|
||||||
return (
|
return (
|
||||||
<PanelBox
|
<PanelBox
|
||||||
style={style}
|
style={style}
|
||||||
title="山洪可视化"
|
title="山洪可视化预案"
|
||||||
color="green"
|
color="green"
|
||||||
>
|
>
|
||||||
<div style={{padding:'10px 8px'}}>
|
<div style={{padding:'10px 8px'}}>
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,48 @@
|
||||||
|
import React, { useMemo, useState } 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 { DrpRealPromise } from '../../../../models/_/real';
|
||||||
|
import useRefresh from '../../../../utils/useRefresh';
|
||||||
|
import clsx from 'clsx';
|
||||||
|
import { renderDrp } from '../../../../utils/renutils';
|
||||||
|
import { TableSortLabel } from '@material-ui/core';
|
||||||
|
import { InfoPopNames } from '../../InfoPops';
|
||||||
|
// import AreaDrpChart from './chart';
|
||||||
|
import config from '../../../../config';
|
||||||
|
import TablePage from './table.js'
|
||||||
|
|
||||||
|
function DrpReal({ style }) {
|
||||||
|
const dispatch = useDispatch();
|
||||||
|
const [ tab, setTab ] = useState('1')
|
||||||
|
const [ tab2, setTab2 ] = useState('1')
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
const flyTo = (row) => {
|
||||||
|
dispatch?.runtime.setInfoDlg({ layerId: 'PdfLayer', properties: row })
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
return (
|
||||||
|
<PanelBox
|
||||||
|
style={style}
|
||||||
|
title="预案"
|
||||||
|
color="green"
|
||||||
|
>
|
||||||
|
<div style={{ color: "#fff",display:'flex',padding:'10px',cursor:'pointer' }} onClick={() => flyTo({planName:'潭家河村山洪灾害防御预案'})}>
|
||||||
|
<span>潭家河村山洪灾害防御预案</span>
|
||||||
|
</div>
|
||||||
|
</PanelBox>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default DrpReal;
|
||||||
|
|
@ -0,0 +1,91 @@
|
||||||
|
import React, { useMemo, useState } 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 appconsts from '../../../../models/appconsts';
|
||||||
|
import { renderDrp, renderSkArz, renderSkRz } from '../../../../utils/renutils';
|
||||||
|
|
||||||
|
|
||||||
|
const data = [
|
||||||
|
{ name:'雨量站', name2:'10', name3:'8', name4:'2', name5:'80' },
|
||||||
|
{ name:'水位站', name2:'15', name3:'15', name4:'0', name5:'100' },
|
||||||
|
{ name:'图像站', name2:'10', name3:'10', name4:'0', name5:'100' },
|
||||||
|
{ name:'合计', name2:'35', name3:'33', name4:'2', name5:'94.29' },
|
||||||
|
]
|
||||||
|
|
||||||
|
const data2 = [
|
||||||
|
{ name:'合计', name2:'64', name3:'64', name4:'0', name5:'100' },
|
||||||
|
]
|
||||||
|
|
||||||
|
const data3 = [
|
||||||
|
{ name:'合计', name2:'12', name3:'12', name4:'0', name5:'100' },
|
||||||
|
]
|
||||||
|
|
||||||
|
function Page({ tab }) {
|
||||||
|
|
||||||
|
return (
|
||||||
|
<TableContainer style={{ height: '12rem' }}>
|
||||||
|
<Table size="small" stickyHeader>
|
||||||
|
<TableHead>
|
||||||
|
<TableRow>
|
||||||
|
<DpTableCell style={{ minWidth: '2rem' }} align="left"></DpTableCell>
|
||||||
|
<DpTableCell style={{ minWidth: '3rem' }} align="center">总数</DpTableCell>
|
||||||
|
<DpTableCell style={{ minWidth: '5rem' }} align="center">在线数量</DpTableCell>
|
||||||
|
<DpTableCell style={{ minWidth: '5rem' }} align="center">离线数量</DpTableCell>
|
||||||
|
<DpTableCell style={{ minWidth: '5rem' }} align="center">到报率(%)</DpTableCell>
|
||||||
|
</TableRow>
|
||||||
|
</TableHead>
|
||||||
|
<TableBody>
|
||||||
|
{
|
||||||
|
tab==='1'?data.map((row) => (
|
||||||
|
<DpTableRow key={row.name}>
|
||||||
|
<DpTableCell component="th" scope="row">
|
||||||
|
<div className="table-ellipsis cursor-pointer" onClick={() => {}}>{row.name}</div>
|
||||||
|
</DpTableCell>
|
||||||
|
<DpTableCell align="center">{row.name2}</DpTableCell>
|
||||||
|
<DpTableCell align="center">{row.name3}</DpTableCell>
|
||||||
|
<DpTableCell align="center">{row.name4}</DpTableCell>
|
||||||
|
<DpTableCell align="center">{row.name5}</DpTableCell>
|
||||||
|
</DpTableRow>
|
||||||
|
)):null
|
||||||
|
}
|
||||||
|
{
|
||||||
|
tab==='2'?data2.map((row) => (
|
||||||
|
<DpTableRow key={row.name}>
|
||||||
|
<DpTableCell component="th" scope="row">
|
||||||
|
<div className="table-ellipsis cursor-pointer" onClick={() => {}}>{row.name}</div>
|
||||||
|
</DpTableCell>
|
||||||
|
<DpTableCell align="center">{row.name2}</DpTableCell>
|
||||||
|
<DpTableCell align="center">{row.name3}</DpTableCell>
|
||||||
|
<DpTableCell align="center">{row.name4}</DpTableCell>
|
||||||
|
<DpTableCell align="center">{row.name5}</DpTableCell>
|
||||||
|
</DpTableRow>
|
||||||
|
)):null
|
||||||
|
}
|
||||||
|
{
|
||||||
|
tab==='3'?data3.map((row) => (
|
||||||
|
<DpTableRow key={row.name}>
|
||||||
|
<DpTableCell component="th" scope="row">
|
||||||
|
<div className="table-ellipsis cursor-pointer" onClick={() => {}}>{row.name}</div>
|
||||||
|
</DpTableCell>
|
||||||
|
<DpTableCell align="center">{row.name2}</DpTableCell>
|
||||||
|
<DpTableCell align="center">{row.name3}</DpTableCell>
|
||||||
|
<DpTableCell align="center">{row.name4}</DpTableCell>
|
||||||
|
<DpTableCell align="center">{row.name5}</DpTableCell>
|
||||||
|
</DpTableRow>
|
||||||
|
)):null
|
||||||
|
}
|
||||||
|
</TableBody>
|
||||||
|
</Table>
|
||||||
|
</TableContainer>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default React.memo(Page);
|
||||||
|
|
@ -1,6 +1,7 @@
|
||||||
import React, { useMemo, useState } from 'react';
|
import React, { useMemo, useState } from 'react';
|
||||||
import useRequest from '../../../../utils/useRequest';
|
import useRequest from '../../../../utils/useRequest';
|
||||||
import PanelBox from '../../components/PanelBox';
|
import PanelBox from '../../components/PanelBox';
|
||||||
|
import { parseGeoJSON } from "../../../../utils/tools";
|
||||||
|
|
||||||
import HighlightOff from '@material-ui/icons/HighlightOff';
|
import HighlightOff from '@material-ui/icons/HighlightOff';
|
||||||
import { makeStyles } from '@material-ui/core/styles';
|
import { makeStyles } from '@material-ui/core/styles';
|
||||||
|
|
@ -57,7 +58,7 @@ function SkReal({ style }) {
|
||||||
const flyTo = (record) => {
|
const flyTo = (record) => {
|
||||||
const { lgtd, lttd } = record;
|
const { lgtd, lttd } = record;
|
||||||
if (lgtd && lttd) {
|
if (lgtd && lttd) {
|
||||||
dispatch.runtime.setFeaturePop({ type: InfoPopNames.RealSkPop, properties: record, coordinates: [lgtd, lttd] });
|
// dispatch.runtime.setFeaturePop({ type: InfoPopNames.RealSkPop, properties: record, coordinates: [lgtd, lttd] });
|
||||||
dispatch.runtime.setCameraTarget({
|
dispatch.runtime.setCameraTarget({
|
||||||
center: [lgtd, lttd + config.poiPositionOffsetY.sk],
|
center: [lgtd, lttd + config.poiPositionOffsetY.sk],
|
||||||
zoom: config.poiPositionZoom.sk,
|
zoom: config.poiPositionZoom.sk,
|
||||||
|
|
@ -81,7 +82,55 @@ function SkReal({ style }) {
|
||||||
const handleClose = () => {
|
const handleClose = () => {
|
||||||
setOpen(false);
|
setOpen(false);
|
||||||
};
|
};
|
||||||
|
const setSkLayer = (data = []) => {
|
||||||
|
const map = window.__mapref;
|
||||||
|
const layer = map.getLayer('临时水库tz')
|
||||||
|
if (layer) {
|
||||||
|
map.removeLayer('临时水库tz');
|
||||||
|
map.removeSource('临时水库tz');
|
||||||
|
}
|
||||||
|
if (data.length === 0) { return }
|
||||||
|
map.addLayer({
|
||||||
|
'id': '临时水库tz',//+new Date().getTime(),
|
||||||
|
'type': 'symbol',
|
||||||
|
'source': {
|
||||||
|
'type': 'geojson',
|
||||||
|
'data': {
|
||||||
|
'type': 'FeatureCollection',
|
||||||
|
'features': [],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'layout': {
|
||||||
|
// 'icon-allow-overlap': true,
|
||||||
|
// 'text-allow-overlap': true,
|
||||||
|
'icon-image': '水库', // 从properties中动态读取icon字段
|
||||||
|
'icon-size': [
|
||||||
|
'interpolate', ['linear'], ['zoom'],
|
||||||
|
10, 0.8,
|
||||||
|
14, 0.8,
|
||||||
|
],
|
||||||
|
'text-size': [
|
||||||
|
'interpolate', ['linear'], ['zoom'],
|
||||||
|
5, 10,
|
||||||
|
14, 14,
|
||||||
|
],
|
||||||
|
'text-font': ['Roboto Black'],
|
||||||
|
'text-field': [
|
||||||
|
'step',
|
||||||
|
['zoom'],
|
||||||
|
'',
|
||||||
|
8, ['get', 'stnm']
|
||||||
|
],
|
||||||
|
'text-anchor': 'top',
|
||||||
|
'text-offset': [0, 1],
|
||||||
|
},
|
||||||
|
'paint': {
|
||||||
|
'text-color': '#fff'
|
||||||
|
},
|
||||||
|
'visibility': 'visible',
|
||||||
|
});
|
||||||
|
map.getSource('临时水库tz').setData(parseGeoJSON(data))
|
||||||
|
}
|
||||||
return (
|
return (
|
||||||
<PanelBox
|
<PanelBox
|
||||||
style={style}
|
style={style}
|
||||||
|
|
@ -89,7 +138,7 @@ function SkReal({ style }) {
|
||||||
color="green"
|
color="green"
|
||||||
extra={
|
extra={
|
||||||
<>
|
<>
|
||||||
<i style={{ marginRight: '0.5rem', color: skAutoRefresh ? '#00deff' : '#aaa' }} className="ionicons loop cursor-pointer" onClick={toggleAutoRefresh}></i>
|
{/* <i style={{ marginRight: '0.5rem', color: skAutoRefresh ? '#00deff' : '#aaa' }} className="ionicons loop cursor-pointer" onClick={toggleAutoRefresh}></i> */}
|
||||||
{/* <i style={{ marginRight: '0.5rem' }} className="ionicons image cursor-pointer" onClick={handleOpen}></i> */}
|
{/* <i style={{ marginRight: '0.5rem' }} className="ionicons image cursor-pointer" onClick={handleOpen}></i> */}
|
||||||
{/* <i className="ionicons gear cursor-pointer" onClick={() => showSetting(true)}></i> */}
|
{/* <i className="ionicons gear cursor-pointer" onClick={() => showSetting(true)}></i> */}
|
||||||
</>
|
</>
|
||||||
|
|
@ -99,19 +148,19 @@ function SkReal({ style }) {
|
||||||
<Table size="small" stickyHeader>
|
<Table size="small" stickyHeader>
|
||||||
<TableHead>
|
<TableHead>
|
||||||
<TableRow>
|
<TableRow>
|
||||||
<DpTableCell style={{ maxWidth: '30%' }} align="left">名称</DpTableCell>
|
<DpTableCell style={{ minWidth: '6rem' }} align="left">名称</DpTableCell>
|
||||||
<DpTableCell style={{ minWidth: '6rem' }} align="right">{appconsts.drpTtype[tableSkDrpField]}降雨</DpTableCell>
|
<DpTableCell style={{ minWidth: '8rem' }} align="center">{appconsts.drpTtype[tableSkDrpField]}降雨(mm)</DpTableCell>
|
||||||
<DpTableCell style={{ minWidth: '3rem' }} align="right">水位</DpTableCell>
|
<DpTableCell style={{ minWidth: '3rem' }} align="right">水位(m)</DpTableCell>
|
||||||
<DpTableCell style={{ minWidth: '4rem' }} align="right">超汛限</DpTableCell>
|
<DpTableCell style={{ minWidth: '6rem' }} align="right">超汛限(m)</DpTableCell>
|
||||||
</TableRow>
|
</TableRow>
|
||||||
</TableHead>
|
</TableHead>
|
||||||
<TableBody>
|
<TableBody>
|
||||||
{[...sortedData.filter(o=>o.rzState===1),...sortedData.filter(o=>o.rzState!==1)].map((row) => (
|
{[...sortedData.filter(o=>o.rzState===1)].map((row) => (
|
||||||
<DpTableRow key={row.stcd}>
|
<DpTableRow key={row.stcd} onClick={() => { flyTo(row); setSkLayer([row]) }}>
|
||||||
<DpTableCell component="th" scope="row">
|
<DpTableCell component="th" scope="row">
|
||||||
<div className="table-ellipsis cursor-pointer" onClick={() => flyTo(row)}>{row.rzState===1?row.stnm:row.stnm+'(离线)'}</div>
|
<div className="table-ellipsis cursor-pointer" >{row.rzState===1?row.stnm:row.stnm+'(离线)'}</div>
|
||||||
</DpTableCell>
|
</DpTableCell>
|
||||||
<DpTableCell align="right">{row['h24']}</DpTableCell>
|
<DpTableCell align="center">{row['h24']}</DpTableCell>
|
||||||
<DpTableCell align="right">{row?.rz}</DpTableCell>
|
<DpTableCell align="right">{row?.rz}</DpTableCell>
|
||||||
<DpTableCell align="right">{renderSkArz(row)}</DpTableCell>
|
<DpTableCell align="right">{renderSkArz(row)}</DpTableCell>
|
||||||
</DpTableRow>
|
</DpTableRow>
|
||||||
|
|
|
||||||
|
|
@ -43,12 +43,12 @@ const ljtj = [
|
||||||
{'level':'0.1~10',stcd:'006',color:'#edfce9',children:[
|
{'level':'0.1~10',stcd:'006',color:'#edfce9',children:[
|
||||||
{
|
{
|
||||||
"stcd": "61612910",
|
"stcd": "61612910",
|
||||||
"stnm": "铁门岗乡",
|
"stnm": "白果镇",
|
||||||
"adcd": "421181000000000",
|
"adcd": "421181000000000",
|
||||||
"wscd": null,
|
"wscd": null,
|
||||||
"importancy": 0,
|
"importancy": 0,
|
||||||
"lgtd": 115.087777777,
|
"lgtd": 115.01083,
|
||||||
"lttd": 31.164444444,
|
"lttd": 31.041152,
|
||||||
"elev": null,
|
"elev": null,
|
||||||
"hasRz": true,
|
"hasRz": true,
|
||||||
"type": "sh",
|
"type": "sh",
|
||||||
|
|
@ -57,7 +57,7 @@ const ljtj = [
|
||||||
"h3": 8.4,
|
"h3": 8.4,
|
||||||
"h6": 10.5,
|
"h6": 10.5,
|
||||||
"h12": 11.200000000000001,
|
"h12": 11.200000000000001,
|
||||||
"h24": 12.6,
|
"h24": 0.6,
|
||||||
"h48": 32.8,
|
"h48": 32.8,
|
||||||
"tm": "2025-06-03T02:10:00.000Z",
|
"tm": "2025-06-03T02:10:00.000Z",
|
||||||
"state": 1,
|
"state": 1,
|
||||||
|
|
@ -69,8 +69,8 @@ const ljtj = [
|
||||||
"adcd": "421181000000000",
|
"adcd": "421181000000000",
|
||||||
"wscd": null,
|
"wscd": null,
|
||||||
"importancy": 0,
|
"importancy": 0,
|
||||||
"lgtd": 114.798056,
|
"lgtd": 115.026944,
|
||||||
"lttd": 31.058611,
|
"lttd": 30.959121,
|
||||||
"elev": null,
|
"elev": null,
|
||||||
"hasRz": true,
|
"hasRz": true,
|
||||||
"type": "sh",
|
"type": "sh",
|
||||||
|
|
@ -79,7 +79,7 @@ const ljtj = [
|
||||||
"h3": 7.199999999999999,
|
"h3": 7.199999999999999,
|
||||||
"h6": 9,
|
"h6": 9,
|
||||||
"h12": 9.600000000000001,
|
"h12": 9.600000000000001,
|
||||||
"h24": 10.8,
|
"h24": 0.6,
|
||||||
"h48": 11.899999999999999,
|
"h48": 11.899999999999999,
|
||||||
"tm": "2025-06-03T02:00:00.000Z",
|
"tm": "2025-06-03T02:00:00.000Z",
|
||||||
"state": 1,
|
"state": 1,
|
||||||
|
|
@ -91,8 +91,8 @@ const ljtj = [
|
||||||
"adcd": "421181000000000",
|
"adcd": "421181000000000",
|
||||||
"wscd": null,
|
"wscd": null,
|
||||||
"importancy": 0,
|
"importancy": 0,
|
||||||
"lgtd": 115.339667,
|
"lgtd": 115.172808,
|
||||||
"lttd": 31.1595,
|
"lttd": 30.963342,
|
||||||
"elev": null,
|
"elev": null,
|
||||||
"hasRz": true,
|
"hasRz": true,
|
||||||
"type": "sh",
|
"type": "sh",
|
||||||
|
|
@ -101,7 +101,29 @@ const ljtj = [
|
||||||
"h3": 8.4,
|
"h3": 8.4,
|
||||||
"h6": 10.5,
|
"h6": 10.5,
|
||||||
"h12": 11.200000000000001,
|
"h12": 11.200000000000001,
|
||||||
"h24": 12.6,
|
"h24": 0.4,
|
||||||
|
"h48": 31.299999999999997,
|
||||||
|
"tm": "2025-06-03T02:00:00.000Z",
|
||||||
|
"state": 1,
|
||||||
|
"warning": 0
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"stcd": "616151210",
|
||||||
|
"stnm": "龟山镇",
|
||||||
|
"adcd": "421181000000000",
|
||||||
|
"wscd": null,
|
||||||
|
"importancy": 0,
|
||||||
|
"lgtd": 115.183208,
|
||||||
|
"lttd": 31.074978,
|
||||||
|
"elev": null,
|
||||||
|
"hasRz": true,
|
||||||
|
"type": "sh",
|
||||||
|
"today": 0,
|
||||||
|
"h1": 7,
|
||||||
|
"h3": 8.4,
|
||||||
|
"h6": 10.5,
|
||||||
|
"h12": 11.200000000000001,
|
||||||
|
"h24": 0.51,
|
||||||
"h48": 31.299999999999997,
|
"h48": 31.299999999999997,
|
||||||
"tm": "2025-06-03T02:00:00.000Z",
|
"tm": "2025-06-03T02:00:00.000Z",
|
||||||
"state": 1,
|
"state": 1,
|
||||||
|
|
@ -185,11 +207,11 @@ export default function AreaDrp({ style }) {
|
||||||
const flyTo = (record) => {
|
const flyTo = (record) => {
|
||||||
const { lgtd, lttd } = record;
|
const { lgtd, lttd } = record;
|
||||||
if (lgtd && lttd) {
|
if (lgtd && lttd) {
|
||||||
dispatch.runtime.setFeaturePop({ type: 'RealDrpPop', properties: record, coordinates: [lgtd, lttd] });
|
// dispatch.runtime.setFeaturePop({ type: 'RealDrpPop', properties: record, coordinates: [lgtd, lttd] });
|
||||||
dispatch.runtime.setCameraTarget({
|
dispatch.runtime.setCameraTarget({
|
||||||
center: [lgtd, lttd + config.poiPositionOffsetY.sk],
|
center: [lgtd, lttd ],
|
||||||
zoom: config.poiPositionZoom.sk,
|
zoom: 12,//12config.poiPositionZoom.sk,
|
||||||
pitch: config.poiPitch,
|
pitch: 0,//config.poiPitch,
|
||||||
bearing: 0,
|
bearing: 0,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
@ -277,7 +299,7 @@ export default function AreaDrp({ style }) {
|
||||||
row.children.map((i,index)=>(
|
row.children.map((i,index)=>(
|
||||||
<div style={{display:'flex', color:'#ffffff',padding:'10px 0',paddingLeft:"2.5rem",background:'#1c2439',width:'26.6rem'}}>
|
<div style={{display:'flex', color:'#ffffff',padding:'10px 0',paddingLeft:"2.5rem",background:'#1c2439',width:'26.6rem'}}>
|
||||||
<div style={{width:'13rem',textAlign:'center',cursor:'pointer'}} onClick={()=>{
|
<div style={{width:'13rem',textAlign:'center',cursor:'pointer'}} onClick={()=>{
|
||||||
// flyTo(i)
|
flyTo(i)
|
||||||
}}>{i.stnm}</div>
|
}}>{i.stnm}</div>
|
||||||
<div style={{width:'10rem',textAlign:'center'}}>{i.h24}</div>
|
<div style={{width:'10rem',textAlign:'center'}}>{i.h24}</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -32,6 +32,7 @@ const useStyles = makeStyles({
|
||||||
|
|
||||||
export default function AreaDrp({ style }) {
|
export default function AreaDrp({ style }) {
|
||||||
const classes = useStyles();
|
const classes = useStyles();
|
||||||
|
const [show,setShow] = useState(false)
|
||||||
const dispatch = useDispatch();
|
const dispatch = useDispatch();
|
||||||
const [tab,setTab] = useState('1')
|
const [tab,setTab] = useState('1')
|
||||||
useEffect(()=>{
|
useEffect(()=>{
|
||||||
|
|
@ -46,7 +47,18 @@ export default function AreaDrp({ style }) {
|
||||||
// dispatch.runtime.setLayerSetting({ planeArea: null });
|
// dispatch.runtime.setLayerSetting({ planeArea: null });
|
||||||
// dispatch.map.setLayerVisible({ ContourLayer: false });
|
// dispatch.map.setLayerVisible({ ContourLayer: false });
|
||||||
// }
|
// }
|
||||||
},[tab])
|
const map = window.__mapref
|
||||||
|
if(map){
|
||||||
|
map.setLayoutProperty('网格雨量', 'visibility', show?'visible':'none');
|
||||||
|
}
|
||||||
|
|
||||||
|
return ()=>{
|
||||||
|
const map = window.__mapref
|
||||||
|
if(map){
|
||||||
|
map.setLayoutProperty('网格雨量', 'visibility', 'none');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},[show])
|
||||||
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|
@ -54,6 +66,13 @@ export default function AreaDrp({ style }) {
|
||||||
style={style}
|
style={style}
|
||||||
title="天气预报"
|
title="天气预报"
|
||||||
color="blue"
|
color="blue"
|
||||||
|
extra={
|
||||||
|
<>
|
||||||
|
<div style={{color:show?"#29b6f6":'#ffffff',marginTop:"0.1rem",cursor:'pointer'}} onClick={()=>{
|
||||||
|
setShow(!show)
|
||||||
|
}}>显示网格</div>
|
||||||
|
</>
|
||||||
|
}
|
||||||
>
|
>
|
||||||
<div className={classes.root} style={{marginBottom:'-1.5rem'}}>
|
<div className={classes.root} style={{marginBottom:'-1.5rem'}}>
|
||||||
<Grid container className={classes.tool}>
|
<Grid container className={classes.tool}>
|
||||||
|
|
|
||||||
|
|
@ -2003,12 +2003,12 @@ const ljtj = [
|
||||||
{'level':'0.1~10',stcd:'006',color:'#edfce9',children:[
|
{'level':'0.1~10',stcd:'006',color:'#edfce9',children:[
|
||||||
{
|
{
|
||||||
"stcd": "61612910",
|
"stcd": "61612910",
|
||||||
"stnm": "铁门岗乡",
|
"stnm": "白果镇",
|
||||||
"adcd": "421181000000000",
|
"adcd": "421181000000000",
|
||||||
"wscd": null,
|
"wscd": null,
|
||||||
"importancy": 0,
|
"importancy": 0,
|
||||||
"lgtd": 115.087777777,
|
"lgtd": 115.01083,
|
||||||
"lttd": 31.164444444,
|
"lttd": 31.041152,
|
||||||
"elev": null,
|
"elev": null,
|
||||||
"hasRz": true,
|
"hasRz": true,
|
||||||
"type": "sh",
|
"type": "sh",
|
||||||
|
|
@ -2017,7 +2017,7 @@ const ljtj = [
|
||||||
"h3": 8.4,
|
"h3": 8.4,
|
||||||
"h6": 10.5,
|
"h6": 10.5,
|
||||||
"h12": 11.200000000000001,
|
"h12": 11.200000000000001,
|
||||||
"h24": 12.6,
|
"h24": 0.6,
|
||||||
"h48": 32.8,
|
"h48": 32.8,
|
||||||
"tm": "2025-06-03T02:10:00.000Z",
|
"tm": "2025-06-03T02:10:00.000Z",
|
||||||
"state": 1,
|
"state": 1,
|
||||||
|
|
@ -2029,8 +2029,8 @@ const ljtj = [
|
||||||
"adcd": "421181000000000",
|
"adcd": "421181000000000",
|
||||||
"wscd": null,
|
"wscd": null,
|
||||||
"importancy": 0,
|
"importancy": 0,
|
||||||
"lgtd": 114.798056,
|
"lgtd": 115.026944,
|
||||||
"lttd": 31.058611,
|
"lttd": 30.959121,
|
||||||
"elev": null,
|
"elev": null,
|
||||||
"hasRz": true,
|
"hasRz": true,
|
||||||
"type": "sh",
|
"type": "sh",
|
||||||
|
|
@ -2039,7 +2039,7 @@ const ljtj = [
|
||||||
"h3": 7.199999999999999,
|
"h3": 7.199999999999999,
|
||||||
"h6": 9,
|
"h6": 9,
|
||||||
"h12": 9.600000000000001,
|
"h12": 9.600000000000001,
|
||||||
"h24": 10.8,
|
"h24": 0.6,
|
||||||
"h48": 11.899999999999999,
|
"h48": 11.899999999999999,
|
||||||
"tm": "2025-06-03T02:00:00.000Z",
|
"tm": "2025-06-03T02:00:00.000Z",
|
||||||
"state": 1,
|
"state": 1,
|
||||||
|
|
@ -2051,8 +2051,8 @@ const ljtj = [
|
||||||
"adcd": "421181000000000",
|
"adcd": "421181000000000",
|
||||||
"wscd": null,
|
"wscd": null,
|
||||||
"importancy": 0,
|
"importancy": 0,
|
||||||
"lgtd": 115.339667,
|
"lgtd": 115.172808,
|
||||||
"lttd": 31.1595,
|
"lttd": 30.963342,
|
||||||
"elev": null,
|
"elev": null,
|
||||||
"hasRz": true,
|
"hasRz": true,
|
||||||
"type": "sh",
|
"type": "sh",
|
||||||
|
|
@ -2061,7 +2061,29 @@ const ljtj = [
|
||||||
"h3": 8.4,
|
"h3": 8.4,
|
||||||
"h6": 10.5,
|
"h6": 10.5,
|
||||||
"h12": 11.200000000000001,
|
"h12": 11.200000000000001,
|
||||||
"h24": 12.6,
|
"h24": 0.4,
|
||||||
|
"h48": 31.299999999999997,
|
||||||
|
"tm": "2025-06-03T02:00:00.000Z",
|
||||||
|
"state": 1,
|
||||||
|
"warning": 0
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"stcd": "616151210",
|
||||||
|
"stnm": "龟山镇",
|
||||||
|
"adcd": "421181000000000",
|
||||||
|
"wscd": null,
|
||||||
|
"importancy": 0,
|
||||||
|
"lgtd": 115.183208,
|
||||||
|
"lttd": 31.074978,
|
||||||
|
"elev": null,
|
||||||
|
"hasRz": true,
|
||||||
|
"type": "sh",
|
||||||
|
"today": 0,
|
||||||
|
"h1": 7,
|
||||||
|
"h3": 8.4,
|
||||||
|
"h6": 10.5,
|
||||||
|
"h12": 11.200000000000001,
|
||||||
|
"h24": 0.51,
|
||||||
"h48": 31.299999999999997,
|
"h48": 31.299999999999997,
|
||||||
"tm": "2025-06-03T02:00:00.000Z",
|
"tm": "2025-06-03T02:00:00.000Z",
|
||||||
"state": 1,
|
"state": 1,
|
||||||
|
|
@ -2081,11 +2103,11 @@ export default function AreaDrp({ style }) {
|
||||||
const flyTo = (record) => {
|
const flyTo = (record) => {
|
||||||
const { lgtd, lttd } = record;
|
const { lgtd, lttd } = record;
|
||||||
if (lgtd && lttd) {
|
if (lgtd && lttd) {
|
||||||
dispatch.runtime.setFeaturePop({ type: 'RealDrpPop', properties: record, coordinates: [lgtd, lttd] });
|
// dispatch.runtime.setFeaturePop({ type: 'RealDrpPop', properties: record, coordinates: [lgtd, lttd] });
|
||||||
dispatch.runtime.setCameraTarget({
|
dispatch.runtime.setCameraTarget({
|
||||||
center: [lgtd, lttd + config.poiPositionOffsetY.sk],
|
center: [lgtd, lttd],
|
||||||
zoom: config.poiPositionZoom.sk,
|
zoom: 12,//config.poiPositionZoom.sk,
|
||||||
pitch: config.poiPitch,
|
pitch: 0,
|
||||||
bearing: 0,
|
bearing: 0,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
@ -2348,7 +2370,7 @@ export default function AreaDrp({ style }) {
|
||||||
row.children.map((i,index)=>(
|
row.children.map((i,index)=>(
|
||||||
<div style={{display:'flex', color:'#ffffff',padding:'10px 0',paddingLeft:"2.5rem",background:'#1c2439',width:'26.6rem'}}>
|
<div style={{display:'flex', color:'#ffffff',padding:'10px 0',paddingLeft:"2.5rem",background:'#1c2439',width:'26.6rem'}}>
|
||||||
<div style={{width:'13rem',textAlign:'center',cursor:'pointer'}} onClick={()=>{
|
<div style={{width:'13rem',textAlign:'center',cursor:'pointer'}} onClick={()=>{
|
||||||
// flyTo(i)
|
flyTo(i)
|
||||||
}}>{i.stnm}</div>
|
}}>{i.stnm}</div>
|
||||||
<div style={{width:'10rem',textAlign:'center'}}>{i.h24}</div>
|
<div style={{width:'10rem',textAlign:'center'}}>{i.h24}</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -97,7 +97,7 @@ function DrpReal({ style }) {
|
||||||
'type': 'line',
|
'type': 'line',
|
||||||
'source': {
|
'source': {
|
||||||
'type': 'geojson',
|
'type': 'geojson',
|
||||||
'data': `${window.location.origin}/data3/line2.geojson`
|
'data': `${window.location.origin+process.env.PUBLIC_URL}/data3/line2.geojson`
|
||||||
},
|
},
|
||||||
'layout': {
|
'layout': {
|
||||||
'line-join': 'round'
|
'line-join': 'round'
|
||||||
|
|
|
||||||
|
|
@ -228,7 +228,7 @@ function HDReal({ style }) {
|
||||||
{
|
{
|
||||||
show?
|
show?
|
||||||
<div style={{position:'absolute',top:'-45px',left:'-380px', width:'364px', height:'220px',padding:'10px',background:'rgb(2, 12, 43)'}}>
|
<div style={{position:'absolute',top:'-45px',left:'-380px', width:'364px', height:'220px',padding:'10px',background:'rgb(2, 12, 43)'}}>
|
||||||
<img width={'100%'} height={'100%'} src='/assets/ce.png' />
|
<img width={'100%'} height={'100%'} src={process.env.PUBLIC_URL+'/assets/ce.png'} />
|
||||||
</div>
|
</div>
|
||||||
:null
|
:null
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -228,15 +228,15 @@ const householdData = [
|
||||||
</Typography>
|
</Typography>
|
||||||
<div style={{ display: 'flex', justifyContent: 'center', flexWrap: 'wrap', columnGap: 40 }}>
|
<div style={{ display: 'flex', justifyContent: 'center', flexWrap: 'wrap', columnGap: 40 }}>
|
||||||
<div style={{ padding: 10, width: 130, background: "linear-gradient(to bottom, #001529, #003366)" }}>
|
<div style={{ padding: 10, width: 130, background: "linear-gradient(to bottom, #001529, #003366)" }}>
|
||||||
<div className="value" style={{ color: '#5ecd45' }}>35</div>
|
<div className="value" style={{ color: '#5ecd45' }}>794</div>
|
||||||
<div className="key" style={{ color: '#fff', fontSize: 16 }}>危险区面积</div>
|
<div className="key" style={{ color: '#fff', fontSize: 16 }}>危险区面积(m²)</div>
|
||||||
</div>
|
</div>
|
||||||
<div style={{ padding: 10, width: 130, background: "linear-gradient(to bottom, #001529, #003366)" }}>
|
<div style={{ padding: 10, width: 130, background: "linear-gradient(to bottom, #001529, #003366)" }}>
|
||||||
<div className="value" style={{ color: '#5ecd45' }}>35</div>
|
<div className="value" style={{ color: '#5ecd45' }}>8</div>
|
||||||
<div className="key" style={{ color: '#fff', fontSize: 16 }}>危险区户数</div>
|
<div className="key" style={{ color: '#fff', fontSize: 16 }}>危险区户数</div>
|
||||||
</div>
|
</div>
|
||||||
<div style={{ padding: 10, width: 130, background: "linear-gradient(to bottom, #001529, #003366)" }}>
|
<div style={{ padding: 10, width: 130, background: "linear-gradient(to bottom, #001529, #003366)" }}>
|
||||||
<div className="value" style={{ color: '#5ecd45' }}>35</div>
|
<div className="value" style={{ color: '#5ecd45' }}>8</div>
|
||||||
<div className="key" style={{ color: '#fff', fontSize: 16 }}>风险点(个)</div>
|
<div className="key" style={{ color: '#fff', fontSize: 16 }}>风险点(个)</div>
|
||||||
</div>
|
</div>
|
||||||
<div style={{ padding: 10, width: 130, background: "linear-gradient(to bottom, #001529, #003366)" }}>
|
<div style={{ padding: 10, width: 130, background: "linear-gradient(to bottom, #001529, #003366)" }}>
|
||||||
|
|
@ -244,7 +244,7 @@ const householdData = [
|
||||||
className="value"
|
className="value"
|
||||||
style={{ cursor: 'pointer', color: '#5ecd45' }}
|
style={{ cursor: 'pointer', color: '#5ecd45' }}
|
||||||
>
|
>
|
||||||
15
|
32
|
||||||
</div>
|
</div>
|
||||||
<div className="key" style={{ color: '#fff', fontSize: 16 }}>危险区人口(人)</div>
|
<div className="key" style={{ color: '#fff', fontSize: 16 }}>危险区人口(人)</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -256,11 +256,11 @@ const householdData = [
|
||||||
<div className="info-row">
|
<div className="info-row">
|
||||||
<div className="info-item">
|
<div className="info-item">
|
||||||
<span className="label">威胁对象:</span>
|
<span className="label">威胁对象:</span>
|
||||||
<span className="value">18</span>
|
<span className="value">8</span>
|
||||||
</div>
|
</div>
|
||||||
<div className="info-item">
|
<div className="info-item">
|
||||||
<span className="label">威胁人口:</span>
|
<span className="label">威胁人口:</span>
|
||||||
<span className="value">75</span>
|
<span className="value">32</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="info-item">
|
<div className="info-item">
|
||||||
|
|
|
||||||
|
|
@ -15,7 +15,7 @@ function DrpReal({ style }) {
|
||||||
// </>
|
// </>
|
||||||
// }
|
// }
|
||||||
>
|
>
|
||||||
<img src='/assets/组 8.png' style={{width:'26rem',marginLeft:'8px',marginTop:'0.8rem'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/组 8.png'} style={{width:'26rem',marginLeft:'8px',marginTop:'0.8rem'}}/>
|
||||||
</PanelBox>
|
</PanelBox>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -10,12 +10,12 @@ function DrpReal({ style }) {
|
||||||
color="green"
|
color="green"
|
||||||
extra={
|
extra={
|
||||||
<>
|
<>
|
||||||
<img src='/assets/镇下拉.jpg' style={{width:'100px', height:'30px',marginRight:'10px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/镇下拉.jpg'} style={{width:'100px', height:'30px',marginRight:'10px'}}/>
|
||||||
<img src='/assets/水厂切换.jpg' style={{width:'165px', height:'20px',marginRight:'5px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/水厂切换.jpg'} style={{width:'165px', height:'20px',marginRight:'5px'}}/>
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
<img src='/assets/药耗分析.jpg' style={{width:'26rem', height:'17.5rem',marginLeft:'8px'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/药耗分析.jpg'} style={{width:'26rem', height:'17.5rem',marginLeft:'8px'}}/>
|
||||||
</PanelBox>
|
</PanelBox>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -15,7 +15,7 @@ function DrpReal({ style }) {
|
||||||
// </>
|
// </>
|
||||||
// }
|
// }
|
||||||
>
|
>
|
||||||
<img src='/assets/组 4.png' style={{width:'23rem',marginLeft:'1.7rem',marginTop:'1rem'}}/>
|
<img src={process.env.PUBLIC_URL+'/assets/组 4.png'} style={{width:'23rem',marginLeft:'1.7rem',marginTop:'1rem'}}/>
|
||||||
</PanelBox>
|
</PanelBox>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -49,7 +49,7 @@ function DrpReal({ style }) {
|
||||||
return (
|
return (
|
||||||
<PanelBox
|
<PanelBox
|
||||||
style={style}
|
style={style}
|
||||||
title="雨情"
|
title="重点关注水情"
|
||||||
color="green"
|
color="green"
|
||||||
tabs={
|
tabs={
|
||||||
<>
|
<>
|
||||||
|
|
|
||||||
|
|
@ -8,21 +8,136 @@ import TableBody from '@material-ui/core/TableBody';
|
||||||
import TableHead from '@material-ui/core/TableHead';
|
import TableHead from '@material-ui/core/TableHead';
|
||||||
import TableRow from '@material-ui/core/TableRow';
|
import TableRow from '@material-ui/core/TableRow';
|
||||||
import DpTableCell from '../../../../layouts/mui/DpTableCell';
|
import DpTableCell from '../../../../layouts/mui/DpTableCell';
|
||||||
|
import { useDispatch, useSelector } from 'react-redux';
|
||||||
import DpTableRow from '../../../../layouts/mui/DpTableRow';
|
import DpTableRow from '../../../../layouts/mui/DpTableRow';
|
||||||
import appconsts from '../../../../models/appconsts';
|
import appconsts from '../../../../models/appconsts';
|
||||||
import { renderDrp, renderSkArz, renderSkRz } from '../../../../utils/renutils';
|
import { renderDrp, renderSkArz, renderSkRz } from '../../../../utils/renutils';
|
||||||
|
|
||||||
|
|
||||||
const data = [
|
const data = [
|
||||||
{ name:'宋埠镇', name2:'项生(宋埠)', name3:'675.49', name4:'680.23', name5:'692.17' },
|
{ name:'宋埠镇', name2:'项生(宋埠)', name3:'21.84', name4:'25.24', name5:'26.23',data: {
|
||||||
{ name:'黄土岗镇', name2:'鹰山畈(黄土岗)', name3:'692.92', name4:'710.29', name5:'728.38' },
|
"stcd": "61614460",
|
||||||
|
"stnm": "项生(宋埠)",
|
||||||
|
"adcd": "421181000000000",
|
||||||
|
"wscd": null,
|
||||||
|
"importancy": 0,
|
||||||
|
"lgtd": 114.798056,
|
||||||
|
"lttd": 31.058611,
|
||||||
|
"elev": null,
|
||||||
|
"hasRz": true,
|
||||||
|
"wrz": null,
|
||||||
|
"wrq": null,
|
||||||
|
"grz": null,
|
||||||
|
"grq": null,
|
||||||
|
"sfz": null,
|
||||||
|
"sfq": null,
|
||||||
|
"type": "sh",
|
||||||
|
"tm": "2025-06-06T22:00:00.000Z",
|
||||||
|
"rz": 21.84,
|
||||||
|
"trend": -1,
|
||||||
|
"state": 1,
|
||||||
|
"warning": 0,
|
||||||
|
"maxRz": 21.9,
|
||||||
|
"maxDate": "2025-06-06T04:30:00.000Z",
|
||||||
|
"warndes": null
|
||||||
|
}},
|
||||||
|
{ name:'黄土岗镇', name2:'鹰山畈(黄土岗)', name3:'76.99', name4:'78.21', name5:'82.64',data:{
|
||||||
|
"stcd": "61612150",
|
||||||
|
"stnm": "鹰山畈(黄土岗)",
|
||||||
|
"adcd": "421181000000000",
|
||||||
|
"wscd": null,
|
||||||
|
"importancy": 0,
|
||||||
|
"lgtd": 115.073611,
|
||||||
|
"lttd": 31.386667,
|
||||||
|
"elev": null,
|
||||||
|
"hasRz": true,
|
||||||
|
"wrz": null,
|
||||||
|
"wrq": null,
|
||||||
|
"grz": null,
|
||||||
|
"grq": null,
|
||||||
|
"sfz": null,
|
||||||
|
"sfq": null,
|
||||||
|
"type": "sh",
|
||||||
|
"tm": "2025-06-06T22:00:00.000Z",
|
||||||
|
"rz": 76.99,
|
||||||
|
"trend": 1,
|
||||||
|
"state": 1,
|
||||||
|
"warning": 0,
|
||||||
|
"maxRz": 76.99,
|
||||||
|
"maxDate": "2025-06-05T17:25:00.000Z",
|
||||||
|
"warndes": null
|
||||||
|
}},
|
||||||
]
|
]
|
||||||
const data2 = [
|
const data2 = [
|
||||||
{ name:'阎家河', name2:'桃林河(阎河)', name3:'609.78', name4:'603.20', name5:'639.21' },
|
{ name:'阎家河', name2:'桃林河(阎河)', name3:'55.67', name4:'58.12', name5:'60.52',data:{
|
||||||
{ name:'巴水', name2:'杨梅河(木子店)', name3:'509.53', name4:'539.20', name5:'558.29' },
|
"stcd": "61612910",
|
||||||
|
"stnm": "桃林河(阎河)",
|
||||||
|
"adcd": "421181000000000",
|
||||||
|
"wscd": null,
|
||||||
|
"importancy": 0,
|
||||||
|
"lgtd": 115.087777777,
|
||||||
|
"lttd": 31.164444444,
|
||||||
|
"elev": null,
|
||||||
|
"hasRz": true,
|
||||||
|
"wrz": null,
|
||||||
|
"wrq": null,
|
||||||
|
"grz": null,
|
||||||
|
"grq": null,
|
||||||
|
"sfz": null,
|
||||||
|
"sfq": null,
|
||||||
|
"type": "sh",
|
||||||
|
"tm": "2025-06-06T22:15:00.000Z",
|
||||||
|
"rz": 55.67,
|
||||||
|
"trend": 0,
|
||||||
|
"state": 1,
|
||||||
|
"warning": 0,
|
||||||
|
"maxRz": 55.67,
|
||||||
|
"maxDate": "2025-06-06T02:05:00.000Z",
|
||||||
|
"warndes": null
|
||||||
|
} },
|
||||||
|
{ name:'巴水', name2:'杨梅河(木子店)', name3:'112.71', name4:'120.31', name5:'130.12',data:{
|
||||||
|
"stcd": "61615110",
|
||||||
|
"stnm": "杨梅河(木子店)",
|
||||||
|
"adcd": "421181000000000",
|
||||||
|
"wscd": null,
|
||||||
|
"importancy": 0,
|
||||||
|
"lgtd": 115.339667,
|
||||||
|
"lttd": 31.1595,
|
||||||
|
"elev": null,
|
||||||
|
"hasRz": true,
|
||||||
|
"wrz": null,
|
||||||
|
"wrq": null,
|
||||||
|
"grz": null,
|
||||||
|
"grq": null,
|
||||||
|
"sfz": null,
|
||||||
|
"sfq": null,
|
||||||
|
"type": "sh",
|
||||||
|
"tm": "2025-06-06T22:15:00.000Z",
|
||||||
|
"rz": 112.71,
|
||||||
|
"trend": 0,
|
||||||
|
"state": 1,
|
||||||
|
"warning": 0,
|
||||||
|
"maxRz": 112.71,
|
||||||
|
"maxDate": "2025-06-06T14:05:00.000Z",
|
||||||
|
"warndes": null
|
||||||
|
}},
|
||||||
]
|
]
|
||||||
|
|
||||||
function Page({ tab }) {
|
function Page({ tab }) {
|
||||||
|
const dispatch = useDispatch();
|
||||||
|
|
||||||
|
const flyTo = (row) => {
|
||||||
|
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: 50,
|
||||||
|
bearing: 0
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<TableContainer style={{ height: '12rem' }}>
|
<TableContainer style={{ height: '12rem' }}>
|
||||||
|
|
@ -39,10 +154,10 @@ function Page({ tab }) {
|
||||||
<TableBody>
|
<TableBody>
|
||||||
{(tab==='1'?data:data2).map((row) => (
|
{(tab==='1'?data:data2).map((row) => (
|
||||||
<DpTableRow key={row.name}>
|
<DpTableRow key={row.name}>
|
||||||
|
<DpTableCell align="center">{row.name}</DpTableCell>
|
||||||
<DpTableCell component="th" scope="row">
|
<DpTableCell component="th" scope="row">
|
||||||
<div className="table-ellipsis cursor-pointer" onClick={() => {}}>{row.name}</div>
|
<div className="table-ellipsis cursor-pointer" onClick={() => {flyTo(row.data)}}>{row.name2}</div>
|
||||||
</DpTableCell>
|
</DpTableCell>
|
||||||
<DpTableCell align="center">{row.name2}</DpTableCell>
|
|
||||||
<DpTableCell align="center">{row.name3}</DpTableCell>
|
<DpTableCell align="center">{row.name3}</DpTableCell>
|
||||||
<DpTableCell align="center">{row.name4}</DpTableCell>
|
<DpTableCell align="center">{row.name4}</DpTableCell>
|
||||||
<DpTableCell align="center">{row.name5}</DpTableCell>
|
<DpTableCell align="center">{row.name5}</DpTableCell>
|
||||||
|
|
|
||||||
|
|
@ -16,7 +16,7 @@ function DrpReal({ style }) {
|
||||||
'type': 'line',
|
'type': 'line',
|
||||||
'source': {
|
'source': {
|
||||||
'type': 'geojson',
|
'type': 'geojson',
|
||||||
'data': `${window.location.origin}/data3/line1.geojson`
|
'data': `${window.location.origin+process.env.PUBLIC_URL}/data3/line1.geojson`
|
||||||
},
|
},
|
||||||
'layout': {
|
'layout': {
|
||||||
'line-join': 'round'
|
'line-join': 'round'
|
||||||
|
|
@ -83,7 +83,7 @@ function DrpReal({ style }) {
|
||||||
title="站点统计"
|
title="站点统计"
|
||||||
color="green"
|
color="green"
|
||||||
>
|
>
|
||||||
<img src='/assets/站点统计.jpg' style={{width:'27rem',marginLeft:'0rem',marginTop:'0rem'}} onClick={()=>{
|
<img src={process.env.PUBLIC_URL+'/assets/站点统计.jpg'} style={{width:'27rem',marginLeft:'0rem',marginTop:'0rem'}} onClick={()=>{
|
||||||
// setSkLayer1()
|
// setSkLayer1()
|
||||||
}}/>
|
}}/>
|
||||||
</PanelBox>
|
</PanelBox>
|
||||||
|
|
|
||||||
|
|
@ -76,7 +76,7 @@ function Login() {
|
||||||
<div className="logo-container">
|
<div className="logo-container">
|
||||||
<video
|
<video
|
||||||
style={{ objectFit: 'cover' }}
|
style={{ objectFit: 'cover' }}
|
||||||
src="/assets/logo.mp4"
|
src={process.env.PUBLIC_URL+"/assets/logo.mp4"}
|
||||||
objectfit="true"
|
objectfit="true"
|
||||||
autoPlay
|
autoPlay
|
||||||
muted
|
muted
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue