From 708832820ec79193a01b2cc4f78a982e0d689082 Mon Sep 17 00:00:00 2001 From: wjn Date: Mon, 25 Mar 2024 17:36:00 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../CustomPages/BI/BI013RiskAnalysisModel.js | 1504 +++++++++++------ src/models/login.js | 6 +- 2 files changed, 966 insertions(+), 544 deletions(-) diff --git a/src/components/CustomPages/BI/BI013RiskAnalysisModel.js b/src/components/CustomPages/BI/BI013RiskAnalysisModel.js index 5cbed4b..fe54219 100644 --- a/src/components/CustomPages/BI/BI013RiskAnalysisModel.js +++ b/src/components/CustomPages/BI/BI013RiskAnalysisModel.js @@ -2,335 +2,107 @@ import React, { useState, useEffect, useRef, Component } from "react"; import { connect } from "dva"; import { initFilter, - addRuleAndGroups, - guid, - extendInclude, - extendRule, extendOrder, - extend, - initQueryFilter, + guid, } from "../../../utils/common"; -import { Table, Row, Col, Button, Select, DatePicker, message } from "antd"; +import { Table, Row, Col, Button, Select, DatePicker, message, Modal, } from "antd"; import echarts from "echarts"; import moment from "moment"; +import IconFont from "../../../utils/iconFont"; class BI013RiskAnalysisModel extends React.Component { constructor(props) { super(props); this.state = { - pagination: {}, - retData: [], - LEVEL1TOTAL: 0, - LEVEL2TOTAL: 0, - LEVEL3TOTAL: 0, - LEVEL4TOTAL: 0, - HAZARDTOTALCOUNT: 0, - RISKTOTALCOUNT: 0, - MEASURESTOTALCOUNT: 0, + level1Color: "#c02e30", + level2Color: "#f7aa52", + level3Color: "#fbe06a", + level4Color: "#5185f3", + detailForm: { + isShow: false, + formCode: "", + title: "", + }, + ret: { + "IsSuccessful": true, "Data": { + "DATECOUNTS": [ + { "DATE": "2024-01-31 23:59:59", "COUNT": 50, "TYPE": 1 }, { "DATE": "2024-01-31 23:59:59", "COUNT": 414, "TYPE": 0 }, + { "DATE": "2024-02-29 23:59:59", "COUNT": 62, "TYPE": 1 }, { "DATE": "2024-02-29 23:59:59", "COUNT": 514, "TYPE": 0 }, + { "DATE": "2024-03-31 23:59:59", "COUNT": 62, "TYPE": 1 }, { "DATE": "2024-03-31 23:59:59", "COUNT": 614, "TYPE": 0 }, + { "DATE": "2024-04-30 23:59:59", "COUNT": 70, "TYPE": 1 }, { "DATE": "2024-04-30 23:59:59", "COUNT": 714, "TYPE": 0 }, + { "DATE": "2024-05-31 23:59:59", "COUNT": 80, "TYPE": 1 }, { "DATE": "2024-05-31 23:59:59", "COUNT": 814, "TYPE": 0 }, + { "DATE": "2024-06-30 23:59:59", "COUNT": 80, "TYPE": 1 }, { "DATE": "2024-06-30 23:59:59", "COUNT": 914, "TYPE": 0 }, + { "DATE": "2024-07-31 23:59:59", "COUNT": 94, "TYPE": 1 }, { "DATE": "2024-07-31 23:59:59", "COUNT": 954, "TYPE": 0 }, + { "DATE": "2024-08-31 23:59:59", "COUNT": 102, "TYPE": 1 }, { "DATE": "2024-08-31 23:59:59", "COUNT": 984, "TYPE": 0 }, + { "DATE": "2024-09-30 23:59:59", "COUNT": 102, "TYPE": 1 }, { "DATE": "2024-09-30 23:59:59", "COUNT": 1014, "TYPE": 0 }, + { "DATE": "2024-10-31 23:59:59", "COUNT": 112, "TYPE": 1 }, { "DATE": "2024-10-31 23:59:59", "COUNT": 1024, "TYPE": 0 }, + { "DATE": "2024-11-30 23:59:59", "COUNT": 113, "TYPE": 1 }, { "DATE": "2024-11-30 23:59:59", "COUNT": 1114, "TYPE": 0 }, + { "DATE": "2024-12-31 23:59:59", "COUNT": 116, "TYPE": 1 }, { "DATE": "2024-12-31 23:59:59", "COUNT": 1154, "TYPE": 0 }, + ], + "CHART11": [{ "name": "一级", "value": 39 }, { "name": "二级", "value": 82 }, { "name": "三级", "value": 381 }, { "name": "四级", "value": 812 }], + "CHARTLIST": [ + { "NAME": ["选矿厂", "尾矿库", "露天矿"], "LEVEL1": [137, 190, 168], "LEVEL2": [251, 231, 242], "LEVEL3": [365, 346, 370], "LEVEL4": [437, 497, 478] }, + + { "NAME": ["容器爆炸", "淹溺", "物体打击", "高处坠落", "火灾", "起重伤害", "其他爆炸", "中毒和窒息", "放炮", "冒顶片帮", "坍塌", "车辆伤害", "触电", "其他伤害", "机械伤害", "灼烫", "火药爆炸"], "LEVEL1": [398, 395, 389, 372, 356, 343, 328, 315, 299, 286, 272, 261, 247, 235, 223, 199, 184], "LEVEL2": [137, 145, 152, 161, 173, 186, 191, 203, 218, 229, 241, 260, 277, 293, 306, 321, 375], "LEVEL3": [37, 56, 72, 89, 104, 127, 143, 158, 175, 191, 206, 227, 251, 273, 294, 320, 385], "LEVEL4": [25, 37, 50, 62, 75, 88, 101, 119, 133, 147, 161, 178, 194, 211, 230, 255, 392] }, + + { "NAME": ["生产一班", "选矿部", "机电设备管理办公室", "矿山部", "财务部", "办公室", "非金属资源部筹备组", "企业管理部", "技术管理部", "营销部"], "LEVEL1": [35, 121, 227, 330, 97, 153, 178, 212, 25, 301], "LEVEL2": [39, 151, 202, 322, 45, 187, 239, 308, 112, 376], "LEVEL3": [56, 109, 273, 381, 74, 135, 215, 296, 123, 335], "LEVEL4": [23, 168, 250, 390, 62, 117, 244, 313, 89, 367] }, + + { "NAME": ["部门", "车间", "班组", "公司"], "LEVEL1": [75, 119, 25, 392], "LEVEL2": [307, 102, 235, 18], "LEVEL3": [343, 121, 396, 78], "LEVEL4": [215, 331, 37, 292] }, + + { "NAME": ["容器爆炸", "淹溺", "物体打击", "高处坠落", "火灾", "起重伤害", "其他爆炸", "中毒和窒息", "放炮", "冒顶片帮", "坍塌", "车辆伤害", "触电", "其他伤害", "机械伤害", "灼烫", "火药爆炸"], "LEVEL1": [95, 122, 217, 78, 254, 153, 26, 192, 239, 170, 103, 145, 278, 212, 55, 189, 287], "LEVEL2": [221, 135, 110, 243, 150, 199, 273, 148, 17, 290, 228, 201, 184, 92, 165, 106, 133], "LEVEL3": [300, 23, 187, 86, 111, 250, 248, 137, 157, 260, 298, 53, 100, 129, 175, 142, 285], "LEVEL4": [204, 162, 223, 291, 197, 109, 42, 274, 171, 118, 138, 232, 252, 167, 255, 124, 2] }, + + { "NAME": ["部门", "车间", "班组", "公司"], "LEVEL1": [153, 124, 178, 190], "LEVEL2": [105, 132, 27, 185], "LEVEL3": [200, 14, 56, 139], "LEVEL4": [37, 176, 150, 120] }, + + { "NAME": ["生产一班", "选矿部", "机电设备管理办公室", "矿山部", "财务部", "办公室", "非金属资源部筹备组", "企业管理部", "技术管理部", "营销部"], "LEVEL1": [187, 152, 113, 199, 75, 141, 102, 34, 160, 128], "LEVEL2": [135, 194, 86, 162, 107, 43, 173, 155, 118, 181], "LEVEL3": [110, 131, 197, 27, 92, 150, 170, 180, 12, 178], "LEVEL4": [56, 183, 100, 125, 190, 171, 89, 140, 161, 137] }, + + { "NAME": ["破碎车间-粗碎单元", '机电设备管理科作业区', '高压配电室', '电焊作业区', '采场', '破碎车间', '尾矿库截洪单元', '尾矿库库坝单元', '磨重车间-细粒选别单元', '钨细泥回收车间-排尾单元'], "LEVEL1": [320, 302, 301, 334, 320, 302, 301, 33, 67, 89], "LEVEL2": [120, 132, 101, 134, 334, 320, 302, 301, 33, 67], "LEVEL3": [220, 182, 191, 234, 334, 320, 302, 301, 33, 67], "LEVEL4": [150, 212, 201, 154, 334, 320, 302, 301, 33, 67] } + ] + }, "TotalCount": 0, "MessageType": 0 + } }; } componentDidMount() { - let currentMineType = ""; - if (this.props.formParam != undefined || this.props.formParam != null) { - currentMineType = this.props.formParam.type; - } else { - currentMineType = localStorage.getItem("currentMineType"); - } - this.getBaseInfoData(currentMineType); + this.getBaseInfoData(); } //获取数据 - getBaseInfoData = (mineType) => { + getBaseInfoDataOnline = (mineType) => { const json2 = initFilter(this.props.login.OrgId); extendOrder(json2, "CREATE_TIME", 1); json2.Parameter1 = mineType; this.props.dispatch({ type: "app/getDataByPost", - url: "BI/BIController/getRiskData", + url: "BI/BIController/getRiskPerformanceData", payload: json2, onlyData: false, onComplete: (ret) => { - if (ret) { - this.state.retData = ret?.Data.RISKLEVELCOUNTS; - let level1all = 0; - let level2all = 0; - let level3all = 0; - let level4all = 0; - for (let i = 0; i < ret.Data.RISKLEVELCOUNTS.length; i++) { - level1all += ret.Data.RISKLEVELCOUNTS[i].LEVEL1; - level2all += ret.Data.RISKLEVELCOUNTS[i].LEVEL2; - level3all += ret.Data.RISKLEVELCOUNTS[i].LEVEL3; - level4all += ret.Data.RISKLEVELCOUNTS[i].LEVEL4; - } - this.setState({ - LEVEL1TOTAL: level1all, - LEVEL2TOTAL: level2all, - LEVEL3TOTAL: level3all, - LEVEL4TOTAL: level4all, - HAZARDTOTALCOUNT: ret.Data.HAZARDTOTALCOUNT, - RISKTOTALCOUNT: ret.Data.RISKTOTALCOUNT, - MEASURESTOTALCOUNT: ret.Data.MEASURESTOTALCOUNT, - }); - // this.state.LEVEL1TOTAL = level1all; - // this.state.LEVEL2TOTAL = level2all; - // this.state.LEVEL3TOTAL = level3all; - // this.state.LEVEL4TOTAL = level4all; - // this.state.HAZARDTOTALCOUNT = ret.Data.HAZARDTOTALCOUNT; - // this.state.RISKTOTALCOUNT = ret.Data.RISKTOTALCOUNT; - // this.state.MEASURESTOTALCOUNT = ret.Data.MEASURESTOTALCOUNT; - } - this.chart1(); - this.chart2(ret?.Data.AREACOUNTS.slice(0, 20)); this.chart4(ret?.Data.DATECOUNTS); + this.chart11(ret?.Data.CHART11); + this.chart12(ret?.Data.CHARTLIST[0]); + this.chart13(ret?.Data.CHARTLIST[1]); + this.chart14(ret?.Data.CHARTLIST[2]); + this.chart15(ret?.Data.CHARTLIST[3]); + + this.chart16(ret?.Data.CHARTLIST[4]); + this.chart17(ret?.Data.CHARTLIST[5]); + this.chart18(ret?.Data.CHARTLIST[6]); + this.chart19(ret?.Data.CHARTLIST[7]); }, }); }; - chart1 = () => { - let showData = []; - let color = []; - let allNum = 0; - showData.push({ value: this.state.LEVEL1TOTAL, name: "一级" }); - showData.push({ value: this.state.LEVEL2TOTAL, name: "二级" }); - showData.push({ value: this.state.LEVEL3TOTAL, name: "三级" }); - showData.push({ value: this.state.LEVEL4TOTAL, name: "四级" }); - showData.map((item) => { - if (item.name === "一级") { - color.push("#c92a2a"); - } else if (item.name === "二级") { - color.push("#ffa94d"); - } else if (item.name === "三级") { - color.push("#ffe066"); - } else if (item.name === "四级") { - color.push("#4285F4"); - } - allNum = allNum + item.value; - }); + getBaseInfoData = (mineType) => { + this.chart4(this.state.ret.Data.DATECOUNTS); + this.chart11(this.state.ret.Data.CHART11); + this.chart12(this.state.ret.Data.CHARTLIST[0]); + this.chart13(this.state.ret.Data.CHARTLIST[1]); + this.chart14(this.state.ret.Data.CHARTLIST[2]); + this.chart15(this.state.ret.Data.CHARTLIST[3]); - let chart1s = document.getElementById("chartone"); - let myChart = echarts.init(chart1s); - myChart.setOption({ - color: color, - title: [ - { - text: "风险分级占比", - left: "center", - top: "2%", - }, - { - text: allNum, - x: "26%", - y: "center", - textStyle: { - fontSize: 26, - fontWeight: "normal", - color: ["#333"], - }, - }, - ], - tooltip: { - trigger: "item", - formatter: "{b}:({d}%)", - }, - legend: { - orient: "vartical", - x: "left", - top: "35%", - left: "65%", - bottom: "0%", - data: showData, - // itemWidth: 20, - // itemHeight: 14, - // itemGap :15, - formatter: function (name) { - //通过name获取到数组对象中的单个对象 - let singleData = showData.filter(function (item) { - return item.name == name; - }); - let countAll = 0; - showData.map((item) => { - countAll = countAll + item.value; - }); - - return ( - name + - " | " + - singleData[0].value + - " | " + - Number((singleData[0].value / countAll) * 100).toFixed(2) + - "%" - ); - }, - }, - grid: { - left: 30, - containLabel: true, - bottom: 10, - top: 10, - right: 30, - }, - series: [ - { - name: "访问来源", - type: "pie", - clockwise: false, - // minAngle: 20, - avoidLabelOverlap: false, - radius: ["45%", "65%"], - center: ["30%", "50%"], - itemStyle: { - //图形样式 - normal: { - borderColor: "#ffffff", - borderWidth: 1, - padding: "0 20px", - }, - }, - label: { - show: false, - }, - // color: color, - data: showData, - }, - ], - }, true); + this.chart16(this.state.ret.Data.CHARTLIST[4]); + this.chart17(this.state.ret.Data.CHARTLIST[5]); + this.chart18(this.state.ret.Data.CHARTLIST[6]); + this.chart19(this.state.ret.Data.CHARTLIST[7]); }; - chart2 = (data) => { - let areaName = []; - let areaCount = []; - data.forEach((item) => { - areaName.push(item.AREANAME); - areaCount.push(item.AREACOUNT); - }); - let chart2s = document.getElementById("chart2"); - if (chart2s) { - let myChart = echarts.init(chart2s); - myChart.setOption({ - title: { - text: "风险区域统计", - left: "center", - top: "2%", - }, - tooltip: { - trigger: "axis", - axisPointer: { - type: "shadow", - }, - }, - grid: { - left: "3%", - right: "4%", - top: "10%", - bottom: "1%", - containLabel: true, - }, - xAxis: { - show: false, - }, - yAxis: [ - { - triggerEvent: true, - show: true, - inverse: false, - data: areaName, - axisLine: { - show: false, - }, - splitLine: { - show: false, - }, - axisTick: { - show: false, - }, - axisLabel: { - interval: 0, - color: "#666", - align: "right", - margin: 20, - fontSize: 13, - - rich: { - idx0: { - color: "#FB375E", - backgroundColor: "#FFE8EC", - borderRadius: 100, - padding: [5, 8], - }, - idx1: { - color: "#FF9023", - backgroundColor: "#FFEACF", - borderRadius: 100, - padding: [5, 8], - }, - idx2: { - color: "#01B599", - backgroundColor: "#E1F7F3", - borderRadius: 100, - padding: [5, 8], - }, - idx: { - color: "#333", - borderRadius: 100, - padding: [5, 8], - }, - title: { - width: 165, - }, - }, - }, - }, - { - triggerEvent: true, - show: true, - inverse: false, - data: areaCount, - axisLine: { - show: false, - }, - splitLine: { - show: false, - }, - axisTick: { - show: false, - }, - axisLabel: { - interval: 0, - color: "#666", - align: "left", - margin: 20, - fontSize: 12, - }, - }, - ], - series: [ - { - name: "数量", - type: "bar", - // label: { - // show: true, - // position: "insideRight", - // color: "#fff", - // formatter: "{c}", - // fontSize: "12", - // }, - barWidth: 10, - itemStyle: { - color: "#1990FF", - barBorderRadius: 30, - }, - // itemStyle: { - // color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [ - // { offset: 0, color: "#01AEF6" }, - // { offset: 1, color: "#9999FF" }, - // ]), - // }, - data: areaCount, - show: false, - }, - ], - }, true); - } - }; - chart4 = (data) => { let riskArr = []; let hazardArr = []; @@ -338,7 +110,7 @@ class BI013RiskAnalysisModel extends React.Component { for (let i = 0; i < data.length; i++) { if (data[i].TYPE == 0) { riskArr.push(data[i].COUNT); - dates.push(moment(data[i].DATE).format("YYYY/MM")); + dates.push(moment(data[i].DATE).format("MM")); } else { hazardArr.push(data[i].COUNT); } @@ -346,7 +118,7 @@ class BI013RiskAnalysisModel extends React.Component { let currMonth = dates.length; for (let i = 1; i < 13 - currMonth; i++) { dates.push( - moment(dates[dates.length]).add(i, "months").format("YYYY/MM") + moment(dates[dates.length]).add(i, "months").format("MM") ); } let chart4s = document.getElementById("chart4"); @@ -399,12 +171,796 @@ class BI013RiskAnalysisModel extends React.Component { }, true); } }; + chart11 = (Data) => { + let that = this; + let chart11s = document.getElementById("chart11"); + Data.forEach(item => { + if (item.name == "一级") { + item.itemStyle = { color: this.state.level1Color }; + } + if (item.name == "二级") { + item.itemStyle = { color: this.state.level2Color }; + } + if (item.name == "三级") { + item.itemStyle = { color: this.state.level3Color }; + } + if (item.name == "四级") { + item.itemStyle = { color: this.state.level4Color }; + } + }) + if (chart11s) { + let myChart = echarts.init(chart11s); + myChart.setOption({ + title: { + text: '风险等级', + left: 'center' + }, + tooltip: { + trigger: 'item', + formatter: '{b} : {c} ({d}%)' + }, + legend: { + orient: "vartical", + x: "right", + top: "40%", + bottom: "0%", + data: ['一级', '二级', '三级', '四级'], + formatter: function (name) { + let singleData = Data.filter(function (item) { + return item.name == name; + }); + let countAll = 0; + Data.map((item) => { + countAll = countAll + item.value; + }); + + return ( + name + + " | " + + singleData[0].value + + " | " + + Number((singleData[0].value / countAll) * 100).toFixed(2) + + "%" + ); + }, + }, + series: [ + { + type: 'pie', + radius: '65%', + center: ['45%', '50%'], + data: Data, + label: { + show: false, + }, + } + ] + }, true); + // 添加点击事件监听器 + myChart.on('click', function (params) { + // params 参数包含了点击事件的相关信息 + // 如：params.componentType 可能是 'series' + // params.seriesIndex 系列的索引（在只有一个系列的情况下通常是0） + // params.dataIndex 扇区的数据索引 + // params.name 点击的扇区名称 + // params.value 点击的扇区对应的数值 + + + // 你可以根据params执行任何你想做的操作，例如： + if (params.componentType === 'series') { + if (params.name == '一级') { + that.chart13(that.subtractRandomNotLessThanSelf(that.state.ret.Data.CHARTLIST[1])) + } else if (params.name == '二级') { + that.subtractRandomNotLessThanSelf(that.state.ret.Data.CHARTLIST[1]); + } else if (params.name == '三级') { + that.subtractRandomNotLessThanSelf(that.state.ret.Data.CHARTLIST[1]); + } else if (params.name == '四级') { + that.subtractRandomNotLessThanSelf(that.state.ret.Data.CHARTLIST[1]); + } + } + }); + } + }; + chart12 = (Data) => { + let chart12s = document.getElementById("chart12"); + if (chart12s) { + let myChart = echarts.init(chart12s); + myChart.setOption( + { + title: { + text: '生产单元', + left: 'center' + }, + tooltip: { + trigger: 'axis', + axisPointer: { // 坐标轴指示器，坐标轴触发有效 + type: 'shadow' // 默认为直线，可选为：'line' | 'shadow' + } + }, + legend: { + top: '40%', + orient: 'vertical', + x: "right", + data: ['一级', '二级', '三级', '四级'] + }, + grid: { + left: '3%', + right: '12%', + bottom: '3%', + containLabel: true + }, + xAxis: [ + { + type: 'category', + data: Data.NAME + } + ], + yAxis: [ + { + type: 'value' + } + ], + series: [ + { + name: '一级', + type: 'bar', + data: Data.LEVEL1, + itemStyle: { color: this.state.level1Color } + }, + { + name: '二级', + type: 'bar', + data: Data.LEVEL2, + itemStyle: { color: this.state.level2Color } + }, + { + name: '三级', + type: 'bar', + data: Data.LEVEL3, + itemStyle: { color: this.state.level3Color } + }, + { + name: '四级', + type: 'bar', + data: Data.LEVEL4, + itemStyle: { color: this.state.level4Color } + } + ] + }, true); + } + }; + chart13 = (Data) => { + let chart13s = document.getElementById("chart13"); + if (chart13s) { + let myChart = echarts.init(chart13s); + myChart.setOption( + { + title: { + text: '风险类别(等级)', + left: 'center' + }, + tooltip: { + trigger: 'axis', + axisPointer: { // 坐标轴指示器，坐标轴触发有效 + type: 'shadow' // 默认为直线，可选为：'line' | 'shadow' + } + }, + legend: { + top: '40%', + orient: 'vertical', + x: "right", + data: ['一级', '二级', '三级', '四级'] + }, + grid: { + left: '3%', + right: '12%', + bottom: '3%', + containLabel: true + }, + xAxis: { + type: 'value' + }, + yAxis: { + type: 'category', + data: Data.NAME.slice(0, 10) + }, + series: [ + { + name: '一级', + type: 'bar', + stack: '总量', + label: { + show: true, + position: 'insideRight' + }, + data: Data.LEVEL1.slice(0, 10) + , + itemStyle: { color: this.state.level1Color } + }, + { + name: '二级', + type: 'bar', + stack: '总量', + label: { + show: true, + position: 'insideRight' + }, + data: Data.LEVEL2.slice(0, 10), + itemStyle: { color: this.state.level2Color } + }, + { + name: '三级', + type: 'bar', + stack: '总量', + label: { + show: true, + position: 'insideRight' + }, + data: Data.LEVEL3.slice(0, 10), + itemStyle: { color: this.state.level3Color } + }, + { + name: '四级', + type: 'bar', + stack: '总量', + label: { + show: true, + position: 'insideRight' + }, + data: Data.LEVEL4.slice(0, 10), + itemStyle: { color: this.state.level4Color } + }, + ] + }, true); + } + }; + chart14 = (Data) => { + let chart14s = document.getElementById("chart14"); + if (chart14s) { + let myChart = echarts.init(chart14s); + myChart.setOption( + { + title: { + text: '责任单位(等级)', + left: 'center' + }, + tooltip: { + trigger: 'axis', + axisPointer: { // 坐标轴指示器，坐标轴触发有效 + type: 'shadow' // 默认为直线，可选为：'line' | 'shadow' + } + }, + legend: { + top: '40%', + orient: 'vertical', + x: "right", + data: ['一级', '二级', '三级', '四级'] + }, + grid: { + left: '3%', + right: '12%', + bottom: '3%', + containLabel: true + }, + xAxis: [ + { + type: 'category', + data: Data.NAME, + axisLabel: { + interval: 0, + rotate: 40, + formatter: function (value) { + return value + } + } + } + ], + yAxis: [ + { + type: 'value' + } + ], + series: [ + + { + name: '一级', + type: 'bar', + data: Data.LEVEL1, + itemStyle: { color: this.state.level1Color } + }, + { + name: '二级', + type: 'bar', + data: Data.LEVEL2, + itemStyle: { color: this.state.level2Color } + }, + { + name: '三级', + type: 'bar', + data: Data.LEVEL3, + itemStyle: { color: this.state.level3Color } + }, + { + name: '四级', + type: 'bar', + data: Data.LEVEL4, + itemStyle: { color: this.state.level4Color } + } + ] + }, true); + } + }; + chart15 = (Data) => { + let chart15s = document.getElementById("chart15"); + if (chart15s) { + let myChart = echarts.init(chart15s); + myChart.setOption( + { + title: { + text: '层级（等级）', + left: 'center' + }, + tooltip: { + trigger: 'axis', + axisPointer: { // 坐标轴指示器，坐标轴触发有效 + type: 'shadow' // 默认为直线，可选为：'line' | 'shadow' + } + }, + legend: { + top: '40%', + orient: 'vertical', + x: "right", + data: ['一级', '二级', '三级', '四级'] + }, + grid: { + left: '3%', + right: '12%', + bottom: '3%', + containLabel: true + }, + xAxis: [ + { + type: 'category', + data: Data.NAME + } + ], + yAxis: [ + { + type: 'value' + } + ], + series: [ + + { + name: '一级', + type: 'bar', + data: Data.LEVEL1, + itemStyle: { color: this.state.level1Color } + }, + { + name: '二级', + type: 'bar', + data: Data.LEVEL2, + itemStyle: { color: this.state.level2Color } + }, + { + name: '三级', + type: 'bar', + data: Data.LEVEL3, + itemStyle: { color: this.state.level3Color } + }, + { + name: '四级', + type: 'bar', + data: Data.LEVEL4, + itemStyle: { color: this.state.level4Color } + } + ] + }, true); + } + }; + chart16 = (Data) => { + let chart16s = document.getElementById("chart16"); + if (chart16s) { + let myChart = echarts.init(chart16s); + myChart.setOption( + { + title: { + text: '风险类别(生产单元+等级)', + left: 'center' + }, + tooltip: { + trigger: 'axis', + axisPointer: { // 坐标轴指示器，坐标轴触发有效 + type: 'shadow' // 默认为直线，可选为：'line' | 'shadow' + } + }, + legend: { + top: '40%', + orient: 'vertical', + x: "right", + data: ['一级', '二级', '三级', '四级'] + }, + grid: { + left: '3%', + right: '12%', + bottom: '3%', + containLabel: true + }, + xAxis: { + type: 'value' + }, + yAxis: { + type: 'category', + data: Data.NAME + }, + series: [ + { + name: '一级', + type: 'bar', + stack: '总量', + label: { + show: true, + position: 'insideRight' + }, + data: Data.LEVEL1, + itemStyle: { color: this.state.level1Color } + }, + { + name: '二级', + type: 'bar', + stack: '总量', + label: { + show: true, + position: 'insideRight' + }, + data: Data.LEVEL2, + itemStyle: { color: this.state.level2Color } + }, + { + name: '三级', + type: 'bar', + stack: '总量', + label: { + show: true, + position: 'insideRight' + }, + data: Data.LEVEL3, + itemStyle: { color: this.state.level3Color } + }, + { + name: '四级', + type: 'bar', + stack: '总量', + label: { + show: true, + position: 'insideRight' + }, + data: Data.LEVEL4, + itemStyle: { color: this.state.level4Color } + }, + ] + }, true); + } + }; + chart17 = (Data) => { + let chart17s = document.getElementById("chart17"); + if (chart17s) { + let myChart = echarts.init(chart17s); + myChart.setOption( + { + title: { + text: '层级（生产单元+等级）', + left: 'center' + }, + tooltip: { + trigger: 'axis', + axisPointer: { // 坐标轴指示器，坐标轴触发有效 + type: 'shadow' // 默认为直线，可选为：'line' | 'shadow' + } + }, + legend: { + top: '40%', + orient: 'vertical', + x: "right", + data: ['一级', '二级', '三级', '四级'] + }, + grid: { + left: '3%', + right: '12%', + bottom: '3%', + containLabel: true + }, + xAxis: [ + { + type: 'category', + data: Data.NAME + } + ], + yAxis: [ + { + type: 'value' + } + ], + series: [ + + { + name: '一级', + type: 'bar', + data: Data.LEVEL1, + itemStyle: { color: this.state.level1Color } + }, + { + name: '二级', + type: 'bar', + data: Data.LEVEL2, + itemStyle: { color: this.state.level2Color } + }, + { + name: '三级', + type: 'bar', + data: Data.LEVEL3, + itemStyle: { color: this.state.level3Color } + }, + { + name: '四级', + type: 'bar', + data: Data.LEVEL4, + itemStyle: { color: this.state.level4Color } + } + ] + }, true); + } + }; + chart18 = (Data) => { + let chart18s = document.getElementById("chart18"); + if (chart18s) { + let myChart = echarts.init(chart18s); + myChart.setOption( + { + title: { + text: '责任单位(等级)', + left: 'center' + }, + tooltip: { + trigger: 'axis', + axisPointer: { // 坐标轴指示器，坐标轴触发有效 + type: 'shadow' // 默认为直线，可选为：'line' | 'shadow' + } + }, + legend: { + top: '40%', + orient: 'vertical', + x: "right", + data: ['一级', '二级', '三级', '四级'] + }, + grid: { + left: '3%', + right: '12%', + bottom: '3%', + containLabel: true + }, + xAxis: [ + { + type: 'category', + data: Data.NAME, + axisLabel: { + interval: 0, + rotate: 40, + formatter: function (value) { + return value + } + } + } + ], + yAxis: [ + { + type: 'value' + } + ], + series: [ + + { + name: '一级', + type: 'bar', + data: Data.LEVEL1, + itemStyle: { color: this.state.level1Color } + }, + { + name: '二级', + type: 'bar', + data: Data.LEVEL2, + itemStyle: { color: this.state.level2Color } + }, + { + name: '三级', + type: 'bar', + data: Data.LEVEL3, + itemStyle: { color: this.state.level3Color } + }, + { + name: '四级', + type: 'bar', + data: Data.LEVEL4, + itemStyle: { color: this.state.level4Color } + } + ] + }, true); + } + }; + chart19 = (Data) => { + let chart19s = document.getElementById("chart19"); + if (chart19s) { + let myChart = echarts.init(chart19s); + myChart.setOption( + { + title: { + text: '区域(生产单元+等级)', + left: 'center' + }, + tooltip: { + trigger: 'axis', + axisPointer: { // 坐标轴指示器，坐标轴触发有效 + type: 'shadow' // 默认为直线，可选为：'line' | 'shadow' + } + }, + legend: { + top: '40%', + orient: 'vertical', + x: "right", + data: ['一级', '二级', '三级', '四级'] + }, + grid: { + left: '3%', + right: '12%', + bottom: '3%', + containLabel: true + }, + xAxis: { + type: 'value' + }, + yAxis: { + type: 'category', + data: Data.NAME + }, + series: [ + { + name: '一级', + type: 'bar', + stack: '总量', + label: { + show: true, + position: 'insideRight' + }, + data: Data.LEVEL1, + itemStyle: { color: this.state.level1Color } + }, + { + name: '二级', + type: 'bar', + stack: '总量', + label: { + show: true, + position: 'insideRight' + }, + data: Data.LEVEL2, + itemStyle: { color: this.state.level2Color } + }, + { + name: '三级', + type: 'bar', + stack: '总量', + label: { + show: true, + position: 'insideRight' + }, + data: Data.LEVEL3, + itemStyle: { color: this.state.level3Color } + }, + { + name: '四级', + type: 'bar', + stack: '总量', + label: { + show: true, + position: 'insideRight' + }, + data: Data.LEVEL4, + itemStyle: { color: this.state.level4Color } + }, + ] + }, true); + } + }; + subtractRandomNotLessThanSelf = (data) => { + function getRandomNotLessThan(num) { + return Math.floor(Math.random() * num) + num; + } + + // 处理数组的情况 + if (Array.isArray(data)) { + return data.map(item => { + if (typeof item === 'number') { + const randomSubtraction = getRandomNotLessThan(item); + return item - randomSubtraction; + } + // 同样地，这里假设对象有一个名为value的数字属性需要处理 + else if (typeof item === 'object' && typeof item.value === 'number') { + const randomSubtraction = getRandomNotLessThan(item.value); + return { ...item, value: item.value - randomSubtraction }; + } + else { + return item; + } + }); + } + // 处理非数组但为数字的情况 + else if (typeof data === 'number') { + const randomSubtraction = getRandomNotLessThan(data); + return data - randomSubtraction; + } + // 其他情况返回原数据 + else { + return data; + } + } + + //显示详情弹窗 + showDetailModal = (formCode) => { + var titleTemp = + this.state.mineType == 20 + ? "尾矿库" + : this.state.mineType == 10 + ? "选矿厂" + : "露天矿"; + if (formCode == "chart13") { + titleTemp += "风险类别"; + } else if (formCode == "") { + titleTemp += ""; + } else if (formCode == "") { + titleTemp += ""; + } else if (formCode == "") { + titleTemp += ""; + } else if (formCode == "") { + titleTemp += ""; + } + + const newtmpData = { + data: { + id: guid(), + mineType: this.state.mineType, + onCancel: this.handleCancel, + homeReload: true, + }, + formCode: formCode, + }; + this.setState({ tmpData: newtmpData }, () => { + var detailForm = { + isShow: true, + formCode: formCode, + title: titleTemp, + }; + this.setState({ + detailForm: detailForm, + }); + }); + }; + //详情弹窗关闭（隐藏） + detailFormClose = () => { + var detailForm = { + isShow: false, + formCode: "", + title: "", + }; + this.setState({ + detailForm: detailForm, + }); + }; render() { return (
- {/*

- 风险管理统计分析 -

*/} - - - {/* -
- - - - -
- */} - +
+ + +
+ +
-
+
+ +
+
+
+ + +
+
+
+ + + + + + +
+
+ this.showDetailModal("chart13") + } + > + +
+
+
+ + +
+
+
+ + +
+
+
+ + + + + + +
+
+
+ + +
+
+
+ + + + + +
+
+
+ + +
+
+
+ + + + + + {/*
- - {/*
*/} - - - -
-
- 危险源/风险库 - {/*

*/} -
- - {this.state.RISKTOTALCOUNT} - - 条 -
-
-
- 职业危害库 - {/*

*/} -
- - {this.state.HAZARDTOTALCOUNT} - - 条 -
-
-
- 管控措施 - {/*

*/} -
- - {this.state.MEASURESTOTALCOUNT} - - 条 -
-
-
- - - - - -
-
-
- - + */} + +
); diff --git a/src/models/login.js b/src/models/login.js index ea10c74..ead219b 100644 --- a/src/models/login.js +++ b/src/models/login.js @@ -115,9 +115,9 @@ export default { dispatch({ type: "refreshToken", }); - dispatch({ - type: "app/getCurrVer", - }); + // dispatch({ + // type: "app/getCurrVer", + // }); dispatch({ type: "app/getAllEnum", }).then((e) => {