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

Compare commits

base: lishenfeng:ef0ed5e310b49179b0dec4cbba6527370c724543
Branches Tags
lishenfeng:master
lishenfeng:qzc-dev
lishenfeng:lsf-dev
...
compare: lishenfeng:99d9008627dcad6344cef02439b7a72d46188c67
Branches Tags
lishenfeng:master
lishenfeng:qzc-dev
lishenfeng:lsf-dev

12 Commits
ef0ed5e310 ... 99d9008627

Author SHA1 Message Date
秦子超 99d9008627 合并 2025-06-11 11:31:37 +08:00
秦子超 8e75910321 修改水库切换 2025-06-11 11:29:32 +08:00
李神峰 c4f7e31f30 merge: 解决冲突 2025-06-11 11:15:43 +08:00
李神峰 6218cd032b feat(): 水库防汛调度开发 2025-06-11 11:10:37 +08:00
秦子超 8fafed3199 合并代码 2025-06-11 11:08:39 +08:00
秦子超 475f551507 修改水库切换逻辑 2025-06-11 11:08:10 +08:00
李神峰 4508e5d59c merge: 合并冲突 2025-06-10 13:55:27 +08:00
李神峰 75c5ba9690 feat():修改水库 2025-06-10 13:53:14 +08:00
秦子超 b379a58cc8 修改数据 2025-06-10 13:52:31 +08:00
秦子超 69e11dad51 合并 2025-06-09 16:27:41 +08:00
秦子超 3fabf984a6 :wq 
Merge branch 'master' of http://10.0.41.100:3000/lishenfeng/mcfxkh-Web
 2025-06-09 16:26:02 +08:00
李神峰 0be79dd7c3 feat(): 水厂报警列表开发 2025-06-09 16:24:57 +08:00
58 changed files with 5146 additions and 1925 deletions
Show Stats Expand all files Collapse all files

1
public/assets/icon/中型水库.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1749537394241" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2581" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M0 511.936008a511.936008 511.936008 0 1 0 511.936008-511.936008 511.936008 511.936008 0 0 0-511.936008 511.936008z" fill="#00B4FF" p-id="2582"></path><path d="M511.936008 475.204599h426.647469c0-219.850919-191.054518-398.132633-426.647469-398.132633S85.160555 255.353681 85.160555 475.204599z" fill="#FFFFFF" p-id="2583"></path></svg>
Side by Side

After

Width:  |  Height:  |  Size: 667 B

6
public/assets/icon/大型水库.svg Normal file
View File

@ -0,0 +1,6 @@
<?xml version="1.0" encoding="utf-8"?>
<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="20px" height="20px" xmlns="http://www.w3.org/2000/svg">
<g transform="matrix(1 0 0 1 -51 -179 )">
<path d="M 20 10 C 20 4.47715250169207 15.5228474983079 0 10 0 C 4.47715250169207 0 0 4.47715250169207 0 10 C 0 15.5228474983079 4.47715250169207 20 10 20 C 15.5228474983079 20 20 15.5228474983079 20 10 Z M 1.4285 10 C 1.4285 5.26609126682536 5.26609126682536 1.4285 10 1.4285 L 10 10 L 1.4285 10 Z " fill-rule="nonzero" fill="#00b4ff" stroke="none" transform="matrix(1 0 0 1 51 179 )" />
</g>
</svg>

BIN
public/assets/icon/展开.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.0 KiB

BIN
public/assets/icon/收起.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.3 KiB

BIN
public/assets/loushun.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 46 KiB

BIN
public/assets/lsyy.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 107 KiB

After

Width:  |  Height:  |  Size: 107 KiB

1642
public/data3/drpReal.json
View File

File diff suppressed because it is too large Load Diff

54
public/data3/hdReal.json
View File

@ -16,13 +16,13 @@
"sfz": null, "sfz": null,
"sfq": null, "sfq": null,
"type": "sh", "type": "sh",
"tm": "2025-06-08T03:00:00.000Z", "tm": "2025-06-06T22:00:00.000Z",
"rz": 77.24, "rz": 76.99,
"trend": 0, "trend": 1,
"state": 1, "state": 1,
"warning": 0, "warning": 0,
"maxRz": 77.35, "maxRz": 76.99,
"maxDate": "2025-06-07T16:05:00.000Z", "maxDate": "2025-06-05T17:25:00.000Z",
"warndes": null "warndes": null
}, },
{ {
@ -42,13 +42,13 @@
"sfz": null, "sfz": null,
"sfq": null, "sfq": null,
"type": "sh", "type": "sh",
"tm": "2025-06-08T03:05:00.000Z", "tm": "2025-06-06T22:15:00.000Z",
"rz": 55.66, "rz": 55.67,
"trend": 0, "trend": 0,
"state": 1, "state": 1,
"warning": 0, "warning": 0,
"maxRz": 55.67, "maxRz": 55.67,
"maxDate": "2025-06-07T19:30:00.000Z", "maxDate": "2025-06-06T02:05:00.000Z",
"warndes": null "warndes": null
}, },
{ {
@ -68,13 +68,13 @@
"sfz": null, "sfz": null,
"sfq": null, "sfq": null,
"type": "sh", "type": "sh",
"tm": "2025-06-08T03:00:00.000Z", "tm": "2025-06-06T22:00:00.000Z",
"rz": 27.57, "rz": 27.57,
"trend": 0, "trend": 0,
"state": 1, "state": 1,
"warning": 0, "warning": 0,
"maxRz": 27.57, "maxRz": 27.57,
"maxDate": "2025-06-07T22:35:00.000Z", "maxDate": "2025-06-05T17:50:00.000Z",
"warndes": null "warndes": null
}, },
{ {
@ -94,13 +94,13 @@
"sfz": null, "sfz": null,
"sfq": null, "sfq": null,
"type": "sh", "type": "sh",
"tm": "2025-06-08T03:00:00.000Z", "tm": "2025-06-06T22:00:00.000Z",
"rz": 21.87, "rz": 21.84,
"trend": 1, "trend": -1,
"state": 1, "state": 1,
"warning": 0, "warning": 0,
"maxRz": 21.94, "maxRz": 21.9,
"maxDate": "2025-06-07T16:00:00.000Z", "maxDate": "2025-06-06T04:30:00.000Z",
"warndes": null "warndes": null
}, },
{ {
@ -120,13 +120,13 @@
"sfz": null, "sfz": null,
"sfq": null, "sfq": null,
"type": "sh", "type": "sh",
"tm": "2025-06-08T03:00:00.000Z", "tm": "2025-06-06T22:15:00.000Z",
"rz": 112.71, "rz": 112.71,
"trend": 0, "trend": 0,
"state": 1, "state": 1,
"warning": 0, "warning": 0,
"maxRz": 112.71, "maxRz": 112.71,
"maxDate": "2025-06-08T00:10:00.000Z", "maxDate": "2025-06-06T14:05:00.000Z",
"warndes": null "warndes": null
}, },
{ {
@ -140,8 +140,8 @@
"elev": null, "elev": null,
"hasRz": true, "hasRz": true,
"type": "sw", "type": "sw",
"tm": "2025-06-08T03:00:00.000Z", "tm": "2025-06-06T22:00:00.000Z",
"rz": 52.85, "rz": 52.44,
"state": 1 "state": 1
}, },
{ {
@ -155,8 +155,8 @@
"elev": null, "elev": null,
"hasRz": true, "hasRz": true,
"type": "sw", "type": "sw",
"tm": "2025-06-08T03:00:00.000Z", "tm": "2025-06-06T22:00:00.000Z",
"rz": 51.432, "rz": 51.387,
"state": 1 "state": 1
}, },
{ {
@ -170,7 +170,7 @@
"elev": null, "elev": null,
"hasRz": true, "hasRz": true,
"type": "sw", "type": "sw",
"tm": "2025-06-08T03:00:00.000Z", "tm": "2025-06-06T22:00:00.000Z",
"rz": 73.37, "rz": 73.37,
"state": 1 "state": 1
}, },
@ -185,8 +185,8 @@
"elev": null, "elev": null,
"hasRz": true, "hasRz": true,
"type": "sw", "type": "sw",
"tm": "2025-06-08T03:00:00.000Z", "tm": "2025-06-06T22:00:00.000Z",
"rz": 61.98, "rz": 61.59,
"state": 1 "state": 1
}, },
{ {
@ -200,8 +200,8 @@
"elev": null, "elev": null,
"hasRz": true, "hasRz": true,
"type": "sw", "type": "sw",
"tm": "2025-06-08T03:00:00.000Z", "tm": "2025-06-06T21:00:00.000Z",
"rz": 134.21, "rz": 133.89,
"state": 1 "state": 1
}, },
{ {
@ -215,7 +215,7 @@
"elev": null, "elev": null,
"hasRz": true, "hasRz": true,
"type": "sw", "type": "sw",
"tm": "2025-06-08T03:00:00.000Z", "tm": "2025-06-06T22:00:00.000Z",
"rz": 43.6, "rz": 43.6,
"state": 1 "state": 1
} }

657
public/data3/overall.json
View File

