966 lines
36 KiB
JavaScript
966 lines
36 KiB
JavaScript
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} 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'
|
||
|
||
class BI006FormRunAnalysis extends React.Component {
|
||
|
||
constructor(props) {
|
||
super(props);
|
||
this.state = {
|
||
visible: false,
|
||
noticeTitle: '',
|
||
tmpData: {},
|
||
tableKey: "1",
|
||
// selectStartTime: moment(this.getStartDate(), 'YYYY-MM-DD 00:00:00'),
|
||
selectEndTime:moment(this.getEndDate(), 'YYYY-MM-DD 23:59:59'),
|
||
startTime: this.getDate(),
|
||
endTime:moment(new Date()).format("YYYYMMDD"),
|
||
timeType: 5,
|
||
totalCount:0,
|
||
finishCount:0,
|
||
overtimeCount:0,
|
||
unfinishCount:0,
|
||
dtotalCount:0,
|
||
dfinishCount:0,
|
||
dovertimeCount:0,
|
||
dunfinishCount:0,
|
||
drate:'0%',
|
||
dnormalRate:'0%',
|
||
weekColor:'black',
|
||
monthColor:'orange',
|
||
threeMonthColor:'black',
|
||
sixMonthColor:'black',
|
||
yearColor:'black',
|
||
retData:[],
|
||
groupData:[],
|
||
detailData:[],
|
||
newData:[],
|
||
detailDataH:[],
|
||
displayHr:'none',
|
||
displaydetail:'none',
|
||
columns: [
|
||
{
|
||
width: "100px",
|
||
title: '部门',
|
||
dataIndex: 'DEPARTMENT_NAME',
|
||
key: 'DEPARTMENT_NAME',
|
||
// render: (text, record) => (
|
||
// <span>
|
||
// <a onClick={() => this.showEditModal(record.DEPARTMENT_ID,record.DEPARTMENT_NAME)}>{record.DEPARTMENT_NAME}</a>
|
||
// </span>
|
||
// ),
|
||
},
|
||
{
|
||
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: "50px",
|
||
title: '完成率',
|
||
dataIndex: 'FINISH_RATE',
|
||
key: 'FINISH_RATE',
|
||
},
|
||
{
|
||
width: "70px",
|
||
title: '及时完成率',
|
||
dataIndex: 'NORMAL_FINISH_RATE',
|
||
key: 'NORMAL_FINISH_RATE',
|
||
}
|
||
],
|
||
detailColumns: [
|
||
// {
|
||
// width: "55px",
|
||
// title: '序号',
|
||
// dataIndex: 'NUM',
|
||
// key: 'NUM',
|
||
// },
|
||
{
|
||
width: "100px",
|
||
title: '模块名称',
|
||
dataIndex: 'MOUDLE_NAME',
|
||
key: 'MOUDLE_NAME',
|
||
// render: (text, record) => (
|
||
// <span>
|
||
// <a onClick={() => this.showFormModal(record.MOUDLE_NAME)}>{record.MOUDLE_NAME}</a>
|
||
// </span>
|
||
// ),
|
||
},
|
||
{
|
||
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: "50px",
|
||
title: '完成率',
|
||
dataIndex: 'FINISH_RATE',
|
||
key: 'FINISH_RATE',
|
||
},
|
||
{
|
||
width: "70px",
|
||
title: '及时完成率',
|
||
dataIndex: 'NORMAL_FINISH_RATE',
|
||
key: 'NORMAL_FINISH_RATE',
|
||
}
|
||
],
|
||
};
|
||
};
|
||
getStartDate=()=>{
|
||
let date = new Date()
|
||
let y = date.getFullYear()
|
||
let m = date.getMonth() + 1
|
||
let d = date.getDate();
|
||
// 当前日期
|
||
let nowDate = y + "-" + (m < 10 ? "0" + m : m) + "-" + (d < 10 ? "0" + d : d);
|
||
let pastDate = moment(nowDate).add(-1, "month").format('YYYY-MM-DD 00:00:00')
|
||
return pastDate;
|
||
}
|
||
|
||
getEndDate=()=>{
|
||
let date = new Date()
|
||
let y = date.getFullYear()
|
||
let m = date.getMonth() + 1
|
||
let d = date.getDate();
|
||
// 当前日期
|
||
let nowDate = y + "-" + (m < 10 ? "0" + m : m) + "-" + (d < 10 ? "0" + d : d);
|
||
let pastDate = moment(nowDate).format('YYYY-MM-DD 23:59:59')
|
||
return pastDate;
|
||
}
|
||
componentDidMount() {
|
||
this.loadData()
|
||
};
|
||
showEditModal = (departmentId, departmentName) => {
|
||
const newtmpData = {
|
||
data: {
|
||
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=(mouldName)=>{
|
||
const newtmpData = {
|
||
data: {
|
||
name: mouldName, onCancel: this.handleCancel, tableKey: this.state.tableKey,
|
||
homeReload: true
|
||
},
|
||
formCode: "BI008_RUNANALYSIS",
|
||
}
|
||
this.setState({
|
||
name: mouldName,
|
||
noticeTitle: mouldName+"安全生产标准化运行情况",
|
||
tmpData: newtmpData,
|
||
currActivatedMenu: ''
|
||
}, () => this.setState({
|
||
visible: true
|
||
}));
|
||
}
|
||
// showEditModal = (dataId, formCode, TaskID, title, taskCode) => {
|
||
|
||
// const newtmpData = {
|
||
// data: {
|
||
// id: dataId, TaskID: TaskID, onCancel: this.handleCancel, taskCode: taskCode, tableKey: this.state.tableKey,
|
||
// homeReload: true
|
||
// },
|
||
// formCode: formCode,
|
||
// }
|
||
// this.setState({
|
||
// noticeTitle: title,
|
||
// taskCode: taskCode,
|
||
// tmpData: newtmpData,
|
||
// currActivatedMenu: ''
|
||
// }, () => this.setState({
|
||
// visible: true
|
||
// }));
|
||
// }
|
||
|
||
getDate=(type)=>{
|
||
let date = new Date()
|
||
let y = date .getFullYear()
|
||
let m = date .getMonth() + 1
|
||
let d = date .getDate();
|
||
// 当前日期
|
||
let nowDate = y + "-" + (m < 10 ? "0" + m : m) + "-" + (d < 10 ? "0" + d : d);
|
||
let pastDate = moment(nowDate).add(-1, "month").format('YYYYMMDD')
|
||
let weekColor='black';
|
||
let monthColor='orange';
|
||
let threeMonthColor='black';
|
||
let sixMonthColor='black';
|
||
let yearColor='black';
|
||
let timeType=5;
|
||
if(type==="Week")
|
||
{
|
||
pastDate=moment(nowDate).add(-7, "d").format("YYYYMMDD")
|
||
weekColor='orange';
|
||
monthColor='black';
|
||
threeMonthColor='black';
|
||
sixMonthColor='black';
|
||
yearColor='black';
|
||
timeType=1;
|
||
}
|
||
if(type==="ThreeMonth")
|
||
{
|
||
pastDate=moment(nowDate).add(-3, "month").format("YYYYMMDD")
|
||
weekColor='black';
|
||
monthColor='black';
|
||
threeMonthColor='orange';
|
||
sixMonthColor='black';
|
||
yearColor='black';
|
||
timeType=10;
|
||
}
|
||
if(type==="SixMonth")
|
||
{
|
||
pastDate=moment(nowDate).add(-6, "month").format("YYYYMMDD")
|
||
weekColor='black';
|
||
monthColor='black';
|
||
threeMonthColor='black';
|
||
sixMonthColor='orange';
|
||
yearColor='black';
|
||
timeType=15;
|
||
}
|
||
if(type==="Year")
|
||
{
|
||
pastDate=moment(nowDate).add(-1, "year").format("YYYYMMDD")
|
||
weekColor='black';
|
||
monthColor='black';
|
||
threeMonthColor='black';
|
||
sixMonthColor='black';
|
||
yearColor='orange';
|
||
timeType=20;
|
||
}
|
||
this.setState({
|
||
startTime: pastDate,
|
||
timeType: timeType,
|
||
weekColor:weekColor,
|
||
monthColor:monthColor,
|
||
threeMonthColor:threeMonthColor,
|
||
sixMonthColor:sixMonthColor,
|
||
yearColor:yearColor
|
||
},()=>{
|
||
if(type)
|
||
{
|
||
this.loadData();
|
||
}
|
||
})
|
||
return pastDate;
|
||
}
|
||
//加载数据赋值
|
||
loadData = () => {
|
||
this.ksRun();
|
||
this.xkRun();
|
||
this.getMould();
|
||
this.getDepartment();
|
||
}
|
||
//矿山
|
||
ksRun = () => {
|
||
let json = initFilter(this.props.login.OrgId);
|
||
extendRule(json, 'DEPARTMENT_NAME', 1, "矿山部");
|
||
// 1代表=，2代表不等于，3小于，4小于等于，5大于，6大于等于，7以开始的Like,8以结束的Like，9包含
|
||
if(this.state.timeType ===1)//最近一周(显示最近一月的，最小单位为月)
|
||
{
|
||
let start=moment(new Date()).add(0, "month").format('YYYY-MM-01 00:00:00')
|
||
let end=moment(new Date()).add(1, "month").format('YYYY-MM-01 00:00:00')
|
||
extendRule(json, 'MONTH', 6, start);
|
||
extendRule(json, 'MONTH', 3, end);
|
||
}
|
||
else if(this.state.timeType ===5)//最近一月
|
||
{
|
||
let start=moment(new Date()).add(0, "month").format('YYYY-MM-01 00:00:00')
|
||
let end=moment(new Date()).add(1, "month").format('YYYY-MM-01 00:00:00')
|
||
extendRule(json, 'MONTH', 6, start);
|
||
extendRule(json, 'MONTH', 3, end);
|
||
}
|
||
else if(this.state.timeType ===10)//最近三月
|
||
{
|
||
let start=moment(new Date()).add(-2, "month").format('YYYY-MM-01 00:00:00')
|
||
let end=moment(new Date()).add(1, "month").format('YYYY-MM-01 00:00:00')
|
||
extendRule(json, 'MONTH', 6, start);
|
||
extendRule(json, 'MONTH', 3, end);
|
||
}
|
||
else if(this.state.timeType ===15)//最近半年
|
||
{
|
||
let start=moment(new Date()).add(-5, "month").format('YYYY-MM-01 00:00:00')
|
||
let end=moment(new Date()).add(1, "month").format('YYYY-MM-01 00:00:00')
|
||
extendRule(json, 'MONTH', 6, start);
|
||
extendRule(json, 'MONTH', 3, end);
|
||
}
|
||
else if(this.state.timeType ===20)//最近一年
|
||
{
|
||
let start=moment(new Date()).add(-11, "month").format('YYYY-MM-01 00:00:00')
|
||
let end=moment(new Date()).add(1, "month").format('YYYY-MM-01 00:00:00')
|
||
extendRule(json, 'MONTH', 6, start);
|
||
extendRule(json, 'MONTH', 3, end);
|
||
}
|
||
extendOrder(json, "MONTH", 0);
|
||
this.props.dispatch({
|
||
type: 'app/getDataByPost',
|
||
url: "BI/BIStatiscialAnalysisController/GetEntities",
|
||
payload: json,
|
||
onlyData: false,
|
||
onComplete: (data) => {
|
||
// let data = {
|
||
// "IsSuccessful": true, "Data": [{ "DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MONTH": "2021-08-01 00:00:00", "MONTHStr": "2023年1月", "C_COUNT": 90, "D_COUNT":80},
|
||
// {"DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MONTH": "2021-09-01 00:00:00", "MONTHStr": "2023年2月", "C_COUNT": 70, "D_COUNT": 60},
|
||
// { "DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MONTH": "2021-10-01 00:00:00", "MONTHStr": "2023年3月", "C_COUNT": 70, "D_COUNT": 60},
|
||
// { "DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MONTH": "2021-11-01 00:00:00", "MONTHStr": "2023年4月", "C_COUNT": 70, "D_COUNT": 60},
|
||
// { "DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MONTH": "2021-12-01 00:00:00", "MONTHStr": "2023年5月", "C_COUNT": 70, "D_COUNT": 60},
|
||
// {"DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MONTH": "2021-09-01 00:00:00", "MONTHStr": "2023年6月", "C_COUNT": 70, "D_COUNT": 60},
|
||
// { "DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MONTH": "2021-10-01 00:00:00", "MONTHStr": "2023年7月", "C_COUNT": 70, "D_COUNT": 60},
|
||
// { "DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MONTH": "2021-11-01 00:00:00", "MONTHStr": "2023年8月", "C_COUNT": 70, "D_COUNT": 60},
|
||
// { "DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MONTH": "2021-12-01 00:00:00", "MONTHStr": "2023年9月","C_COUNT": 70, "D_COUNT": 60},
|
||
// { "DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MONTH": "2021-11-01 00:00:00", "MONTHStr": "2023年10月", "C_COUNT": 70, "D_COUNT": 60},
|
||
// { "DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MONTH": "2021-12-01 00:00:00", "MONTHStr": "2023年11月", "C_COUNT": 70, "D_COUNT": 60 },
|
||
// { "DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MONTH": "2022-01-01 00:00:00", "MONTHStr": "2023年12月", "C_COUNT": 70, "D_COUNT": 60 }], "TotalCount": 0, "ErrorMessage": null
|
||
// }
|
||
if (data && data.IsSuccessful) {
|
||
let month = [];
|
||
let company = [];
|
||
let department = [];
|
||
data.Data.forEach(item => {
|
||
month.push(item.MONTHStr);
|
||
company.push(item.FINISH_RATE);
|
||
department.push(item.NORMAL_FINISH_RATE);
|
||
})
|
||
let myChart = echarts.init(document.getElementById('ksRun'));
|
||
myChart.setOption({
|
||
// title: {
|
||
// text: "矿山部-安全生产标准化运行走势图",
|
||
// left: 'center'
|
||
// },
|
||
tooltip: {
|
||
trigger: 'axis',
|
||
// formatter: function (params) {
|
||
// let temp=''
|
||
// params.forEach(t=>{
|
||
// temp=temp+t.seriesName +":"+t.value+"%"+'<br />';
|
||
|
||
// })
|
||
// return temp;
|
||
// }
|
||
},
|
||
legend: {
|
||
// data: ['部门'],
|
||
data: ['完成率', '及时完成率'],
|
||
bottom: '10px'
|
||
},
|
||
grid: {
|
||
left: '3%',
|
||
right: '4%',
|
||
top: '3%',
|
||
containLabel: true
|
||
},
|
||
toolbox: {
|
||
feature: {
|
||
// saveAsImage: {}
|
||
}
|
||
},
|
||
xAxis: {
|
||
type: 'category',
|
||
boundaryGap: false,
|
||
data: month,
|
||
axisLine: {
|
||
show: false,
|
||
// lineStyle: {
|
||
// color: 'rgba(192, 192, 102)'
|
||
// }
|
||
},
|
||
axisTick: {
|
||
show: false
|
||
},
|
||
axisLabel: {
|
||
color: '#000',
|
||
rotate: 40,
|
||
formatter: function (value) { // 自定义文字超出部分 ...
|
||
if (value.length > 10) {
|
||
return `${value.slice(0, 10)}...`;
|
||
}
|
||
return value;
|
||
}
|
||
}
|
||
},
|
||
yAxis: {
|
||
axisLabel: {
|
||
formatter: function (val) {
|
||
return (val)+ '%';
|
||
}
|
||
},
|
||
},
|
||
series: [
|
||
{
|
||
name: '完成率',
|
||
type: 'line',
|
||
color: '#4b9bf3',
|
||
data: company
|
||
},
|
||
{
|
||
name: '及时完成率',
|
||
type: 'line',
|
||
color: '#FCD149',
|
||
data: department
|
||
},
|
||
|
||
]
|
||
})
|
||
}
|
||
}
|
||
});
|
||
}
|
||
//选矿
|
||
xkRun = () => {
|
||
let json = initFilter(this.props.login.OrgId);
|
||
extendRule(json, 'DEPARTMENT_NAME', 1, "选矿部");
|
||
// 1代表=，2代表不等于，3小于，4小于等于，5大于，6大于等于，7以开始的Like,8以结束的Like，9包含
|
||
if(this.state.timeType ===1)//最近一周(显示最近一月的，最小单位为月)
|
||
{
|
||
let start=moment(new Date()).add(0, "month").format('YYYY-MM-01 00:00:00')
|
||
let end=moment(new Date()).add(1, "month").format('YYYY-MM-01 00:00:00')
|
||
extendRule(json, 'MONTH', 6, start);
|
||
extendRule(json, 'MONTH', 3, end);
|
||
}
|
||
else if(this.state.timeType ===5)//最近一月
|
||
{
|
||
let start=moment(new Date()).add(0, "month").format('YYYY-MM-01 00:00:00')
|
||
let end=moment(new Date()).add(1, "month").format('YYYY-MM-01 00:00:00')
|
||
extendRule(json, 'MONTH', 6, start);
|
||
extendRule(json, 'MONTH', 3, end);
|
||
}
|
||
else if(this.state.timeType ===10)//最近三月
|
||
{
|
||
let start=moment(new Date()).add(-2, "month").format('YYYY-MM-01 00:00:00')
|
||
let end=moment(new Date()).add(1, "month").format('YYYY-MM-01 00:00:00')
|
||
extendRule(json, 'MONTH', 6, start);
|
||
extendRule(json, 'MONTH', 3, end);
|
||
}
|
||
else if(this.state.timeType ===15)//最近半年
|
||
{
|
||
let start=moment(new Date()).add(-5, "month").format('YYYY-MM-01 00:00:00')
|
||
let end=moment(new Date()).add(1, "month").format('YYYY-MM-01 00:00:00')
|
||
extendRule(json, 'MONTH', 6, start);
|
||
extendRule(json, 'MONTH', 3, end);
|
||
}
|
||
else if(this.state.timeType ===20)//最近一年
|
||
{
|
||
let start=moment(new Date()).add(-12, "month").format('YYYY-MM-01 00:00:00')
|
||
let end=moment(new Date()).add(1, "month").format('YYYY-MM-01 00:00:00')
|
||
extendRule(json, 'MONTH', 6, start);
|
||
extendRule(json, 'MONTH', 3, end);
|
||
}
|
||
extendOrder(json, "MONTH", 0);
|
||
this.props.dispatch({
|
||
type: 'app/getDataByPost',
|
||
url: "BI/BIStatiscialAnalysisController/GetEntities",
|
||
payload: json,
|
||
onlyData: false,
|
||
onComplete: (data) => {
|
||
// let data = {
|
||
// "IsSuccessful": true, "Data": [{ "DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MONTH": "2021-08-01 00:00:00", "MONTHStr": "2023年1月", "C_COUNT": 90, "D_COUNT":80},
|
||
// {"DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MONTH": "2021-09-01 00:00:00", "MONTHStr": "2023年2月", "C_COUNT": 70, "D_COUNT": 60},
|
||
// { "DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MONTH": "2021-10-01 00:00:00", "MONTHStr": "2023年3月", "C_COUNT": 70, "D_COUNT": 60},
|
||
// { "DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MONTH": "2021-11-01 00:00:00", "MONTHStr": "2023年4月", "C_COUNT": 70, "D_COUNT": 60},
|
||
// { "DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MONTH": "2021-12-01 00:00:00", "MONTHStr": "2023年5月", "C_COUNT": 70, "D_COUNT": 60},
|
||
// {"DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MONTH": "2021-09-01 00:00:00", "MONTHStr": "2023年6月", "C_COUNT": 70, "D_COUNT": 60},
|
||
// { "DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MONTH": "2021-10-01 00:00:00", "MONTHStr": "2023年7月", "C_COUNT": 70, "D_COUNT": 60},
|
||
// { "DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MONTH": "2021-11-01 00:00:00", "MONTHStr": "2023年8月", "C_COUNT": 70, "D_COUNT": 60},
|
||
// { "DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MONTH": "2021-12-01 00:00:00", "MONTHStr": "2023年9月","C_COUNT": 70, "D_COUNT": 60},
|
||
// { "DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MONTH": "2021-11-01 00:00:00", "MONTHStr": "2023年10月", "C_COUNT": 70, "D_COUNT": 60},
|
||
// { "DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MONTH": "2021-12-01 00:00:00", "MONTHStr": "2023年11月", "C_COUNT": 70, "D_COUNT": 60 },
|
||
// { "DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MONTH": "2022-01-01 00:00:00", "MONTHStr": "2023年12月", "C_COUNT": 70, "D_COUNT": 60 }], "TotalCount": 0, "ErrorMessage": null
|
||
// }
|
||
if (data && data.IsSuccessful) {
|
||
let month = [];
|
||
let company = [];
|
||
let department = [];
|
||
data.Data.forEach(item => {
|
||
month.push(item.MONTHStr);
|
||
company.push(item.FINISH_RATE);
|
||
department.push(item.NORMAL_FINISH_RATE);
|
||
})
|
||
let myChart = echarts.init(document.getElementById('xkRun'));
|
||
myChart.setOption({
|
||
// title: {
|
||
// text: "选矿部-安全生产标准化运行走势图",
|
||
// padding: [0,100,100,100],
|
||
// left: 'center'
|
||
// },
|
||
tooltip: {
|
||
trigger: 'axis',
|
||
// formatter: function (params) {
|
||
// let temp=''
|
||
// params.forEach(t=>{
|
||
// temp=temp+t.seriesName +":"+t.value+"%"+'<br />';
|
||
|
||
// })
|
||
// return temp;
|
||
// }
|
||
},
|
||
legend: {
|
||
// data: ['部门'],
|
||
data: ['完成率', '及时完成率'],
|
||
bottom: '10px'
|
||
},
|
||
grid: {
|
||
left: '3%',
|
||
right: '4%',
|
||
top: '3%',
|
||
containLabel: true
|
||
},
|
||
toolbox: {
|
||
feature: {
|
||
// saveAsImage: {}
|
||
}
|
||
},
|
||
xAxis: {
|
||
type: 'category',
|
||
boundaryGap: false,
|
||
data: month,
|
||
axisLine: {
|
||
show: false,
|
||
// lineStyle: {
|
||
// color: 'rgba(192, 192, 102)'
|
||
// }
|
||
},
|
||
axisTick: {
|
||
show: false
|
||
},
|
||
axisLabel: {
|
||
color: '#000',
|
||
rotate: 40,
|
||
formatter: function (value) { // 自定义文字超出部分 ...
|
||
if (value.length > 10) {
|
||
return `${value.slice(0, 10)}...`;
|
||
}
|
||
return value;
|
||
}
|
||
}
|
||
},
|
||
yAxis: {
|
||
axisLabel: {
|
||
formatter: function (val) {
|
||
return (val)+ '%';
|
||
}
|
||
},
|
||
},
|
||
series: [
|
||
{
|
||
name: '完成率',
|
||
type: 'line',
|
||
color: '#4b9bf3',
|
||
data: company
|
||
},
|
||
{
|
||
name: '及时完成率',
|
||
type: 'line',
|
||
color: '#FCD149',
|
||
data: department
|
||
},
|
||
|
||
]
|
||
})
|
||
}
|
||
}
|
||
});
|
||
}
|
||
getMould=()=>{
|
||
let allData= [{
|
||
MOUDLE_NAME : "风险管理",
|
||
TOTAL_QTY :0,
|
||
FINISH_QTY : 0,
|
||
OVER_FINISH_QTY : 0,
|
||
UNFINISH_QTY : 0,
|
||
FINISH_RATE : 0+"%",
|
||
NORMAL_FINISH_RATE : 0+"%",
|
||
},{
|
||
MOUDLE_NAME : "安全检查",
|
||
TOTAL_QTY :0,
|
||
FINISH_QTY : 0,
|
||
OVER_FINISH_QTY : 0,
|
||
UNFINISH_QTY : 0,
|
||
FINISH_RATE : 0+"%",
|
||
NORMAL_FINISH_RATE : 0+"%",
|
||
},{
|
||
MOUDLE_NAME : "作业现场管理",
|
||
TOTAL_QTY :0,
|
||
FINISH_QTY : 0,
|
||
OVER_FINISH_QTY : 0,
|
||
UNFINISH_QTY : 0,
|
||
FINISH_RATE : 0+"%",
|
||
NORMAL_FINISH_RATE : 0+"%",
|
||
},{
|
||
MOUDLE_NAME : "法律法规与其他要求",
|
||
TOTAL_QTY :0,
|
||
FINISH_QTY : 0,
|
||
OVER_FINISH_QTY : 0,
|
||
UNFINISH_QTY : 0,
|
||
FINISH_RATE : 0+"%",
|
||
NORMAL_FINISH_RATE : 0+"%",
|
||
},{
|
||
MOUDLE_NAME : "安全教育培训",
|
||
TOTAL_QTY :0,
|
||
FINISH_QTY : 0,
|
||
OVER_FINISH_QTY : 0,
|
||
UNFINISH_QTY : 0,
|
||
FINISH_RATE : 0+"%",
|
||
NORMAL_FINISH_RATE : 0+"%",
|
||
},{
|
||
MOUDLE_NAME : "方针与目标管理",
|
||
TOTAL_QTY :0,
|
||
FINISH_QTY : 0,
|
||
OVER_FINISH_QTY : 0,
|
||
UNFINISH_QTY : 0,
|
||
FINISH_RATE : 0+"%",
|
||
NORMAL_FINISH_RATE : 0+"%",
|
||
},{
|
||
MOUDLE_NAME : "绩效测量与评价",
|
||
TOTAL_QTY :0,
|
||
FINISH_QTY : 0,
|
||
OVER_FINISH_QTY : 0,
|
||
UNFINISH_QTY : 0,
|
||
FINISH_RATE : 0+"%",
|
||
NORMAL_FINISH_RATE : 0+"%",
|
||
},{
|
||
MOUDLE_NAME : "生产工艺管理",
|
||
TOTAL_QTY :0,
|
||
FINISH_QTY : 0,
|
||
OVER_FINISH_QTY : 0,
|
||
UNFINISH_QTY : 0,
|
||
FINISH_RATE : 0+"%",
|
||
NORMAL_FINISH_RATE : 0+"%",
|
||
},{
|
||
MOUDLE_NAME : "事故事件",
|
||
TOTAL_QTY :0,
|
||
FINISH_QTY : 0,
|
||
OVER_FINISH_QTY : 0,
|
||
UNFINISH_QTY : 0,
|
||
FINISH_RATE : 0+"%",
|
||
NORMAL_FINISH_RATE : 0+"%",
|
||
},{
|
||
MOUDLE_NAME : "安全生产组织保障",
|
||
TOTAL_QTY :0,
|
||
FINISH_QTY : 0,
|
||
OVER_FINISH_QTY : 0,
|
||
UNFINISH_QTY : 0,
|
||
FINISH_RATE : 0+"%",
|
||
NORMAL_FINISH_RATE : 0+"%",
|
||
},{
|
||
MOUDLE_NAME : "安全投入、科技与工伤",
|
||
TOTAL_QTY :0,
|
||
FINISH_QTY : 0,
|
||
OVER_FINISH_QTY : 0,
|
||
UNFINISH_QTY : 0,
|
||
FINISH_RATE : 0+"%",
|
||
NORMAL_FINISH_RATE : 0+"%",
|
||
},
|
||
{
|
||
MOUDLE_NAME : "职业卫生",
|
||
TOTAL_QTY :0,
|
||
FINISH_QTY : 0,
|
||
OVER_FINISH_QTY : 0,
|
||
UNFINISH_QTY : 0,
|
||
FINISH_RATE : 0+"%",
|
||
NORMAL_FINISH_RATE : 0+"%",
|
||
},
|
||
{
|
||
MOUDLE_NAME : "应急管理",
|
||
TOTAL_QTY :0,
|
||
FINISH_QTY : 0,
|
||
OVER_FINISH_QTY : 0,
|
||
UNFINISH_QTY : 0,
|
||
FINISH_RATE : 0+"%",
|
||
NORMAL_FINISH_RATE : 0+"%",
|
||
},
|
||
{
|
||
MOUDLE_NAME : "机电安全管理",
|
||
TOTAL_QTY :0,
|
||
FINISH_QTY : 0,
|
||
OVER_FINISH_QTY : 0,
|
||
UNFINISH_QTY : 0,
|
||
FINISH_RATE : 0+"%",
|
||
NORMAL_FINISH_RATE : 0+"%",
|
||
},
|
||
{
|
||
MOUDLE_NAME : "会议管理",
|
||
TOTAL_QTY :0,
|
||
FINISH_QTY : 0,
|
||
OVER_FINISH_QTY : 0,
|
||
UNFINISH_QTY : 0,
|
||
FINISH_RATE : 0+"%",
|
||
NORMAL_FINISH_RATE : 0+"%",
|
||
},
|
||
{
|
||
MOUDLE_NAME : "标准化创建",
|
||
TOTAL_QTY :0,
|
||
FINISH_QTY : 0,
|
||
OVER_FINISH_QTY : 0,
|
||
UNFINISH_QTY : 0,
|
||
FINISH_RATE : 0+"%",
|
||
NORMAL_FINISH_RATE : 0+"%",
|
||
},
|
||
]
|
||
var orgId = this.props.login ? this.props.login.OrgId : '';
|
||
let json = initFilter(orgId);
|
||
extendRule(json, 'TYPE', 1, this.state.timeType);
|
||
extendOrder(json, "NUM", 0);
|
||
this.props.dispatch({
|
||
type: 'app/getDataByPost',
|
||
payload: json,
|
||
url: 'BI/MouldRunSummary/OrderEntities',
|
||
onComplete: (ret) => {
|
||
if (ret) {
|
||
let temp=[];
|
||
allData.forEach(t=>{
|
||
let group=ret.filter(m=>m.MOUDLE_NAME === t.MOUDLE_NAME)
|
||
if(group.length>0)
|
||
{
|
||
t.TOTAL_QTY = group[0].TOTAL_QTY;
|
||
t.FINISH_QTY = group[0].FINISH_QTY;
|
||
t.OVER_FINISH_QTY = group[0].OVER_FINISH_QTY;
|
||
t.UNFINISH_QTY = group[0].UNFINISH_QTY;
|
||
t.FINISH_RATE = group[0].FINISH_RATE+"%";
|
||
t.NORMAL_FINISH_RATE =group[0].NORMAL_FINISH_RATE+"%";
|
||
}
|
||
temp.push(t);
|
||
})
|
||
this.setState({
|
||
detailData:temp
|
||
})
|
||
}
|
||
}
|
||
})
|
||
}
|
||
getDepartment=()=>{
|
||
var orgId = this.props.login ? this.props.login.OrgId : '';
|
||
const jsonTemp = initFilter(orgId)
|
||
extendRule(jsonTemp, "DEPARTMENT_TYPE", 1, 0);
|
||
this.props.dispatch({
|
||
type: 'app/getDataByPost',
|
||
payload: jsonTemp,
|
||
url: 'FM/Department/OrderEntities',
|
||
onComplete: (retDepart) => {
|
||
if (retDepart) {
|
||
let tempDepart=[];
|
||
retDepart.forEach(t=>{
|
||
let tempNow={
|
||
DEPARTMENT_ID:t.ID,
|
||
DEPARTMENT_NAME:t.NAME,
|
||
TOTAL_QTY:0,
|
||
FINISH_QTY:0,
|
||
OVER_FINISH_QTY:0,
|
||
UNFINISH_QTY:0,
|
||
FINISH_RATE:"0%",
|
||
NORMAL_FINISH_RATE:"0%"};
|
||
tempDepart.push(tempNow);
|
||
})
|
||
|
||
let json = initFilter(orgId);
|
||
extendRule(json, 'TYPE', 1, this.state.timeType);
|
||
extendRule(json, 'DEPARTMENT_TYPE', 1, 0);
|
||
this.props.dispatch({
|
||
type: 'app/getDataByPost',
|
||
payload: json,
|
||
url: 'BI/SystemRunSummary/OrderEntities',
|
||
onComplete: (ret) => {
|
||
if (ret) {
|
||
let temp=[];
|
||
if(ret)
|
||
{
|
||
let t1 = 0;
|
||
let t2 = 0;
|
||
let t3 = 0;
|
||
let t4 = 0;
|
||
tempDepart.forEach(t=>{
|
||
let group=ret.filter(m=>m.DEPARTMENT_ID === t.DEPARTMENT_ID)
|
||
if(group.length>0)
|
||
{
|
||
t.TOTAL_QTY = group[0].TOTAL_QTY;
|
||
t.FINISH_QTY = group[0].FINISH_QTY;
|
||
t.OVER_FINISH_QTY = group[0].OVER_FINISH_QTY;
|
||
t.UNFINISH_QTY = group[0].UNFINISH_QTY;
|
||
t.FINISH_RATE = group[0].FINISH_RATE+"%";
|
||
t.NORMAL_FINISH_RATE =group[0].NORMAL_FINISH_RATE+"%";
|
||
t1 = t1 + group[0].TOTAL_QTY;
|
||
t2 = t2 + group[0].FINISH_QTY;
|
||
t3 = t3 + group[0].OVER_FINISH_QTY;
|
||
t4 = t4 + group[0].UNFINISH_QTY;
|
||
}
|
||
temp.push(t);
|
||
})
|
||
let t5 = t1===0?"0%": ((t2+t3)/t1 *100).toFixed(0)+"%";
|
||
let t6 = t1===0?"0%":(t2/t1 *100).toFixed(0)+"%";
|
||
this.setState({
|
||
retData:temp,
|
||
totalCount:t1,
|
||
finishCount:t2,
|
||
overtimeCount:t3,
|
||
unfinishCount:t4,
|
||
rate:t5,
|
||
normalRate:t6,
|
||
})
|
||
// ret.groupData.forEach(t=>{
|
||
// t.unDoneCount = t.TotalCount-t.doneCount -t.timeOverCount;
|
||
// t.allDoneRate = ((t.doneCount +t.timeOverCount)/t.TotalCount*100).toFixed(0)+"%";
|
||
// t.doneRate = (t.doneCount/t.TotalCount*100).toFixed(0)+"%";
|
||
// temp.push(t);
|
||
// })
|
||
}
|
||
|
||
}
|
||
}
|
||
})
|
||
}
|
||
}
|
||
})
|
||
}
|
||
closeModal = () => { // 退出弹窗
|
||
this.clearData();
|
||
}
|
||
clearData = () => {
|
||
let newtmpData = { ...this.state.tmpData }
|
||
newtmpData["data"].id = '';
|
||
newtmpData["data"].homeReload = false;
|
||
newtmpData.formCode = '';
|
||
this.setState({
|
||
visible: false,
|
||
tmpData: newtmpData,
|
||
})
|
||
}
|
||
handleCancel = () => { // 退出弹窗
|
||
this.clearData();
|
||
}
|
||
render() {
|
||
const { startTime, endTime,finishCount,overtimeCount,totalCount,unfinishCount,
|
||
weekColor,monthColor,threeMonthColor,sixMonthColor,yearColor,
|
||
} = this.state;
|
||
let allFinishRate=totalCount ===0?0:((finishCount+overtimeCount)/totalCount * 100).toFixed(0);
|
||
let finishRate=totalCount ===0?0:(finishCount/totalCount * 100).toFixed(0);
|
||
return <div>
|
||
{/* className='route-home' ,boxShadow:'inset 0 0 10px #ccc' */}
|
||
<div style={{backgroundColor:'white',width:'1200px',top:'0',bottom:'0',left:'0',right:'0',margin:'auto',borderStyle:'solid',borderColor:'#ccc',borderWidth:'1px',}}>
|
||
<Modal
|
||
visible={this.state.visible}
|
||
title={this.state.noticeTitle}
|
||
maskClosable={false}
|
||
onCancel={this.handleCancel}
|
||
footer={null}
|
||
className='antd-modal-fullscreen'
|
||
closeModal={this.closeModal}
|
||
// forceRender={true}
|
||
>
|
||
<FormPage {...this.state.tmpData} />
|
||
</Modal>
|
||
<h1 style={{ textAlign: "center",marginTop:'30px',fontWeight:'bold'}}>行洛坑钨矿安全生产标准化运行情况</h1>
|
||
<Row style={{ textAlign: 'center',fontSize:'15px'}}> <span>({startTime}-{endTime})</span></Row>
|
||
<br></br>
|
||
<span style={{width:"800px",marginLeft:"30px"}}>
|
||
<Button style={{width:"100px",height:"60px",borderRadius: '8px',border:'1px RGB(24, 149, 255) solid',marginRight:"10px"}}>总任务数<br></br><span style={{fontWeight:"bold",fontSize:"20px",color:'black'}}>{totalCount}</span></Button>
|
||
<Button style={{width:"100px",height:"60px",borderRadius: '8px',border:'1px RGB(24, 149, 255) solid',marginRight:"10px"}}>正常已办<br></br><span style={{fontWeight:"bold",fontSize:"20px",color:'green'}}>{finishCount}</span></Button>
|
||
<Button style={{width:"100px",height:"60px",borderRadius: '8px',border:'1px RGB(24, 149, 255) solid',marginRight:"10px"}}>超时已办<br></br><span style={{fontWeight:"bold",fontSize:"20px",color:'orange'}}>{overtimeCount}</span></Button>
|
||
<Button style={{width:"100px",height:"60px",borderRadius: '8px',border:'1px RGB(24, 149, 255) solid',marginRight:"10px"}}>未完成数<br></br><span style={{fontWeight:"bold",fontSize:"20px",color:'red'}}>{unfinishCount}</span></Button>
|
||
<Button style={{width:"100px",height:"60px",borderRadius: '8px',border:'1px RGB(24, 149, 255) solid',marginRight:"10px"}}>完成率<br></br><span style={{fontWeight:"bold",fontSize:"20px",color:'orange'}}>{allFinishRate}%</span></Button>
|
||
<Button style={{width:"100px",height:"60px",borderRadius: '8px',border:'1px RGB(24, 149, 255) solid',marginRight:"10px"}}>及时完成率<br></br><span style={{fontWeight:"bold",fontSize:"20px",color:'orange'}}>{finishRate}%</span></Button>
|
||
</span>
|
||
<span style={{float:"right",marginTop:"20px",width:"400px"}}>
|
||
<Col span={4}> <Button type='link' style= {{color:weekColor,marginRight:"5px"}} onClick={() => this.getDate("Week")}>最近1周</Button></Col>
|
||
<Col span={4}> <Button type='link' style= {{color:monthColor,marginRight:"5px"}} onClick={() => this.getDate("Month")}>最近1月</Button></Col>
|
||
<Col span={4}> <Button type='link' style= {{color:threeMonthColor,marginRight:"5px"}} onClick={() => this.getDate("ThreeMonth")}>最近3月</Button></Col>
|
||
<Col span={4}> <Button type='link' style= {{color:sixMonthColor,marginRight:"5px"}} onClick={() => this.getDate("SixMonth")}>最近半年</Button></Col>
|
||
<Col span={4}> <Button type='link' style= {{color:yearColor,marginRight:"5px"}} onClick={() => this.getDate("Year")}>最近1年</Button></Col>
|
||
{/* <Col span={4}> <Button type='link' style= {{color:yearColor,marginRight:"5px"}} onClick={() => this.getDate("All")}>全部</Button></Col> */}
|
||
</span>
|
||
<hr style={{border:'1px dashed #ccc',marginBottom:"20px",marginTop:"20px"}}></hr>
|
||
<Row style={{marginTop:"10px"}}>
|
||
<Col span={12}>
|
||
<h2 style={{textAlign:'left',fontWeight:'bold',marginLeft:"30px"}}><Icon type="appstore"/> 部门统计分析</h2>
|
||
<Table style={{width:'600px',marginLeft:"30px",textAlign:'center'}}
|
||
// scroll={{ y: 400 }}
|
||
dataSource={this.state.retData}
|
||
columns={this.state.columns}
|
||
pagination={false}
|
||
loading={false}
|
||
size="small"
|
||
/>
|
||
</Col>
|
||
<Col span={12}>
|
||
<h2 style={{textAlign:'center',fontWeight:'bold'}}>矿山部-安全生产标准化运行走势图</h2>
|
||
<div id="ksRun" style={{ height: '350px',marginLeft:"50px" ,marginRight:"30px" ,backgroundColor:"white",borderStyle:'solid',borderColor:'#ccc',borderWidth:'1px'}}></div>
|
||
</Col>
|
||
</Row>
|
||
<hr style={{border:'1px dashed #ccc',marginBottom:"20px",marginTop:"20px"}}></hr>
|
||
<Row style={{marginBottom:"10px"}}>
|
||
<Col span={12}>
|
||
<h2 style={{textAlign:'left',fontWeight:'bold',marginLeft:"30px"}}><Icon type="appstore"/> 模块统计分析</h2>
|
||
<Table style={{marginLeft:"30px",width:'600px',textAlign:'center'}}
|
||
// scroll={{ y: 400 }}
|
||
dataSource={this.state.detailData}
|
||
columns={this.state.detailColumns}
|
||
pagination={false}
|
||
loading={false}
|
||
size="small"
|
||
/>
|
||
</Col>
|
||
<Col span={12}>
|
||
<h2 style={{textAlign:'center',fontWeight:'bold'}}>选矿部-安全生产标准化运行走势图</h2>
|
||
<div id="xkRun" style={{ height: '350px',marginLeft:"50px" ,marginRight:"30px" ,backgroundColor:"white",borderStyle:'solid',borderColor:'#ccc',borderWidth:'1px'}}></div>
|
||
</Col>
|
||
</Row>
|
||
|
||
</div>
|
||
</div >
|
||
}
|
||
}
|
||
export default connect(({ login, app }) => ({ login, app }))(BI006FormRunAnalysis)
|