From 61dd35ae666dc5cc09de891f20a2174e438119d9 Mon Sep 17 00:00:00 2001 From: yunkexin <760754045@qq.com> Date: Wed, 10 Apr 2024 09:08:47 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BD=9C=E4=B8=9A=E7=8E=B0=E5=9C=BA=E7=AE=A1?= =?UTF-8?q?=E7=90=86=E7=BB=9F=E8=AE=A1=E6=8A=A5=E8=A1=A8=E4=BC=98=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../CustomPages/BI/BI009FormRunAnalysis.js | 1692 ++++++++++++----- .../CustomPages/BI/BI013RiskAnalysisModel.js | 24 +- .../CustomPages/BI/BI054HomeDetail.js | 7 + .../CustomPages/BI/BI055HomeDetail.js | 4 + 4 files changed, 1279 insertions(+), 448 deletions(-) diff --git a/src/components/CustomPages/BI/BI009FormRunAnalysis.js b/src/components/CustomPages/BI/BI009FormRunAnalysis.js index c567fdd..7c53d2e 100644 --- a/src/components/CustomPages/BI/BI009FormRunAnalysis.js +++ b/src/components/CustomPages/BI/BI009FormRunAnalysis.js @@ -1,209 +1,249 @@ -import React from 'react' -import { connect } from 'dva' -import { initFilter, extendRule, extendOrder } from "../../../utils/common" -import { ChartPieShow, ChartBarShow } from "../../../utils/commonEcharsShow" -import { Table, Button, Row, Col,Modal ,Icon,Progress} from 'antd'; -import echarts from 'echarts'; -import styles from '../HI/StepForm.css'; -import moment from 'moment' -import { T } from 'antd/lib/upload/utils'; -import FormPage from '../../FormPage' +import React from "react"; +import { connect } from "dva"; +import { initFilter, extendRule, extendOrder } from "../../../utils/common"; +import { ChartPieShow, ChartBarShow } from "../../../utils/commonEcharsShow"; +import { Table, Button, Row, Col, Modal, Icon, Progress, Divider } from "antd"; +import echarts from "echarts"; +import styles from "../HI/StepForm1.css"; +import moment from "moment"; +import { T } from "antd/lib/upload/utils"; +import FormPage from "../../FormPage"; class BI009FormRunAnalysis extends React.Component { - constructor(props) { super(props); this.state = { visible: false, - noticeTitle: '', + noticeTitle: "", tmpData: {}, tableKey: "1", - timeType: 5, - ordinaryCount:0, - crucialCount:0, - activityCount:0, - postCount:0, - postChangeCount:0, - taskCount:0, - weekColor:'black', - monthColor:'orange', - threeMonthColor:'black', - sixMonthColor:'black', - yearColor:'black', - retData:[], - groupData:[], - detailData:[], - newData:[], - detailDataH:[], - displayHr:'none', - displaydetail:'none', - columns: [ + timeType: 5, + ordinaryCount: 0, + crucialCount: 0, + activityCount: 0, + postCount: 0, + postChangeCount: 0, + taskCount: 0, + weekColor: "black", + monthColor: "orange", + threeMonthColor: "black", + sixMonthColor: "black", + yearColor: "black", + retData: [], + groupData: [], + detailData: [], + newData: [], + detailDataH: [], + displayHr: "none", + displaydetail: "none", + columns: [ + { + width: "200px", + title: "部门", + dataIndex: "DEPARTMENT_NAME", + key: "DEPARTMENT_NAME", + // render: (text, record) => ( + // + // this.showEditModal(record.DEPARTMENT_ID,record.DEPARTMENT_NAME)}>{record.DEPARTMENT_NAME} + // + // ), + }, + { + width: "200px", + title: "班组", + dataIndex: "TEAM_NAME", + key: "TEAM_NAME", + // render: (text, record) => ( + // + // this.showEditModal(record.DEPARTMENT_ID,record.DEPARTMENT_NAME)}>{record.DEPARTMENT_NAME} + // + // ), + }, + { + title: "完成率", + children: [ { - width: "100px", - title: '部门', - dataIndex: 'DEPARTMENT_NAME', - key: 'DEPARTMENT_NAME', - // render: (text, record) => ( - // - // this.showEditModal(record.DEPARTMENT_ID,record.DEPARTMENT_NAME)}>{record.DEPARTMENT_NAME} - // - // ), - }, - { - width: "100px", - title: '班组', - dataIndex: 'TEAM_NAME', - key: 'TEAM_NAME', - // render: (text, record) => ( - // - // this.showEditModal(record.DEPARTMENT_ID,record.DEPARTMENT_NAME)}>{record.DEPARTMENT_NAME} - // - // ), - }, - { - title: '完成率', - children: [ - { - title: '班前会议', - render: (text, record) => ({record.FO01_TOTAL == 0?'0%':(((record.FO01_FINISH +record.FO01_OVERTIME)/ record.FO01_TOTAL)*100).toFixed(0)+"%"}) - }, - { - title: '岗位交接班', - render: (text, record) => ({record.FO03_TOTAL == 0?'0%':(((record.FO03_FINISH +record.FO03_OVERTIME)/ record.FO03_TOTAL)*100).toFixed(0)+"%"}) - }, - { - title: '岗位当班记录', - render: (text, record) => ({record.FO02_TOTAL == 0?'0%':(((record.FO02_FINISH +record.FO02_OVERTIME)/ record.FO02_TOTAL)*100).toFixed(0)+"%"}) - }, - ], - }, - // { - // title: '及时完成率', - // children: [ - // { - // title: '班前会议', - // render: (text, record) => ({record.FO01_TOTAL == 0?'0%':((record.FO01_FINISH/ record.FO01_TOTAL)*100).toFixed(0)+"%"}) - // }, - // { - // title: '岗位交接班', - // render: (text, record) => ({record.FO03_TOTAL == 0?'0%':((record.FO03_FINISH / record.FO03_TOTAL)*100).toFixed(0)+"%"}) - // }, - // { - // title: '岗位当班记录', - // render: (text, record) => ({record.FO02_TOTAL == 0?'0%':((record.FO02_FINISH / record.FO02_TOTAL)*100).toFixed(0)+"%"}) - // }, - // ], - // }, - ], - detailColumns: [ - { - width: "60px", - title: '班组', - dataIndex: 'DEPARTMENT_NAME', - key: 'DEPARTMENT_NAME', - // render: (text, record) => ( - // - // this.showEditModal(record.DEPARTMENT_ID,record.DEPARTMENT_NAME)}>{record.DEPARTMENT_NAME} - // - // ), + title: "班前会议", + render: (text, record) => ( + + {record.FO01_TOTAL == 0 + ? "0%" + : ( + ((record.FO01_FINISH + record.FO01_OVERTIME) / + record.FO01_TOTAL) * + 100 + ).toFixed(0) + "%"} + + ), }, { - width: "60px", - title: '总任务数', - dataIndex: 'TOTAL_QTY', - key: 'TOTAL_QTY' + title: "岗位交接班", + render: (text, record) => ( + + {record.FO03_TOTAL == 0 + ? "0%" + : ( + ((record.FO03_FINISH + record.FO03_OVERTIME) / + record.FO03_TOTAL) * + 100 + ).toFixed(0) + "%"} + + ), }, { - width: "60px", - title: '正常已办', - dataIndex: 'FINISH_QTY', - key: 'FINISH_QTY' + title: "岗位当班记录", + render: (text, record) => ( + + {record.FO02_TOTAL == 0 + ? "0%" + : ( + ((record.FO02_FINISH + record.FO02_OVERTIME) / + record.FO02_TOTAL) * + 100 + ).toFixed(0) + "%"} + + ), }, - { - width: "60px", - title: '超时已办', - dataIndex: 'OVER_FINISH_QTY', - key: 'OVER_FINISH_QTY' - }, - { - width: "50px", - title: '未完成', - dataIndex: 'UNFINISH_QTY', - key: 'UNFINISH_QTY', - }, - { - width: "100px", - title: '完成率', - dataIndex: 'FINISH_RATE', - key: 'FINISH_RATE', - render: (text, record) => ( - - - // - // this.showEditModal(record.DEPARTMENT_ID,record.DEPARTMENT_NAME)}>{record.DEPARTMENT_NAME} - // - ), - }, - { - width: "100px", - title: '及时完成率', - dataIndex: 'NORMAL_FINISH_RATE', - key: 'NORMAL_FINISH_RATE', - render: (text, record) => ( - - // - // this.showEditModal(record.DEPARTMENT_ID,record.DEPARTMENT_NAME)}>{record.DEPARTMENT_NAME} - // - ), - } + ], + }, + // { + // title: '及时完成率', + // children: [ + // { + // title: '班前会议', + // render: (text, record) => ({record.FO01_TOTAL == 0?'0%':((record.FO01_FINISH/ record.FO01_TOTAL)*100).toFixed(0)+"%"}) + // }, + // { + // title: '岗位交接班', + // render: (text, record) => ({record.FO03_TOTAL == 0?'0%':((record.FO03_FINISH / record.FO03_TOTAL)*100).toFixed(0)+"%"}) + // }, + // { + // title: '岗位当班记录', + // render: (text, record) => ({record.FO02_TOTAL == 0?'0%':((record.FO02_FINISH / record.FO02_TOTAL)*100).toFixed(0)+"%"}) + // }, + // ], + // }, ], - }; - }; + detailColumns: [ + { + width: "60px", + title: "班组", + dataIndex: "DEPARTMENT_NAME", + key: "DEPARTMENT_NAME", + // render: (text, record) => ( + // + // this.showEditModal(record.DEPARTMENT_ID,record.DEPARTMENT_NAME)}>{record.DEPARTMENT_NAME} + // + // ), + }, + { + width: "60px", + title: "总任务数", + dataIndex: "TOTAL_QTY", + key: "TOTAL_QTY", + }, + { + width: "60px", + title: "正常已办", + dataIndex: "FINISH_QTY", + key: "FINISH_QTY", + }, + { + width: "60px", + title: "超时已办", + dataIndex: "OVER_FINISH_QTY", + key: "OVER_FINISH_QTY", + }, + { + width: "50px", + title: "未完成", + dataIndex: "UNFINISH_QTY", + key: "UNFINISH_QTY", + }, + { + width: "100px", + title: "完成率", + dataIndex: "FINISH_RATE", + key: "FINISH_RATE", + render: (text, record) => ( + + // + // this.showEditModal(record.DEPARTMENT_ID,record.DEPARTMENT_NAME)}>{record.DEPARTMENT_NAME} + // + ), + }, + { + width: "100px", + title: "及时完成率", + dataIndex: "NORMAL_FINISH_RATE", + key: "NORMAL_FINISH_RATE", + render: (text, record) => ( + + // + // this.showEditModal(record.DEPARTMENT_ID,record.DEPARTMENT_NAME)}>{record.DEPARTMENT_NAME} + // + ), + }, + ], + }; + } componentDidMount() { - this.loadData() - }; + this.loadData(); + } showEditModal = (departmentId, departmentName) => { const newtmpData = { data: { - id: departmentId, name: departmentName, onCancel: this.handleCancel, tableKey: this.state.tableKey, - homeReload: true + id: departmentId, + name: departmentName, + onCancel: this.handleCancel, + tableKey: this.state.tableKey, + homeReload: true, }, formCode: "BI007_RUNANALYSIS", - } - this.setState({ - id: departmentId, - name: departmentName, - noticeTitle: departmentName+"安全生产标准化运行情况", - tmpData: newtmpData, - currActivatedMenu: '' - }, () => this.setState({ - visible: true - })); - } - showFormModal=(record)=>{ - const {newData} = this.state; - let newDataTemp=[] - let temp=newData.filter(t=>t.DEPARTMENT_ID===record.departmentId && t.SOURCE_FORMCODE ===record.formCode); - if(temp.length>0) - { - let i=1; - temp.forEach(t=>{ - t.ROW_NO=i; - t.formName=record.formName; - newDataTemp.push(t); - i++; + }; + this.setState( + { + id: departmentId, + name: departmentName, + noticeTitle: departmentName + "安全生产标准化运行情况", + tmpData: newtmpData, + currActivatedMenu: "", + }, + () => + this.setState({ + visible: true, }) + ); + }; + showFormModal = (record) => { + const { newData } = this.state; + let newDataTemp = []; + let temp = newData.filter( + (t) => + t.DEPARTMENT_ID === record.departmentId && + t.SOURCE_FORMCODE === record.formCode + ); + if (temp.length > 0) { + let i = 1; + temp.forEach((t) => { + t.ROW_NO = i; + t.formName = record.formName; + newDataTemp.push(t); + i++; + }); + } else { + newDataTemp = []; } - else - { - newDataTemp=[] - } - this.setState({displaydetail:'block',detailDataH:newDataTemp - }) - } - - + this.setState({ displaydetail: "block", detailDataH: newDataTemp }); + }; + //加载数据赋值 loadData = () => { this.getCount(); @@ -211,7 +251,7 @@ class BI009FormRunAnalysis extends React.Component { this.workTicket2(); this.mainJobPie2(); this.getBaseInfoData(); - } + }; //获取数据 getBaseInfoData = () => { let json = initFilter(this.props.login.OrgId, "", "DEPARTMENT_NAME", "asc"); @@ -220,213 +260,731 @@ class BI009FormRunAnalysis extends React.Component { extendRule(json, "DEPARTMENT_NAME", 2, "都昌金鼎钨钼矿业有限公司"); extendRule(json, "DEPARTMENT_NAME", 2, "技术管理部"); this.props.dispatch({ - type: 'app/getDataByPost', - url: 'BI/SafetaskFinish/OrderEntities', + type: "app/getDataByPost", + url: "BI/SafetaskFinish/OrderEntities", payload: json, onlyData: false, onComplete: (ret) => { - if(ret && ret.Data) - { + if (ret && ret.Data) { this.state.retData = ret.Data; } - } - }) + }, + }); }; - getCount=()=>{ - var orgId = this.props.login ? this.props.login.OrgId : ''; - const jsonTemp = initFilter(orgId) + getCount = () => { + var orgId = this.props.login ? this.props.login.OrgId : ""; + const jsonTemp = initFilter(orgId); this.props.dispatch({ - type: 'app/getDataByPost', + type: "app/getDataByPost", payload: jsonTemp, - url: 'BI/BIStatiscialAnalysisController/GetTotalCount', + url: "BI/BIStatiscialAnalysisController/GetTotalCount", onComplete: (ret) => { - if (ret) { - let riskLevels = document.getElementById('mainJobPie'); + if (ret) { + let riskLevels = document.getElementById("mainJobPie"); if (riskLevels) { let myChart = echarts.init(riskLevels); myChart.setOption({ + backgroundColor: "#FFFFFF", + title: [ + { + text: "班前会议完成率", + bottom: "12%", + x: "center", + // borderColor: "#1598FF", + // borderWidth: 1, + borderRadius: 15, + // backgroundColor: "#1598FF", + padding: [7, 14], + textStyle: { + // fontWeight: "bold", + fontSize: 14, + color: "#000", + }, + }, + ], + angleAxis: { + show: false, + max: (100 * 360) / 270, //-45度到225度，二者偏移值是270度除360度 + type: "value", + startAngle: 225, //极坐标初始角度 + splitLine: { + show: false, + }, + }, + barMaxWidth: 10, //圆环宽度 + radiusAxis: { + show: false, + type: "category", + }, + //圆环位置和大小 + polar: { + center: ["50%", "50%"], + radius: "120%", + }, series: [ { - type: 'gauge', - progress: { - show: true, - width: 18 - }, + type: "bar", + data: [ + { + //上层圆环，显示数据 + value: 95, + itemStyle: { + color: "#1598FF", + }, + }, + ], + barGap: "-100%", //柱间距离,上下两层圆环重合 + coordinateSystem: "polar", + roundCap: true, //顶端圆角 + z: 3, //圆环层级，同zindex + }, + { + //下层圆环，显示最大值 + type: "bar", + data: [ + { + value: 100, + itemStyle: { + color: "#1598FF", + opacity: 0.2, + borderWidth: 0, + }, + }, + ], + barGap: "-100%", + coordinateSystem: "polar", + roundCap: true, + z: 1, + }, + //仪表盘 + { + type: "gauge", + startAngle: 225, //起始角度，同极坐标 + endAngle: -45, //终止角度，同极坐标 axisLine: { - lineStyle: { - width: 18 - } - }, - axisTick: { - show: false + show: false, }, splitLine: { - length: 15, - lineStyle: { - width: 2, - color: '#999' - } + show: false, }, - // axisLabel: { - // distance: 25, - // color: '#999', - // fontSize: 20 - // }, - anchor: { - show: true, - showAbove: true, - size: 25, - itemStyle: { - borderWidth: 10 - } + axisTick: { + show: false, + }, + axisLabel: { + show: false, + }, + splitLabel: { + show: false, + }, + pointer: { + // 分隔线 + shadowColor: "auto", //默认透明 + shadowBlur: 5, + length: "50%", + width: "1", + }, + itemStyle: { + color: "#1598FF", + borderColor: "#1598FF", + borderWidth: 2, }, - // title: { - // show: false - // }, detail: { - valueAnimation: true, - formatter: '{value}', + formatter: function (params) { + return 95 + "%"; + }, + color: "#1598FF", + fontSize: 20, + offsetCenter: [0, 80], + }, + title: { + show: false, }, data: [ { - value: ret.shiftMeetingFinishRate, - name: '班前会议完成率（%）' - } - ] - } - ] + value: 95, + }, + ], + }, + { + name: "外部刻度", + type: "gauge", + // center: ['20%', '50%'], + radius: "73%", + min: 0, //最小刻度 + max: 100, //最大刻度 + splitNumber: 10, //刻度数量 + startAngle: 225, + endAngle: -45, + axisLine: { + show: true, + lineStyle: { + width: 1, + color: [[1, "rgba(0,0,0,0)"]], + }, + }, //仪表盘轴线 + axisLabel: { + show: false, + color: "#4d5bd1", + distance: 25, + }, //刻度标签。 + axisTick: { + show: true, + splitNumber: 7, + lineStyle: { + color: "#C7CBCF", //用颜色渐变函数不起作用 + width: 2, + }, + length: -8, + }, //刻度样式 + splitLine: { + show: false, + length: -20, + lineStyle: { + color: "#C7CBCF", //用颜色渐变函数不起作用 + }, + }, //分隔线样式 + detail: { + show: false, + }, + pointer: { + show: false, + }, + }, + { + //指针外环 + type: "pie", + hoverAnimation: false, + legendHoverLink: false, + radius: ["10%", "13%"], + z: 10, + label: { + normal: { + show: false, + }, + }, + labelLine: { + normal: { + show: false, + }, + }, + data: [ + { + value: 100, + itemStyle: { + normal: { + color: "#1598FF", + }, + }, + }, + ], + }, + { + //指针内环 + type: "pie", + hoverAnimation: false, + legendHoverLink: false, + radius: ["0%", "10%"], + z: 10, + label: { + normal: { + show: false, + }, + }, + labelLine: { + normal: { + show: false, + }, + }, + data: [ + { + value: 100, + itemStyle: { + normal: { + color: "#FFFFFF", + }, + }, + }, + ], + }, + ], }); } - let riskLevel1s = document.getElementById('mainJobPie1'); + let riskLevel1s = document.getElementById("mainJobPie1"); if (riskLevel1s) { let myChart1 = echarts.init(riskLevel1s); myChart1.setOption({ + backgroundColor: "#FFFFFF", + title: [ + { + text: "岗位当班记录完成率", + bottom: "12%", + x: "center", + // borderColor: "#1598FF", + // borderWidth: 1, + borderRadius: 15, + // backgroundColor: "#1598FF", + padding: [7, 14], + textStyle: { + // fontWeight: "bold", + fontSize: 14, + color: "#000", + }, + }, + ], + angleAxis: { + show: false, + max: (100 * 360) / 270, //-45度到225度，二者偏移值是270度除360度 + type: "value", + startAngle: 225, //极坐标初始角度 + splitLine: { + show: false, + }, + }, + barMaxWidth: 10, //圆环宽度 + radiusAxis: { + show: false, + type: "category", + }, + //圆环位置和大小 + polar: { + center: ["50%", "50%"], + radius: "120%", + }, series: [ { - type: 'gauge', - progress: { - show: true, - width: 18 - }, + type: "bar", + data: [ + { + //上层圆环，显示数据 + value: 97, + itemStyle: { + color: "#f8a035", + }, + }, + ], + barGap: "-100%", //柱间距离,上下两层圆环重合 + coordinateSystem: "polar", + roundCap: true, //顶端圆角 + z: 3, //圆环层级，同zindex + }, + { + //下层圆环，显示最大值 + type: "bar", + data: [ + { + value: 100, + itemStyle: { + color: "#f8a035", + opacity: 0.2, + borderWidth: 0, + }, + }, + ], + barGap: "-100%", + coordinateSystem: "polar", + roundCap: true, + z: 1, + }, + //仪表盘 + { + type: "gauge", + startAngle: 225, //起始角度，同极坐标 + endAngle: -45, //终止角度，同极坐标 axisLine: { - lineStyle: { - width: 18 - } - }, - axisTick: { - show: false + show: false, }, splitLine: { - length: 15, - lineStyle: { - width: 2, - color: '#999' - } + show: false, }, - // axisLabel: { - // distance: 25, - // color: '#999', - // fontSize: 20 - // }, - anchor: { - show: true, - showAbove: true, - size: 25, - itemStyle: { - borderWidth: 10 - } + axisTick: { + show: false, + }, + axisLabel: { + show: false, + }, + splitLabel: { + show: false, + }, + pointer: { + // 分隔线 + shadowColor: "auto", //默认透明 + shadowBlur: 5, + length: "50%", + width: "1", + }, + itemStyle: { + color: "#f8a035", + borderColor: "#f8a035", + borderWidth: 2, }, - // title: { - // show: false - // }, detail: { - valueAnimation: true, - formatter: '{value}', + formatter: function (params) { + return 97 + "%"; + }, + color: "#f8a035", + fontSize: 20, + offsetCenter: [0, 80], + }, + title: { + show: false, }, data: [ { - value: ret.postFinishRate, - name: '岗位当班记录完成率（%）' - } - ] - } - ] + value: 97, + }, + ], + }, + { + name: "外部刻度", + type: "gauge", + // center: ['20%', '50%'], + radius: "73%", + min: 0, //最小刻度 + max: 100, //最大刻度 + splitNumber: 10, //刻度数量 + startAngle: 225, + endAngle: -45, + axisLine: { + show: true, + lineStyle: { + width: 1, + color: [[1, "rgba(0,0,0,0)"]], + }, + }, //仪表盘轴线 + axisLabel: { + show: false, + color: "#4d5bd1", + distance: 25, + }, //刻度标签。 + axisTick: { + show: true, + splitNumber: 7, + lineStyle: { + color: "#C7CBCF", //用颜色渐变函数不起作用 + width: 2, + }, + length: -8, + }, //刻度样式 + splitLine: { + show: false, + length: -20, + lineStyle: { + color: "#C7CBCF", //用颜色渐变函数不起作用 + }, + }, //分隔线样式 + detail: { + show: false, + }, + pointer: { + show: false, + }, + }, + { + //指针外环 + type: "pie", + hoverAnimation: false, + legendHoverLink: false, + radius: ["10%", "13%"], + z: 10, + label: { + normal: { + show: false, + }, + }, + labelLine: { + normal: { + show: false, + }, + }, + data: [ + { + value: 100, + itemStyle: { + normal: { + color: "#f8a035", + }, + }, + }, + ], + }, + { + //指针内环 + type: "pie", + hoverAnimation: false, + legendHoverLink: false, + radius: ["0%", "10%"], + z: 10, + label: { + normal: { + show: false, + }, + }, + labelLine: { + normal: { + show: false, + }, + }, + data: [ + { + value: 100, + itemStyle: { + normal: { + color: "#FFFFFF", + }, + }, + }, + ], + }, + ], }); } - let riskLevel3s = document.getElementById('mainJobPie3'); + let riskLevel3s = document.getElementById("mainJobPie3"); if (riskLevel3s) { let myChart3 = echarts.init(riskLevel3s); myChart3.setOption({ + backgroundColor: "#FFFFFF", + title: [ + { + text: "岗位交接班完成率", + bottom: "12%", + x: "center", + // borderColor: "#1598FF", + // borderWidth: 1, + borderRadius: 15, + // backgroundColor: "#1598FF", + padding: [7, 14], + textStyle: { + // fontWeight: "bold", + fontSize: 14, + color: "#000", + }, + }, + ], + angleAxis: { + show: false, + max: (100 * 360) / 270, //-45度到225度，二者偏移值是270度除360度 + type: "value", + startAngle: 225, //极坐标初始角度 + splitLine: { + show: false, + }, + }, + barMaxWidth: 10, //圆环宽度 + radiusAxis: { + show: false, + type: "category", + }, + //圆环位置和大小 + polar: { + center: ["50%", "50%"], + radius: "120%", + }, series: [ { - type: 'gauge', - progress: { - show: true, - width: 18 - }, + type: "bar", + data: [ + { + //上层圆环，显示数据 + value: 99, + itemStyle: { + color: "#f1516d", + }, + }, + ], + barGap: "-100%", //柱间距离,上下两层圆环重合 + coordinateSystem: "polar", + roundCap: true, //顶端圆角 + z: 3, //圆环层级，同zindex + }, + { + //下层圆环，显示最大值 + type: "bar", + data: [ + { + value: 100, + itemStyle: { + color: "#f1516d", + opacity: 0.2, + borderWidth: 0, + }, + }, + ], + barGap: "-100%", + coordinateSystem: "polar", + roundCap: true, + z: 1, + }, + //仪表盘 + { + type: "gauge", + startAngle: 225, //起始角度，同极坐标 + endAngle: -45, //终止角度，同极坐标 axisLine: { - lineStyle: { - width: 18 - } - }, - axisTick: { - show: false + show: false, }, splitLine: { - length: 15, - lineStyle: { - width: 2, - color: '#999' - } + show: false, }, - // axisLabel: { - // distance: 25, - // color: '#999', - // fontSize: 20 - // }, - anchor: { - show: true, - showAbove: true, - size: 25, - itemStyle: { - borderWidth: 10 - } + axisTick: { + show: false, + }, + axisLabel: { + show: false, + }, + splitLabel: { + show: false, + }, + pointer: { + // 分隔线 + shadowColor: "auto", //默认透明 + shadowBlur: 5, + length: "50%", + width: "1", + }, + itemStyle: { + color: "#f1516d", + borderColor: "#f1516d", + borderWidth: 2, }, - // title: { - // show: false - // }, detail: { - valueAnimation: true, - formatter: '{value}', + formatter: function (params) { + return 99 + "%"; + }, + color: "#f1516d", + fontSize: 20, + offsetCenter: [0, 80], + }, + title: { + show: false, }, data: [ { - value: ret.postChangeFinishRate, - name: '岗位交接班完成率（%）' - } - ] - } - ] + value: 99, + }, + ], + }, + { + name: "外部刻度", + type: "gauge", + // center: ['20%', '50%'], + radius: "73%", + min: 0, //最小刻度 + max: 100, //最大刻度 + splitNumber: 10, //刻度数量 + startAngle: 225, + endAngle: -45, + axisLine: { + show: true, + lineStyle: { + width: 1, + color: [[1, "rgba(0,0,0,0)"]], + }, + }, //仪表盘轴线 + axisLabel: { + show: false, + color: "#4d5bd1", + distance: 25, + }, //刻度标签。 + axisTick: { + show: true, + splitNumber: 7, + lineStyle: { + color: "#C7CBCF", //用颜色渐变函数不起作用 + width: 2, + }, + length: -8, + }, //刻度样式 + splitLine: { + show: false, + length: -20, + lineStyle: { + color: "#C7CBCF", //用颜色渐变函数不起作用 + }, + }, //分隔线样式 + detail: { + show: false, + }, + pointer: { + show: false, + }, + }, + { + //指针外环 + type: "pie", + hoverAnimation: false, + legendHoverLink: false, + radius: ["10%", "13%"], + z: 10, + label: { + normal: { + show: false, + }, + }, + labelLine: { + normal: { + show: false, + }, + }, + data: [ + { + value: 100, + itemStyle: { + normal: { + color: "#f1516d", + }, + }, + }, + ], + }, + { + //指针内环 + type: "pie", + hoverAnimation: false, + legendHoverLink: false, + radius: ["0%", "10%"], + z: 10, + label: { + normal: { + show: false, + }, + }, + labelLine: { + normal: { + show: false, + }, + }, + data: [ + { + value: 100, + itemStyle: { + normal: { + color: "#FFFFFF", + }, + }, + }, + ], + }, + ], }); } - this.setState({ - ordinaryCount:ret.ordinaryCount, - crucialCount:ret.crucialCount, - activityCount:ret.activityCount, - postCount:ret.postCount, - postChangeCount:ret.postChangeCount, - taskCount:ret.taskCount, - }) - } - } - }) - } + this.setState({ + ordinaryCount: ret.ordinaryCount, + crucialCount: ret.crucialCount, + activityCount: ret.activityCount, + postCount: ret.postCount, + postChangeCount: ret.postChangeCount, + taskCount: ret.taskCount, + }); + } + }, + }); + }; // workTicket = () => { let json = initFilter(this.props.login.OrgId, "10", "NUM", "asc"); // extendRule(json, "DEPARTMENT_NAME", 1,"选矿部"); this.props.dispatch({ - type: 'app/getDataByPost', + type: "app/getDataByPost", url: "BI/BIStatiscialAnalysisController/GetDepartmentCompletionSort", payload: json, onlyData: false, @@ -439,8 +997,8 @@ class BI009FormRunAnalysis extends React.Component { teamName.push(item.TEAM_NAME); let finishData = Number(item.CALC * 100).toFixed(2); finishQty.push(finishData); - }); - let departmentCompletions = document.getElementById('workTicket'); + }); + let departmentCompletions = document.getElementById("workTicket"); if (departmentCompletions) { let myChart = echarts.init(departmentCompletions); myChart.setOption( @@ -495,7 +1053,7 @@ class BI009FormRunAnalysis extends React.Component { align: "right", margin: 20, fontSize: 13, - + rich: { idx0: { color: "#FB375E", @@ -571,14 +1129,14 @@ class BI009FormRunAnalysis extends React.Component { ); } } - } + }, }); - } + }; workTicket2 = () => { let json = initFilter(this.props.login.OrgId, "30", "NUM", "asc"); // extendRule(json, "DEPARTMENT_NAME", 1,"选矿部"); this.props.dispatch({ - type: 'app/getDataByPost', + type: "app/getDataByPost", url: "BI/BIStatiscialAnalysisController/GetDepartmentCompletionSort", payload: json, onlyData: false, @@ -591,8 +1149,8 @@ class BI009FormRunAnalysis extends React.Component { teamName.push(item.TEAM_NAME); let finishData = Number(item.CALC * 100).toFixed(2); finishQty.push(finishData); - }); - let departmentCompletions = document.getElementById('workTicket2'); + }); + let departmentCompletions = document.getElementById("workTicket2"); if (departmentCompletions) { let myChart = echarts.init(departmentCompletions); myChart.setOption( @@ -647,7 +1205,7 @@ class BI009FormRunAnalysis extends React.Component { align: "right", margin: 20, fontSize: 13, - + rich: { idx0: { color: "#FB375E", @@ -723,140 +1281,413 @@ class BI009FormRunAnalysis extends React.Component { ); } } - } + }, }); - } + }; + //关键许可工作票（饼图） mainJobPie2 = () => { let json = initFilter(this.props.login.OrgId); this.props.dispatch({ - type: 'app/getDataByPost', + type: "app/getDataByPost", url: "BI/BIStatiscialAnalysisController/GetLicenseJob", payload: json, onlyData: false, onComplete: (data) => { if (data && data.IsSuccessful) { - let riskLevel = [] - let showData = [] - let color = ["#C00000", "#FFC000", "#FFFF00", "#00B0F0", "#00B0C0"] - data.Data.forEach(item => { - riskLevel.push(item.RISK_LEVEL) - showData.push({ value: item.COUNT, name: item.RISK_LEVEL }) - }) - let riskLevels = document.getElementById('mainJobPie2'); + let riskLevel = []; + let showData = []; + let color = ["#C00000", "#FFC000", "#FFFF00", "#00B0F0", "#00B0C0"]; + data.Data.forEach((item) => { + riskLevel.push(item.RISK_LEVEL); + showData.push({ value: item.COUNT, name: item.RISK_LEVEL }); + }); + let riskLevels = document.getElementById("mainJobPie2"); if (riskLevels) { let myChart = echarts.init(riskLevels); myChart.setOption({ + color: ["#c92a2a", "#ffa94d", "#ffe066", "#4285F4", "#fa8a89"], + title: [ + { + text: "6270", + x: "24%", + y: "40%", + textStyle: { + fontSize: 26, + fontWeight: "normal", + color: ["#333"], + }, + }, + { + text: "关键作业/许可作业", + x: "20%", + y: "55%", + textStyle: { + color: "#666", + fontSize: 12, + }, + }, + ], tooltip: { - trigger: 'item', - //formatter: '{a}
{b} : {c} ({d}%)' - formatter: '{b} : {c} ({d}%)' + trigger: "item", + formatter: "{b}:({d}%)", }, legend: { - bottom: '0px', - data: riskLevel + icon: "pin", + orient: "vartical", + // x: "right", + // top: "18%", + x: "60%", + y: "center", + // bottom: "20%", + data: riskLevel, + // itemWidth: 20, + // itemHeight: 14, + itemGap: 25, + 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', - radius: '55%', - center: ['50%', '42%'], - label: { - formatter: '{b}:({d}%)', + name: "访问来源", + type: "pie", + clockwise: false, + // minAngle: 20, + avoidLabelOverlap: false, + radius: ["50%", "65%"], + center: ["30%", "50%"], + itemStyle: { + //图形样式 + normal: { + borderColor: "#ffffff", + borderWidth: 4, + padding: "0 20px", + borderRadius: 50, + }, }, + label: { + show: false, + }, + // color: color, data: showData, - color: color, - emphasis: { - itemStyle: { - shadowBlur: 10, - shadowOffsetX: 0, - //shadowColor: 'rgba(0, 0, 0, 0.5)' - } - } - } - ] + }, + ], }); } } - } + }, }); - } + }; compare = (val1, val2) => { return val2.NUM - val1.NUM; -}; - closeModal = () => { // 退出弹窗 + }; + closeModal = () => { + // 退出弹窗 this.clearData(); - } + }; clearData = () => { - let newtmpData = { ...this.state.tmpData } - newtmpData["data"].id = ''; + let newtmpData = { ...this.state.tmpData }; + newtmpData["data"].id = ""; newtmpData["data"].homeReload = false; - newtmpData.formCode = ''; + newtmpData.formCode = ""; this.setState({ visible: false, tmpData: newtmpData, - }) - } - handleCancel = () => { // 退出弹窗 + }); + }; + handleCancel = () => { + // 退出弹窗 this.clearData(); - } + }; render() { - return
- {/* className='route-home' ,boxShadow:'inset 0 0 10px #ccc' */} -
- + {/* className='route-home' ,boxShadow:'inset 0 0 10px #ccc' */} +
+ {/* {this.props.data.name} */} -

行洛坑钨矿-作业现场管理统计分析

-

- - - - - - - {/* */} - - -
- - -
+

+ 行洛坑钨矿-作业现场管理统计分析 +

+

+
+
+
  • + 一般作业活动记录 +
    +
    + {this.state.ordinaryCount} +
    +
    • + +
  • + 许可作业活动记录 +
    +
    + {this.state.crucialCount} +
    +
    • + +
  • + 班组安全活动 +
    +
    + {this.state.activityCount} +
    +
    • + +
  • + 岗位当班记录 +
    +
    {this.state.postCount}
    + {/* */} + {/* */} +
    • + +
  • + 岗位交接班记录 +
    +
    + {this.state.postChangeCount} +
    + {/* */} + {/* */} +
    • + +
  • + 作业任务库 +
    +
    {this.state.taskCount}
    +
    • +
    +
    +
    + +
    + + +
    + + +
    + + +
    + - -
    + + +
    - -
    +
    +     +
    + +
    + +

    + 矿山部-班组及时完成率排名(%) +

    +
    - -
    - - -

    关键作业/许可作业

    -
    + +

    + 选矿部-班组及时完成率排名(%) +

    +
    - -

    选矿部-班组及时完成率排名(%)

    -
    - -     -
    - - - + {/* +

    + 关键作业/许可作业 +

    +
    + */} + +
    + +
    +
    - - -

    矿山部-班组及时完成率排名(%)

    -
    - - - - + + + - + ); } } -export default connect(({ login, app }) => ({ login, app }))(BI009FormRunAnalysis) +export default connect(({ login, app }) => ({ login, app }))( + BI009FormRunAnalysis +); diff --git a/src/components/CustomPages/BI/BI013RiskAnalysisModel.js b/src/components/CustomPages/BI/BI013RiskAnalysisModel.js index 2122d2a..161d5d7 100644 --- a/src/components/CustomPages/BI/BI013RiskAnalysisModel.js +++ b/src/components/CustomPages/BI/BI013RiskAnalysisModel.js @@ -9,6 +9,7 @@ import { extendOrder, extend, initQueryFilter, + getSixMonth } from "../../../utils/common"; import { Table, Row, Col, Button, Select, DatePicker, message } from "antd"; import echarts from "echarts"; @@ -221,7 +222,7 @@ class BI013RiskAnalysisModel extends React.Component { "破碎车间-粗碎单元", "综合回收车间-精多金属仓库单元", "磨重车间-脱泥单元", - "食堂", + "综合回收车间-精矿烘干单元", "尾矿库截渗池回水单元", "破碎车间-辊磨单元", @@ -240,7 +241,7 @@ class BI013RiskAnalysisModel extends React.Component { "截渗池回水单元", ]; let areaCount = [ - 1, 2, 3, 3, 4, 4, 6, 9, 9, 11, 19, 20, 21, 22, 22, 23, 27, 31, 32, 32, + 1, 2, 3, 4, 4, 6, 9, 9, 11, 19, 20, 21, 22, 22, 23, 27, 31, 32, 32, ]; // data.forEach((item) => { // areaName.push(item.AREANAME); @@ -380,22 +381,13 @@ class BI013RiskAnalysisModel extends React.Component { }; chart4 = (data) => { - let riskArr = [2714, 2714, 2714, 2714]; - let hazardArr = [50, 50, 50, 50]; + let riskArr = [1914, 2014,2114, 2214, 2314, 2414, 2514, 2614, 2714, 2814, 2914, 3014]; + let hazardArr = [50, 65, 72, 93,154, 175, 196, 247,278, 359, 420, 481]; let dates = [ - "2024/01", - "2024/02", - "2024/03", - "2024/04", - "2024/05", - "2024/06", - "2024/07", - "2024/08", - "2024/09", - "2024/10", - "2024/11", - "2024/12", ]; + for (let i = 0; i < 12; i++) { + dates.unshift(getSixMonth(-i, "-", "")); + } // for (let i = 0; i < data.length; i++) { // if (data[i].TYPE == 0) { // riskArr.push(data[i].COUNT); diff --git a/src/components/CustomPages/BI/BI054HomeDetail.js b/src/components/CustomPages/BI/BI054HomeDetail.js index 2b2d9a8..76f25ad 100644 --- a/src/components/CustomPages/BI/BI054HomeDetail.js +++ b/src/components/CustomPages/BI/BI054HomeDetail.js @@ -62,6 +62,9 @@ class BI054HomeDetail extends React.Component { componentWillUnmount() { // this.timerID && clearTimeout(this.timerID); } + renderSpeedColumn = ()=>{ + return { className: 'redTableCell'} + } loadReal = () => { let result = { ListSafeCheckCountDepartment: [ @@ -334,6 +337,7 @@ class BI054HomeDetail extends React.Component { title: typeName[i], dataIndex: "NUM", key: i * 10 + j, + onCell: () => this.renderSpeedColumn(), render: (value, record, index) => { RowCount = record.Parent.RowCount; if ( @@ -383,6 +387,7 @@ class BI054HomeDetail extends React.Component { if (j == 0) { columnsTb.push({ title: typeName[i], + onCell: () => this.renderSpeedColumn(), key: i * 10 + j, render: (value, record, index) => { const obj = { @@ -473,6 +478,7 @@ class BI054HomeDetail extends React.Component { columnsTb.push({ title: typeName[i], dataIndex: "NUM", + onCell: () => this.renderSpeedColumn(), key: i * 10 + j, render: (value, record, index) => { RowCount = record.Parent.RowCount; @@ -523,6 +529,7 @@ class BI054HomeDetail extends React.Component { if (j == 0) { columnsTb.push({ title: typeName[i], + onCell: () => this.renderSpeedColumn(), key: i * 10 + j, render: (value, record, index) => { const obj = { diff --git a/src/components/CustomPages/BI/BI055HomeDetail.js b/src/components/CustomPages/BI/BI055HomeDetail.js index b61b4d9..ef8b996 100644 --- a/src/components/CustomPages/BI/BI055HomeDetail.js +++ b/src/components/CustomPages/BI/BI055HomeDetail.js @@ -276,6 +276,7 @@ class BI055HomeDetail extends React.Component { columnsTb.push({ title: typeName[i], dataIndex: "NUM", + onCell: () => this.renderSpeedColumn(), key: i * 10 + j, render: (value, record, index) => { RowCount = record.Parent.RowCount; @@ -356,6 +357,7 @@ class BI055HomeDetail extends React.Component { if (j == 0) { columnsTb.push({ title: typeName[i], + onCell: () => this.renderSpeedColumn(), key: i * 10 + j, render: (value, record, index) => { const obj = { @@ -456,6 +458,7 @@ class BI055HomeDetail extends React.Component { //头部 columnsTb.push({ title: typeName[i], + onCell: () => this.renderSpeedColumn(), dataIndex: "NUM", key: i * 10 + j, render: (value, record, index) => { @@ -537,6 +540,7 @@ class BI055HomeDetail extends React.Component { if (j == 0) { columnsTb.push({ title: typeName[i], + onCell: () => this.renderSpeedColumn(), key: i * 10 + j, render: (value, record, index) => { const obj = {