@ -1,6 +1,6 @@
{ {
"tm2": "08日11时", "tm2": "07日6时",
"tm1": "07日11时", "tm1": "06日6时",
"drpInfo": { "drpInfo": {
"stCount": { "stCount": {
"total": 379, "total": 379,
@ -12,85 +12,85 @@
}, },
"h1": { "h1": {
"drpStCount": { "drpStCount": {
"total": 75, "total": 98,
"sh": 15, "sh": 34,
"sw": 22, "sw": 25,
"sk": 5, "sk": 6,
"qx": 33 "qx": 33
}, },
"max": { "max": {
"value": 7.5, "value": 50.2,
"stnm": "芭茅河水库", "stnm": "福田河",
"stcd": "61612580", "stcd": "Q9111",
"type": "sk" "type": "qx"
}, },
"cntDrp10": 75, "cntDrp10": 41,
"cntDrp25": 0, "cntDrp25": 37,
"cntDrp50": 0, "cntDrp50": 18,
"cntDrp100": 0, "cntDrp100": 2,
"cntDrp250": 0, "cntDrp250": 0,
"cntDrpg250": 0 "cntDrpg250": 0
}, },
"h3": { "h3": {
"drpStCount": { "drpStCount": {
"total": 91, "total": 99,
"sh": 31, "sh": 35,
"sw": 22, "sw": 25,
"sk": 5, "sk": 6,
"qx": 33 "qx": 33
}, },
"max": { "max": {
"value": 14.3, "value": 50.3,
"stnm": "下白米", "stnm": "福田河",
"stcd": "Q9123", "stcd": "Q9111",
"type": "qx" "type": "qx"
}, },
"cntDrp10": 83, "cntDrp10": 38,
"cntDrp25": 8, "cntDrp25": 35,
"cntDrp50": 0, "cntDrp50": 21,
"cntDrp100": 0, "cntDrp100": 5,
"cntDrp250": 0, "cntDrp250": 0,
"cntDrpg250": 0 "cntDrpg250": 0
}, },
"h6": { "h6": {
"drpStCount": { "drpStCount": {
"total": 94, "total": 99,
"sh": 31, "sh": 35,
"sw": 23, "sw": 25,
"sk": 6, "sk": 6,
"qx": 34 "qx": 33
}, },
"max": { "max": {
"value": 22.7, "value": 50.3,
"stnm": "下白米", "stnm": "福田河",
"stcd": "Q9123", "stcd": "Q9111",
"type": "qx" "type": "qx"
}, },
"cntDrp10": 63, "cntDrp10": 38,
"cntDrp25": 31, "cntDrp25": 35,
"cntDrp50": 0, "cntDrp50": 21,
"cntDrp100": 0, "cntDrp100": 5,
"cntDrp250": 0, "cntDrp250": 0,
"cntDrpg250": 0 "cntDrpg250": 0
}, },
"h24": { "h24": {
"drpStCount": { "drpStCount": {
"total": 100, "total": 99,
"sh": 34, "sh": 35,
"sw": 26, "sw": 25,
"sk": 6, "sk": 6,
"qx": 34 "qx": 33
}, },
"max": { "max": {
"value": 45.2, "value": 50.3,
"stnm": "下白米", "stnm": "福田河",
"stcd": "Q9123", "stcd": "Q9111",
"type": "qx" "type": "qx"
}, },
"cntDrp10": 23, "cntDrp10": 38,
"cntDrp25": 52, "cntDrp25": 35,
"cntDrp50": 25, "cntDrp50": 21,
"cntDrp100": 0, "cntDrp100": 5,
"cntDrp250": 0, "cntDrp250": 0,
"cntDrpg250": 0 "cntDrpg250": 0
} }
@ -104,34 +104,130 @@
"aRzSk": [], "aRzSk": [],
"drpSk": [ "drpSk": [
{ {
"stcd": "61614200", "stcd": "61612700",
"type": "sk", "type": "sk",
"hasRz": true, "hasRz": true,
"stnm": "浮桥河水库", "stnm": "碧绿河水库",
"adcd": "421181100000", "adcd": "421181109000",
"wscd": null, "wscd": null,
"importancy": 0, "importancy": 0,
"lgtd": 114.875, "lgtd": 115.214444,
"lttd": 31.166667, "lttd": 31.299722,
"elev": 0, "elev": 0,
"damel": 71.33, "damel": 142.9,
"dsflz": 68.04, "dsflz": 139.08,
"fsltdz": 64.89, "fsltdz": 137,
"ddz": 51.78, "ddz": 105,
"zcxsw": 64.89, "zcxsw": 137,
"drpTm": "2025-06-08T03:00:00.000Z", "drpTm": "2025-06-06T22:00:00.000Z",
"today": 13, "today": 50,
"h1": 1, "h1": 38,
"h3": 8.5, "h3": 50,
"h6": 16, "h6": 50,
"h12": 19, "h12": 50,
"h24": 26.5, "h24": 50,
"h48": 70, "h48": 50,
"drpState": 1, "drpState": 1,
"rz": 60.78, "rz": 120,
"w": 164.6, "w": 13.55,
"a_fsltdz": -4.109999999999999, "a_fsltdz": -17,
"rzTm": "2025-06-08T03:00:00.000Z", "rzTm": "2025-06-06T00:00:00.000Z",
"rzWarning": 0,
"rzState": 2
},
{
"stcd": "61612560",
"type": "sk",
"hasRz": true,
"stnm": "大河铺水库",
"adcd": "421181112000",
"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": 1.66,
"a_fsltdz": -14.5,
"rzTm": "2025-06-06T00:00:00.000Z",
"rzWarning": 0,
"rzState": 2
},
{
"stcd": "61612610",
"type": "sk",
"hasRz": true,
"stnm": "三河口水库",
"adcd": "421181109000",
"wscd": null,
"importancy": 0,
"lgtd": 115.166667,
"lttd": 31.333333,
"elev": 0,
"damel": 156.8,
"dsflz": 154.99,
"fsltdz": 149,
"ddz": 124,
"zcxsw": 149,
"drpTm": "2025-06-06T22:00:00.000Z",
"today": 43.5,
"h1": 32,
"h3": 43.5,
"h6": 43.5,
"h12": 43.5,
"h24": 43.5,
"h48": 43.5,
"drpState": 1,
"rz": 141.56,
"w": 78.3,
"a_fsltdz": -7.439999999999998,
"rzTm": "2025-06-06T22:00:00.000Z",
"rzWarning": 0,
"rzState": 1
},
{
"stcd": "61612580",
"type": "sk",
"hasRz": true,
"stnm": "芭茅河水库",
"adcd": "421181110000",
"wscd": null,
"importancy": 0,
"lgtd": 115.101389,
"lttd": 31.307778,
"elev": 0,
"damel": 127.8,
"dsflz": 125.57,
"fsltdz": 122.44,
"ddz": 106.94,
"zcxsw": 122.44,
"drpTm": "2025-06-06T22:00:00.000Z",
"today": 18,
"h1": 18,
"h3": 18,
"h6": 18,
"h12": 18,
"h24": 18,
"h48": 18,
"drpState": 1,
"rz": 117.78,
"w": 6.215,
"a_fsltdz": -4.659999999999997,
"rzTm": "2025-06-06T22:00:00.000Z",
"rzWarning": 0, "rzWarning": 0,
"rzState": 1 "rzState": 1
}, },
@ -151,90 +247,158 @@
"fsltdz": 93, "fsltdz": 93,
"ddz": 78.02, "ddz": 78.02,
"zcxsw": 93, "zcxsw": 93,
"drpTm": "2025-06-08T03:00:00.000Z", "drpTm": "2025-06-06T22:00:00.000Z",
"today": 13, "today": 15,
"h1": 2.5, "h1": 15,
"h3": 10.5, "h3": 15,
"h6": 14, "h6": 15,
"h12": 15.5, "h12": 15,
"h24": 22, "h24": 15,
"h48": 74.5, "h48": 15,
"drpState": 1, "drpState": 1,
"rz": 85.27, "rz": 84.67,
"w": 54.6, "w": 50.9,
"a_fsltdz": -7.730000000000004, "a_fsltdz": -8.329999999999998,
"rzTm": "2025-06-08T03:00:00.000Z", "rzTm": "2025-06-06T22:00:00.000Z",
"rzWarning": 0, "rzWarning": 0,
"rzState": 1 "rzState": 1
}, }
],
"warnDrpSt": [
{ {
"stcd": "61612700", "stcd": "61615110",
"type": "sk", "stnm": "杨梅河(木子店)",
"hasRz": true, "adcd": "421181000000000",
"stnm": "碧绿河水库",
"adcd": "421181109000",
"wscd": null, "wscd": null,
"importancy": 0, "importancy": 0,
"lgtd": 115.214444, "lgtd": 115.339667,
"lttd": 31.299722, "lttd": 31.1595,
"elev": 0, "elev": null,
"damel": 142.9, "hasRz": true,
"dsflz": 139.08, "type": "sh",
"fsltdz": 137, "today": 46,
"ddz": 105, "h1": 44,
"zcxsw": 137, "h3": 46,
"drpTm": "2025-06-08T03:00:00.000Z", "h6": 46,
"today": 8.5, "h12": 46,
"h1": 6, "h24": 46,
"h3": 7.5, "h48": 46,
"h6": 9, "tm": "2025-06-06T22:25:00.000Z",
"h12": 10.5, "state": 1,
"h24": 18, "warning": 0
"h48": 106.5,
"drpState": 1,
"rz": 121,
"w": 14.7,
"a_fsltdz": -16,
"rzTm": "2025-06-08T00:00:00.000Z",
"rzWarning": 0,
"rzState": 2
}, },
{ {
"stcd": "61612580", "stcd": "61641700",
"type": "sk", "stnm": "前畈(三河口)",
"hasRz": true, "adcd": "421181000000000",
"stnm": "芭茅河水库",
"adcd": "421181110000",
"wscd": null, "wscd": null,
"importancy": 0, "importancy": 0,
"lgtd": 115.101389, "lgtd": 115.2267,
"lttd": 31.307778, "lttd": 31.3925,
"elev": 0, "elev": null,
"damel": 127.8, "hasRz": false,
"dsflz": 125.57, "type": "sh",
"fsltdz": 122.44, "today": 32,
"ddz": 106.94, "h1": 32,
"zcxsw": 122.44, "h3": 32,
"drpTm": "2025-06-08T03:00:00.000Z", "h6": 32,
"today": 9, "h12": 32,
"h1": 7.5, "h24": 32,
"h3": 8, "h48": 32,
"h6": 9.5, "tm": "2025-06-06T22:25:00.000Z",
"h12": 11.5, "state": 1,
"h24": 17.5, "warning": 0
"h48": 65.5, },
"drpState": 1, {
"rz": 117.75, "stcd": "61641750",
"w": 6.191, "stnm": "金盘地(三河口)",
"a_fsltdz": -4.689999999999998, "adcd": "421181000000000",
"rzTm": "2025-06-08T03:00:00.000Z", "wscd": null,
"rzWarning": 0, "importancy": 0,
"rzState": 1 "lgtd": 115.2188,
"lttd": 31.2545,
"elev": null,
"hasRz": false,
"type": "sh",
"today": 46.5,
"h1": 36.5,
"h3": 46.5,
"h6": 46.5,
"h12": 46.5,
"h24": 46.5,
"h48": 46.5,
"tm": "2025-06-06T22:25:00.000Z",
"state": 1,
"warning": 0
},
{
"stcd": "61641850",
"stnm": "饶家畈(三河口)",
"adcd": "421181000000000",
"wscd": null,
"importancy": 0,
"lgtd": 115.318333,
"lttd": 31.293611,
"elev": null,
"hasRz": false,
"type": "sh",
"today": 44.5,
"h1": 43,
"h3": 44.5,
"h6": 44.5,
"h12": 44.5,
"h24": 44.5,
"h48": 44.5,
"tm": "2025-06-06T22:25:00.000Z",
"state": 1,
"warning": 0
},
{
"stcd": "61641900",
"stnm": "周家河(三河口)",
"adcd": "421181000000000",
"wscd": null,
"importancy": 0,
"lgtd": 115.164166666,
"lttd": 31.32916667,
"elev": null,
"hasRz": false,
"type": "sh",
"today": 51.5,
"h1": 44.5,
"h3": 51.5,
"h6": 51.5,
"h12": 51.5,
"h24": 51.5,
"h48": 51.5,
"tm": "2025-06-06T22:15:00.000Z",
"state": 1,
"warning": 0
},
{
"stcd": "61642040",
"stnm": "月形塘(龟山)",
"adcd": "421181000000000",
"wscd": null,
"importancy": 0,
"lgtd": 115.2875,
"lttd": 31.2292,
"elev": null,
"hasRz": false,
"type": "sh",
"today": 50.5,
"h1": 49,
"h3": 50.5,
"h6": 50.5,
"h12": 50.5,
"h24": 50.5,
"h48": 50.5,
"tm": "2025-06-06T22:25:00.000Z",
"state": 0,
"warning": 1
}, },
{ {
"stcd": "61612610", "stcd": "61612610",
"type": "sk",
"hasRz": true,
"stnm": "三河口水库", "stnm": "三河口水库",
"adcd": "421181109000", "adcd": "421181109000",
"wscd": null, "wscd": null,
@ -242,29 +406,196 @@
"lgtd": 115.166667, "lgtd": 115.166667,
"lttd": 31.333333, "lttd": 31.333333,
"elev": 0, "elev": 0,
"damel": 156.8, "hasRz": true,
"dsflz": 154.99, "type": "sk",
"fsltdz": 149, "tm": "2025-06-06T22:00:00.000Z",
"ddz": 124, "today": 43.5,
"zcxsw": 149, "h1": 32,
"drpTm": "2025-06-08T03:00:00.000Z", "h3": 43.5,
"today": 5, "h6": 43.5,
"h1": 3.5, "h12": 43.5,
"h3": 4.5, "h24": 43.5,
"h6": 5.5, "h48": 43.5,
"h12": 7.5, "state": 1,
"h24": 13, "warning": 0
"h48": 96.5, },
"drpState": 1, {
"rz": 141.98, "stcd": "61612700",
"w": 80.5, "stnm": "碧绿河水库",
"a_fsltdz": -7.02000000000001, "adcd": "421181109000",
"rzTm": "2025-06-08T03:00:00.000Z", "wscd": null,
"rzWarning": 0, "importancy": 0,
"rzState": 1 "lgtd": 115.214444,
"lttd": 31.299722,
"elev": 0,
"hasRz": true,
"type": "sk",
"tm": "2025-06-06T22:00:00.000Z",
"today": 50,
"h1": 38,
"h3": 50,
"h6": 50,
"h12": 50,
"h24": 50,
"h48": 50,
"state": 1,
"warning": 0
},
{
"stcd": "61612560",
"stnm": "大河铺水库",
"adcd": "421181112000",
"wscd": null,
"importancy": 0,
"lgtd": 114.941111,
"lttd": 31.464444,
"elev": 0,
"hasRz": true,
"type": "sk",
"tm": "2025-06-06T22:00:00.000Z",
"today": 50,
"h1": 50,
"h3": 50,
"h6": 50,
"h12": 50,
"h24": 50,
"h48": 50,
"state": 1,
"warning": 0
},
{
"stcd": "61641600",
"stnm": "张广河",
"adcd": null,
"wscd": null,
"importancy": 0,
"lgtd": 115.316887,
"lttd": 31.352877,
"elev": null,
"hasRz": false,
"type": "sw",
"today": 31,
"h1": 30.5,
"h3": 31,
"h6": 31,
"h12": 31,
"h24": 31,
"h48": 31,
"tm": "2025-06-06T22:00:00.000Z",
"state": 1,
"warning": 0
},
{
"stcd": "61643200",
"stnm": "西张店",
"adcd": null,
"wscd": null,
"importancy": 0,
"lgtd": 114.876389,
"lttd": 31.441389,
"elev": null,
"hasRz": false,
"type": "sw",
"today": 41.5,
"h1": 41.5,
"h3": 41.5,
"h6": 41.5,
"h12": 41.5,
"h24": 41.5,
"h48": 41.5,
"tm": "2025-06-06T22:00:00.000Z",
"state": 1,
"warning": 0
},
{
"stcd": "Q0142",
"stnm": "武麻高速K717+850",
"adcd": null,
"wscd": null,
"importancy": 0,
"lgtd": 115.1917,
"lttd": 31.2036,
"elev": null,
"hasRz": false,
"type": "qx",
"today": 36.6,
"h1": 36.6,
"h3": 36.6,
"h6": 36.6,
"h12": 36.6,
"h24": 36.6,
"h48": 36.6,
"tm": "2025-06-06T22:00:00.000Z",
"state": 1,
"warning": 0
},
{
"stcd": "Q9107",
"stnm": "三河口",
"adcd": null,
"wscd": null,
"importancy": 0,
"lgtd": 115.2414,
"lttd": 31.3308,
"elev": null,
"hasRz": false,
"type": "qx",
"today": 45,
"h1": 34.4,
"h3": 45,
"h6": 45,
"h12": 45,
"h24": 45,
"h48": 45,
"tm": "2025-06-06T22:00:00.000Z",
"state": 1,
"warning": 0
},
{
"stcd": "Q9111",
"stnm": "福田河",
"adcd": null,
"wscd": null,
"importancy": 0,
"lgtd": 115.0944,
"lttd": 31.4747,
"elev": null,
"hasRz": false,
"type": "qx",
"today": 50.3,
"h1": 50.2,
"h3": 50.2,
"h6": 50.2,
"h12": 50.2,
"h24": 50.3,
"h48": 50.3,
"tm": "2025-06-06T22:00:00.000Z",
"state": 1,
"warning": 0
},
{
"stcd": "Q9127",
"stnm": "方家山",
"adcd": null,
"wscd": null,
"importancy": 0,
"lgtd": 115.1656,
"lttd": 31.195,
"elev": null,
"hasRz": false,
"type": "qx",
"today": 35.5,
"h1": 35.5,
"h3": 35.5,
"h6": 35.5,
"h12": 35.5,
"h24": 35.5,
"h48": 35.5,
"tm": "2025-06-06T22:00:00.000Z",
"state": 1,
"warning": 0
} }
], ],
"warnDrpSt": [],
"crucialRz": [ "crucialRz": [
{ {
"stcd": "61615300", "stcd": "61615300",
@ -277,8 +608,8 @@
"elev": null, "elev": null,
"hasRz": true, "hasRz": true,
"type": "sw", "type": "sw",
"tm": "2025-06-08T03:00:00.000Z", "tm": "2025-06-06T21:00:00.000Z",
"rz": 134.21, "rz": 133.89,
"state": 1 "state": 1
} }
] ]

1398
public/data3/skReal.json
View File

File diff suppressed because it is too large Load Diff

4
public/mapbox/sprite@2x.json
View File

@ -337,9 +337,9 @@
}, },
"白蚁监测": { "白蚁监测": {
"width": 20, "width": 20,
"height": 32, "height": 30,
"x": 74, "x": 74,
"y": 290, "y": 286,
"pixelRatio": 0.5, "pixelRatio": 0.5,
"visible": true "visible": true
}, },

60
src/models/_/real.js
View File

@ -24,23 +24,9 @@ export const DrpRealPromise = new CachePromise(
() => fetch(`${process.env.PUBLIC_URL}/data3/drpReal.json`) () => fetch(`${process.env.PUBLIC_URL}/data3/drpReal.json`)
.then((response) => response.json()) .then((response) => response.json())
// .then(data=>{ .then(data => {
// const cs = [] return data.filter(o=>o.state===1)
// const list = data.map((item)=>{ })
// const obj = {...item}
// const num = item.lgtd.toString()||'0.000';
// const num2 = Number(num.slice(num.length-1,num.length))
// obj.h1 = item.h1+num2
// obj.h3 = item.h3+num2*1.2
// obj.h6 = item.h6+num2*1.5
// obj.h12 = item.h12+num2*1.6
// obj.h24 = item.h24+num2*1.8
// obj.h48 = item.h48+num2*1.9
// return obj
// })
// debugger
// return list
// })
.catch(() => null), .catch(() => null),
5000 5000
); );
@ -70,27 +56,31 @@ export const SkRealPromise = new CachePromise(
() => fetch(`${process.env.PUBLIC_URL}/data3/skReal.json`) () => fetch(`${process.env.PUBLIC_URL}/data3/skReal.json`)
.then((response) => response.json()) .then((response) => response.json())
// .then(data=>data.map(o=>{
// return {...o,layer:'RealSkLayer',layerPop:'RealSkPop'}
// }))
.then(data => { .then(data => {
return data.map(o => ({ ...o, aRz: parseFloat((o.rz - o.fsltdz).toFixed(2)) })) return data.map(o => ({ ...o, aRz: parseFloat((o.rz - o.fsltdz).toFixed(2)) }))
}) })
.then(data=>{ // .then(data=>{
const list = data.map((item)=>{ // const list = data.map((item)=>{
const obj = {...item} // const obj = {...item}
const num = item.lgtd.toString()||'0.000'; // const num = item.lgtd.toString()||'0.000';
const num2 = Number(num.slice(num.length-1,num.length)) // const num2 = Number(num.slice(num.length-1,num.length))
obj.h1 = item.h1+num2 // obj.h1 = item.h1+num2
obj.h3 = item.h3+num2*1.2 // obj.h3 = item.h3+num2*1.2
obj.h6 = item.h6+num2*1.5 // obj.h6 = item.h6+num2*1.5
obj.h12 = item.h12+num2*1.6 // obj.h12 = item.h12+num2*1.6
obj.h24 = item.h24+num2*1.8 // obj.h24 = item.h24+num2*1.8
obj.h48 = item.h48+num2*1.9 // obj.h48 = item.h48+num2*1.9
if(obj.w<=0.5){ // if(obj.w<=0.5){
// c.push(obj) // // c.push(obj)
} // }
return obj // return obj
}) // })
return list // return list
}) // })
// .then(data=>data.filter(o=>o.rzState===1))
.catch(() => null), .catch(() => null),
5000 5000
); );

265
src/models/map/index.js
View File

