+
+
+
+
+
+
+
+
+
+
+ 
+
+
+
+
+ + 安全方针：安全第一、综合治理、控制风险、科学发展 + + 安全理念：一切风险皆可控，一切事故皆可防！ +
+
+ 宁化行洛坑安全生产标准化运营平台
+
+
+
+ {this.state.nowDate}
+
+
+
+
+
+
+
+ {/* */}
+ */}
+
+
+
+
+
+
+
+
+ {/*
+ 风险等级基本信息
+
+
+ {/* */}
+ */}
+
+
+
+
+
+
+ 隐患检查基本信息
+
+
+
+ {/*
+ {this.state.checkData.map((item, index) => {
+ return (
+
+
+
+
+
+ );
+ })}
+
+
+
+
+
+ {item.name}
+
+
+
+ /次
+
+
+ {item.value}
+
+
+
+
+
+
+
+ {/* {this.state.screenWidh ? (
+
+ ) : (
+
+ {/*
+ 矿山
*/}
+
+
+
+ 标准化得分
+
+ 83
+
+
+
+
+
+ 标准化得分
+
+ 88
+
+
+
+
+
+ 标准化得分
+
+ 93
+
+
+ )} */}
+
+
+ 矿山
+
+ 标准化得分
+
+ 83
+
+
+ 选矿
+
+ 标准化得分
+
+ 88
+
+
+ 尾矿
+
+ 标准化得分
+
+ 93
+
+
+
+
+ 
+
+
+
+
+ {this.state.roaData.map((item, index) => {
+ return (
+
+
+ );
+ })}
+
+
+
+
+ {item.name}:{item.value}
+
+
+ {/* */}
+
+
+
+
+
+
+
+ 基本会议完成情况
+
+
+
+
+
+ {/*
+ */}
+ {/*
+
+
+ {this.state.meetingData.map((item, index) => (
+
+
+
+
+
+ ))}
+
+
+
+
+
+ {item.value}
+
+
+ {item.name}
+
+
+ {/* */}
+ */}
+
+
+
+
+
+
+ 安全任务完成情况
+
+
+
+ {/*
+
+
+
+ */}
+ */}
+
+
+
+
+ {/* */}
+ */}
+
+
+
+
+
+ 隐患整改数据
+
+
+ {/*
+
+
+
+
+
+
+
+ 83
+
+ 隐患数
+
+
+
+
+
+
+
+ 23
+
+ 延期整改数
+
+
+
+
+
+
+
+ 56
+
+ 按期整改数
+
+
+
+
+
+
+
+
+
+
+ 83%
+
+
+ 整改率
+
+
+
+ {/*
+
+
+
+
+ 安全生产标准化运行走势图
+
+
+
+
+
+
+
+
+
+
+ 班组完成率TOP5
+
+
+
+
{/* {
/> */}
}
+ prefix={
+
{!props.matchLogin ? (
+ {
+ setshowModal(false);
+ }}
+ onCancel={() => {
+ setshowModal(false);
+ }}
+ className="fullScreen"
+ >
+
+
+ );
+ }
+};
+
+const RiskFourColor = withRouter(
+ connect(({ login }) => ({ login }))(RiskFourColorOpton)
+);
+
+const FullScreenOpton = (props) => {
+ const [showModal, setshowModal] = useState(false);
+ const getChildCount = (val) => {
+ setshowModal(val);
+ };
+ const [fullScreen, setFullScreen] = useState(false);
+ const [originResizeFunc, setOriginResizeFunc] = useState();
+ const escFunction = () => {
+ let isFull = !!(
+ document.fullscreen ||
+ document.mozFullScreen ||
+ document.webkitIsFullScreen ||
+ document.webkitFullScreen ||
+ document.msFullScreen
+ );
+ if (isFull) {
+ // /
+ } else {
+ // requestFullScreenMethod(document.body);
+ setshowModal(false);
+ }
+ };
+ useEffect(() => {
+ // 监听退出全屏事件 --- chrome 用 esc 退出全屏并不会触发 keyup 事件
+ document.addEventListener(
+ "webkitfullscreenchange",
+ escFunction
+ ); /* Chrome, Safari and Opera */
+ document.addEventListener("mozfullscreenchange", escFunction); /* Firefox */
+ document.addEventListener(
+ "fullscreenchange",
+ escFunction
+ ); /* Standard syntax */
+ document.addEventListener(
+ "msfullscreenchange",
+ escFunction
+ ); /* IE / Edge */
+ return () => {
+ //销毁时清除监听
+ document.removeEventListener("webkitfullscreenchange", escFunction);
+ document.removeEventListener("mozfullscreenchange", escFunction);
+ document.removeEventListener("fullscreenchange", escFunction);
+ document.removeEventListener("MSFullscreenChange", escFunction);
+ };
+ }, []);
+
+ if (window.navigator.userAgent.indexOf("Windows") < 1) {
+ return ;
+ } else {
+ return (
+ {
+ setshowModal(true);
+ requestFullScreenMethod(document.body); // 进入全屏
+ }}
+ style={{ margin: "0px 36px", display: "flex", alignItems: "center" }}
+ >
+
+
+ {
+ setshowModal(false);
+ }}
+ onCancel={() => {
+ setshowModal(false);
+ }}
+ className="fullScreen"
+ >
+
+
+ );
+ }
+};
+
+const FullScreen = withRouter(
+ connect(({ login }) => ({ login }))(FullScreenOpton)
+);
const NavOpton = (props) => {
const [showModal, setshowModal] = useState(false);
const getChildCount = (val) => {
@@ -390,15 +568,17 @@ function Header(props) {
: "header__left-slogan"
}`}
>
- 安全管理系统
- （SMS）
+ 双重预防机制管控系统
+ {/* 安全管理系统
+ （SMS） */}
{baseConfig.SYS_NAME}{" "}
)}
{
+ setshowModal(true);
+ requestFullScreenMethod(document.body); // 进入全屏
+ }}
+ >
+
+
-
+
+
+
+
+ );
+ }
+}
+
+export default withRouter(connect(({ login }) => ({ login }))(RiskFour));
diff --git a/src/layout/RiskFourOne.js b/src/layout/RiskFourOne.js
new file mode 100644
index 0000000..9896da1
--- /dev/null
+++ b/src/layout/RiskFourOne.js
@@ -0,0 +1,432 @@
+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 "./riskOne.less";
+import echarts from "echarts";
+import storage from "../utils/storage";
+import { initFilter } from "../utils/common";
+import realGif from "../assets/riskone/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/riskone/1-1.png";
+import back2 from "../assets/riskone/1-2.png";
+import back3 from "../assets/riskone/1-3.png";
+import back4 from "../assets/riskone/1-4.png";
+import backTwo1 from "../assets/riskone/2-1.png";
+import backTwo2 from "../assets/riskone/2-2.png";
+import backTwo3 from "../assets/riskone/2-3.png";
+import backTwo4 from "../assets/riskone/2-4.png";
+import backThree1 from "../assets/riskone/3-1.png";
+import backThree2 from "../assets/riskone/3-2.png";
+import backThree3 from "../assets/riskone/3-3.png";
+import backThree4 from "../assets/riskone/3-4.png";
+import backFour1 from "../assets/riskone/4-1.png";
+import backFour2 from "../assets/riskone/4-2.png";
+import backFour3 from "../assets/riskone/4-3.png";
+import backFour4 from "../assets/riskone/4-4.png";
+import { FullScreenContainer } from "@jiaminghi/data-view-react";
+
+class RiskFourOne extends React.Component {
+ constructor(props) {
+ super(props);
+ this.state = {
+ RiskData: [],
+ level1: 0,
+ level2: 0,
+ level3: 0,
+ level4: 0,
+ data1: {},
+ data2: {},
+ data3: {},
+ data4: {},
+
+ content: "",
+ content2: "",
+ content3: "",
+ content4: "",
+ };
+ }
+ componentDidUpdate=(prevProps, prevState)=>{
+ if(prevProps.riskleveldata !== this.props.riskleveldata){
+ this.props.riskleveldata.map((item, index) => {
+ this.getTitle(item)
+ this.setState({
+ RiskData:this.props.riskleveldata
+ })
+ });
+ }
+
+ }
+
+ componentDidMount() {
+ this.props.riskleveldata?.map((item, index) => {
+ this.getTitle(item)
+ });
+ }
+ getTitle=(item)=>{
+ if (item.NAME == "矿石堆场") {
+ this.setState({
+ level1: item.LEVEL,
+ data1: item,
+ content: (
+
+
+
+
+ );
+ }
+}
+
+export default withRouter(connect(({ login }) => ({ login }))(RiskFourOne));
diff --git a/src/layout/RiskFourThree.js b/src/layout/RiskFourThree.js
new file mode 100644
index 0000000..6a8ad8a
--- /dev/null
+++ b/src/layout/RiskFourThree.js
@@ -0,0 +1,236 @@
+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 "./riskThree.less";
+import echarts from "echarts";
+import storage from "../utils/storage";
+import { initFilter } from "../utils/common";
+import realGif from "../assets/riskthree/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/riskthree/1-1.png";
+import back2 from "../assets/riskthree/1-2.png";
+import back3 from "../assets/riskthree/1-3.png";
+import back4 from "../assets/riskthree/1-4.png";
+import backTwo1 from "../assets/riskthree/2-1.png";
+import backTwo2 from "../assets/riskthree/2-2.png";
+import backTwo3 from "../assets/riskthree/2-3.png";
+import backTwo4 from "../assets/riskthree/2-4.png";
+import { FullScreenContainer } from "@jiaminghi/data-view-react";
+
+class RiskFourOne extends React.Component {
+ constructor(props) {
+ super(props);
+ this.state = {
+ RiskData: [],
+ level1: 0,
+ level2: 0,
+ data1: {},
+ data2: {},
+
+ content: "",
+ content2: "",
+ };
+ }
+ componentDidUpdate=(prevProps, prevState)=>{
+ if(prevProps.riskleveldata !== this.props.riskleveldata){
+ this.props.riskleveldata.map((item, index) => {
+ this.getTitle(item)
+ this.setState({
+ RiskData:this.props.riskleveldata
+ })
+ });
+ }
+
+ }
+
+ componentDidMount() {
+ this.props.riskleveldata?.map((item, index) => {
+ this.getTitle(item)
+ });
+ }
+ getTitle=(item)=>{
+ if (item.NAME == "选矿车间") {
+ this.setState({
+ level1: item.LEVEL,
+ data1: item,
+ content: (
+
+
+
+
+ );
+ }
+}
+
+export default withRouter(connect(({ login }) => ({ login }))(RiskFourOne));
diff --git a/src/layout/RiskFourTwo.js b/src/layout/RiskFourTwo.js
new file mode 100644
index 0000000..290b826
--- /dev/null
+++ b/src/layout/RiskFourTwo.js
@@ -0,0 +1,313 @@
+import React, { useState, useEffect, useMemo, useRef } from "react";
+import { connect } from "dva";
+import { withRouter } from "dva/router";
+import { Popover } from "antd";
+import styles from "./riskTwo.less";
+import realGif from "../assets/risktwo/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/risktwo/1-1.png";
+import back2 from "../assets/risktwo/1-2.png";
+import back3 from "../assets/risktwo/1-3.png";
+import back4 from "../assets/risktwo/1-4.png";
+import backTwo1 from "../assets/risktwo/2-1.png";
+import backTwo2 from "../assets/risktwo/2-2.png";
+import backTwo3 from "../assets/risktwo/2-3.png";
+import backTwo4 from "../assets/risktwo/2-4.png";
+import backThree1 from "../assets/risktwo/3-1.png";
+import backThree2 from "../assets/risktwo/3-2.png";
+import backThree3 from "../assets/risktwo/3-3.png";
+import backThree4 from "../assets/risktwo/3-4.png";
+import { FullScreenContainer } from "@jiaminghi/data-view-react";
+
+class RiskFourOne extends React.Component {
+ constructor(props) {
+ super(props);
+ this.state = {
+ RiskData:[],
+ level1: 0,
+ level2: 0,
+ level3: 0,
+ level4: 0,
+ data1: {},
+ data2: {},
+ data3: {},
+ data4: {},
+
+ content: "",
+ content2: "",
+ content3: "",
+ content4: "",
+ };
+ }
+ componentDidUpdate=(prevProps, prevState)=>{
+ if(prevProps.riskleveldata !== this.props.riskleveldata){
+ this.props.riskleveldata.map((item, index) => {
+ this.getTitle(item)
+ this.setState({
+ RiskData:this.props.riskleveldata
+ })
+ });
+ }
+
+ }
+
+ componentDidMount() {
+ this.props.riskleveldata?.map((item, index) => {
+ this.getTitle(item)
+ });
+ }
+ getTitle=(item)=>{
+ if (item.NAME == "大禾底排土场") {
+ this.setState({
+ level1: item.LEVEL,
+ data1: item,
+ content: (
+
+
+
+
+ );
+ }
+}
+
+export default withRouter(connect(({ login }) => ({ login }))(RiskFourOne));
diff --git a/src/layout/full.less b/src/layout/full.less
new file mode 100644
index 0000000..e580865
--- /dev/null
+++ b/src/layout/full.less
@@ -0,0 +1,460 @@
+@font-face {
+ font-family: pangmenzhengdao;
+ src: url("../assets/fonts/pangmenzhengdao.ttf");
+}
+
+@font-face {
+ font-family: "阿里妈妈东方大楷 Regular";
+ font-weight: normal;
+ src: url("../assets/fonts/AlimamaDongFangDaKai-Regular.ttf")
+ format("truetype");
+ font-display: swap;
+}
+@font-face {
+ font-family: "站酷庆科黄油体";
+ font-weight: normal;
+ src: url("../assets/fonts/zhankuqingke.ttf") format("truetype");
+ font-display: swap;
+}
+
+.box{
+ transform-origin: 0 0;
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ transition: 0.3s;
+}
+
+.blackBack {
+ background-image: url("../assets/login/bg.png");
+ width: 100%;
+ // height: calc(100% - 10px); // 进入全屏
+ height: 100%;
+ background-size: cover;
+ background-position: center;
+ background-repeat: no-repeat;
+}
+.backImage {
+ background-color: #021428; //021428
+ width: 100%;
+ height: 100%;
+ opacity: 0.9;
+ display: flex;
+ flex-direction: column;
+}
+.header {
+ background-image: url("../assets/layout/full-header.png");
+ background-size: cover;
+ background-position: center;
+ background-repeat: no-repeat;
+ height: 100px;
+ width: 100%;
+ display: flex;
+ // align-items: center;
+ justify-content: space-between;
+ flex-direction: row;
+}
+.headerText {
+ color: #fff;
+ font-size: 32px;
+ // font-weight: bold;
+ margin-top: 10px;
+ font-family: "pangmenzhengdao";
+}
+.row {
+ // height: calc(65% - 200px);
+ flex: 1;
+ width: 100%;
+}
+.rowTwo {
+ height: 30%;
+ width: 100%;
+}
+.boxleft {
+ height: 100%;
+ // width: 100%;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+}
+.risklevel {
+ height: 60%;
+ width: 90%;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+}
+.risklevelOne {
+ height: 40%;
+ width: 90%;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+}
+.risklevelTwo {
+ height: 100%;
+ width: 90%;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+}
+.riskChange {
+ width: 40%;
+ height: 100%;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: space-around;
+ padding: 20px 5px;
+}
+.riskChangeTwo {
+ width: 60%;
+ height: 100%;
+ padding: 20px 5px;
+ display: flex;
+ align-items: center;
+ justify-content: flex-start;
+}
+.gradient {
+ background-image: linear-gradient(
+ 250deg,
+ rgba(47, 109, 255, 1) 0%,
+ rgba(255, 255, 255, 54) 50%,
+ rgba(47, 109, 255, 1) 100%
+ );
+ width: 60%;
+ height: 30%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 2px;
+ // margin: 10px;
+}
+.gradientTwo {
+ background-image: linear-gradient(
+ 250deg,
+ rgba(47, 109, 255, 1) 0%,
+ rgba(255, 255, 255, 54) 50%,
+ rgba(47, 109, 255, 1) 100%
+ );
+ width: 80%;
+ height: 90%;
+ display: flex;
+ align-items: center;
+ justify-content: space-around;
+ padding: 2px;
+}
+.gradientThree {
+ background-image: linear-gradient(
+ 275deg,
+ rgba(47, 109, 255, 1) 0%,
+ rgba(255, 255, 255, 54) 50%,
+ rgba(47, 109, 255, 1) 100%
+ );
+ display: flex;
+ align-items: center;
+ justify-content: space-around;
+ padding: 2px;
+}
+.gradientNext {
+ width: 100%;
+ height: 100%;
+ background-color: #021428;
+ // z-index: 999;
+}
+.gradientNextTwo {
+ width: 100%;
+ height: 100%;
+ background-color: rgba(47, 109, 255, 0.1);
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ padding: 5px;
+ color: #fff;
+}
+.gradientText {
+ font-size: 26px;
+ font-weight: bold;
+}
+.gradientName {
+ font-size: 12px;
+}
+.gradientTextTwo {
+ font-size: 86px;
+ font-weight: bold;
+ color: #ef595a;
+}
+.gradientNameTwo {
+ font-size: 18px;
+}
+.title {
+ background-image: url("../assets/layout/title.png");
+ background-size: cover;
+ background-position: bottom;
+ background-repeat: no-repeat;
+ width: 90%;
+ height: 25px;
+ padding-bottom: 10px;
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ // justify-content: center;
+}
+.circle {
+ width: 12px;
+ height: 12px;
+ background: #021428;
+ border-radius: 50%;
+ border: 3px solid #fff;
+ margin-right: 5px;
+}
+.titlename {
+ color: #fff;
+ font-size: 16px;
+ font-family: "站酷庆科黄油体";
+ letter-spacing: 3px;
+}
+.risklevelOne {
+ height: 60%;
+ width: 90%;
+}
+.boxTwo {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ height: 100%;
+ // width: 100%;
+}
+.capsuleChart {
+ width: 80%;
+ height: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 20px 0px;
+}
+.scrollboard {
+ width: 90%;
+ height: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin: 0px 20px 20px 20px;
+ flex: 1;
+}
+.scrollboard :global(.header) {
+ height: auto;
+ padding: 0;
+}
+.scrollboard :global(.dv-scroll-board .rows .ceil) {
+ text-align: center;
+}
+.scrollboard :global(.dv-scroll-board .header .header-item) {
+ text-align: center;
+}
+
+.scoreBox {
+ // background-image: url("../assets/layout/score-box.png");
+ // background-size: cover;
+ // background-position: center;
+ // background-repeat: no-repeat;
+ width: 100%;
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20px;
+}
+.scoreBox1 {
+ background-image: url("../assets/layout/score-box.png");
+ background-size: contain;
+ background-position: center;
+ background-repeat: no-repeat;
+ width: 100%;
+ // height: 140px;
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ justify-content: space-around;
+ margin-bottom: 20px;
+ padding: 5px;
+}
+.score {
+ display: flex;
+ flex-direction: row;
+ // align-items: center;
+ // justify-content: space-between;
+ background-image: url("../assets/layout/ks.png");
+ background-size: cover;
+ background-position: center;
+ background-repeat: no-repeat;
+ object-fit: cover;
+ // width: 230px;
+ width: 33%;
+ height: auto;
+ margin: 10px;
+}
+.score2 {
+ display: flex;
+ flex-direction: row;
+ // align-items: center;
+ // justify-content: space-between;
+ background-image: url("../assets/layout/xk.png");
+ background-size: cover;
+ background-position: center;
+ background-repeat: no-repeat;
+ object-fit: cover;
+ width: 33%;
+ height: auto;
+ margin: 10px;
+}
+.score3 {
+ display: flex;
+ flex-direction: row;
+ // align-items: center;
+ // justify-content: space-between;
+ background-image: url("../assets/layout/wk.png");
+ background-size: cover;
+ background-position: center;
+ background-repeat: no-repeat;
+ object-fit: cover;
+ width: 33%;
+ height: auto;
+ margin: 10px;
+}
+.score4 {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: space-between;
+ background-image: url("../assets/layout/score.png");
+ background-size: contain;
+ background-position: center;
+ background-repeat: no-repeat;
+ width: 30%;
+ padding: 0px 15px;
+ // height: 100%;
+ // margin: 10px;
+}
+.scoreRight {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ width: 40%;
+ margin-left: 50%;
+}
+.scoreLeft {
+ font-size: 12px;
+ font-weight: bold;
+ color: #6cc8d9;
+ margin-top: 5px;
+}
+.scoreText {
+ font-size: 13px;
+ font-weight: bold;
+ color: #6cc8d9;
+}
+.scoreText2 {
+ font-size: 33px;
+ color: #7fffff;
+ font-weight: bold;
+ // font-style: oblique;
+}
+.scoreText3 {
+ font-size: 12px;
+ color: #6cc8d9;
+ font-weight: bold;
+}
+.ulData {
+ li {
+ // transform: rotate(45deg);
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ // margin-left: -20px;
+ // margin-right: -20px;
+ transform: translate(-50%, -50%);
+ }
+ li:nth-of-type(1) {
+ // transform: rotate(45deg);
+ transform: translate(-50%, -50%) rotate(12deg) translate(-280px)
+ rotate(-12deg);
+ // transform-origin: 20px 220px;
+ }
+ li:nth-of-type(2) {
+ transform: translate(-50%, -50%) rotate(38deg) translate(-280px)
+ rotate(-38deg);
+ }
+ li:nth-of-type(3) {
+ transform: translate(-50%, -50%) rotate(64deg) translate(-280px)
+ rotate(-64deg);
+ }
+ li:nth-of-type(4) {
+ transform: translate(-50%, -50%) rotate(90deg) translate(-280px)
+ rotate(-90deg);
+ }
+ li:nth-of-type(5) {
+ transform: translate(-50%, -50%) rotate(116deg) translate(-280px)
+ rotate(-116deg);
+ }
+ li:nth-of-type(6) {
+ transform: translate(-50%, -50%) rotate(142deg) translate(-280px)
+ rotate(-142deg);
+ }
+ li:nth-of-type(7) {
+ transform: translate(-50%, -50%) rotate(168deg) translate(-280px)
+ rotate(-168deg);
+ }
+ li:nth-of-type(8) {
+ transform: translate(-50%, -50%) rotate(-12deg) translate(-280px)
+ rotate(12deg);
+ }
+ li:nth-of-type(9) {
+ transform: translate(-50%, -50%) rotate(-38deg) translate(-280px)
+ rotate(38deg);
+ }
+ li:nth-of-type(10) {
+ transform: translate(-50%, -50%) rotate(-64deg) translate(-280px)
+ rotate(64deg);
+ }
+ li:nth-of-type(11) {
+ transform: translate(-50%, -50%) rotate(-116deg) translate(-280px)
+ rotate(116deg);
+ }
+
+ li:nth-of-type(12) {
+ transform: translate(-50%, -50%) rotate(-142deg) translate(-280px)
+ rotate(142deg);
+ }
+ li:nth-of-type(13) {
+ transform: translate(-50%, -50%) rotate(-168deg) translate(-280px)
+ rotate(168deg);
+ }
+}
+
+.roateData {
+ background-image: linear-gradient(
+ 275deg,
+ rgba(47, 109, 255, 1) 0%,
+ rgba(255, 255, 255, 54) 50%,
+ rgba(47, 109, 255, 1) 100%
+ );
+ display: flex;
+ align-items: center;
+ justify-content: space-around;
+ padding: 2px;
+ // background-color: rgba(47, 109, 255, 0.1);
+}
+.roatBack {
+ background-color: #021428;
+ width: 100%;
+ height: 100%;
+ padding: 5px;
+}
diff --git a/src/layout/risk.less b/src/layout/risk.less
new file mode 100644
index 0000000..74f5fa8
--- /dev/null
+++ b/src/layout/risk.less
@@ -0,0 +1,189 @@
+.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);
+ }
+}
+.wrap_scrollImg {
+ width: 100%;
+ height: 100%;
+ //background-color: #2C9806;
+ overflow: hidden;
+ position: relative;
+
+ span {
+ display: inline-block;
+ }
+}
+.left_icon {
+ left: 0;
+ cursor: pointer;
+ z-index: 99999999;
+ position: absolute;
+ display: none;
+ background-color: rgba(0, 0, 0, 0.3);
+ top: 0;
+ bottom: 0;
+ margin: auto;
+ height: 55px;
+ line-height: 55px;
+ width: 44px;
+ text-align: center;
+ font-size: 20px;
+ transition: 0.2s;
+ &:hover {
+ font-size: 30px;
+ height: 60px;
+ // line-height: 60px;
+ width:60px;
+ text-align: center;
+ margin: auto;
+ }
+}
+
+.right_icon {
+ right: 0;
+ cursor: pointer;
+ z-index: 99999999;
+ position: absolute;
+ display: none;
+ background-color: rgba(0, 0, 0, 0.3);
+ top: 0;
+ bottom: 0;
+ margin: auto;
+ height: 55px;
+ line-height: 55px;
+ width: 44px;
+ text-align: center;
+ font-size: 20px;
+ transition: 0.2s;
+ &:hover {
+ font-size: 30px;
+ height: 60px;
+ // line-height: 60px;
+ width:60px;
+ text-align: center;
+ margin: auto;
+ }
+}
diff --git a/src/layout/riskOne.less b/src/layout/riskOne.less
new file mode 100644
index 0000000..eec7825
--- /dev/null
+++ b/src/layout/riskOne.less
@@ -0,0 +1,176 @@
+.riskt {
+ position: absolute;
+ top: 44%;
+ left: 22%;
+ width: 100%;
+ height: 100%;
+}
+.risktTwo {
+ position: absolute;
+ top: 25%;
+ left: 36%;
+ width: 100%;
+ height: 100%;
+}
+.risktThree {
+ position: absolute;
+ top: 80%;
+ left: 30%;
+ width: 100%;
+ height: 100%;
+}
+
+.risktFour {
+ position: absolute;
+ top: 50%;
+ left: 60%;
+ width: 100%;
+ height: 100%;
+}
+.risktFive {
+ position: absolute;
+ top: 27%;
+ left: 84%;
+ 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: 42%;
+ left: 16%;
+ width: 100%;
+ height: 100%;
+}
+
+.riskbackTwo {
+ position: absolute;
+ top: 21%;
+ left: 31%;
+ width: 100%;
+ height: 100%;
+}
+.riskbackThree {
+ position: absolute;
+ top: 52%;
+ left: 15%;
+ width: 100%;
+ height: 100%;
+}
+
+.riskbackFour {
+ position: absolute;
+ top: 19%;
+ left: 34%;
+ width: 100%;
+ height: 100%;
+}
+.riskbackFive {
+ position: absolute;
+ top: 27%;
+ left: 80%;
+ 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);
+ }
+}
+.wrap_scrollImg {
+ width: 100%;
+ height: 100%;
+ //background-color: #2C9806;
+ overflow: hidden;
+ position: relative;
+
+ span {
+ display: inline-block;
+ }
+}
+.left_icon {
+ left: 0;
+ cursor: pointer;
+ z-index: 99999999;
+ position: absolute;
+ display: none;
+ background-color: rgba(0, 0, 0, 0.3);
+ top: 0;
+ bottom: 0;
+ margin: auto;
+ height: 55px;
+ line-height: 55px;
+ width: 44px;
+ text-align: center;
+ font-size: 20px;
+ transition: 0.2s;
+ &:hover {
+ font-size: 30px;
+ height: 60px;
+ // line-height: 60px;
+ width:60px;
+ text-align: center;
+ margin: auto;
+ }
+}
+
+.right_icon {
+ right: 0;
+ cursor: pointer;
+ z-index: 99999999;
+ position: absolute;
+ display: none;
+ background-color: rgba(0, 0, 0, 0.3);
+ top: 0;
+ bottom: 0;
+ margin: auto;
+ height: 55px;
+ line-height: 55px;
+ width: 44px;
+ text-align: center;
+ font-size: 20px;
+ transition: 0.2s;
+}
diff --git a/src/layout/riskThree.less b/src/layout/riskThree.less
new file mode 100644
index 0000000..b61a5b9
--- /dev/null
+++ b/src/layout/riskThree.less
@@ -0,0 +1,52 @@
+
+.riskt {
+ position: absolute;
+ top: 39%;
+ left: 32%;
+ width: 100%;
+ height: 100%;
+}
+.risktTwo {
+ position: absolute;
+ top: 35%;
+ left: 60%;
+ width: 100%;
+ height: 100%;
+}
+
+
+.riskback {
+ position: absolute;
+ top: 26%;
+ left: 18%;
+ width: 100%;
+ height: 100%;
+}
+
+.riskbackTwo {
+ position: absolute;
+ top: 10%;
+ left: 48%;
+ 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);
+ }
+}
\ No newline at end of file
diff --git a/src/layout/riskTwo.less b/src/layout/riskTwo.less
new file mode 100644
index 0000000..e2bcfb6
--- /dev/null
+++ b/src/layout/riskTwo.less
@@ -0,0 +1,68 @@
+
+.riskt {
+ position: absolute;
+ top: 36%;
+ left: 13%;
+ width: 100%;
+ height: 100%;
+}
+.risktTwo {
+ position: absolute;
+ top: 60%;
+ left: 38%;
+ width: 100%;
+ height: 100%;
+}
+.risktThree {
+ position: absolute;
+ top: 24%;
+ left: 70%;
+ width: 100%;
+ height: 100%;
+}
+
+
+.riskback {
+ position: absolute;
+ top: 21%;
+ left: 0;
+ width: 100%;
+ height: 100%;
+}
+
+.riskbackTwo {
+ position: absolute;
+ top: 38%;
+ left: 0%;
+ width: 100%;
+ height: 100%;
+}
+.riskbackThree {
+ position: absolute;
+ top: 15%;
+ left: 49%;
+ 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/routes/dashboard.css b/src/routes/dashboard.css
index dff70f9..8e6d0fd 100644
--- a/src/routes/dashboard.css
+++ b/src/routes/dashboard.css
@@ -411,5 +411,30 @@
background-color: #3c9cff;
color: #fff;
}
-:global() {
+:global(.slide-style){
+ /* margin-bottom: 10px; */
+ font-size: 24px;
+ font-weight: bold;
+ color:#de4e58;
+ /* -webkit-text-stroke: #E38C7A 1px; */
+ /* padding-left:30px; */
+ flex: 1;
+ overflow: hidden;
+ display: flex;
+ align-items: center;
+
+}
+:global(.slide-text-style){
+ position:relative;
+ display:inline-block;
+ white-space:nowrap;
+ animation: slide-text-style 20s linear 1s infinite ;
+ width:'auto';
+ align-items: center;
+ margin-top: 1em;
+}
+
+@keyframes slide-text-style{
+ 0%{margin-left:100%;}
+100%{margin-left:-1200px;}
}
diff --git a/src/utils/common.js b/src/utils/common.js
index ac80612..9c40363 100644
--- a/src/utils/common.js
+++ b/src/utils/common.js
@@ -4,6 +4,25 @@ 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"
+ {this.clickLeftIcon()}} style={this.state.leftDis==true?{color:'#888888'}:{color:'#fff'}}>
+ }
+
+
+
+
+ ),
+ });
+ }
+ if (item.NAME == "东排土场") {
+ this.setState({
+ level2: item.LEVEL,
+ data2: item,
+ content2: (
+ 区域名称：{item.NAME}
+
+
+
+
+ 重大风险：{item.LEVEL1}
+ 较大风险：{item.LEVEL2}
+ 一般风险：{item.LEVEL3}
+ 低风险：{item.LEVEL4}
+
+ {/* 
*/}
+
+
+
+ ),
+ });
+ }
+ if (item.NAME == "采场-终了边坡区") {
+ this.setState({
+ level3: item.LEVEL,
+ data3: item,
+ content3: (
+ 区域名称：{item.NAME}
+
+
+
+
+ 重大风险：{item.LEVEL1}
+ 较大风险：{item.LEVEL2}
+ 一般风险：{item.LEVEL3}
+ 低风险：{item.LEVEL4}
+
+ {/* */}
+
+
+
+ ),
+ });
+ }
+ if (item.NAME == "采场-生产区域") {
+ this.setState({
+ level4: item.LEVEL,
+ data4: item,
+ content4: (
+ 区域名称：{item.NAME}
+
+
+
+
+ 重大风险：{item.LEVEL1}
+ 较大风险：{item.LEVEL2}
+ 一般风险：{item.LEVEL3}
+ 低风险：{item.LEVEL4}
+
+ {/* */}
+
+
+
+ ),
+ });
+ }
+ }
+
+
+
+
+ render() {
+ return (
+ 区域名称：{item.NAME}
+
+
+
+
+ 重大风险：{item.LEVEL1}
+ 较大风险：{item.LEVEL2}
+ 一般风险：{item.LEVEL3}
+ 低风险：{item.LEVEL4}
+
+ {/* */}
+
+
+
+
+
+ {/* 矿石堆场背景区域 */}
+
+
+
+ 
+
+ {/* 东排土场 */}
+
+
+
+ {/* 采场-终了边坡 */}
+
+
+
+ {/* 采场-生产取悦 */}
+
+
+
+ {/* 采场-终了边坡区域2 */}
+ {/*
+
+
*/}
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {" "}
+
+
+
+
+
+ {" "}
+
+
+
+
+ {/*
+ {" "}
+
+
+
+
*/}
+
+
+ ),
+ });
+ }
+ if (item.NAME == "尾矿库") {
+ this.setState({
+ level2: item.LEVEL,
+ data2: item,
+ content2: (
+ 区域名称：{item.NAME}
+
+
+
+
+ 重大风险：{item.LEVEL1}
+ 较大风险：{item.LEVEL2}
+ 一般风险：{item.LEVEL3}
+ 低风险：{item.LEVEL4}
+
+ {/* */}
+
+
+
+ ),
+ });
+ }
+ }
+
+
+
+
+ render() {
+ return (
+ 区域名称：{item.NAME}
+
+
+
+
+ 重大风险：{item.LEVEL1}
+ 较大风险：{item.LEVEL2}
+ 一般风险：{item.LEVEL3}
+ 低风险：{item.LEVEL4}
+
+ {/* */}
+
+
+
+
+
+ {/* 选矿车间 */}
+
+
+
+
+
+ {/* 尾矿库 */}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ ),
+ });
+ }
+ if (item.NAME == "北排土场") {
+ this.setState({
+ level2: item.LEVEL,
+ data2: item,
+ content2: (
+ 区域名称：{item.NAME}
+
+
+
+
+ 重大风险：{item.LEVEL1}
+ 较大风险：{item.LEVEL2}
+ 一般风险：{item.LEVEL3}
+ 低风险：{item.LEVEL4}
+
+ {/* */}
+
+
+
+ ),
+ });
+ }
+ if (item.NAME == "采场-生产区域") {
+ this.setState({
+ level3: item.LEVEL,
+ data3: item,
+ content3: (
+ 区域名称：{item.NAME}
+
+
+
+
+ 重大风险：{item.LEVEL1}
+ 较大风险：{item.LEVEL2}
+ 一般风险：{item.LEVEL3}
+ 低风险：{item.LEVEL4}
+
+ {/* */}
+
+
+
+ ),
+ });
+ }
+ }
+
+
+
+
+ render() {
+ return (
+ 区域名称：{item.NAME}
+
+
+
+
+ 重大风险：{item.LEVEL1}
+ 较大风险：{item.LEVEL2}
+ 一般风险：{item.LEVEL3}
+ 低风险：{item.LEVEL4}
+
+ {/* */}
+
+
+
+
+
+ {/* 大禾底排土场 */}
+
+
+
+
+
+ {/* 北排土场 */}
+
+
+
+ {/* 露天采场 */}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {" "}
+
+
+
+
+
+