From dd42432cb2d3a55730a3f940f002096f1a81fe80 Mon Sep 17 00:00:00 2001 From: yunkexin <760754045@qq.com> Date: Wed, 10 Jul 2024 17:04:32 +0800 Subject: [PATCH] =?UTF-8?q?=E5=88=9D=E5=A7=8B=E5=8C=96=E6=95=B0=E6=8D=AE?= =?UTF-8?q?=EF=BC=8C=E6=8E=A5=E5=8F=A3=E6=9C=89=E5=AF=B9=E5=BA=94=E5=80=BC?= =?UTF-8?q?=E5=B0=B1=E5=8F=96=E6=8E=A5=E5=8F=A3=E7=9A=84=E5=80=BC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/layout/RiskFour.js | 930 +++++++++++++++++++++++++++++------------ 1 file changed, 666 insertions(+), 264 deletions(-) diff --git a/src/layout/RiskFour.js b/src/layout/RiskFour.js index 653ab98..6307ee1 100644 --- a/src/layout/RiskFour.js +++ b/src/layout/RiskFour.js @@ -7,9 +7,7 @@ import EnergyIcon from "../utils/energyIcon"; import { $consts } from "../plugins"; import styles from "./risk.less"; import echarts from "echarts"; -import { - initFilter, -} from '../utils/common' +import { initFilter } from "../utils/common"; import realGif from "../assets/risk/backno.jpg"; import red from "../assets/risk/red.png"; import orange from "../assets/risk/orange.png"; @@ -44,9 +42,7 @@ import backSeven2 from "../assets/risk/7-2.png"; import backSeven3 from "../assets/risk/7-3.png"; import backSeven4 from "../assets/risk/7-4.png"; import qrcode from "../assets/risk/1.png"; -import { - FullScreenContainer, -} from "@jiaminghi/data-view-react"; +import { FullScreenContainer } from "@jiaminghi/data-view-react"; class RiskFour extends React.Component { constructor(props) { @@ -58,6 +54,7 @@ class RiskFour extends React.Component { RISKLEVELCOUNTS: [ { NAME: "东排土场", + LEVEL: 1, LEVEL1: 1, LEVEL2: 2, LEVEL3: 3, @@ -65,6 +62,7 @@ class RiskFour extends React.Component { }, { NAME: "堆矿场", + LEVEL: 3, LEVEL1: 3, LEVEL2: 2, LEVEL3: 3, @@ -72,6 +70,7 @@ class RiskFour extends React.Component { }, { NAME: "622工业场地", + LEVEL: 4, LEVEL1: 4, LEVEL2: 2, LEVEL3: 3, @@ -79,6 +78,7 @@ class RiskFour extends React.Component { }, { NAME: "露天生产区", + LEVEL: 3, LEVEL1: 3, LEVEL2: 2, LEVEL3: 3, @@ -86,6 +86,7 @@ class RiskFour extends React.Component { }, { NAME: "终了边坡区域", + LEVEL: 2, LEVEL1: 2, LEVEL2: 2, LEVEL3: 3, @@ -93,6 +94,7 @@ class RiskFour extends React.Component { }, { NAME: "烧结厂", + LEVEL: 1, LEVEL1: 1, LEVEL2: 2, LEVEL3: 3, @@ -100,6 +102,7 @@ class RiskFour extends React.Component { }, { NAME: "580回风井口", + LEVEL: 2, LEVEL1: 2, LEVEL2: 2, LEVEL3: 3, @@ -125,52 +128,208 @@ class RiskFour extends React.Component { data6: {}, data7: {}, + content: "", + content2: "", + content3: "", + content4: "", + content5: "", + content6: "", content7: "", }; } componentDidMount() { - this.getRiskData() + this.state.RiskData.Data.RISKLEVELCOUNTS.map((item, index) => { if (item.NAME == "东排土场") { this.setState({ - level1: item.LEVEL1, + level1: item.LEVEL, data1: item, + content: ( +
+
区域名称:{item.NAME}
+
+
+
较大风险:{item.LEVEL2}
+
一般风险:{item.LEVEL3}
+
+
+ {/* 33 */} +
+
+
+ ), }); } if (item.NAME == "堆矿场") { this.setState({ - level2: item.LEVEL1, + level2: item.LEVEL, data2: item, + content2: ( +
+
区域名称:{item.NAME}
+
+
+
较大风险:{item.LEVEL2}
+
一般风险:{item.LEVEL3}
+
+
+ {/* 33 */} +
+
+
+ ), }); } if (item.NAME == "622工业场地") { this.setState({ - level3: item.LEVEL1, + level3: item.LEVEL, data3: item, + content3: ( +
+
区域名称:{item.NAME}
+
+
+
较大风险:{item.LEVEL2}
+
一般风险:{item.LEVEL3}
+
+
+ {/* 33 */} +
+
+
+ ), }); } if (item.NAME == "露天生产区") { this.setState({ - level4: item.LEVEL1, + level4: item.LEVEL, data4: item, + content4: ( +
+
区域名称:{item.NAME}
+
+
+
较大风险:{item.LEVEL2}
+
一般风险:{item.LEVEL3}
+
+
+ {/* 33 */} +
+
+
+ ), }); } if (item.NAME == "终了边坡区域") { this.setState({ - level5: item.LEVEL1, + level5: item.LEVEL, data5: item, + content5: ( +
+
区域名称:{item.NAME}
+
+
+
较大风险:{item.LEVEL2}
+
一般风险:{item.LEVEL3}
+
+
+ {/* 33 */} +
+
+
+ ), }); } if (item.NAME == "烧结厂") { this.setState({ - level6: item.LEVEL1, + level6: item.LEVEL, data6: item, + content6: ( +
+
区域名称:{item.NAME}
+
+
+
较大风险:{item.LEVEL2}
+
一般风险:{item.LEVEL3}
+
+
+ {/* 33 */} +
+
+
+ ), }); } if (item.NAME == "580回风井口") { this.setState({ - level7: item.LEVEL1, + level7: item.LEVEL, data7: item, content7: (
@@ -188,11 +347,11 @@ class RiskFour extends React.Component {
一般风险:{item.LEVEL3}
- 33 + > */}
@@ -200,6 +359,7 @@ class RiskFour extends React.Component { }); } }); + this.getRiskData(); // this.setState({ // content7:
//
区域名称:{this.state.data7.NAME}
@@ -215,12 +375,230 @@ class RiskFour extends React.Component { url: "HM/HMEvaluateRisk/getRiskLevelCountData", payload: json, onComplete: (ret) => { - if (ret ) { - console.log(ret,'989989') + if (ret) { + ret.RISKLEVELCOUNTS.map((item,index)=>{ + if (item.NAME == "东排土场") { + this.setState({ + level1: item.LEVEL, + data1: item, + content: ( +
+
区域名称:{item.NAME}
+
+
+
较大风险:{item.LEVEL2}
+
一般风险:{item.LEVEL3}
+
+
+ {/* 33 */} +
+
+
+ ), + }); + } + if (item.NAME == "堆矿场") { + this.setState({ + level2: item.LEVEL, + data2: item, + content2: ( +
+
区域名称:{item.NAME}
+
+
+
较大风险:{item.LEVEL2}
+
一般风险:{item.LEVEL3}
+
+
+ {/* 33 */} +
+
+
+ ), + }); + } + if (item.NAME == "622工业场地") { + this.setState({ + level3: item.LEVEL, + data3: item, + content3: ( +
+
区域名称:{item.NAME}
+
+
+
较大风险:{item.LEVEL2}
+
一般风险:{item.LEVEL3}
+
+
+ {/* 33 */} +
+
+
+ ), + }); + } + if (item.NAME == "露天生产区") { + this.setState({ + level4: item.LEVEL, + data4: item, + content4: ( +
+
区域名称:{item.NAME}
+
+
+
较大风险:{item.LEVEL2}
+
一般风险:{item.LEVEL3}
+
+
+ {/* 33 */} +
+
+
+ ), + }); + } + if (item.NAME == "终了边坡区域") { + this.setState({ + level5: item.LEVEL, + data5: item, + content5: ( +
+
区域名称:{item.NAME}
+
+
+
较大风险:{item.LEVEL2}
+
一般风险:{item.LEVEL3}
+
+
+ {/* 33 */} +
+
+
+ ), + }); + } + if (item.NAME == "烧结厂") { + this.setState({ + level6: item.LEVEL, + data6: item, + content6: ( +
+
区域名称:{item.NAME}
+
+
+
较大风险:{item.LEVEL2}
+
一般风险:{item.LEVEL3}
+
+
+ {/* 33 */} +
+
+
+ ), + }); + } + if (item.NAME == "580回风井口") { + this.setState({ + level7: item.LEVEL, + data7: item, + content7: ( +
+
区域名称:{item.NAME}
+
+
+
较大风险:{item.LEVEL2}
+
一般风险:{item.LEVEL3}
+
+
+ {/* 33 */} +
+
+
+ ), + }); + } + }) } }, }); - } + }; render() { return ( @@ -230,261 +608,285 @@ class RiskFour extends React.Component { 1 - {/* 东排土场 */} -
- 2 -
-
- 3 -
- {/* 堆矿场 */} -
- 4 -
-
- {" "} - 5 -
- {/* 622工业场地 */} -
- 6 -
-
- {" "} - 7 -
- {/* 露天生产区 */} -
- 8 -
-
- {" "} - 9 -
- {/* 终了边坡区域 */} -
- 10 -
-
- {" "} - 11 -
- {/* 烧结厂 */} -
- 12 -
-
- {" "} - 13 -
- {/* 580回风井口 */} -
- 14 -
-
- {" "} - +
+ {/* 东排土场背景区域 */} +
+ 2 +
+ {/* 堆矿场 */} +
+ 4 +
+ {/* 622工业场地 */} +
+ 6 +
+ {/* 露天生产区 */} +
+ 8 +
+ {/* 终了边坡区域 */} +
+ 10 +
{" "} + {/* 烧结厂 */} +
+ 12 +
{" "} + {/* 580回风井口 */} +
15 - +
+
+ +
+
+ + 3 + +
+
+ + 5 + +
+
+ {" "} + + 7 + +
+
+ {" "} + + 9 + +
+
+ {" "} + + 11 + +
+
+ {" "} + + 13 + +
{" "} +
+ {" "} + + 15 + +