@ -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 === 1 || id == 503) {
layerVisible = { layerVisible = {
RealDrpLayer: true, RealDrpLayer: true,
RealHDLayer: true, RealHDLayer: true,
@ -171,8 +171,8 @@ const map = {
YuwaiLayer: false, YuwaiLayer: false,
AdcdLayer: true, AdcdLayer: true,
WataLayer: false, WataLayer: false,
RealSkLayerQ2:true, RealSkLayerQ2: true,
RealHDLayerQ2:true, RealHDLayerQ2: true,
} }
Object.keys(DCPJ_TYPES).forEach(key => { Object.keys(DCPJ_TYPES).forEach(key => {
layerVisible['Dcpj_' + key + 'Layer'] = false; layerVisible['Dcpj_' + key + 'Layer'] = false;
@ -187,8 +187,8 @@ const map = {
YuwaiLayer: false, YuwaiLayer: false,
AdcdLayer: true, AdcdLayer: true,
WataLayer: false, WataLayer: false,
RealSkLayerQ2:true, RealSkLayerQ2: true,
RealHDLayerQ2:true, RealHDLayerQ2: true,
} }
Object.keys(DCPJ_TYPES).forEach(key => { Object.keys(DCPJ_TYPES).forEach(key => {
layerVisible['Dcpj_' + key + 'Layer'] = false; layerVisible['Dcpj_' + key + 'Layer'] = false;
@ -228,7 +228,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;
}); });
}else if (id === 5) { } else if (id === 5) {
layerVisible = { layerVisible = {
RealDrpLayer: true, RealDrpLayer: true,
RealHDLayer: false, RealHDLayer: false,
@ -246,14 +246,16 @@ const map = {
RealDrpLayer: false, RealDrpLayer: false,
RealHDLayer: false, RealHDLayer: false,
RealSkLayer: false, RealSkLayer: false,
RainDrpLayer:true, RainDrpLayer: true,
ShuikuLayer:true, ShuikuLayer: false,
BxSkLayer: true, BxSkLayer: true,
FzdxLayer: false, FzdxLayer: false,
WataLayer: false, WataLayer: false,
AdcdLayer: true, AdcdLayer: true,
RoadLayer: true, RoadLayer: true,
RivlLayer: true, RivlLayer: true,
RealHDLayerQ2: true,
RealSkLayerQ2: true
}; };
Object.keys(DCPJ_TYPES).forEach(key => { Object.keys(DCPJ_TYPES).forEach(key => {
layerVisible['Dcpj_' + key + 'Layer'] = false; layerVisible['Dcpj_' + key + 'Layer'] = false;
@ -314,11 +316,17 @@ const map = {
AdcdLayer: true, AdcdLayer: true,
RoadLayer: true, RoadLayer: true,
RivlLayer: true, RivlLayer: true,
BxjcLayer: true, BxjcLayer: false,
SyjcLayer: true, SyjcLayer: false,
SljcLayer: true, SljcLayer: false,
ByjcLayer:true ByjcLayer: false
}; };
dispatch.runtime.setCameraTarget({
center: [114.88069, 31.171967],
zoom: 12,
pitch: 60,
bearing: 0
});
Object.keys(DCPJ_TYPES).forEach(key => { Object.keys(DCPJ_TYPES).forEach(key => {
layerVisible['Dcpj_' + key + 'Layer'] = false; layerVisible['Dcpj_' + key + 'Layer'] = false;
}); });
@ -342,7 +350,7 @@ const map = {
layerVisible = { layerVisible = {
RealDrpLayer: false, RealDrpLayer: false,
RealHDLayer: false, RealHDLayer: false,
RealSkLayer: true, RealSkLayer: false,
BxSkLayer: false, BxSkLayer: false,
FzdxLayer: true, FzdxLayer: true,
WataLayer: false, WataLayer: false,
@ -359,7 +367,7 @@ const map = {
RealHDLayer: false, RealHDLayer: false,
RealSkLayer: false, RealSkLayer: false,
BxSkLayer: false, BxSkLayer: false,
XunchaLayer:true, XunchaLayer: true,
FzdxLayer: false, FzdxLayer: false,
WataLayer: false, WataLayer: false,
AdcdLayer: true, AdcdLayer: true,
@ -369,7 +377,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;
}); });
} else if (id === 207) { } else if (id === 200) {
layerVisible = { layerVisible = {
RealDrpLayer: false, RealDrpLayer: false,
RealHDLayer: false, RealHDLayer: false,
@ -395,8 +403,8 @@ const map = {
AdcdLayer: true, AdcdLayer: true,
RoadLayer: true, RoadLayer: true,
RivlLayer: true, RivlLayer: true,
ShuichangLayer:true, ShuichangLayer: true,
ShuiyuandiLayer:false, ShuiyuandiLayer: false,
}; };
Object.keys(DCPJ_TYPES).forEach(key => { Object.keys(DCPJ_TYPES).forEach(key => {
layerVisible['Dcpj_' + key + 'Layer'] = false; layerVisible['Dcpj_' + key + 'Layer'] = false;
@ -412,10 +420,10 @@ const map = {
AdcdLayer: true, AdcdLayer: true,
RoadLayer: true, RoadLayer: true,
RivlLayer: true, RivlLayer: true,
ShuichangLayer:true, ShuichangLayer: true,
ShuichangQLayer: true, ShuichangQLayer: true,
ShuiyuandiQLayer:true, ShuiyuandiQLayer: true,
ShuizhiLayer:true, ShuizhiLayer: true,
ShuiyuandiLayer: true, ShuiyuandiLayer: true,
}; };
Object.keys(DCPJ_TYPES).forEach(key => { Object.keys(DCPJ_TYPES).forEach(key => {
@ -432,13 +440,13 @@ const map = {
AdcdLayer: true, AdcdLayer: true,
RoadLayer: true, RoadLayer: true,
RivlLayer: true, RivlLayer: true,
ShuichangLayer:true, ShuichangLayer: true,
ShuichangQLayer: true, ShuichangQLayer: true,
}; };
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 === 303 || id === 306 || id === 305) { } else if (id === 303 || id === 306 || id === 305) {
layerVisible = { layerVisible = {
RealDrpLayer: false, RealDrpLayer: false,
RealHDLayer: false, RealHDLayer: false,
@ -453,7 +461,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;
}); });
}else if ( id === 307) { } else if (id === 307) {
layerVisible = { layerVisible = {
RealDrpLayer: false, RealDrpLayer: false,
RealHDLayer: true, RealHDLayer: true,
@ -485,7 +493,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;
}); });
}else if (id == 504) { } else if (id == 504) {
layerVisible = { layerVisible = {
RealDrpLayer: true, RealDrpLayer: true,
TrsqLayer: true, TrsqLayer: true,
@ -495,7 +503,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;
}); });
}else if (id == 505) { } else if (id == 505) {
layerVisible = { layerVisible = {
BzLayer: true, BzLayer: true,
SbLayer: true, SbLayer: true,
@ -507,7 +515,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;
}); });
}else if (id == 506 || id == 507) { } else if (id == 506 || id == 507) {
layerVisible = { layerVisible = {
AdcdLayer: true, AdcdLayer: true,
RivlLayer: true, RivlLayer: true,
@ -517,7 +525,7 @@ const map = {
layerVisible['Dcpj_' + key + 'Layer'] = true; layerVisible['Dcpj_' + key + 'Layer'] = true;
} else { } else {
layerVisible['Dcpj_' + key + 'Layer'] = false; layerVisible['Dcpj_' + key + 'Layer'] = false;
} }
}); });
} }
@ -527,9 +535,9 @@ const map = {
dispatch.runtime.setFeaturePop(null); dispatch.runtime.setFeaturePop(null);
if (id === 8){ if (id === 8) {
dispatch.rcview.showRealContour('h24') dispatch.rcview.showRealContour('h24')
}else{ } else {
dispatch.runtime.setLayerSetting({ contour: null, dem: undefined }); dispatch.runtime.setLayerSetting({ contour: null, dem: undefined });
dispatch.runtime.setLayerSetting({ planeArea: null }); dispatch.runtime.setLayerSetting({ planeArea: null });
dispatch.map.setLayerVisible({ ContourLayer: false }); dispatch.map.setLayerVisible({ ContourLayer: false });
@ -562,14 +570,209 @@ const map = {
dispatch.runtime.setYyfa({}) dispatch.runtime.setYyfa({})
} }
if (id === 3) { if (
id === 3
|| id === 203
|| id === 205
|| id === 206
) {
dispatch.map.setLayerSetting({ dom: true }); dispatch.map.setLayerSetting({ dom: true });
// map.setLayoutProperty('卫星图', 'visibility', 'visible'); // map.setLayoutProperty('卫星图', 'visibility', 'visible');
} else { } else {
dispatch.map.setLayerSetting({dom: false}); dispatch.map.setLayerSetting({ dom: false });
// map.setLayoutProperty('卫星图', 'visibility', 'none'); // map.setLayoutProperty('卫星图', 'visibility', 'none');
} }
if (id == 203) {
const skdata = [
{
"stcd": "61614200",
"type": "sk",
"hasRz": true,
"stnm": "浮桥河水库",
"adcd": "421181100000",
"wscd": null,
"importancy": 0,
"lgtd": 114.875,
"lttd": 31.166667,
"elev": 0,
"damel": 71.33,
"dsflz": 68.04,
"fsltdz": 64.89,
"ddz": 51.78,
"zcxsw": 64.89,
"drpTm": "2025-06-03T02:00:00.000Z",
"today": 0,
"h1": 5,
"h3": 6,
"h6": 7.5,
"h12": 8,
"h24": 9,
"h48": 26,
"drpState": 1,
"rz": 60.71,
"w": 162.8,
"a_fsltdz": -4.18,
"rzTm": "2025-06-03T02:00:00.000Z",
"rzWarning": 0,
"rzState": 1,
"aRz": -4.18
},
{
"stcd": "61613010",
"type": "sk",
"hasRz": true,
"stnm": "明山水库",
"adcd": "421181103000",
"wscd": null,
"importancy": 0,
"lgtd": 115.066667,
"lttd": 31.016667,
"elev": 0,
"damel": 98.7,
"dsflz": 96.07,
"fsltdz": 93,
"ddz": 78.02,
"zcxsw": 93,
"drpTm": "2025-06-03T02:00:00.000Z",
"today": 0,
"h1": 7,
"h3": 8.4,
"h6": 10.5,
"h12": 11.200000000000001,
"h24": 12.6,
"h48": 25.799999999999997,
"drpState": 1,
"rz": 84.43,
"w": 49.5,
"a_fsltdz": -8.569999999999993,
"rzTm": "2025-06-03T02:00:00.000Z",
"rzWarning": 0,
"rzState": 1,
"aRz": -8.57
},
{
"stcd": "61612610",
"type": "sk",
"hasRz": true,
"stnm": "三河口水库",
"adcd": "421181109000",
"wscd": null,
"importancy": 0,
"lgtd": 115.166667,
"lttd": 31.333333,
"elev": 0,
"damel": 156.8,
"dsflz": 154.99,
"fsltdz": 149,
"ddz": 124,
"zcxsw": 149,
"drpTm": "2025-06-03T02:00:00.000Z",
"today": 0,
"h1": 7,
"h3": 8.4,
"h6": 10.5,
"h12": 11.200000000000001,
"h24": 12.6,
"h48": 25.799999999999997,
"drpState": 1,
"rz": 141.45,
"w": 77.8,
"a_fsltdz": -7.550000000000011,
"rzTm": "2025-06-03T01:00:00.000Z",
"rzWarning": 0,
"rzState": 1,
"aRz": -7.55
},
{
"stcd": "61612700",
"type": "sk",
"hasRz": true,
"stnm": "碧绿河水库",
"adcd": "421181109000",
"wscd": null,
"importancy": 0,
"lgtd": 115.214444,
"lttd": 31.299722,
"elev": 0,
"damel": 142.9,
"dsflz": 139.08,
"fsltdz": 137,
"ddz": 105,
"zcxsw": 137,
"drpTm": "2025-06-03T02:00:00.000Z",
"today": 0,
"h1": 4,
"h3": 4.8,
"h6": 6,
"h12": 6.4,
"h24": 7.2,
"h48": 22.6,
"drpState": 1,
"rz": 119.6,
"w": 13.15,
"a_fsltdz": -17.400000000000006,
"rzTm": "2025-06-03T00:00:00.000Z",
"rzWarning": 0,
"rzState": 2,
"aRz": -17.4
}
]
const layer = map.getLayer('关联站点')
if (layer) {
map.removeLayer('关联站点');
map.removeSource('关联站点');
}
map.addLayer({
'id': '关联站点',//+new Date().getTime(),
'type': 'symbol',
'source': {
'type': 'geojson',
'data': {
'type': 'FeatureCollection',
'features': [],
},
},
'layout': {
'icon-allow-overlap': true,
'text-allow-overlap': true,
'icon-image': '水库-离线',
'icon-size': [
'interpolate', ['linear'], ['zoom'],
10, 0.4,
14, 0.8,
],
'text-allow-overlap': true,
'text-size': [
'interpolate', ['linear'], ['zoom'],
10, 10,
14, 14,
],
'text-font': ['Roboto Black'],
'text-field': [
'step',
['zoom'],
'',
12, ['get', 'stnm']
],
'text-anchor': 'top',
'text-offset': [0, 1],
},
'paint': {
'text-color': '#fff'
},
'visibility': 'visible',
});
map.getSource('关联站点').setData(parseGeoJSON(skdata))
}
if(id!==200&&id!==203&&id!==205&&id!==206){
const layer = map.getLayer('临时水库tz')
if(layer){
map.removeLayer('临时水库tz');
map.removeSource('临时水库tz');
}
}
} }
}) })
}; };

20
src/models/map/layout.js
View File

