-
+ {/*
*/}
diff --git a/src/layout/RiskFour.js b/src/layout/RiskFour.js
new file mode 100644
index 0000000..f357f76
--- /dev/null
+++ b/src/layout/RiskFour.js
@@ -0,0 +1,491 @@
+import React, { useState, useEffect, useMemo, useRef } from "react";
+import { connect } from "dva";
+import { withRouter, matchPath } from "dva/router";
+import { Scrollbars } from "react-custom-scrollbars";
+import { Icon, Row, Col, Progress, Popover } from "antd";
+import EnergyIcon from "../utils/energyIcon";
+import { $consts } from "../plugins";
+import styles from "./risk.less";
+import echarts from "echarts";
+import realGif from "../assets/risk/backno.jpg";
+import red from "../assets/risk/red.png";
+import orange from "../assets/risk/orange.png";
+import yellow from "../assets/risk/yellow.png";
+import blue from "../assets/risk/blue.png";
+import back1 from "../assets/risk/1-1-1.png";
+import back2 from "../assets/risk/1-2.png";
+import back3 from "../assets/risk/1-3.png";
+import back4 from "../assets/risk/1-4.png";
+import backTwo1 from "../assets/risk/2-1-1.png";
+import backTwo2 from "../assets/risk/2-2.png";
+import backTwo3 from "../assets/risk/2-3.png";
+import backTwo4 from "../assets/risk/2-4.png";
+import backThree1 from "../assets/risk/3-1-1.png";
+import backThree2 from "../assets/risk/3-2.png";
+import backThree3 from "../assets/risk/3-3.png";
+import backThree4 from "../assets/risk/3-4.png";
+import backFour1 from "../assets/risk/4-1-1.png";
+import backFour2 from "../assets/risk/4-2.png";
+import backFour3 from "../assets/risk/4-3.png";
+import backFour4 from "../assets/risk/4-4.png";
+import backFive1 from "../assets/risk/5-1-1.png";
+import backFive2 from "../assets/risk/5-2.png";
+import backFive3 from "../assets/risk/5-3.png";
+import backFive4 from "../assets/risk/5-4.png";
+import backSix1 from "../assets/risk/6-1-1.png";
+import backSix2 from "../assets/risk/6-2.png";
+import backSix3 from "../assets/risk/6-3.png";
+import backSix4 from "../assets/risk/6-4.png";
+import backSeven1 from "../assets/risk/7-1-1.png";
+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";
+
+class RiskFour extends React.Component {
+ constructor(props) {
+ super(props);
+ this.state = {
+ RiskData: {
+ IsSuccessful: true,
+ Data: {
+ RISKLEVELCOUNTS: [
+ {
+ NAME: "东排土场",
+ LEVEL1: 1,
+ LEVEL2: 2,
+ LEVEL3: 3,
+ LEVEL4: 4,
+ },
+ {
+ NAME: "堆矿场",
+ LEVEL1: 3,
+ LEVEL2: 2,
+ LEVEL3: 3,
+ LEVEL4: 4,
+ },
+ {
+ NAME: "622工业场地",
+ LEVEL1: 4,
+ LEVEL2: 2,
+ LEVEL3: 3,
+ LEVEL4: 4,
+ },
+ {
+ NAME: "露天生产区",
+ LEVEL1: 3,
+ LEVEL2: 2,
+ LEVEL3: 3,
+ LEVEL4: 4,
+ },
+ {
+ NAME: "终了边坡区域",
+ LEVEL1: 2,
+ LEVEL2: 2,
+ LEVEL3: 3,
+ LEVEL4: 4,
+ },
+ {
+ NAME: "烧结厂",
+ LEVEL1: 1,
+ LEVEL2: 2,
+ LEVEL3: 3,
+ LEVEL4: 4,
+ },
+ {
+ NAME: "580回风井口",
+ LEVEL1: 2,
+ LEVEL2: 2,
+ LEVEL3: 3,
+ LEVEL4: 4,
+ },
+ ],
+ },
+ TotalCount: 0,
+ MessageType: 0,
+ },
+ level1: 0,
+ level2: 0,
+ level3: 0,
+ level4: 0,
+ level5: 0,
+ level6: 0,
+ level7: 0,
+ data1: {},
+ data2: {},
+ data3: {},
+ data4: {},
+ data5: {},
+ data6: {},
+ data7: {},
+
+ content7: "",
+ };
+ }
+
+ componentDidMount() {
+ this.getRiskData()
+ this.state.RiskData.Data.RISKLEVELCOUNTS.map((item, index) => {
+ if (item.NAME == "东排土场") {
+ this.setState({
+ level1: item.LEVEL1,
+ data1: item,
+ });
+ }
+ if (item.NAME == "堆矿场") {
+ this.setState({
+ level2: item.LEVEL1,
+ data2: item,
+ });
+ }
+ if (item.NAME == "622工业场地") {
+ this.setState({
+ level3: item.LEVEL1,
+ data3: item,
+ });
+ }
+ if (item.NAME == "露天生产区") {
+ this.setState({
+ level4: item.LEVEL1,
+ data4: item,
+ });
+ }
+ if (item.NAME == "终了边坡区域") {
+ this.setState({
+ level5: item.LEVEL1,
+ data5: item,
+ });
+ }
+ if (item.NAME == "烧结厂") {
+ this.setState({
+ level6: item.LEVEL1,
+ data6: item,
+ });
+ }
+ if (item.NAME == "580回风井口") {
+ this.setState({
+ level7: item.LEVEL1,
+ data7: item,
+ content7: (
+
+
区域名称：{item.NAME}
+
+
+
较大风险：{item.LEVEL2}
+
一般风险：{item.LEVEL3}
+
+
+
+
+
+
+ ),
+ });
+ }
+ });
+ // this.setState({
+ // content7:
+ //
区域名称：{this.state.data7.NAME}
+ //
较大风险：{this.state.data7.LEVEL2}
+ //
一般风险：{this.state.data7.LEVEL3}
+ //
+ // })
+ }
+ getRiskData = () => {
+ this.props.dispatch({
+ type: "app/getDataByPost",
+ url: "HM/HMEvaluateRisk/getRiskLevelCountData",
+ onComplete: (ret) => {
+ if (ret ) {
+ console.log(ret,'989989')
+ }
+ },
+ });
+ }
+
+ render() {
+ return (
+
+
+
+
+ {/* 东排土场 */}
+
+
+
+
+
+
+ {/* 堆矿场 */}
+
+
+
+
+ {" "}
+
+
+ {/* 622工业场地 */}
+
+
+
+
+ {" "}
+
+
+ {/* 露天生产区 */}
+
+
+
+
+ {" "}
+
+
+ {/* 终了边坡区域 */}
+
+
+
+
+ {" "}
+
+
+ {/* 烧结厂 */}
+
+
+
+
+ {" "}
+
+
+ {/* 580回风井口 */}
+
+
+
+
+ {" "}
+
+
+
+
+
+ );
+ }
+}
+
+export default withRouter(connect(({ login }) => ({ login }))(RiskFour));
diff --git a/src/layout/risk.less b/src/layout/risk.less
new file mode 100644
index 0000000..5efaf59
--- /dev/null
+++ b/src/layout/risk.less
@@ -0,0 +1,130 @@
+.riskback {
+ width: 100%;
+ height: 100%;
+ object-fit: fill;
+}
+.riskt {
+ position: absolute;
+ top: 20%;
+ left: 15%;
+ width: 100%;
+ height: 100%;
+}
+.risktTwo {
+ position: absolute;
+ top: 65%;
+ left: 18%;
+ width: 100%;
+ height: 100%;
+}
+.risktThree {
+ position: absolute;
+ top: 80%;
+ left: 20%;
+ width: 100%;
+ height: 100%;
+}
+
+.risktFour {
+ position: absolute;
+ top: 30%;
+ left: 50%;
+ width: 100%;
+ height: 100%;
+}
+.risktFive {
+ position: absolute;
+ top: 80%;
+ left: 50%;
+ width: 100%;
+ height: 100%;
+}
+.risktSix {
+ position: absolute;
+ top: 75%;
+ left: 77%;
+ width: 100%;
+ height: 100%;
+}
+.risktSeven {
+ position: absolute;
+ top: 42%;
+ left: 87%;
+ width: 100%;
+ height: 100%;
+}
+
+.riskback {
+ position: absolute;
+ top: 15%;
+ left: 8%;
+ width: 100%;
+ height: 100%;
+}
+
+.riskbackTwo {
+ position: absolute;
+ top: 60%;
+ left: 12%;
+ width: 100%;
+ height: 100%;
+}
+.riskbackThree {
+ position: absolute;
+ top: 70%;
+ left: 13%;
+ width: 100%;
+ height: 100%;
+}
+
+.riskbackFour {
+ position: absolute;
+ top: 1%;
+ left: 18%;
+ width: 100%;
+ height: 100%;
+}
+.riskbackFive {
+ position: absolute;
+ top: 48%;
+ left: 32%;
+ width: 100%;
+ height: 100%;
+}
+.riskbackSix {
+ position: absolute;
+ top: 62%;
+ left: 70%;
+ width: 100%;
+ height: 100%;
+}
+.riskbackSeven {
+ position: absolute;
+ top: 40%;
+ left: 81%;
+ width: 100%;
+ height: 100%;
+
+}
+.riskhover {
+ transition: all 0.5s;
+ animation: jump 1.8s infinite ;
+}
+// .riskhover:hover {
+// transform: scale(1.1);
+// animation: jump 1.8s infinite ;
+// }
+
+
+@keyframes jump {
+ 0% {
+ transform: translateY(0px);
+ }
+ 50% {
+ transform: translateY(-20px);
+ }
+ 100% {
+ transform: translateY(0px);
+ }
+}
+
diff --git a/src/utils/common.js b/src/utils/common.js
index ac80612..a22c2cd 100644
--- a/src/utils/common.js
+++ b/src/utils/common.js
@@ -4,6 +4,26 @@ import { random, omit } from "lodash";
import moment from "moment";
const RFC4122_TEMPLATE = "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx";
+// 展开/全屏
+export function requestFullScreenMethod(element) {
+ var requestMethod = element.requestFullscreen || element.webkitRequestFullscreen || element.msRequestFullscreen || element.mozRequestFullScreen;
+ if (requestMethod) {
+ requestMethod.call(element);
+ }
+}
+// 退出/全屏
+export function exitFullScreen() {
+ var exitMethod = document.exitFullscreen || document.webkitExitFullscreen || document.msExitFullscreen || document.mozCancelFullScreen;
+ if (exitMethod) {
+ exitMethod.call(document);
+ }
+}
+// 判断是否全屏
+export function isFullscreenElement() {
+ var isFull = document.fullscreenElement || document.webkitFullscreenElement || document.msFullscreenElement || document.mozFullScreenElement;
+ return !!isFull;
+}
+
export function uuid(placeholder) {
return RFC4122_TEMPLATE.replace(/[xy]/g, function () {
let value = random(15);
diff --git a/yarn.lock b/yarn.lock
index 2fb6eaf..a76d1ac 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -992,7 +992,7 @@
"pirates" "^4.0.0"
"source-map-support" "^0.5.16"
-"@babel/runtime@^7.0.0", "@babel/runtime@^7.1.2", "@babel/runtime@^7.11.2", "@babel/runtime@^7.18.3", "@babel/runtime@^7.4.2", "@babel/runtime@^7.6.3":
+"@babel/runtime@^7.0.0", "@babel/runtime@^7.1.2", "@babel/runtime@^7.11.2", "@babel/runtime@^7.18.3", "@babel/runtime@^7.4.2", "@babel/runtime@^7.5.5", "@babel/runtime@^7.6.3":
"integrity" "sha512-hC2v6p8ZSI/W0HUzh3V8C5g+NwSKzKPtJwSpTjwl0o297GP9+ZLQSkdvHz46CM3LqyoXxq+5G9komY+eSqSO0g=="
"resolved" "https://registry.npmjs.org/@babel/runtime/-/runtime-7.23.1.tgz"
"version" "7.23.1"
@@ -1084,6 +1084,50 @@
"resolved" "https://registry.npmjs.org/@ctrl/tinycolor/-/tinycolor-3.6.1.tgz"
"version" "3.6.1"
+"@jiaminghi/bezier-curve@*":
+ "integrity" "sha512-u9xJPOEl6Dri2E9FfmJoGxYQY7vYJkURNX04Vj64tdi535tPrpkuf9Sm0lNr3QTKdHQh0DdNRsaa62FLQNQEEw=="
+ "resolved" "https://registry.npmmirror.com/@jiaminghi/bezier-curve/-/bezier-curve-0.0.9.tgz"
+ "version" "0.0.9"
+ dependencies:
+ "@babel/runtime" "^7.5.5"
+
+"@jiaminghi/c-render@^0.4.3":
+ "integrity" "sha512-FJfzj5hGj7MLqqqI2D7vEzHKbQ1Ynnn7PJKgzsjXaZpJzTqs2Yw5OSeZnm6l7Qj7jyPAP53lFvEQNH4o4j6s+Q=="
+ "resolved" "https://registry.npmmirror.com/@jiaminghi/c-render/-/c-render-0.4.3.tgz"
+ "version" "0.4.3"
+ dependencies:
+ "@babel/runtime" "^7.5.5"
+ "@jiaminghi/bezier-curve" "*"
+ "@jiaminghi/color" "*"
+ "@jiaminghi/transition" "*"
+
+"@jiaminghi/charts@^0.2":
+ "integrity" "sha512-K+HXaOOeWG9OOY1VG6M4mBreeeIAPhb9X+khG651AbnwEwL6G2UtcAQ8GWCq6GzhczcLwwhIhuaHqRygwHC0sA=="
+ "resolved" "https://registry.npmmirror.com/@jiaminghi/charts/-/charts-0.2.18.tgz"
+ "version" "0.2.18"
+ dependencies:
+ "@babel/runtime" "^7.5.5"
+ "@jiaminghi/c-render" "^0.4.3"
+
+"@jiaminghi/color@*":
+ "integrity" "sha512-ZY3hdorgODk4OSTbxyXBPxAxHPIVf9rPlKJyK1C1db46a50J0reFKpAvfZG8zMG3lvM60IR7Qawgcu4ZDO3+Hg=="
+ "resolved" "https://registry.npmmirror.com/@jiaminghi/color/-/color-1.1.3.tgz"
+ "version" "1.1.3"
+
+"@jiaminghi/data-view-react@^1.2.5":
+ "integrity" "sha512-hxlfg0yULj7nUde8oj5hB9pUWrHqFyuPUeJWNG70YPPHFnWXqmlWCx1aB1OpqD3lwxaI1aKkA4YJRhkvfLyKrg=="
+ "resolved" "https://registry.npmmirror.com/@jiaminghi/data-view-react/-/data-view-react-1.2.5.tgz"
+ "version" "1.2.5"
+ dependencies:
+ "@jiaminghi/charts" "^0.2"
+
+"@jiaminghi/transition@*":
+ "integrity" "sha512-owBggipoHMikDHHDW5Gc7RZYlVuvxHADiU4bxfjBVkHDAmmck+fCkm46n2JzC3j33hWvP9nSCAeh37t6stgWeg=="
+ "resolved" "https://registry.npmmirror.com/@jiaminghi/transition/-/transition-1.1.11.tgz"
+ "version" "1.1.11"
+ dependencies:
+ "@babel/runtime" "^7.5.5"
+
"@types/history@*":
"integrity" "sha512-cS5owqtwzLN5kY+l+KgKdRJ/Cee8tlmQoGQuIE9tWnSmS3JMKzmxo2HIAk2wODMifGwO20d62xZQLYz+RLfXmw=="
"version" "4.7.3"
@@ -10156,7 +10200,7 @@
"recompose" "^0.27.1"
"shallowequal" "^1.0.2"
-"react-dom@*", "react-dom@^0.14.0 || ^15.0.0 || ^16.0.0", "react-dom@^0.14.0 || ^15.0.0 || ^16.0.0-beta || ^16.0.0", "react-dom@^0.14.0 || ^15.0.0-0 || ^16.0.0", "react-dom@^0.14.0 || ^15.0.0-rc || ^16.0.0-rc || ^16.0.0", "react-dom@^0.14.0 || ^15.0.1 || ^16.0.0", "react-dom@^15.0.0 || ^16.0.0", "react-dom@^16.0.0", "react-dom@^16.0.0-0", "react-dom@^16.3.0", "react-dom@>=15.0.0", "react-dom@>=15.x", "react-dom@>=16.0.0", "react-dom@>=16.9.0", "react-dom@>0.14.5", "react-dom@0.14.x || 15.x || 16.x", "react-dom@15.x || ^16.0.0-0", "react-dom@16.8.2":
+"react-dom@*", "react-dom@^0.14.0 || ^15.0.0 || ^16.0.0", "react-dom@^0.14.0 || ^15.0.0 || ^16.0.0-beta || ^16.0.0", "react-dom@^0.14.0 || ^15.0.0-0 || ^16.0.0", "react-dom@^0.14.0 || ^15.0.0-rc || ^16.0.0-rc || ^16.0.0", "react-dom@^0.14.0 || ^15.0.1 || ^16.0.0", "react-dom@^15.0.0 || ^16.0.0", "react-dom@^16.0.0", "react-dom@^16.0.0-0", "react-dom@^16.3.0", "react-dom@^16.8.0", "react-dom@>=15.0.0", "react-dom@>=15.x", "react-dom@>=16.0.0", "react-dom@>=16.9.0", "react-dom@>0.14.5", "react-dom@0.14.x || 15.x || 16.x", "react-dom@15.x || ^16.0.0-0", "react-dom@16.8.2":
"integrity" "sha512-cPGfgFfwi+VCZjk73buu14pYkYBR1b/SRMSYqkLDdhSEHnSwcuYTPu6/Bh6ZphJFIk80XLvbSe2azfcRzNF+Xg=="
"resolved" "https://registry.npmmirror.com/react-dom/-/react-dom-16.8.2.tgz"
"version" "16.8.2"
@@ -10318,7 +10362,7 @@
"resolved" "https://registry.npmmirror.com/react-websocket/-/react-websocket-2.0.1.tgz"
"version" "2.0.1"
-"react@*", "react@^0.14 || ^15.0.0 || ^16.0.0-alpha", "react@^0.14.0 || ^15.0.0 || ^16.0.0", "react@^0.14.0 || ^15.0.0 || ^16.0.0-0", "react@^0.14.0 || ^15.0.0 || ^16.0.0-beta || ^16.0.0", "react@^0.14.0 || ^15.0.0-0 || ^16.0.0", "react@^0.14.0 || ^15.0.0-0 || ^16.0.0-0", "react@^0.14.0 || ^15.0.0-rc || ^16.0.0-rc || ^16.0.0", "react@^0.14.0 || ^15.0.1 || ^16.0.0", "react@^15.0.0 || ^16.0.0", "react@^16.0.0", "react@^16.0.0-0", "react@^16.3.0", "react@^16.8.0 || ^17.0.0 || ^18.0.0", "react@>= 16.3", "react@>=0.13.2 || ^0.14 || ^15.0.0 || >=16.0.0", "react@>=15", "react@>=15.0.0", "react@>=15.x", "react@>=16.0.0", "react@>=16.9.0", "react@>0.14.5", "react@0.13.x || 0.14.x || ^15.0.0-0 || ^16.0.0-0", "react@0.14.x || 15.x || 16.x", "react@15.x || ^16.0.0-0", "react@16.8.2", "react@16.x":
+"react@*", "react@^0.14 || ^15.0.0 || ^16.0.0-alpha", "react@^0.14.0 || ^15.0.0 || ^16.0.0", "react@^0.14.0 || ^15.0.0 || ^16.0.0-0", "react@^0.14.0 || ^15.0.0 || ^16.0.0-beta || ^16.0.0", "react@^0.14.0 || ^15.0.0-0 || ^16.0.0", "react@^0.14.0 || ^15.0.0-0 || ^16.0.0-0", "react@^0.14.0 || ^15.0.0-rc || ^16.0.0-rc || ^16.0.0", "react@^0.14.0 || ^15.0.1 || ^16.0.0", "react@^15.0.0 || ^16.0.0", "react@^16.0.0", "react@^16.0.0-0", "react@^16.3.0", "react@^16.8.0", "react@^16.8.0 || ^17.0.0 || ^18.0.0", "react@>= 16.3", "react@>=0.13.2 || ^0.14 || ^15.0.0 || >=16.0.0", "react@>=15", "react@>=15.0.0", "react@>=15.x", "react@>=16.0.0", "react@>=16.9.0", "react@>0.14.5", "react@0.13.x || 0.14.x || ^15.0.0-0 || ^16.0.0-0", "react@0.14.x || 15.x || 16.x", "react@15.x || ^16.0.0-0", "react@16.8.2", "react@16.x":
"integrity" "sha512-aB2ctx9uQ9vo09HVknqv3DGRpI7OIGJhCx3Bt0QqoRluEjHSaObJl+nG12GDdYH6sTgE7YiPJ6ZUyMx9kICdXw=="
"resolved" "https://registry.npmmirror.com/react/-/react-16.8.2.tgz"
"version" "16.8.2"