@ -82,9 +82,8 @@ export default function calcLayout(view, rightStack, hidePanels) {
} else if (view === 203) { } else if (view === 203) {
left = [ left = [
{ key: '天气' }, { key: '天气' },
{ key: '变形监测', style: { height: '20rem', flexGrow: 1 } }, { key: '关联站点',style: { height: '15rem', flexGrow: 1 } },
{ key: '渗压监测', style: { height: '20rem', flexGrow: 1 } }, { key: '水库水量统计',style: { height: '22rem' } },
{ key: '渗流监测', style: { height: '20rem', flexGrow: 1 } },
// { key: '安全监测', style: { height: '20rem', flexGrow: 1 } }, // { key: '安全监测', style: { height: '20rem', flexGrow: 1 } },
]; ];
leftFullHeight = true; leftFullHeight = true;
@ -108,11 +107,12 @@ export default function calcLayout(view, rightStack, hidePanels) {
{ key: '巡查任务总览', style: { height: '40rem', flexGrow: 1 } }, { key: '巡查任务总览', style: { height: '40rem', flexGrow: 1 } },
]; ];
leftFullHeight = true; leftFullHeight = true;
} else if (view === 207) { } else if (view === 200) {
left = [ left = [
{ key: '天气' }, { key: '天气' },
{ key: '水库总览', style: { height: '24rem', flexGrow: 1 } }, { key: '水库总览', style: { height: '30rem', flexGrow: 1 } },
{ key: '水库列表', style: { height: '24rem', flexGrow: 1 } }, { key: '超汛水库', style: { height: '16rem'} },
// { key: '水库列表', style: { height: '16rem'} },
]; ];
} else if (view === 301) { } else if (view === 301) {
left = [ left = [
@ -320,12 +320,12 @@ export default function calcLayout(view, rightStack, hidePanels) {
{ key: '巡查问题看板', style: { height: '70%', flexGrow: 1 } }, { key: '巡查问题看板', style: { height: '70%', flexGrow: 1 } },
{ key: '水库管护', style: { height: '10rem', flexGrow: 1 } }, { key: '水库管护', style: { height: '10rem', flexGrow: 1 } },
]; ];
} else if (view === 207) { } else if (view === 200) {
right = [ right = [
{ key: '警报' }, { key: '警报' },
{ key: '关联站点',style: { height: '15rem', flexGrow: 1 } }, // { key: '关联站点',style: { height: '15rem', flexGrow: 1 } },
{ key: '水库水量统计',style: { height: '22rem' } }, // { key: '水库水量统计',style: { height: '22rem' } },
{ key: '洪水防御',style: { height: '18rem', flexGrow: 1 } }, // { key: '洪水防御',style: { height: '18rem', flexGrow: 1 } },
]; ];
rightFullHeight = true; rightFullHeight = true;
} else if (view === 301) { } else if (view === 301) {

2
src/views/Home/InfoDlg/BxjcBlg/index.js
View File

@ -56,7 +56,7 @@ function HDStDlg({ record, onClose }) {
<DpTabs value={value} indicatorColor="primary" onChange={(_, v) => setValue(v)}> <DpTabs value={value} indicatorColor="primary" onChange={(_, v) => setValue(v)}>
<DpTab label={record.res_nm+'-'+record.cd_nm} /> <DpTab label={record.res_nm+'-'+record.cd_nm} />
</DpTabs> </DpTabs>
<button className={classes.addButton} onClick={()=>setVisible(true)}>三维展示</button> {/* <button className={classes.addButton} onClick={()=>setVisible(true)}>三维展示</button> */}
<DpCloseButton onClick={onClose} /> <DpCloseButton onClick={onClose} />
</DpAppBar> </DpAppBar>
<div style={{ padding: '2rem', hminHeight: '50rem',maxHeight: '60rem' }}> <div style={{ padding: '2rem', hminHeight: '50rem',maxHeight: '60rem' }}>

114
src/views/Home/InfoDlg/ShuichangguanwangDlg/Bjjl.js Normal file
View File

@ -0,0 +1,114 @@
import { Grid, withStyles, TableCell } from '@material-ui/core';
import React,{useState} from 'react';
import useRequest from '../../../../utils/useRequest';
import { skInfo } from '../../../../models/_/search';
import { adnmCun, adnmZhen } from '../../../../models/_/adcd';
import { Person } from '@material-ui/icons';
import PanelBox from '../../components/PanelBox';
import { makeStyles } from '@material-ui/core/styles';
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 { DatePicker } from 'antd';
import moment from 'moment';
import ReactECharts from 'echarts-for-react';
import ModalView from './view'
const { RangePicker } = DatePicker;
const useStyles = makeStyles({
tableContainer: {
background: '#182d42', // 设置表格容器的背景颜色
},
item: {
'& .MuiGrid-item': {
'& [class*="makeStyles-title"]': {
color: '#fff',
backgroundColor: '#104175',
},
},
},
});
const DpTableCell = withStyles({
head: {
backgroundColor: '#104175',
color: '#fff',
fontSize: '1rem',
padding: '0.5rem 0.3rem !important',
},
body: {
color: '#fff',
fontSize: '0.9rem',
padding: '0.7rem 0.3rem !important',
borderBottom: 'none',
position: "relative"
},
})(TableCell);
function SkInfo() {
const classes = useStyles();
const data = [
{
type: '爆管',
location: '龙池桥街道',
tm: '2025-06-06 15:38:00',
status:'已解除'
},
{
type: '压力异常',
location: '夫子河监测点',
tm: '2025-06-06 15:38:00',
status:'未解除'
},
{
type: '漏损',
location: '南湖街道',
tm: '2025-06-06 15:38:00',
status:'已解除'
}
];
const [visible, setVisible] = useState(false)
return (
<div style={{ display: 'flex' }}>
<TableContainer style={{ height: '49vh' }} className={classes.tableContainer}>
<Table size="small" stickyHeader>
<TableHead>
<TableRow style={{ padding: '30px 0' }}>
<DpTableCell align="center">序号</DpTableCell>
<DpTableCell align="center">报警类型</DpTableCell>
<DpTableCell align="center">所在位置</DpTableCell>
<DpTableCell align="center">报警时间</DpTableCell>
<DpTableCell align="center">状态</DpTableCell>
<DpTableCell align="center">处置情况</DpTableCell>
</TableRow>
</TableHead>
<TableBody>
{data.map((row,i) => (
<DpTableRow key={row.stcd}>
<DpTableCell align="center">
<div className="table-ellipsis cursor-pointer" onClick={() => { }}>{i+ 1}</div>
</DpTableCell>
<DpTableCell align="center">{row.type}</DpTableCell>
<DpTableCell align="center">{row.location}</DpTableCell>
<DpTableCell align="center">{row.tm}</DpTableCell>
<DpTableCell align="center">{row.status}</DpTableCell>
<DpTableCell align="center" onClick={() => setVisible(true)}>查看</DpTableCell>
</DpTableRow>
))}
</TableBody>
</Table>
</TableContainer>
<ModalView
open={visible}
onClose={() => setVisible(false)}
></ModalView>
</div>
)
}
export default SkInfo;

10
src/views/Home/InfoDlg/ShuichangguanwangDlg/index.js
View File

@ -15,10 +15,14 @@ import SkPlan from '../../components/SkInfo/SkPlan';
import DpBackgroundDrop from '../../../../layouts/mui/DpBackdrop'; import DpBackgroundDrop from '../../../../layouts/mui/DpBackdrop';
import DpCloseButton from '../../../../layouts/mui/DpCloseButton'; import DpCloseButton from '../../../../layouts/mui/DpCloseButton';
import ZrrPlan from './zrrPlan' import ZrrPlan from './zrrPlan'
import Shuizhijc from './Shuizhijc' import Shuizhijc from './loushun'
import Jianceflow from './jianceflow' import Jianceflow from './jianceflow'
import Yxsj from './yxsj' import Yxsj from './yxsj'
import Spjk from './spjk' import Spjk from './spjk'
import Bjjl from './Bjjl'
import Jbxx from './jbxx' import Jbxx from './jbxx'
import './index.less' import './index.less'
function SkDlg({ record, onClose }) { function SkDlg({ record, onClose }) {
@ -47,8 +51,8 @@ function SkDlg({ record, onClose }) {
<div style={{ padding: '2rem', height: '50rem' }}> <div style={{ padding: '2rem', height: '50rem' }}>
{value === 0 && <Jbxx record={record} />} {value === 0 && <Jbxx record={record} />}
{value === 1 && <Yxsj record={record} />} {value === 1 && <Yxsj record={record} />}
{value === 2 && <Jianceflow record={record} />} {value === 2 && <Bjjl record={record} />}
{value === 3 && <Spjk record={record} />} {value === 3 && <Shuizhijc record={record} />}
</div> </div>
</DialogContent> </DialogContent>

221
src/views/Home/InfoDlg/ShuichangguanwangDlg/loushun.js Normal file
View File

@ -0,0 +1,221 @@
import { Grid, withStyles, TableCell } from '@material-ui/core';
import React from 'react';
import useRequest from '../../../../utils/useRequest';
import { skInfo } from '../../../../models/_/search';
import { adnmCun, adnmZhen } from '../../../../models/_/adcd';
import { Person } from '@material-ui/icons';
import PanelBox from '../../components/PanelBox';
import { makeStyles } from '@material-ui/core/styles';
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 { DatePicker } from 'antd';
import moment from 'moment';
import ReactECharts from 'echarts-for-react';
const { RangePicker } = DatePicker;
const useStyles = makeStyles({
tableContainer: {
background: '#182d42', // 设置表格容器的背景颜色
},
item: {
'& .MuiGrid-item': {
'& [class*="makeStyles-title"]': {
color: '#fff',
backgroundColor: '#104175',
},
},
},
});
const DpTableCell = withStyles({
head: {
backgroundColor: '#104175',
color: '#fff',
fontSize: '1rem',
padding: '0.5rem 0.3rem !important',
},
body: {
color: '#fff',
fontSize: '0.9rem',
padding: '0.7rem 0.3rem !important',
borderBottom: 'none',
position: "relative"
},
})(TableCell);
function SkInfo() {
const classes = useStyles();
const data = [
{ time: '06-08 12:00', turbidity: 0.3, chlorine: 0.5, ph: 7.2 },
{ time: '06-08 11:00', turbidity: 0.2, chlorine: 0.4, ph: 7.1 },
{ time: '06-08 10:00', turbidity: 0.4, chlorine: 0.6, ph: 7.3 },
{ time: '06-08 09:00', turbidity: 0.3, chlorine: 0.5, ph: 7.2 },
{ time: '06-08 08:00', turbidity: 0.2, chlorine: 0.4, ph: 7.0 },
{ time: '06-08 07:00', turbidity: 0.4, chlorine: 0.5, ph: 7.4 },
{ time: '06-08 06:00', turbidity: 0.3, chlorine: 0.6, ph: 7.2 },
{ time: '06-08 05:00', turbidity: 0.2, chlorine: 0.5, ph: 7.1 },
{ time: '06-08 04:00', turbidity: 0.3, chlorine: 0.4, ph: 7.3 },
{ time: '06-08 03:00', turbidity: 0.4, chlorine: 0.5, ph: 7.2 },
{ time: '06-08 02:00', turbidity: 0.3, chlorine: 0.6, ph: 7.1 },
{ time: '06-08 01:00', turbidity: 0.2, chlorine: 0.5, ph: 7.3 },
{ time: '06-08 00:00', turbidity: 0.3, chlorine: 0.4, ph: 7.2 },
{ time: '06-07 23:00', turbidity: 0.4, chlorine: 0.5, ph: 7.1 },
{ time: '06-07 22:00', turbidity: 0.3, chlorine: 0.6, ph: 7.3 },
{ time: '06-07 21:00', turbidity: 0.2, chlorine: 0.5, ph: 7.2 },
{ time: '06-07 20:00', turbidity: 0.3, chlorine: 0.4, ph: 7.1 },
{ time: '06-07 19:00', turbidity: 0.4, chlorine: 0.5, ph: 7.3 },
{ time: '06-07 18:00', turbidity: 0.3, chlorine: 0.6, ph: 7.2 },
{ time: '06-07 17:00', turbidity: 0.2, chlorine: 0.5, ph: 7.1 },
{ time: '06-07 16:00', turbidity: 0.3, chlorine: 0.4, ph: 7.3 },
{ time: '06-07 15:00', turbidity: 0.4, chlorine: 0.5, ph: 7.2 },
{ time: '06-07 14:00', turbidity: 0.3, chlorine: 0.6, ph: 7.1 },
{ time: '06-07 13:00', turbidity: 0.2, chlorine: 0.5, ph: 7.3 },
{ time: '06-07 12:00', turbidity: 0.3, chlorine: 0.4, ph: 7.2 }
];
const option = {
tooltip: {
trigger: 'axis'
},
grid: {
top: '15%',
left: '3%',
right: '8%',
bottom: '3%',
containLabel: true
},
xAxis: {
type: 'category',
boundaryGap: false,
data: ['04-20', '04-21', '04-22', '04-23', '04-24', '04-25', '04-26'],
axisLine: {
lineStyle: {
color: '#fff'
}
},
axisLabel: {
color: '#fff'
}
},
yAxis: {
type: 'value',
name: '流量m³/h',
splitLine: {
lineStyle: {
type: 'dashed',
color: 'rgba(255,255,255,0.2)'
}
},
axisLine: {
lineStyle: {
color: '#fff'
}
},
axisLabel: {
color: '#fff'
}
},
series: [
{
name: '夜间流量',
type: 'line',
smooth: true,
areaStyle: {
color: {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [{
offset: 0,
color: 'rgba(0,255,255,0.3)'
}, {
offset: 1,
color: 'rgba(0,255,255,0)'
}]
}
},
lineStyle: {
color: '#00ffff'
},
data: [180, 205, 135, 150, 180, 120, 190],
markLine: {
silent: true,
lineStyle: {
color: '#ffd700',
type: 'dashed'
},
data: [{
yAxis: 180,
name: '安全流量上限'
}]
}
}
]
};
return (
<div style={{ display: 'flex' }}>
<div style={{ width: 600 }}>
<div className='toolbar' style={{ marginBottom: '10px' }}>
<div className='tm' style={{ position: "relative", zIndex: 999999, width: '60%' }}>
<RangePicker
width="50%"
className='time-picker'
style={{
flex: 1,
background: "transparent",
border: "none",
color: "#fff",
}}
allowClear
format="YYYY-MM-DD HH:mm"
showTime={{
format: 'HH:mm',
}}
value={[moment('2025-04-20 12:00:00'), moment('2025-04-26 12:00:00')]}
/>
</div>
<button className='search'>查询</button>
</div>
<TableContainer style={{ height: '49vh' }} className={classes.tableContainer}>
<Table size="small" stickyHeader>
<TableHead>
<TableRow style={{ padding: '30px 0' }}>
<DpTableCell align="center">序号</DpTableCell>
<DpTableCell align="center">漏水量（m³）</DpTableCell>
<DpTableCell align="center">供水量（m³）</DpTableCell>
<DpTableCell align="center">漏损率（%）</DpTableCell>
</TableRow>
</TableHead>
<TableBody>
{[].map((row,i) => (
<DpTableRow key={row.stcd}>
<DpTableCell align="center">
<div className="table-ellipsis cursor-pointer" onClick={() => { }}>{i+ 1}</div>
</DpTableCell>
<DpTableCell align="center">{row.turbidity}</DpTableCell>
<DpTableCell align="center">{row.chlorine}</DpTableCell>
<DpTableCell align="center">{row.ph}</DpTableCell>
</DpTableRow>
))}
</TableBody>
</Table>
</TableContainer>
</div>
<div style={{ height: '500px', width: '100%', flex: 1 }}>
<ReactECharts
option={option}
style={{ height: '100%' }}
opts={{ renderer: 'canvas' }}
/>
</div>
</div>
)
}
export default SkInfo;

40
src/views/Home/InfoDlg/ShuichangguanwangDlg/view.js Normal file
View File

@ -0,0 +1,40 @@
import React from 'react';
import DpTab from '../../../../layouts/mui/DpTab';
import Dialog from '@material-ui/core/Dialog';
import DialogContent from '@material-ui/core/DialogContent';
import DpPaperComponent from '../../../../layouts/mui/DpPaperCompanent';
import DpTabs from '../../../../layouts/mui/DpTabs';
import DpAppBar from '../../../../layouts/mui/DpAppBar';
import DpBackgroundDrop from '../../../../layouts/mui/DpBackdrop';
import DpCloseButton from '../../../../layouts/mui/DpCloseButton';
function HDStDlg({ record, onClose,open }) {
const [value, setValue] = React.useState(0);
return (
<Dialog
open={open}
onClose={onClose}
maxWidth="xl"
style={{ borderRadius: 0 }}
PaperComponent={DpPaperComponent}
BackdropComponent={DpBackgroundDrop}
>
<div className="boxhead"></div>
<DialogContent style={{ padding: 0, width: '70rem', overflowX: 'hidden',height:'50rem' }}>
<DpAppBar position="sticky">
<DpTabs value={value} indicatorColor="primary" onChange={(_, v) => setValue(v)}>
<DpTab label="任务信息" />
</DpTabs>
<DpCloseButton onClick={onClose} />
</DpAppBar>
<div style={{padding:10}}>
<img src={`${process.env.PUBLIC_URL}/assets/loushun.png`} style={{width:'100%'}}></img>
</div>
</DialogContent>
<div className="boxfoot"></div>
</Dialog>
)
}
export default React.memo(HDStDlg);

4
src/views/Home/InfoDlg/SkDlg/index.js
View File

@ -45,8 +45,8 @@ function SkDlg({ record, onClose }) {
<DpCloseButton onClick={onClose} /> <DpCloseButton onClick={onClose} />
</DpAppBar> </DpAppBar>
<div style={{ padding: '2rem', height: '50rem' }}> <div style={{ padding: '2rem', height: '50rem' }}>
{value === 0 && <DrpSearch record={record} />} {value === 0 && <DrpSearch record={{...record,tm:record.rzTm}} />}
{value === 1 && <RzSearch record={record} />} {value === 1 && <RzSearch record={{...record,tm:record.rzTm}} />}
{value === 2 && <SkImgSearch record={record} />} {value === 2 && <SkImgSearch record={record} />}
{value === 3 && <SkInfo record={record} />} {value === 3 && <SkInfo record={record} />}
{value === 4 && <ZrrPlan />} {value === 4 && <ZrrPlan />}

2
src/views/Home/InfoDlg/WyWarnDlg/index.js
View File

@ -40,6 +40,7 @@ function HDStDlg({ record, onClose }) {
<TableHead> <TableHead>
<TableRow> <TableRow>
<DpTableCell align="center">序号</DpTableCell> <DpTableCell align="center">序号</DpTableCell>
<DpTableCell align="center">水库名称</DpTableCell>
<DpTableCell align="center">预警时间</DpTableCell> <DpTableCell align="center">预警时间</DpTableCell>
<DpTableCell align="center">测点编号</DpTableCell> <DpTableCell align="center">测点编号</DpTableCell>
<DpTableCell align="center">预警级别</DpTableCell> <DpTableCell align="center">预警级别</DpTableCell>
@ -53,6 +54,7 @@ function HDStDlg({ record, onClose }) {
<DpTableCell align="center"> <DpTableCell align="center">
<div className="table-ellipsis cursor-pointer" >1</div> <div className="table-ellipsis cursor-pointer" >1</div>
</DpTableCell> </DpTableCell>
<DpTableCell align="center">浮桥河水库</DpTableCell>
<DpTableCell align="center">2025-5-20 10:00:00</DpTableCell> <DpTableCell align="center">2025-5-20 10:00:00</DpTableCell>
<DpTableCell align="center">GN1</DpTableCell> <DpTableCell align="center">GN1</DpTableCell>
<DpTableCell align="center">红色</DpTableCell> <DpTableCell align="center">红色</DpTableCell>

10
src/views/Home/InfoPops/RealDrpPop/DrpChart.js
View File

@ -204,7 +204,7 @@ function DrpChart({ record }) {
const classes = useStyles(); const classes = useStyles();
const tm = [moment().add(-24, 'hour'), moment()]; const tm = [moment().add(-24, 'hour'), moment()];
const resultTm = ['2025-06-07 10:00:00','2025-06-08 10:00:00']//normalizeSearchTmRange(tm, 'h'); const resultTm = [moment(record.tm).add(-1,'days').format('YYYY-MM-DD HH:00:00'),moment(record.tm).format('YYYY-MM-DD HH:00:00')]//normalizeSearchTmRange(tm, 'h');
useEffect(() => { useEffect(() => {
drpSearch(record.type, record.stcd, 'h', resultTm, record.countycode).then((data) => { drpSearch(record.type, record.stcd, 'h', resultTm, record.countycode).then((data) => {
@ -378,9 +378,9 @@ function DrpChart({ record }) {
option={option} option={option}
style={{ height: '15rem', width: '30rem' }} style={{ height: '15rem', width: '30rem' }}
/> />
<div className={classes.grid}> <div className={classes.grid} >
{/* <Typography variant="subtitle2">上报时间: {record.tm ? moment(record.tm).format('YYYY-MM-DD HH:mm:ss') : '-'}</Typography> */} <Typography variant="subtitle2" style={{color:"#ffffff"}}>上报时间: {record.tm ? moment(record.tm).format('YYYY-MM-DD HH:mm:ss') : '-'}</Typography>
{/* <div className={classes.realdrpgrid}> <div className={classes.realdrpgrid}>
{ {
['h1', 'h3', 'h6', 'h12', 'h24'].map(key => ( ['h1', 'h3', 'h6', 'h12', 'h24'].map(key => (
<div key={key} className="item"> <div key={key} className="item">
@ -389,7 +389,7 @@ function DrpChart({ record }) {
</div> </div>
)) ))
} }
</div> */} </div>
</div> </div>
</> </>
) )

8
src/views/Home/InfoPops/RealDrpPop/index.js
View File

@ -9,9 +9,9 @@ function RealDrpTip({ record, dispatch }) {
const [type, setType] = useState('drp'); const [type, setType] = useState('drp');
const changeView = () => { // const changeView = () => {
setType(type === 'drp' ? 'rz' : 'drp'); // setType(type === 'drp' ? 'rz' : 'drp');
} // }
const viewInfo = () => { const viewInfo = () => {
dispatch?.runtime.setInfoDlg({ layerId: 'RealDrpLayer', properties: record }) dispatch?.runtime.setInfoDlg({ layerId: 'RealDrpLayer', properties: record })
@ -26,7 +26,7 @@ function RealDrpTip({ record, dispatch }) {
<div className="extra cursor-pointer" onClick={viewInfo}>详细</div> <div className="extra cursor-pointer" onClick={viewInfo}>详细</div>
</div> </div>
{type === 'drp' ? <DrpChart record={record} /> : null} {type === 'drp' ? <DrpChart record={record} /> : null}
{type === 'rz' ? <HDChart record={record} /> : null} {/* {type === 'rz' ? <HDChart record={record} /> : null} */}
<div className="boxfoot"></div> <div className="boxfoot"></div>
</> </>
) )

20
src/views/Home/InfoPops/RealHDPop/HDChart.js
View File

@ -28,8 +28,8 @@ function HDChart({ record }) {
const [data, setData] = useState([]); const [data, setData] = useState([]);
const tm = [moment().add(-24, 'hour'), moment()]; const tm = [moment().add(-24, 'hour'), moment()];
const resultTm = normalizeSearchTmRange(tm, 'h'); // const resultTm = normalizeSearchTmRange(tm, 'h');
const resultTm = [moment(record.tm).add(-1,'days').format('YYYY-MM-DD HH:00:00'),moment(record.tm).format('YYYY-MM-DD HH:00:00')]//normalizeSearchTmRange(tm, 'h');
useEffect(() => { useEffect(() => {
rzSearch(record.type, record.stcd, 'h', resultTm, record.countycode).then((data) => { rzSearch(record.type, record.stcd, 'h', resultTm, record.countycode).then((data) => {
setData(data || []); setData(data || []);
@ -196,25 +196,25 @@ function HDChart({ record }) {
style={{ height: '15rem', width: '30rem' }} style={{ height: '15rem', width: '30rem' }}
/> />
<div className={classes.grid}> <div className={classes.grid}>
<Typography variant="subtitle2">上报时间: {rtm ? moment(rtm).format('YYYY-MM-DD HH:mm:ss') : '-'}</Typography> <Typography variant="subtitle2" style={{color:'#ffffff'}}>上报时间: {rtm ? moment(rtm).format('YYYY-MM-DD HH:mm:ss') : '-'}</Typography>
<div className={classes.realdrpgrid}> {/* <div className={classes.realdrpgrid}>
<div className="item"> <div className="item">
<Typography variant="caption">水位</Typography> <Typography variant="caption">水位</Typography>
<Typography variant="h5">{renderHDRz(record)}</Typography> <Typography variant="h5" style={{color:"#fff"}}>{renderHDRz(record)}</Typography>
</div> </div>
<div className="item"> <div className="item" >
<Typography variant="caption">设防水位</Typography> <Typography variant="caption">设防水位</Typography>
<Typography variant="h5">{record.sfz || '--'}</Typography> <Typography variant="h5" style={{color:"#fff"}}>{record.sfz || '--'}</Typography>
</div> </div>
<div className="item"> <div className="item">
<Typography variant="caption">警戒水位</Typography> <Typography variant="caption">警戒水位</Typography>
<Typography variant="h5">{record.wrz || '--'}</Typography> <Typography variant="h5" style={{color:"#fff"}}>{record.wrz || '--'}</Typography>
</div> </div>
<div className="item"> <div className="item">
<Typography variant="caption">保证水位</Typography> <Typography variant="caption">保证水位</Typography>
<Typography variant="h5">{record.grz || '--'}</Typography> <Typography variant="h5" style={{color:"#fff"}}>{record.grz || '--'}</Typography>
</div> </div>
</div> </div> */}
</div> </div>
</> </>
) )

21
src/views/Home/MapCtrl/index.js
View File

@ -126,12 +126,27 @@ export default function MapCtrl({ initParams, onLoad }) {
} }
layer.featureClicked(props, dispatch); layer.featureClicked(props, dispatch);
} }
if(feature.layer.id==='sk1111'||feature.layer.id==='sk2222'){ if(feature.layer.id==='sk1111'||feature.layer.id==='sk2222'||feature.layer.id==='临时水库tz'||feature.layer.id==='临时水库'){
const record = feature.properties const record = feature.properties
dispatch.runtime.setFeaturePop({ type: 'RealSkPop', properties: record, coordinates: [record.lgtd, record.lttd] }); if(feature.layer.id==='临时水库tz'){
dispatch.map.setView(203)
sessionStorage.setItem('lastCenter',JSON.stringify([record.lgtd, record.lttd]))
}
dispatch.runtime.setFeaturePop({ type: record.layerPop, properties: record, coordinates: [record.lgtd, record.lttd] });
} }
if(feature.layer.id==='关联站点'){ if (feature.layer.id === '关联站点') {
const record = feature.properties const record = feature.properties
if (record.cd_nm == 'GN1') {
dispatch?.runtime.setInfoDlg({ layerId: 'BxjcLayer', properties: record })
}else if (record.cd_nm == 'UPD1') {
dispatch?.runtime.setInfoDlg({ layerId: 'SyjcLayer', properties: record })
}else if (record.cd_nm == 'WE1') {
dispatch?.runtime.setInfoDlg({ layerId: 'SljcLayer', properties: record })
}else if (record.cd_nm == '0EA5DE') {
dispatch?.runtime.setInfoDlg({ layerId: 'ByjcLayer', properties: record })
}else if (record.stnm == '浮桥河水库') {
dispatch?.runtime.setInfoDlg({ layerId: 'RealSkLayer', properties: record })
}
// dispatch.runtime.setFeaturePop({ type: 'RealSkPop', properties: record, coordinates: [record.lgtd, record.lttd] }); // dispatch.runtime.setFeaturePop({ type: 'RealSkPop', properties: record, coordinates: [record.lgtd, record.lttd] });
} }
} }

6
src/views/Home/MapCtrl/mapstyle/bxjclayer.js
View File

@ -46,8 +46,8 @@ const ShapeStyle = {
const page1 = [ const page1 = [
{ {
"res_cd": "42118140035", "res_cd": "42118140035",
"res_lon": 115.14137, "res_lon": 114.88089,
"res_lat": 31.55095, "res_lat": 31.171467,
"cd": "01", "cd": "01",
"cd_nm": "GN1", "cd_nm": "GN1",
"stnm": "GN1", "stnm": "GN1",
@ -65,7 +65,7 @@ const page1 = [
"eng_scal": "小（1）型", "eng_scal": "小（1）型",
"danger_stat": "非病险水库", "danger_stat": "非病险水库",
"label": "2023高标准", "label": "2023高标准",
"res_nm": "大堰口水库", "res_nm": "浮桥河水库",
"de_value": -11.5381, "de_value": -11.5381,
"dn_value": -11.2248, "dn_value": -11.2248,
"du_value": 113.8833, "du_value": 113.8833,

54
src/views/Home/MapCtrl/mapstyle/byjclayer.js
View File

@ -72,36 +72,44 @@ export default class ByjcLayer extends BaseLayer {
let data = let data =
// await PicStPromise.get(); // await PicStPromise.get();
[ [
{ {
"res_cd": "42118140004", "cd": "1",
"res_nm": "永丰水库", "cd_nm": "UPD1",
"ch": "0+060",
"res_reg_cd": "42118140011-A4",
"res_cd": "42118140038",
"res_nm": "浮桥河水库",
"res_lon": 114.88299,
"res_lat": 31.172700,
"stnm": "UPD1",
"province_cd": "420000000000", "province_cd": "420000000000",
"province_nm": "湖北省", "province_nm": "湖北省",
stnm:'0FA5DE',
"city_cd": "421100000000", "city_cd": "421100000000",
"city_nm": "黄冈市", "city_nm": "黄冈市",
"county_cd": "421181000000", "county_cd": "421181000000",
"county_nm": "麻城市", "county_nm": "麻城市",
"town_cd": "421181003000", "town_cd": "421181113000",
"town_nm": "南湖办事处", "town_nm": "乘马岗镇",
"rv_name": "举水",
"bas_guid": "鄂东五河片区", "bas_guid": "鄂东五河片区",
"res_lon": 115.05541,
"res_lat": 31.11106,
"res_reg_cd": "42118140042-A4",
"eng_scal": "小（1）型", "eng_scal": "小（1）型",
"eng_g": "IV", "danger_stat": "非病险水库",
"children": [ "label": "2023高标准",
{ "value": 164.8742,
"res_cd": "42118140004", "diff_value": -0.0275,
"res_nm": "永丰水库", "trend": -1,
"cd": 5821, "is_has_data": "y",
"cd_nm": "永丰水库", "diff_rz": -0.6958,
"termite_status": "n", "stcd": "4239",
"tm": "2025-05-21 09:18:28", "diff_rz_cd": 5.0554,
"is_main_cd": "y" "max_cd_value": -0.0225,
} "rz": 165.57,
] "dt": "2025-05-20",
"diff5_value": -0.0737,
"trend5": -1,
"diff10_value": -0.1204,
"trend10": -1,
"diff30_value": -0.0633,
"trend30": -1
}, },
{ {
"res_cd": "42118140015", "res_cd": "42118140015",

6
src/views/Home/MapCtrl/mapstyle/realsklayer.js
View File

@ -50,7 +50,11 @@ const Style = {
], ],
'icon-size': [ 'icon-size': [
'interpolate', ['linear'], ['zoom'], 'interpolate', ['linear'], ['zoom'],
10, ['case', ['==', ['get', 'rzWarning'], 1], 0.6, 0.3], 10,
['case',
['!=', ['get', 'rzState'], 1], 0.4,
['==', ['get', 'rzWarning'], 1], 0.7,
0.7],
14, 0.7, 14, 0.7,
], ],
'text-size': [ 'text-size': [

9
src/views/Home/MapCtrl/mapstyle/sljclayer.js
View File

@ -71,16 +71,17 @@ export default class SljcLayer extends BaseLayer {
let data = let data =
// await PicStPromise.get(); // await PicStPromise.get();
[{ [
{
"cd": "1", "cd": "1",
"cd_nm": "WE", "cd_nm": "WE",
"ch": "1", "ch": "1",
'stnm':'WE', 'stnm':'WE',
"res_reg_cd": "42118140042-A4", "res_reg_cd": "42118140042-A4",
"res_cd": "42118140004", "res_cd": "42118140004",
"res_nm": "永丰水库", "res_nm": "浮桥河水库",
"res_lon": 115.05541, "res_lon": 114.88429,
"res_lat": 31.11106, "res_lat": 31.172700,
"province_cd": "420000000000", "province_cd": "420000000000",
"province_nm": "湖北省", "province_nm": "湖北省",
"city_cd": "421100000000", "city_cd": "421100000000",

6
src/views/Home/MapCtrl/mapstyle/syjclayer.js
View File

@ -78,9 +78,9 @@ export default class SyjcLayer extends BaseLayer {
"ch": "0+060", "ch": "0+060",
"res_reg_cd": "42118140011-A4", "res_reg_cd": "42118140011-A4",
"res_cd": "42118140038", "res_cd": "42118140038",
"res_lon": 115.01664, "res_nm": "浮桥河水库",
"res_lat": 31.40681, "res_lon": 114.87929,
"res_nm": "蛤蟆岗水库", "res_lat": 31.171467,
"stnm": "UPD1", "stnm": "UPD1",
"province_cd": "420000000000", "province_cd": "420000000000",
"province_nm": "湖北省", "province_nm": "湖北省",

3
src/views/Home/PanelIndex.js
View File

@ -112,6 +112,7 @@ import Ddcg from './panels/Ddcg'
import Fadb from './panels/Fadb' import Fadb from './panels/Fadb'
import Sksltj from './panels/Sksltj' import Sksltj from './panels/Sksltj'
import Hsfy from './panels/Hsfy' import Hsfy from './panels/Hsfy'
import Cxsk from './panels/Cxsk'
@ -397,6 +398,8 @@ export default function PanelIndex({ name, style, ...params }) {
return <Sbyj style={style} /> return <Sbyj style={style} />
} else if (name === '供水负荷曲线') { } else if (name === '供水负荷曲线') {
return <Gsfhqx style={style} /> return <Gsfhqx style={style} />
} else if (name === '超汛水库') {
return <Cxsk style={style} />
} }

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

@ -19,15 +19,16 @@ const VIEWS = [
{ id: 7, title: '调度', img: '/assets/menu/辅助决策.png' }, { id: 7, title: '调度', img: '/assets/menu/辅助决策.png' },
] ]
}, },
{ id: 200, title: '水库', img: '/assets/menu/水库专题.png',children:[ // { id: 200, title: '水库', img: '/assets/menu/水库专题.png',children:[
{ id: 207, title: '水库总览', img: '/assets/menu/水库管理.png' }, // { id: 207, title: '水库总览', img: '/assets/menu/水库管理.png' },
// { id: 201, title: '雨情监测', img: '/assets/menu/雨情监测.png' }, // // { id: 201, title: '雨情监测', img: '/assets/menu/雨情监测.png' },
// { id: 202, title: '水情监测', img: '/assets/menu/水情监测.png' }, // // { id: 202, title: '水情监测', img: '/assets/menu/水情监测.png' },
{ id: 203, title: '水库监测', img: '/assets/menu/安全监测.png' }, // { id: 203, title: '水库监测', img: '/assets/menu/安全监测.png' },
// { id: 204, title: '视频监视', img: '/assets/menu/视频监视.png' }, // // { id: 204, title: '视频监视', img: '/assets/menu/视频监视.png' },
{ id: 205, title: '防汛调度', img: '/assets/menu/防汛调度.png' }, // { id: 205, title: '防汛调度', img: '/assets/menu/防汛调度.png' },
{ id: 206, title: '巡查维养', img: '/assets/menu/水库管理.png' }, // { id: 206, title: '巡查维养', img: '/assets/menu/水库管理.png' },
] }, // ] },
{ id: 200, title: '水库', img: '/assets/menu/水库专题.png'},
{ {
id: 300, title: '水厂', img: '/assets/menu/水利设施.png', children: [ id: 300, title: '水厂', img: '/assets/menu/水利设施.png', children: [
{ id: 301, title: '供水态势', img: '/assets/menu/降雨中心.png' }, { id: 301, title: '供水态势', img: '/assets/menu/降雨中心.png' },
@ -136,7 +137,7 @@ export default function ActionDock({ }) {
} }
} }
}}> }}>
<div className={clsx('button', { active: view === o.id })}> <div className={clsx('button', { active: o.id===200?(view===207||view===203||view===205||view===206||view===200):view === o.id })}>
<img width={32} height={32} src={o.img} /> <img width={32} height={32} src={o.img} />
</div> </div>
</div> </div>

4
src/views/Home/components/DrpSearch/index.js
View File

@ -188,8 +188,8 @@ function DrpSearch({ record }) {
"year": "2025" "year": "2025"
} }
] ]
const [stm, handleDateChange1] = useState(() => moment().add(-1, 'd')); const [stm, handleDateChange1] = useState(() => moment(record.tm).add(-1, 'd'));
const [etm, handleDateChange2] = useState(() => moment()); const [etm, handleDateChange2] = useState(() => moment(record.tm));
const [data, setData] = useState([]); const [data, setData] = useState([]);
const searchTm = useMemo(() => { const searchTm = useMemo(() => {

7
src/views/Home/components/RzSearch/index.js
View File

@ -9,11 +9,12 @@ import ReactEcharts from 'echarts-for-react';
import moment from 'moment' import moment from 'moment'
import rzOption from './rzOption'; import rzOption from './rzOption';
import DpAlert from '../../../../layouts/mui/DpAlert'; import DpAlert from '../../../../layouts/mui/DpAlert';
import { backgroundColor } from 'echarts/lib/theme/dark';
function RzSearch({ record }) { function RzSearch({ record }) {
console.log('r', record); console.log('r', record);
const [selectedDate1, handleDateChange1] = useState(() => moment().add(-1, 'd')); const [selectedDate1, handleDateChange1] = useState(() => moment(record.tm).add(-1, 'd'));
const [selectedDate2, handleDateChange2] = useState(() => moment()); const [selectedDate2, handleDateChange2] = useState(() => moment(record.tm));
const [data, setData] = useState([]); const [data, setData] = useState([]);
const searchTm = useMemo(() => { const searchTm = useMemo(() => {
@ -64,7 +65,7 @@ function RzSearch({ record }) {
<DpAlert style={{ width: '100%' }} severity="error">{searchTm.error}</DpAlert> <DpAlert style={{ width: '100%' }} severity="error">{searchTm.error}</DpAlert>
</DpToolComponent> </DpToolComponent>
) : ( ) : (
<DpResultComponent> <DpResultComponent >
<ReactEcharts <ReactEcharts
option={option} option={option}
style={{ height: '100%' }} style={{ height: '100%' }}

12
src/views/Home/components/RzSearch/rzOption.js
View File

@ -1,5 +1,6 @@
import echarts from 'echarts/lib/echarts'; import echarts from 'echarts/lib/echarts';
import { hdyjColor } from '../../../../utils/renutils'; import { hdyjColor } from '../../../../utils/renutils';
import { backgroundColor } from 'echarts/lib/theme/dark';
export default function rzOption({ data, skinfo }) { export default function rzOption({ data, skinfo }) {
const serialData = data.map(obj => [obj.tm, obj.rz || obj.z || 0]); const serialData = data.map(obj => [obj.tm, obj.rz || obj.z || 0]);
@ -19,14 +20,15 @@ export default function rzOption({ data, skinfo }) {
]; ];
} else if (data[0]) { } else if (data[0]) {
const { sfz, wrz, grz } = data[0]; const { sfz, wrz, grz } = data[0];
const recordWrz = wrz||skinfo.wrz;
markLine.data = []; markLine.data = [];
if (sfz) { if (sfz) {
sorted.push(sfz) sorted.push(sfz)
markLine.data.push({ label: { formatter: '设防水位' }, yAxis: sfz, lineStyle: { color: hdyjColor[1] } }); markLine.data.push({ label: { formatter: '设防水位' }, yAxis: sfz, lineStyle: { color: hdyjColor[1] } });
} }
if (wrz) { if (recordWrz) {
sorted.push(wrz) sorted.push(recordWrz)
markLine.data.push({ label: { formatter: '警戒水位' }, yAxis: wrz, lineStyle: { color: hdyjColor[2] } }); markLine.data.push({ label: { formatter: '警戒水位' + `(${recordWrz})` }, yAxis: recordWrz, lineStyle: { color: hdyjColor[2] } });
} }
if (grz) { if (grz) {
sorted.push(grz) sorted.push(grz)
@ -51,9 +53,9 @@ export default function rzOption({ data, skinfo }) {
} }
}, },
grid: { grid: {
x: 24, x: 25,
y: 24, y: 24,
x2: 38, x2: 100,
y2: 42, y2: 42,
borderWidth: 0 borderWidth: 0
}, },

30
src/views/Home/components/Title/index.js
View File

@ -155,6 +155,36 @@ export default function Title() {
</div> </div>
</div>:null </div>:null
} }
{
(view===203||view===205||view===206)?
<div style={{position:'absolute',left:'50%',top:'6rem',transform:'translate(-50%, 0px)',display:'flex'}}>
{
[
{name:'返回',key:200},
{name:'水库监测',key:203},
{name:'防汛调度',key:205},
{name:'巡查维养',key:206},
].map((item)=>
<>
<div style={{padding:'1rem',color:item.key===view?'#65dbfb':'#ffffff',cursor:'pointer',margin:"0 1rem"}} onClick={()=>{
dispatch.map.setView(item.key)
if(item.key===200){
const center = JSON.parse(sessionStorage.getItem('lastCenter'))
if(center){
dispatch.runtime.setCameraTarget({
center: center,
zoom: 15,
pitch: 50,
bearing: 0
});
}
}
}}>{item.name}</div>
</>
)
}
</div>:null
}
</div> </div>
) )
} }

2
src/views/Home/panels/BxSkOverall/OverallContent.js
View File

@ -67,7 +67,7 @@ export default function OverallContent({ data, skAll }) {
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}>261mm</span>；
共产生<span className={classes.number}>3</span>个山洪预警（2个内部预警，1个外部预警），均已处置；<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>
{/* <div> {/* <div>

76
src/views/Home/panels/Bxjc/index.js
View File

@ -14,12 +14,13 @@ import clsx from 'clsx';
import { renderDrp } from '../../../../utils/renutils'; import { renderDrp } from '../../../../utils/renutils';
const data1 = [ const data1 = [
{ {
"res_cd": "42118140035", "res_cd": "42118140035",
"res_lon": 115.14137, "res_lon": 114.88089,
"res_lat": 31.55095, "res_lat": 31.171467,
"cd": "01", "cd": "01",
"cd_nm": "GN1", "cd_nm": "GN1",
"stnm": "GN1",
"res_reg_cd": "42118140006-A4", "res_reg_cd": "42118140006-A4",
"ch": "0+000", "ch": "0+000",
"province_cd": "420000000000", "province_cd": "420000000000",
@ -34,50 +35,17 @@ const data1 = [
"eng_scal": "小（1）型", "eng_scal": "小（1）型",
"danger_stat": "非病险水库", "danger_stat": "非病险水库",
"label": "2023高标准", "label": "2023高标准",
"res_nm": "大堰口水库", "res_nm": "浮桥河水库",
"de_value": -4.2885, "de_value": -11.5381,
"dn_value": -13.5384, "dn_value": -11.2248,
"du_value": 132.4892, "du_value": 113.8833,
"de_trend": null, "de_trend": null,
"dn_trend": null, "dn_trend": null,
"du_trend": null, "du_trend": null,
"max_de": 1.0981, "max_de": 2.9303,
"max_dn": -2.3255, "max_dn": -2.1648,
"max_du": 132.4892, "max_du": 113.8833,
"dt": "2025-05-20", "dt": "2025-05-25",
"is_has_data": "y"
},
{
"res_cd": "42118140035",
"res_lon": 115.14137,
"res_lat": 31.55095,
"cd": "03",
"cd_nm": "GN3",
"res_reg_cd": "42118140006-A4",
"ch": "0+000",
"province_cd": "420000000000",
"province_nm": "湖北省",
"city_cd": "421100000000",
"city_nm": "黄冈市",
"county_cd": "421181000000",
"county_nm": "麻城市",
"town_cd": "421181112000",
"town_nm": "福田河镇",
"bas_guid": "鄂东五河片区",
"eng_scal": "小（1）型",
"danger_stat": "非病险水库",
"label": "2023高标准",
"res_nm": "大堰口水库",
"de_value": -10.73,
"dn_value": -9.8975,
"du_value": 121.3495,
"de_trend": null,
"dn_trend": null,
"du_trend": null,
"max_de": 1.0981,
"max_dn": -2.3255,
"max_du": 132.4892,
"dt": "2025-05-20",
"is_has_data": "y" "is_has_data": "y"
}, },
{ {
@ -640,14 +608,16 @@ function DrpReal({ style }) {
<DpTableRow key={row.stcd}> <DpTableRow key={row.stcd}>
<DpTableCell component="th" scope="row"> <DpTableCell component="th" scope="row">
<div className="table-ellipsis cursor-pointer" onClick={() => { <div className="table-ellipsis cursor-pointer" onClick={() => {
const { res_lon:lgtd, res_lat:lttd } = row; const { res_lon: lgtd, res_lat: lttd,res_nm:stnm } = row;
if (lgtd && lttd) { if (stnm == '浮桥河水库') {
dispatch.runtime.setCameraTarget({ if (lgtd && lttd) {
center: [lgtd, lttd], dispatch.runtime.setCameraTarget({
zoom: 15, center: [lgtd, lttd],
pitch: 60, zoom: 17,
bearing: 0 pitch: 60,
}); bearing: 0
});
}
} }
}}>{row.res_nm}</div> }}>{row.res_nm}</div>
</DpTableCell> </DpTableCell>

1306
src/views/Home/panels/Byjc/index.js
View File

File diff suppressed because it is too large Load Diff

218
src/views/Home/panels/Cxsk/ARzSk.js Normal file
View File

@ -0,0 +1,218 @@
import React, { useEffect, useMemo, useState } from 'react';
import moment from 'moment';
import { Typography, Collapse,Table, TableContainer, TableBody,TableHead, TableRow, TableSortLabel } from '@material-ui/core';
import DpTableCell from '../../../../layouts/mui/DpTableCell';
import DpTableRow from '../../../../layouts/mui/DpTableRow';
import { useDispatch } from 'react-redux';
import { InfoPopNames } from '../../InfoPops';
import { MailOutline } from '@material-ui/icons';
import { parseGeoJSON } from "../../../../utils/tools";
import { skInfo } from '../../../../models/_/search';
import config from '../../../../config';
function Item({ data, viewInfo, sendMessage }) {
return (
<div className="item">
<div className={`header alertsk`}>
</div>
<div className="content">
<div className="main">
<div className="title cursor-pointer" onClick={() => viewInfo(data)}>{data.stnm}</div>
<div className="span"></div>
<div className="extra">+{(data.rz - data.fsltdz).toFixed(2)}</div>
</div>
<div className="desc">
<Typography variant="body2">
水库汛限水位<span className="bold">{data.fsltdz}</span>m。
</Typography>
<Typography variant="body2">
实时监测水位<span className="bold">{data.rz}</span>m，超出汛限水位<span className="bold red">{(data.rz - data.fsltdz).toFixed(2)}</span>m
</Typography>
</div>
<div className="tail">
<span>{moment(data.rzTm).format('YYYY-MM-DD HH:mm')}</span>
<MailOutline className="action" onClick={() => sendMessage(data)} />
</div>
</div>
</div>
);
}
function ARzSk({data}) {
data = [{
"stcd": "716129061",
"type": "sk",
"hasRz": true,
"stnm": "仰天窝水库",
"adcd": "421181201000",
"wscd": null,
"importancy": 0,
"lgtd": 115.106667,
"lttd": 31.126389,
"elev": 0,
"damel": 325.08,
"dsflz": 324.18,
"fsltdz": 323.5,
"ddz": 319.5,
"zcxsw": 323.5,
"drpTm": "2025-04-11T05:00:00.000Z",
"today": 0,
"h1": 0,
"h3": 0,
"h6": 0,
"h12": 0,
"h24": 0,
"h48": 0,
"drpState": 2,
"rz": 325.16,
"w": 0.132,
"a_fsltdz": 4.660000000000025,
"rzTm": "2025-04-11T05:00:00.000Z",
"rzWarning": 1,
"rzState": 2,
"pic": [
{
"stcd": "716129061",
"tm": "2023-03-12T06:05:00.000Z",
"url": "http://223.75.53.106:8891/skjgimages/2023/0312/716129061/20230312140500.jpg"
},
{
"stcd": "716129061",
"tm": "2023-03-12T07:25:00.000Z",
"url": "http://223.75.53.106:8891/skjgimages/2023/0312/716129062/20230312152500.jpg"
}
],
"layer": "RealSkLayer",
"layerPop": "RealSkPop",
"aRz": 4.66,
"strarz": "4.66"
}];
useEffect(()=>{
return ()=>{
const map = window.__mapref;
const layer = map.getLayer('临时水库')
if(layer){
map.removeLayer('临时水库');
map.removeSource('临时水库');
}
}
},[])
const dispatch = useDispatch();
const flyTo = (record) => {
const { lgtd, lttd } = record;
if (lgtd && lttd) {
// dispatch.runtime.setFeaturePop({ type: InfoPopNames.RealSkPop, properties: record, coordinates: [lgtd, lttd] });
dispatch.runtime.setCameraTarget({
center: [lgtd, lttd+0.005],
zoom: 15,
pitch: config.poiPitch,
});
}
}
const sendMessage = (record) => {
skInfo(record).then(data => {
if (data) {
console.log(record, data);
const txt = `${record.stnm}在${moment(record.rzTm).format('D日H时')}测得水位为${record.rz}米，超汛限水位(${record.fsltdz})${(record.rz - record.fsltdz).toFixed(2)}米，请做好核实防范工作。`;
dispatch.runtime.setInfoDlg({ layerId: 'SkSmtp', properties: { stnm: data.stnm, stcd: data.stcd, personels: data.personels, txt } })
}
})
}
const setSkLayer = (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': '水库-超汛限', // 从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('临时水库').setData(parseGeoJSON(data))
}
return (
// <div className="dppanel-shyj">
// {
// data.map(o => (
// <Item key={o.stcd} viewInfo={flyTo} sendMessage={sendMessage} data={o} />
// ))
// }
// </div>
<TableContainer style={{ height: '12.8rem' }}>
<Table size="small" stickyHeader>
<TableHead>
<TableRow>
<DpTableCell style={{ minWidth: '4rem' }} align="left">水库名称</DpTableCell>
<DpTableCell style={{ minWidth: '5rem' }} align="center">类型</DpTableCell>
<DpTableCell style={{ minWidth: '3rem' }} align="center">水位(m)</DpTableCell>
<DpTableCell style={{ minWidth: '6rem' }} align="center">监测时间</DpTableCell>
</TableRow>
</TableHead>
{
data.map((tableRow,index)=>
<TableBody>
<DpTableRow key={tableRow.stcd}>
<DpTableCell align="center" >
<div className="table-ellipsis cursor-pointer" onClick={()=>{
flyTo(tableRow)
setSkLayer([tableRow])
}}>
{tableRow.stnm}
</div>
</DpTableCell>
<DpTableCell align="center" >小(2)型</DpTableCell>
<DpTableCell align="center" >{tableRow.rz}</DpTableCell>
<DpTableCell align="center" >{moment(tableRow.tm).format('YYYY-MM-DD HH:mm:ss')}</DpTableCell>
</DpTableRow>
</TableBody>
)
}
</Table>
</TableContainer>
)
}
export default ARzSk;

17
src/views/Home/panels/Cxsk/index.js Normal file
View File

@ -0,0 +1,17 @@
import clsx from 'clsx';
import React from 'react';
import PanelBox from '../../components/PanelBox';
import ARzSk from './ARzSk';
export default function Warn({ style }) {
return (
<PanelBox
style={style}
title="超汛水库"
color="green"
>
<ARzSk />
</PanelBox>
)
}

14
src/views/Home/panels/Drpfx/index.js
View File

@ -204,7 +204,11 @@ export default function Overall({ style }) {
<Button <Button
key={item.value} key={item.value}
className={classes.timeButton} className={classes.timeButton}
onClick={() => setTimeRange(item.value)} onClick={() => {
if (item.value == '1h' || item.value == '3h') {
setTimeRange(item.value)
}
}}
variant={timeRange === item.value ? 'contained' : 'outlined'} variant={timeRange === item.value ? 'contained' : 'outlined'}
style={{ padding: '5px 10px' }} style={{ padding: '5px 10px' }}
> >
@ -255,10 +259,10 @@ export default function Overall({ style }) {
{/* 展开的详细内容可以在这里添加 */}{ {/* 展开的详细内容可以在这里添加 */}{
station.id == 'heavy' && drpData.map(item => ( station.id == 'heavy' && drpData.map(item => (
<TableRow onClick={() =>flyTo(item)}> <TableRow onClick={() =>flyTo(item)}>
<DpTableCell style={{ width: '25%' }}>{item.stnm}</DpTableCell> <DpTableCell style={{ width: '53%' }}>{item.stnm}</DpTableCell>
<DpTableCell style={{ width: '20%' }}>{item.today}</DpTableCell> <DpTableCell style={{ width: '10%' }}>{item.today}</DpTableCell>
<DpTableCell style={{ width: '25%' }}>阎家河镇</DpTableCell> <DpTableCell style={{ width: '20%' }}>阎家河镇</DpTableCell>
<DpTableCell style={{ width: '30%' }}>桃林河</DpTableCell> <DpTableCell style={{ width: '27%' }}>桃林河</DpTableCell>
</TableRow> </TableRow>
)) ))
} }

72
src/views/Home/panels/Glzd/index.js
View File

@ -24,6 +24,7 @@ const DRP_COLORS = [
'rgb(136, 11, 29)', 'rgb(136, 11, 29)',
] ]
const data1 = [ const data1 = [
{ {
"stcd": "61612150", "stcd": "61612150",
@ -887,14 +888,16 @@ function DrpReal({ style }) {
} }
} }
},[skObj]) },[skObj])
const [showDrp, setShowdDrp] = 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){ if(tab==='1'&&drpData && showDrp){
setLayer(drpData,'drp') setLayer(drpData,'drp')
} }
if(tab==='2'&&hdData){ if(tab==='2'&&hdData && showHd){
setLayer(hdData,'hd') setLayer(hdData,'hd')
} }
if(tab==='3'&&data3){ if(tab==='3'&&data3){
@ -916,7 +919,7 @@ function DrpReal({ style }) {
}, 500); }, 500);
} }
},[drpData,hdData,skObj,tab]) },[drpData,hdData,skObj,tab,showDrp,showHd])
@ -940,7 +943,8 @@ function DrpReal({ style }) {
} }
}); });
} }
setDrpData(data) const newData = [data[1],data[0]]
setDrpData(newData)
} }
const getHd = async(skObj)=>{ const getHd = async(skObj)=>{
@ -963,7 +967,8 @@ function DrpReal({ style }) {
} }
}); });
} }
setHdData(data) const newData = [data[1],data[0]]
setHdData(newData)
} }
const setLayer = (data=[],type)=>{ const setLayer = (data=[],type)=>{
@ -1208,21 +1213,32 @@ function DrpReal({ style }) {
map.getSource('关联站点').setData(parseGeoJSON(data)) map.getSource('关联站点').setData(parseGeoJSON(data))
} }
// useEffect(() => {
// setLayer(skdata,"sk")
// }, [])
useEffect(() => {
setShowdHd(0)
setShowdDrp(0)
}, [tab])
return ( return (
<PanelBox <PanelBox
style={style} style={style}
title="关联站点" title="水雨情监测"
color="green" color="green"
tabs={ tabs={
<span className="button-group"> <span className="button-group">
<span className={clsx({ active: tab==='1' })} onClick={() => { <span className={clsx({ active: tab==='1' })} onClick={() => {
setTab('1') setTab('1')
}}>雨量站</span> }}>雨量站</span>
<span className={clsx({ active: tab==='2' })} onClick={() => { <span className={clsx({ active: tab==='2' })} onClick={() => {
setTab('2') setTab('2')
}}>水位站</span> }}>水位站</span>
<span className={clsx({ active: tab==='3' })} onClick={() => { {/* <span className={clsx({ active: tab==='3' })} onClick={() => {
setTab('3') setTab('3')
}}>流量站</span> }}>流量站</span>
<span className={clsx({ active: tab==='4' })} onClick={() => { <span className={clsx({ active: tab==='4' })} onClick={() => {
@ -1230,7 +1246,7 @@ function DrpReal({ style }) {
}}>图像站</span> }}>图像站</span>
<span className={clsx({ active: tab==='5' })} onClick={() => { <span className={clsx({ active: tab==='5' })} onClick={() => {
setTab('5') setTab('5')
}}>视频站</span> }}>视频站</span> */}
</span> </span>
} }
> >
@ -1254,14 +1270,17 @@ function DrpReal({ style }) {
<DpTableCell component="th" scope="row"> <DpTableCell component="th" scope="row">
<div className="table-ellipsis cursor-pointer" onClick={() => { <div className="table-ellipsis cursor-pointer" onClick={() => {
const { lgtd, lttd } = row; const { lgtd, lttd } = row;
if (lgtd && lttd) { if (row.stnm == '浮桥河') {
dispatch.runtime.setFeaturePop({ type: 'RealDrpPop', properties: row, coordinates: [row.lgtd, row.lttd] }); setShowdDrp(1)
dispatch.runtime.setCameraTarget({ if (lgtd && lttd) {
center: [lgtd, lttd], dispatch.runtime.setFeaturePop({ type: 'RealDrpPop', properties: row, coordinates: [row.lgtd, row.lttd] });
zoom: 15, dispatch.runtime.setCameraTarget({
pitch: 60, center: [lgtd, lttd],
bearing: 0 zoom: 15,
}); pitch: 60,
bearing: 0
});
}
} }
}}>{row.stnm}</div> }}>{row.stnm}</div>
</DpTableCell> </DpTableCell>
@ -1289,14 +1308,17 @@ function DrpReal({ style }) {
<DpTableCell component="th" scope="row"> <DpTableCell component="th" scope="row">
<div className="table-ellipsis cursor-pointer" onClick={() => { <div className="table-ellipsis cursor-pointer" onClick={() => {
const { lgtd, lttd } = row; const { lgtd, lttd } = row;
if (lgtd && lttd) { if (row.stnm == '浮桥河') {
dispatch.runtime.setFeaturePop({ type: 'RealHDPop', properties: row, coordinates: [row.lgtd, row.lttd] }); setShowdHd(1)
dispatch.runtime.setCameraTarget({ if (lgtd && lttd) {
center: [lgtd, lttd], dispatch.runtime.setFeaturePop({ type: 'RealHDPop', properties: row, coordinates: [row.lgtd, row.lttd] });
zoom: 15, dispatch.runtime.setCameraTarget({
pitch: 60, center: [lgtd, lttd],
bearing: 0 zoom: 15,
}); pitch: 60,
bearing: 0
});
}
} }
}}>{row.stnm}</div> }}>{row.stnm}</div>
</DpTableCell> </DpTableCell>

73
src/views/Home/panels/HdWarning/index.js
View File

@ -1,5 +1,6 @@
import React, { useState } from 'react'; import React, { useState,useCallback} from 'react';
import { OverallPromise } from '../../../../models/_/real'; import { OverallPromise } from '../../../../models/_/real';
import { useDispatch, useSelector } from 'react-redux';
import useRequest from '../../../../utils/useRequest'; import useRequest from '../../../../utils/useRequest';
import PanelBox from '../../components/PanelBox'; import PanelBox from '../../components/PanelBox';
import OverallContent from './OverallContent'; import OverallContent from './OverallContent';
@ -22,7 +23,13 @@ import {
import AddIcon from '@material-ui/icons/Add'; import AddIcon from '@material-ui/icons/Add';
import RemoveIcon from '@material-ui/icons/Remove'; import RemoveIcon from '@material-ui/icons/Remove';
import DpTableCell from '../../../../layouts/mui/DpTableCell'; import DpTableCell from '../../../../layouts/mui/DpTableCell';
import useRefresh from '../../../../utils/useRefresh';
import { hdyjUnclose } from '../../../../models/_/hdyj';
import moment from 'moment';
import { HDRealPromise } from '../../../../models/_/real';
import { InfoPopNames } from '../../InfoPops';
import { hdyjLatestClosed } from '../../../../models/_/hdyj';
import config from '../../../../config';
const useStyles = makeStyles((theme) => ({ const useStyles = makeStyles((theme) => ({
root: { root: {
color: '#fff', color: '#fff',
@ -90,7 +97,24 @@ const useStyles = makeStyles((theme) => ({
} }
})); }));
export default function Overall({ style }) { export default function Overall({ style }) {
const dispatch = useDispatch();
const t = useRefresh(60 * 1000);
const hdyj =[{
"stcd": "61612900",
"stnm": "阎家河",
"adcd": null,
"wscd": null,
"importancy": 0,
"lgtd": 115.128722,
"lttd": 31.207,
"elev": null,
"hasRz": true,
"type": "sw",
"tm": "2025-06-03T02:00:00.000Z",
"rz": 61.75,
"state": 1,
wrz:61.6
}]
const classes = useStyles(); const classes = useStyles();
const [types, setTypes] = useState({ const [types, setTypes] = useState({
mountain: true, mountain: true,
@ -109,8 +133,8 @@ export default function Overall({ style }) {
}; };
const stations = [ const stations = [
{ id: 'history', name: '超危险水位', count: 0, type: 'pink' }, { id: 'history', name: '超危险水位', count: 0, type: 'pink',types:'wx' },
{ id: '100year', name: '超警戒水位', count: 0, type: 'purple' }, { id: '100year', name: '超警戒水位', count: 1, type: 'purple',types:'jj' },
]; ];
const toggleExpand = (id) => { const toggleExpand = (id) => {
@ -119,6 +143,19 @@ export default function Overall({ style }) {
[id]: !prev[id] [id]: !prev[id]
})); }));
}; };
const flyTo = useCallback(async ({ stcd, source }) => {
const list = await HDRealPromise.get() || [];
const record = list.find(o => o.stcd === stcd) || {};
const { lgtd, lttd } = record;
if (lgtd && lttd) {
dispatch.runtime.setFeaturePop({ type: InfoPopNames.RealHDPop, properties: {...record,wrz:61.6}, coordinates: [lgtd, lttd] });
dispatch.runtime.setCameraTarget({
center: [lgtd, lttd],
zoom: 15,
pitch: config.poiPitch,
});
}
}, [dispatch]);
return ( return (
<PanelBox <PanelBox
@ -175,13 +212,25 @@ export default function Overall({ style }) {
<DpTableCell colSpan={4} style={{ padding: 0 }}> <DpTableCell colSpan={4} style={{ padding: 0 }}>
<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}`}>
{/* 展开的详细内容可以在这里添加 */} {
{/* <TableRow> station.types == 'jj' ? hdyj.map(item => (
<DpTableCell style={{ width: '25%' }}>站名</DpTableCell> <TableRow onClick={() => flyTo(item)}>
<DpTableCell style={{ width: '20%' }}>水位(m)</DpTableCell> <DpTableCell style={{ width: '40%' }}><div
<DpTableCell style={{ width: '25%' }}>所属政区</DpTableCell> className="table-ellipsis cursor-pointer"
<DpTableCell style={{ width: '30%' }}>所属流域</DpTableCell> >{item.stnm}</div></DpTableCell>
</TableRow> */} <DpTableCell style={{ width: '20%' }}><div
className="table-ellipsis cursor-pointer"
>{item.rz}</div></DpTableCell>
<DpTableCell style={{ width: '24%' }}><div
className="table-ellipsis cursor-pointer"
>{item.stnm}镇</div></DpTableCell>
<DpTableCell style={{ width: '20%' }}>{item.stnm}</DpTableCell>
</TableRow>
))
:
<Typography>暂无详细信息</Typography>
}
</Box> </Box>
</Collapse> </Collapse>
</DpTableCell> </DpTableCell>

28
src/views/Home/panels/Overall/OverallContent.js
View File

@ -100,28 +100,28 @@ export default function OverallContent({ data }) {
}) })
} else { } else {
const obj = { const obj = {
'Q9123':{ 'Q9111':{
"stcd": "Q9123", "stcd": "Q9111",
"stnm": "下白米", "stnm": "福田河",
"adcd": null, "adcd": null,
"wscd": null, "wscd": null,
"importancy": 0, "importancy": 0,
"lgtd": 115.1217, "lgtd": 115.0944,
"lttd": 30.8992, "lttd": 31.4747,
"elev": null, "elev": null,
"hasRz": false, "hasRz": false,
"type": "qx", "type": "qx",
"today": 17.8, "today": 50.3,
"h1": 7.2, "h1": 50.2,
"h3": 14.3, "h3": 50.2,
"h6": 22.7, "h6": 50.2,
"h12": 24.2, "h12": 50.2,
"h24": 45.2, "h24": 50.3,
"h48": 123.5, "h48": 50.3,
"tm": "2025-06-08T03:00:00.000Z", "tm": "2025-06-06T22:00:00.000Z",
"state": 1, "state": 1,
"warning": 0 "warning": 0
}, },
} }
_showRecord(obj[stcd], InfoPopNames.RealDrpPop) _showRecord(obj[stcd], InfoPopNames.RealDrpPop)

8
src/views/Home/panels/ShWarning/index.js
View File

@ -105,13 +105,13 @@ export default function Overall({ style }) {
{ {
type: 'immediate', type: 'immediate',
label: '立即转移', label: '立即转移',
count: 3, count: 0,
details: [] // 这里可以添加详细信息的数组 details: [] // 这里可以添加详细信息的数组
}, },
{ {
type: 'prepare', type: 'prepare',
label: '准备转移', label: '准备转移',
count: 0, count: 3,
details: [] // 这里可以添加详细信息的数组 details: [] // 这里可以添加详细信息的数组
} }
]; ];
@ -278,10 +278,8 @@ export default function Overall({ style }) {
<DpTableCell colSpan={3} style={{ padding: 0 }}> <DpTableCell colSpan={3} style={{ padding: 0 }}>
<Collapse in={expanded[row.type]} timeout="auto" unmountOnExit> <Collapse in={expanded[row.type]} timeout="auto" unmountOnExit>
<Box className={classes.expandedContent}> <Box className={classes.expandedContent}>
{/* 这里可以添加展开后显示的详细内容 */}
{/* <Typography>暂无详细信息</Typography> */}
{ {
row.type == 'immediate' ? zyData.map(item => ( row.type == 'prepare' ? zyData.map(item => (
<TableRow onClick={() => flyTo(item)}> <TableRow onClick={() => flyTo(item)}>
<DpTableCell style={{ width: '30%' }}><div <DpTableCell style={{ width: '30%' }}><div
className="table-ellipsis cursor-pointer" className="table-ellipsis cursor-pointer"

14
src/views/Home/panels/SkReal/index.js
View File

@ -90,8 +90,8 @@ function SkReal({ style }) {
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> */}
</> </>
} }
> >
@ -100,16 +100,16 @@ function SkReal({ style }) {
<TableHead> <TableHead>
<TableRow> <TableRow>
<DpTableCell style={{ maxWidth: '30%' }} align="left">名称</DpTableCell> <DpTableCell style={{ maxWidth: '30%' }} align="left">名称</DpTableCell>
<DpTableCell align="right">{appconsts.drpTtype[tableSkDrpField]}降雨</DpTableCell> <DpTableCell style={{ minWidth: '6rem' }} align="right">{appconsts.drpTtype[tableSkDrpField]}降雨</DpTableCell>
<DpTableCell align="right">水位</DpTableCell> <DpTableCell style={{ minWidth: '3rem' }} align="right">水位</DpTableCell>
<DpTableCell align="right">超汛限</DpTableCell> <DpTableCell style={{ minWidth: '4rem' }} align="right">超汛限</DpTableCell>
</TableRow> </TableRow>
</TableHead> </TableHead>
<TableBody> <TableBody>
{sortedData.map((row) => ( {[...sortedData.filter(o=>o.rzState===1),...sortedData.filter(o=>o.rzState!==1)].map((row) => (
<DpTableRow key={row.stcd}> <DpTableRow key={row.stcd}>
<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" onClick={() => flyTo(row)}>{row.rzState===1?row.stnm:row.stnm+'(离线)'}</div>
</DpTableCell> </DpTableCell>
<DpTableCell align="right">{row['h24']}</DpTableCell> <DpTableCell align="right">{row['h24']}</DpTableCell>
<DpTableCell align="right">{row?.rz}</DpTableCell> <DpTableCell align="right">{row?.rz}</DpTableCell>

96
src/views/Home/panels/SkWarning/index.js
View File

@ -130,50 +130,52 @@ export default function Overall({ style }) {
})); }));
}; };
const skData = [{ const skData =[{
"stcd": "716113701", "stcd": "716129061",
"type": "sk", "type": "sk",
"hasRz": true, "hasRz": true,
"stnm": "永红水库", "stnm": "仰天窝水库",
"adcd": "421181105000", "adcd": "421181201000",
"wscd": null, "wscd": null,
"importancy": 0, "importancy": 0,
"lgtd": 115.120278, "lgtd": 115.106667,
"lttd": 31.183611, "lttd": 31.126389,
"elev": 0, "elev": 0,
"damel": 131.99, "damel": 325.08,
"dsflz": 130.56, "dsflz": 324.18,
"fsltdz": 129.9, "fsltdz": 323.5,
"ddz": 113.5, "ddz": 319.5,
"zcxsw": 129.9, "zcxsw": 323.5,
"drpTm": "2025-04-11T06:00:00.000Z", "drpTm": "2025-04-11T05:00:00.000Z",
"today": 0, "today": 0,
"h1": 0, "h1": 0,
"h3": 0, "h3": 0,
"h6": 0, "h6": 0,
"h12": 0, "h12": 0,
"h24": 0, "h24": 0,
"h48": 0, "h48": 0,
"drpState": 2, "drpState": 2,
"rz": 130.15, "rz": 325.16,
"w": 0.444, "w": 0.132,
"a_fsltdz": -10.75, "a_fsltdz": 4.660000000000025,
"rzTm": "2025-04-11T06:00:00.000Z", "rzTm": "2025-04-11T05:00:00.000Z",
"rzWarning": 0, "rzWarning": 1,
"rzState": 2, "rzState": 2,
"pic": [ "pic": [
{ {
"stcd": "716113701", "stcd": "716129061",
"tm": "2023-11-16T11:19:00.000Z", "tm": "2023-03-12T06:05:00.000Z",
"url": "http://223.75.53.106:8891/skjgimages/2023/1116/716113701/20231116191900.jpg" "url": "http://223.75.53.106:8891/skjgimages/2023/0312/716129061/20230312140500.jpg"
}, },
{ {
"stcd": "716113701", "stcd": "716129061",
"tm": "2023-11-16T09:05:00.000Z", "tm": "2023-03-12T07:25:00.000Z",
"url": "http://223.75.53.106:8891/skjgimages/2023/1116/716113702/20231116170500.jpg" "url": "http://223.75.53.106:8891/skjgimages/2023/0312/716129062/20230312152500.jpg"
} }
] ],
},] "aRz": 4.66,
"strarz": "4.66"
}];
const flyTo = () => { const flyTo = () => {
const { lgtd, lttd } = skData[0]; const { lgtd, lttd } = skData[0];
if (lgtd && lttd) { if (lgtd && lttd) {
@ -247,11 +249,11 @@ export default function Overall({ style }) {
station.id == "cxx" && <TableRow onClick={() => flyTo()}> station.id == "cxx" && <TableRow onClick={() => flyTo()}>
<DpTableCell style={{ width: '20%' }}><div <DpTableCell style={{ width: '20%' }}><div
className="table-ellipsis cursor-pointer" className="table-ellipsis cursor-pointer"
>永红水库</div></DpTableCell> >仰天窝水库</div></DpTableCell>
<DpTableCell style={{ width: '20%' }}>130.15(0.25)</DpTableCell> <DpTableCell style={{ width: '20%' }}>325.16(1.66)</DpTableCell>
<DpTableCell style={{ width: '20%' }}><div <DpTableCell style={{ width: '20%' }}><div
className="table-ellipsis cursor-pointer" className="table-ellipsis cursor-pointer"
>阎家河镇</div></DpTableCell> >龟山镇</div></DpTableCell>
<DpTableCell style={{ width: '20%' }}>阎家河</DpTableCell> <DpTableCell style={{ width: '20%' }}>阎家河</DpTableCell>
<DpTableCell style={{ width: '20%' }}><a <DpTableCell style={{ width: '20%' }}><a
className="table-ellipsis cursor-pointer" className="table-ellipsis cursor-pointer"

12
src/views/Home/panels/Sksltj/index.js
View File

@ -202,7 +202,7 @@ function DrpReal({ style }) {
return ( return (
<PanelBox <PanelBox
style={style} style={style}
title="水量统计" title="水资源利用"
color="green" color="green"
extra={ extra={
<> <>
@ -214,20 +214,20 @@ function DrpReal({ style }) {
// dispatch.map.setLayerVisible({'ByjcLayer':false}); // dispatch.map.setLayerVisible({'ByjcLayer':false});
setTab('生态') setTab('生态')
}}>生态</span> }}>生态</span>
<span className={clsx({ active: tab==='灌溉' })} onClick={() => { <span className={clsx({ active: tab==='灌溉发电' })} onClick={() => {
// dispatch.map.setLayerVisible({'BxjcLayer':false}); // dispatch.map.setLayerVisible({'BxjcLayer':false});
// dispatch.map.setLayerVisible({'SyjcLayer':true}); // dispatch.map.setLayerVisible({'SyjcLayer':true});
// dispatch.map.setLayerVisible({'SljcLayer':false}); // dispatch.map.setLayerVisible({'SljcLayer':false});
// dispatch.map.setLayerVisible({'ByjcLayer':false}); // dispatch.map.setLayerVisible({'ByjcLayer':false});
setTab('灌溉') setTab('灌溉发电')
}}>灌溉</span> }}>灌溉发电</span>
<span className={clsx({ active: tab==='发电' })} onClick={() => { {/* <span className={clsx({ active: tab==='发电' })} onClick={() => {
// dispatch.map.setLayerVisible({'BxjcLayer':false}); // dispatch.map.setLayerVisible({'BxjcLayer':false});
// dispatch.map.setLayerVisible({'SyjcLayer':false}); // dispatch.map.setLayerVisible({'SyjcLayer':false});
// dispatch.map.setLayerVisible({'SljcLayer':true}); // dispatch.map.setLayerVisible({'SljcLayer':true});
// dispatch.map.setLayerVisible({'ByjcLayer':false}); // dispatch.map.setLayerVisible({'ByjcLayer':false});
setTab('发电') setTab('发电')
}}>发电</span> }}>发电</span> */}
<span className={clsx({ active: tab==='泄洪' })} onClick={() => { <span className={clsx({ active: tab==='泄洪' })} onClick={() => {
// dispatch.map.setLayerVisible({'BxjcLayer':false}); // dispatch.map.setLayerVisible({'BxjcLayer':false});
// dispatch.map.setLayerVisible({'SyjcLayer':false}); // dispatch.map.setLayerVisible({'SyjcLayer':false});

18
src/views/Home/panels/Skzl/collapsePage.js Normal file
View File

@ -0,0 +1,18 @@
function Page({ type,name,num1,num2,skType,setSkType }) {
return (
<div style={{width:'100%',display:'flex',fontSize:'0.9rem', color:'#ffffff',padding:'0.5rem 0.5rem 0.5rem 1rem',borderRadius:'5px',background:'#132a4b',alignItems:'center',marginBottom:'1px',cursor:'pointer'}} onClick={()=>{
setSkType(skType!==type?type:'')
}}>
<img src={`${process.env.PUBLIC_URL}/assets/icon/大型水库.svg`} width={15} height={15} alt=""/>
<div style={{flex:1,paddingLeft:'0.8rem',marginBottom:'-0.1rem'}}>{name}</div>
<div style={{marginBottom:'-0.1rem'}}>{num1}座</div>
<div style={{margin:'0 1rem -0.1rem 1rem'}}>{num2}亿m³</div>
<img src={`${process.env.PUBLIC_URL}/assets/icon/${skType===type?'收起':'展开'}.png`} style={{cursor:'pointer'}} width={20} alt="" />
</div>
)
}
export default Page;

32
src/views/Home/panels/Skzl/countPage.js Normal file
View File

@ -0,0 +1,32 @@
function Page({ style }) {
return (
<div style={{width:'100%',display:'flex'}}>
<div style={{width:'100%',display:'flex',alignItems:'flex-start',padding:'0.5rem 0',justifyContent:'space-around'}}>
<div style={{width:'24%',display:'flex',flexDirection:'column',alignItems:'center',border:'1px solid rgba(36, 136, 223, 0.4)',paddingTop:'0.2rem',background:'#132a4b'}}>
<img src={`${process.env.PUBLIC_URL}/assets/icon/大型水库.svg`} width={20} alt=""/>
<div style={{color:'#ffffff',fontSize:'0.8rem',marginTop:'0.1rem'}}>大型水库</div>
<div style={{color:'#ffffff',fontSize:'0.8rem',lineHeight:'1rem'}}><span style={{color:'#7dd188',fontSize:'1.2rem'}}>3</span> 座</div>
</div>
<div style={{width:'24%',display:'flex',flexDirection:'column',alignItems:'center',border:'1px solid rgba(36, 136, 223, 0.4)',paddingTop:'0.2rem',background:'#132a4b'}}>
<img src={`${process.env.PUBLIC_URL}/assets/icon/大型水库.svg`} width={20} alt=""/>
<div style={{color:'#ffffff',fontSize:'0.8rem',marginTop:'0.1rem'}}>中型水库</div>
<div style={{color:'#ffffff',fontSize:'0.8rem',lineHeight:'1rem'}}><span style={{color:'#7dd188',fontSize:'1.2rem'}}>3</span> 座</div>
</div>
<div style={{width:'24%',display:'flex',flexDirection:'column',alignItems:'center',border:'1px solid rgba(36, 136, 223, 0.4)',paddingTop:'0.2rem',background:'#132a4b'}}>
<img src={`${process.env.PUBLIC_URL}/assets/icon/大型水库.svg`} width={20} alt=""/>
<div style={{color:'#ffffff',fontSize:'0.8rem',marginTop:'0.1rem'}}>小(1)型水库</div>
<div style={{color:'#ffffff',fontSize:'0.8rem',lineHeight:'1rem'}}><span style={{color:'#7dd188',fontSize:'1.2rem'}}>3</span> 座</div>
</div>
<div style={{width:'24%',display:'flex',flexDirection:'column',alignItems:'center',border:'1px solid rgba(36, 136, 223, 0.4)',paddingTop:'0.2rem',background:'#132a4b'}}>
<img src={`${process.env.PUBLIC_URL}/assets/icon/大型水库.svg`} width={20} alt=""/>
<div style={{color:'#ffffff',fontSize:'0.8rem',marginTop:'0.1rem'}}>小(2)型水库</div>
<div style={{color:'#ffffff',fontSize:'0.8rem',lineHeight:'1rem'}}><span style={{color:'#7dd188',fontSize:'1.2rem'}}>3</span> 座</div>
</div>
</div>
</div>
)
}
export default Page;

178
src/views/Home/panels/Skzl/index.js
View File

@ -1,13 +1,125 @@
import React, { useMemo, useState } from 'react'; import React, { useEffect, useMemo, useState } from 'react';
import { Switch, FormControlLabel,InputLabel, Select, MenuItem,FormControl } from '@material-ui/core/index' import { Switch, Collapse,Table, TableContainer, TableBody,TableHead, TableRow, TableSortLabel } from '@material-ui/core/index'
import DpTableCell from '../../../../layouts/mui/DpTableCell';
import DpTableRow from '../../../../layouts/mui/DpTableRow';
import PanelBox from '../../components/PanelBox'; import PanelBox from '../../components/PanelBox';
import AreaDrpChart from './chart'; import { parseGeoJSON } from "../../../../utils/tools";
import { SkRealPromise } from "../../../../models/_/real";
import { useDispatch, useSelector } from 'react-redux';
import CountPage from './countPage'
import CollapsePage from './collapsePage'
function DrpReal({ style }) { function DrpReal({ style }) {
const [dimension, setDimension] =useState('ft'); const [dimension, setDimension] =useState('ft');
const [skData,setSkData] = useState([])
const [skType,setSkType] = useState('')
const [sort,setSort] = useState(true)
const dispatch = useDispatch();
const tableData = useMemo(()=>{
if(skType==='1'){
return (skData.filter(o=>o.w>10000)||[]).sort((a,b)=>sort?(b.w-a.w):(a.w-b.w))
}
if(skType==='2'){
return (skData.filter(o=>o.w>100 && o.w<=10000)||[]).sort((a,b)=>sort?(b.w-a.w):(a.w-b.w))
}
if(skType==='3'){
return (skData.filter(o=>o.w>0.375 && o.w<=100)||[]).sort((a,b)=>sort?(b.w-a.w):(a.w-b.w))
}
if(skType==='4'){
return (skData.filter(o=>o.w>=0 && o.w<=0.375)||[]).sort((a,b)=>sort?(b.w-a.w):(a.w-b.w))
}
return []
},[skData,skType,sort])
const skTypeObj = [
{type:'1',name:'大型水库',num1:3,num2:7.9316},//8.735
{type:'2',name:'中型水库',num1:7,num2:1.627},
{type:'3',name:'小(1)型水库',num1:43,num2:1.627},
{type:'4',name:'小(2)型水库',num1:207,num2:8.735},
]
useEffect(()=>{
getSkData()
// return ()=>{
// const map = window.__mapref;
// const layer = map.getLayer('临时水库tz')
// if(layer){
// map.removeLayer('临时水库tz');
// map.removeSource('临时水库tz');
// }
// }
},[])
const getSkData = async()=>{
const data = await SkRealPromise.get();
setSkData(data)
}
const flyTo = (row)=>{
const { lgtd, lttd } = row;
if (lgtd && lttd) {
// dispatch.runtime.setFeaturePop({ type: 'RealSkPop', properties: row, coordinates: [row.lgtd, row.lttd] });
dispatch.runtime.setCameraTarget({
center: [lgtd, lttd],
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))
}
return ( return (
<PanelBox <PanelBox
@ -15,18 +127,54 @@ function DrpReal({ style }) {
title="水库总览" title="水库总览"
color="green" color="green"
> >
<div style={{width:'100%',height:"14rem",display:'flex',marginTop:'-15px'}}> <CountPage/>
<div style={{margin:'10px auto',width:'70%'}}> {
<AreaDrpChart data={[]} /> skTypeObj.map((item)=>
</div> (<>
<div style={{width:'30%',display:'flex',flexDirection:'column',justifyContent:'center'}}> <CollapsePage type={item.type} name={item.name} num1={item.num1} num2={item.num2} skType={skType} setSkType={setSkType}/>
<div style={{display:'flex',alignItems:'center',color:'#cdddf7',cursor:'pointer',marginTop:'35px'}}><div style={{width:'8px',height:'8px',borderRadius:'8px',background:'#6187e6',marginRight:'10px'}}></div>大型水库</div> <Collapse in={skType===item.type} timeout="auto" unmountOnExit>
<div style={{display:'flex',alignItems:'center',color:'#cdddf7',cursor:'pointer',marginTop:'10px'}}><div style={{width:'8px',height:'8px',borderRadius:'8px',background:'#77caa1',marginRight:'10px'}}></div>中型水库</div> <TableContainer style={{ height: '12.8rem' }}>
<div style={{display:'flex',alignItems:'center',color:'#cdddf7',cursor:'pointer',marginTop:'10px'}}><div style={{width:'8px',height:'8px',borderRadius:'8px',background:'#5c6988',marginRight:'10px'}}></div>小(1)型水库</div> <Table size="small" stickyHeader>
<div style={{display:'flex',alignItems:'center',color:'#cdddf7',cursor:'pointer',marginTop:'10px'}}><div style={{width:'8px',height:'8px',borderRadius:'8px',background:'#e2b642',marginRight:'10px'}}></div>小(2)型水库</div> <TableHead>
</div> <TableRow>
</div> <DpTableCell style={{ minWidth: '1rem' }} align="left">序号</DpTableCell>
<div style={{width:'100%',color:'#E0F6F7',padding:"0 15px"}}><div style={{width:'2rem',display:'inline-block'}}></div>麻城市共有 325 座水库，其中大型水库 3 座（浮桥河水库45490万m³、明山水库16900万m³、三河口水库16926万m³），中型水库 7 座（总库容约 1.627亿m³），小（1）型水库 44 座、小（2）型水库 271 座，全市水库总库容约 11.56 亿m³。</div> <DpTableCell style={{ minWidth: '5rem' }} align="center">水库名称</DpTableCell>
<DpTableCell style={{ minWidth: '8rem' }} align="center">类型</DpTableCell>
<DpTableCell style={{ minWidth: '8rem' }} align="center">
<TableSortLabel
onClick={() => setSort(!sort)}
active={true}
direction={sort?'desc':'asc'}>
{'库容(万m³)'}
</TableSortLabel>
</DpTableCell>
</TableRow>
</TableHead>
{
tableData.map((tableRow,index)=>
<TableBody>
<DpTableRow key={tableRow.stcd}>
<DpTableCell align="center" >{index+1}</DpTableCell>
<DpTableCell align="center" >
<div className="table-ellipsis cursor-pointer" onClick={()=>{
flyTo(tableRow)
setSkLayer([tableRow])
}}>
{tableRow.stnm}
</div>
</DpTableCell>
<DpTableCell align="center" >{item.name}</DpTableCell>
<DpTableCell align="center" >{tableRow.w}</DpTableCell>
</DpTableRow>
</TableBody>
)
}
</Table>
</TableContainer>
</Collapse>
</>)
)
}
</PanelBox> </PanelBox>
) )
} }

59
src/views/Home/panels/Sljc/index.js
View File

@ -12,34 +12,35 @@ import DpTableCell from '../../../../layouts/mui/DpTableCell';
import DpTableRow from '../../../../layouts/mui/DpTableRow'; import DpTableRow from '../../../../layouts/mui/DpTableRow';
import clsx from 'clsx'; import clsx from 'clsx';
import { renderDrp } from '../../../../utils/renutils'; import { renderDrp } from '../../../../utils/renutils';
const data3 = [{ const data3 =[{
"cd": "1", "cd": "1",
"cd_nm": "WE", "cd_nm": "WE",
"ch": "1", "ch": "1",
"res_reg_cd": "42118140042-A4", 'stnm':'WE',
"res_cd": "42118140004", "res_reg_cd": "42118140042-A4",
"res_nm": "永丰水库", "res_cd": "42118140004",
"res_lon": 115.05541, "res_nm": "浮桥河水库",
"res_lat": 31.11106, "res_lon": 114.88429,
"province_cd": "420000000000", "res_lat": 31.172700,
"province_nm": "湖北省", "province_cd": "420000000000",
"city_cd": "421100000000", "province_nm": "湖北省",
"city_nm": "黄冈市", "city_cd": "421100000000",
"county_cd": "421181000000", "city_nm": "黄冈市",
"county_nm": "麻城市", "county_cd": "421181000000",
"town_cd": "421181003000", "county_nm": "麻城市",
"town_nm": "南湖办事处", "town_cd": "421181003000",
"danger_stat": "非病险水库", "town_nm": "南湖办事处",
"bas_guid": "鄂东五河片区", "danger_stat": "非病险水库",
"label": "2023高标准", "bas_guid": "鄂东五河片区",
"eng_scal": "小（1）型", "label": "2023高标准",
"value": 0.3, "eng_scal": "小（1）型",
"diff_value": -0.02, "value": 0.3,
"trend": -1, "diff_value": -0.02,
"dt": "2025-05-20", "trend": -1,
"is_has_data": "y", "dt": "2025-05-20",
"max_value": 0.3 "is_has_data": "y",
}] "max_value": 0.3
}]
function DrpReal({ style }) { function DrpReal({ style }) {
@ -73,7 +74,7 @@ function DrpReal({ style }) {
if (lgtd && lttd) { if (lgtd && lttd) {
dispatch.runtime.setCameraTarget({ dispatch.runtime.setCameraTarget({
center: [lgtd- 0.0029, lttd], center: [lgtd- 0.0029, lttd],
zoom: 15, zoom: 17,
pitch: 60, pitch: 60,
bearing: 0 bearing: 0
}); });

24
src/views/Home/panels/Syjc/index.js
View File

@ -19,9 +19,9 @@ const data2 = [
"ch": "0+060", "ch": "0+060",
"res_reg_cd": "42118140011-A4", "res_reg_cd": "42118140011-A4",
"res_cd": "42118140038", "res_cd": "42118140038",
"res_lon": 115.01664, "res_lon": 114.87929,
"res_lat": 31.40681, "res_lat": 31.171467,
"res_nm": "蛤蟆岗水库", "res_nm": "浮桥河水库",
"province_cd": "420000000000", "province_cd": "420000000000",
"province_nm": "湖北省", "province_nm": "湖北省",
"city_cd": "421100000000", "city_cd": "421100000000",
@ -730,14 +730,16 @@ function DrpReal({ style }) {
<DpTableRow key={row.stcd}> <DpTableRow key={row.stcd}>
<DpTableCell component="th" scope="row"> <DpTableCell component="th" scope="row">
<div className="table-ellipsis cursor-pointer" onClick={() => { <div className="table-ellipsis cursor-pointer" onClick={() => {
const { res_lon:lgtd, res_lat:lttd } = row; const { res_lon: lgtd, res_lat: lttd,res_nm:stnm } = row;
if (lgtd && lttd) { if (stnm == '浮桥河水库') {
dispatch.runtime.setCameraTarget({ if (lgtd && lttd) {
center: [lgtd + 0.0019, lttd], dispatch.runtime.setCameraTarget({
zoom: 15, center: [lgtd+ 0.0019, lttd],
pitch: 60, zoom: 17,
bearing: 0 pitch: 60,
}); bearing: 0
});
}
} }
}}>{row.res_nm}</div> }}>{row.res_nm}</div>
</DpTableCell> </DpTableCell>

3
src/views/Home/panels/Warn/Hdyj.js
View File

@ -88,7 +88,8 @@ function Hdyj({ data }) {
}, [dispatch]); }, [dispatch]);
const showdata = hisdata?.length > 0 ? hisdata : (data || []); const showdata = hisdata?.length > 0 ? hisdata : (data || []);
console.log("showdata",showdata);
return ( return (
<div className="dppanel-shyj"> <div className="dppanel-shyj">
{ {

67
src/views/Home/panels/Yuanyfa/WaterLevelAlert/index.js Normal file
View File

@ -0,0 +1,67 @@
import React, { useState, useEffect } from 'react';
import './index.less';
const WaterLevelAlert = () => {
const [position, setPosition] = useState(0);
const alerts = [
{
reservoir: '浮桥河水库',
time: '06月08日02时',
level: '65.01',
overLimit: '0.12',
},
{
reservoir: '浮桥河水库',
time: '06月08日02时',
level: '93.4',
overLimit: '0.40',
}
];
useEffect(() => {
const height = 24; // 每个项目的高度
const totalHeight = height * alerts.length;
let currentPosition = 0;
const animate = () => {
currentPosition += height;
if (currentPosition >= totalHeight) {
currentPosition = 0;
}
setPosition(currentPosition);
};
const timer = setInterval(animate, 3000);
return () => clearInterval(timer);
}, []);
// 复制一份数据用于无缝滚动
const displayAlerts = [...alerts, ...alerts];
return (
<div className="water-level-alert">
<div className="alert-container">
<div
className="alert-wrapper"
style={{
transform: `translateY(-${position}px)`,
transition: position === 0 ? 'none' : 'transform 0.5s ease-in-out'
}}
>
{displayAlerts.map((alert, index) => (
<div key={index} className="alert-item">
<span className="alert-text">
预计{alert.reservoir}于 {alert.time}水位将上涨至
{alert.level} m (超汛限水位{alert.overLimit}m)，
请做好防范
</span>
</div>
))}
</div>
</div>
</div>
);
};
export default WaterLevelAlert;

32
src/views/Home/panels/Yuanyfa/WaterLevelAlert/index.less Normal file
View File

@ -0,0 +1,32 @@
.water-level-alert {
background: rgba(0, 32, 51, 0.9);
padding: 10px 20px;
border-radius: 4px;
border: 1px solid #0088cc;
.alert-container {
height: 24px;
overflow: hidden;
}
.alert-wrapper {
will-change: transform;
}
.alert-item {
height: 24px;
display: flex;
align-items: center;
}
.alert-text {
color: #ffffff;
font-size: 14px;
white-space: nowrap;
&::before {
content: '⚠️';
margin-right: 8px;
}
}
}

5
src/views/Home/panels/Yuanyfa/index.js
View File

@ -19,6 +19,7 @@ import { RadioGroup, Radio, Switch, FormControlLabel, InputLabel, Select, MenuIt
import { backgroundColor } from 'echarts/lib/theme/dark'; import { backgroundColor } from 'echarts/lib/theme/dark';
import { Description } from '@material-ui/icons'; import { Description } from '@material-ui/icons';
import DescriptionItem from '../../components/DescrptionItem'; import DescriptionItem from '../../components/DescrptionItem';
import WaterLevelAlert from './WaterLevelAlert'
export default function Warn({ style }) { export default function Warn({ style }) {
const dispatch = useDispatch(); const dispatch = useDispatch();
const res = useSelector(s => s.runtime.yyObj) const res = useSelector(s => s.runtime.yyObj)
@ -168,6 +169,10 @@ export default function Warn({ style }) {
<img src={`${process.env.PUBLIC_URL}/assets/sl.jpg`} alt="" style={{ width: 421}} /> <img src={`${process.env.PUBLIC_URL}/assets/sl.jpg`} alt="" style={{ width: 421}} />
</div> */} </div> */}
</div>} </div>}
<div style={{ color: "#fff", position: 'absolute', top: 90, right: 600 }}>
<WaterLevelAlert />
</div>
</div> </div>
</PanelBox> </PanelBox>
) )