1190 lines
44 KiB
JavaScript
1190 lines
44 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,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'
|
|
|
|
class BI007FormRunAnalysis extends React.Component {
|
|
|
|
constructor(props) {
|
|
super(props);
|
|
this.state = {
|
|
visible: false,
|
|
noticeTitle: '',
|
|
tmpData: {},
|
|
tableKey: "1",
|
|
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: "60px",
|
|
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: "100px",
|
|
title: '完成率',
|
|
dataIndex: 'FINISH_RATE',
|
|
key: 'FINISH_RATE',
|
|
render: (text, record) => (
|
|
|
|
<Progress percent={record.FINISH_RATE.split('%')[0]} />
|
|
// <span>
|
|
// <a onClick={() => this.showEditModal(record.DEPARTMENT_ID,record.DEPARTMENT_NAME)}>{record.DEPARTMENT_NAME}</a>
|
|
// </span>
|
|
),
|
|
},
|
|
{
|
|
width: "100px",
|
|
title: '及时完成率',
|
|
dataIndex: 'NORMAL_FINISH_RATE',
|
|
key: 'NORMAL_FINISH_RATE',
|
|
render: (text, record) => (
|
|
<Progress percent={record.NORMAL_FINISH_RATE.split('%')[0] } strokeColor={{ from: 'rgba(82, 196, 26)', to: 'rgba(82, 196, 26)' }} />
|
|
// <span>
|
|
// <a onClick={() => this.showEditModal(record.DEPARTMENT_ID,record.DEPARTMENT_NAME)}>{record.DEPARTMENT_NAME}</a>
|
|
// </span>
|
|
),
|
|
}
|
|
],
|
|
};
|
|
};
|
|
|
|
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=(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=[]
|
|
}
|
|
this.setState({displaydetail:'block',detailDataH:newDataTemp
|
|
})
|
|
}
|
|
// 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.getClassDepartment();
|
|
this.getShopDepartment();
|
|
}
|
|
//矿山
|
|
ksRun = () => {
|
|
let json = initFilter(this.props.login.OrgId);
|
|
extendRule(json, 'DEPARTMENT_NAME', 1, "矿山部");
|
|
extendOrder(json, "MONTH", 0);
|
|
this.props.dispatch({
|
|
type: 'app/getDataByPost',
|
|
url: "BI/DepartmentMonthRun/OrderEntities",
|
|
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, "选矿部");
|
|
extendOrder(json, "MONTH", 0);
|
|
this.props.dispatch({
|
|
type: 'app/getDataByPost',
|
|
url: "BI/DepartmentMonthRun/OrderEntities",
|
|
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
|
|
},
|
|
|
|
]
|
|
})
|
|
}
|
|
}
|
|
});
|
|
}
|
|
//
|
|
workTicket = () => {
|
|
const {retData} = this.state;
|
|
let teamName = [];
|
|
let wattingQty = [];
|
|
let finishQty = [];
|
|
let overFinishQty = [];
|
|
let totalQty = [];
|
|
retData.forEach(item => {
|
|
teamName.push(item.DEPARTMENT_NAME);
|
|
wattingQty.push(item.UNFINISH_QTY);
|
|
finishQty.push(item.FINISH_QTY);
|
|
overFinishQty.push(item.OVER_FINISH_QTY);
|
|
totalQty.push(item.TOTAL_QTY);
|
|
})
|
|
//图标2
|
|
let workTickets = document.getElementById('workTicket');
|
|
if (workTickets) {
|
|
let myChart = echarts.init(workTickets);
|
|
myChart.setOption({
|
|
// title: {
|
|
// text: "部门级-安全事务完成情况",
|
|
// left: 'center'
|
|
// },
|
|
tooltip: {
|
|
trigger: 'axis',
|
|
axisPointer: { // 坐标轴指示器，坐标轴触发有效
|
|
type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
|
|
},
|
|
},
|
|
grid: {
|
|
left: '3%',
|
|
right: '4%',
|
|
top: '10%',
|
|
bottom: '10%',
|
|
containLabel: true
|
|
},
|
|
xAxis: {
|
|
type: 'category',
|
|
data: teamName,
|
|
axisLine: {
|
|
show: false,
|
|
// lineStyle: {
|
|
// color: 'rgba(192, 192, 102)'
|
|
// }
|
|
},
|
|
axisTick: {
|
|
show: false
|
|
},
|
|
axisLabel: {
|
|
color: '#000',
|
|
rotate: 40,
|
|
formatter: function (value) { // 自定义文字超出部分 ...
|
|
if (value.length > 5) {
|
|
return `${value.slice(0, 5)}...`;
|
|
}
|
|
return value;
|
|
}
|
|
}
|
|
},
|
|
legend: {
|
|
data: ['正常已办', '超时已办','未完成'],
|
|
bottom: '0px'
|
|
},
|
|
yAxis: {
|
|
type: 'value',
|
|
splitLine: {
|
|
show: false,
|
|
lineStyle: {
|
|
color: '#172749'
|
|
}
|
|
},
|
|
axisLine: {
|
|
show: false,
|
|
// lineStyle: {
|
|
// color: 'rgba(192, 192, 102)'
|
|
// }
|
|
},
|
|
axisTick: {
|
|
show: false
|
|
},
|
|
},
|
|
series: [
|
|
// {
|
|
// name: '总数',
|
|
// type: 'bar',
|
|
// stack: '',
|
|
// label: {
|
|
// show: true,
|
|
// position: 'top',
|
|
// color: '#000',
|
|
// },
|
|
// data: totalQty,
|
|
// barGap: '-100%',
|
|
// z: -1,
|
|
// itemStyle: {
|
|
// normal: {
|
|
// color: '#CCCCCC'//rgba(128, 128, 128, 0.3)
|
|
// }
|
|
// },
|
|
// },
|
|
{
|
|
name: '正常已办',
|
|
type: 'bar',
|
|
stack: '总量',
|
|
label: {
|
|
show: true,
|
|
position: 'inside',
|
|
color: '#000',
|
|
},
|
|
emphasis: {//折线图的高亮状态。
|
|
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
|
|
},
|
|
data: finishQty,
|
|
barGap: '-100%',
|
|
z: -1,
|
|
itemStyle: {
|
|
// 渐变色 1、指明颜色渐变的方向 2、指明不同百分比之下颜色的值
|
|
color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
|
|
{ offset: 0, color: "#01AEF6" },
|
|
{ offset: 1, color: "rgba(16,36,95,0.6)" },//rgba(16,36,95,0.6) #9999FF
|
|
]),
|
|
// normal: {
|
|
// color: '#5B9BD5',
|
|
// }
|
|
},
|
|
},
|
|
{
|
|
name: '超时已办',
|
|
type: 'bar',
|
|
stack: '总量',
|
|
label: {
|
|
show: true,
|
|
position: 'inside',
|
|
color: '#000',
|
|
},
|
|
emphasis: {//折线图的高亮状态。
|
|
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
|
|
},
|
|
data: overFinishQty,
|
|
barGap: '-100%',
|
|
z: -1,
|
|
itemStyle: {
|
|
// 渐变色 1、指明颜色渐变的方向 2、指明不同百分比之下颜色的值
|
|
color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
|
|
{ offset: 0, color: "#ED7D31" },
|
|
{ offset: 1, color: "#FFFF33" },//rgba(255,255,0,0.6)
|
|
]),
|
|
// normal: {
|
|
// color: '#ED7D31',
|
|
// }
|
|
},
|
|
},
|
|
{
|
|
name: '未完成',
|
|
type: 'bar',
|
|
stack: '总量',
|
|
label: {
|
|
show: true,
|
|
position: 'inside',
|
|
color: '#000',
|
|
},
|
|
emphasis: {//折线图的高亮状态。
|
|
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
|
|
},
|
|
data: wattingQty,
|
|
barGap: '-100%',
|
|
z: -1,
|
|
itemStyle: {
|
|
normal: {
|
|
color: '#CCCCCC'//rgba(128, 128, 128, 0.3)
|
|
}
|
|
},
|
|
},
|
|
],
|
|
});
|
|
}
|
|
}//主要工作分布图（饼图）
|
|
// mainJobPie2Old = () => {
|
|
// const {retData} = this.state;
|
|
// // let data = { "IsSuccessful": true, "Data": [{ "USER_ID": "37c527b6-86cf-4549-8b2d-8528af5600d1", "DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MODULE": "安全检查", "COUNT": 3, "COLOR": "#CD0505" }, { "USER_ID": "37c527b6-86cf-4549-8b2d-8528af5600d1", "DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MODULE": "作业现场", "COUNT": 2, "COLOR": "#FCD149" }, { "USER_ID": "37c527b6-86cf-4549-8b2d-8528af5600d1", "DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MODULE": "应急管理", "COUNT": 1, "COLOR": "#60A9F8" }], "TotalCount": 0, "ErrorMessage": null }
|
|
|
|
// let moduleData = []
|
|
// let showData = []
|
|
// let dataColor = []
|
|
// retData.forEach(item => {
|
|
// moduleData.push(item.DEPARTMENT_NAME)
|
|
// let valueTemp=item.FINISH_QTY+item.OVER_FINISH_QTY
|
|
// showData.push({ value: valueTemp, name: item.DEPARTMENT_NAME })
|
|
// let agb=`rgb(${Math.floor(Math.random()*256)},${Math.floor(Math.random()*256)},${Math.floor(Math.random()*256)})`;
|
|
// dataColor.push(agb)
|
|
// })
|
|
// let myChart = echarts.init(document.getElementById('mainJobPie2'));
|
|
// myChart.setOption({
|
|
// // title: {
|
|
// // text: "部门级-安全事务完成率",
|
|
// // left: 'center'
|
|
// // },
|
|
// tooltip: {
|
|
// trigger: 'item',
|
|
// //formatter: '{a} <br/>{b} : {c} ({d}%)'
|
|
// formatter: '{b} : {c} ({d}%)'
|
|
// },
|
|
// legend: {
|
|
// bottom: '10px',
|
|
// data: moduleData
|
|
// },
|
|
// series: [
|
|
// {
|
|
// name: '主要工作分布',
|
|
// type: 'pie',
|
|
// radius: '55%',
|
|
// center: ['50%', '42%'],
|
|
// label: {
|
|
// formatter: '{b}:({d}%)',
|
|
// normal:{
|
|
// show: true,
|
|
// position:'inner',
|
|
// formatter: '{d}%',
|
|
// }
|
|
// },
|
|
// data: showData,
|
|
// color: dataColor,
|
|
// emphasis: {
|
|
// itemStyle: {
|
|
// shadowBlur: 10,
|
|
// shadowOffsetX: 0,
|
|
// //shadowColor: 'rgba(0, 0, 0, 0.5)'
|
|
// }
|
|
// }
|
|
// }
|
|
// ]
|
|
// });
|
|
// }
|
|
mainJobPie2 = () => {
|
|
const {retData} = this.state;
|
|
// let data = { "IsSuccessful": true, "Data": [{ "USER_ID": "37c527b6-86cf-4549-8b2d-8528af5600d1", "DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MODULE": "安全检查", "COUNT": 3, "COLOR": "#CD0505" }, { "USER_ID": "37c527b6-86cf-4549-8b2d-8528af5600d1", "DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MODULE": "作业现场", "COUNT": 2, "COLOR": "#FCD149" }, { "USER_ID": "37c527b6-86cf-4549-8b2d-8528af5600d1", "DEPARTMENT_ID": "e3061909-1a7e-b60c-bc71-1845b79c4a11", "MODULE": "应急管理", "COUNT": 1, "COLOR": "#60A9F8" }], "TotalCount": 0, "ErrorMessage": null }
|
|
|
|
let month = [];
|
|
let company = [];
|
|
let department = [];
|
|
let totalCount = [];
|
|
// retData.forEach(item => {
|
|
// moduleData.push(item.DEPARTMENT_NAME)
|
|
// let valueTemp=item.FINISH_QTY+item.OVER_FINISH_QTY
|
|
// showData.push({ value: valueTemp, name: item.DEPARTMENT_NAME })
|
|
// let agb=`rgb(${Math.floor(Math.random()*256)},${Math.floor(Math.random()*256)},${Math.floor(Math.random()*256)})`;
|
|
// dataColor.push(agb)
|
|
// })
|
|
retData.forEach((item) => {
|
|
month.push(item.DEPARTMENT_NAME);
|
|
company.push(item.FINISH_RATE);
|
|
department.push(item.NORMAL_FINISH_RATE);
|
|
totalCount.push(item.FINISH_QTY+item.OVER_FINISH_QTY);
|
|
});
|
|
let myChart = echarts.init(document.getElementById("mainJobPie2"));
|
|
myChart.setOption({
|
|
tooltip: {
|
|
trigger: "axis",
|
|
axisPointer: {
|
|
// 坐标轴指示器，坐标轴触发有效
|
|
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
|
|
},
|
|
transitionDuration: 0,
|
|
formatter: function (params) {
|
|
return (
|
|
params[0].marker +
|
|
params[0].seriesName +
|
|
" : " +
|
|
params[0].value +
|
|
"</br>" +
|
|
params[1].marker +
|
|
params[1].seriesName +
|
|
" : " +
|
|
params[1].value + "%" +
|
|
"</br>" +
|
|
params[2].marker +
|
|
params[2].seriesName +
|
|
" : " +
|
|
params[2].value + "%"
|
|
);
|
|
},
|
|
},
|
|
title: {
|
|
text: "工作票完成分析",
|
|
left: "center",
|
|
top: "5%",
|
|
},
|
|
legend: {
|
|
data: ["完成数","完成率", "及时完成率"],
|
|
left: "center",
|
|
align: "left",
|
|
bottom: "2%",
|
|
textStyle: {
|
|
color: "#000",
|
|
},
|
|
itemWidth: 10,
|
|
itemHeight: 10,
|
|
// itemGap: 35,
|
|
},
|
|
grid: {
|
|
left: "3%",
|
|
right: "4%",
|
|
top: "15%",
|
|
containLabel: true,
|
|
},
|
|
xAxis: {
|
|
type: "category",
|
|
data: month,
|
|
axisLabel: {
|
|
showMaxLabel: true,
|
|
},
|
|
},
|
|
yAxis: [
|
|
{
|
|
type: "value",
|
|
position: "left",
|
|
splitLine: {
|
|
show: true,
|
|
lineStyle: {
|
|
color: ["#f2f2f2"],
|
|
// opacity:0.2
|
|
// zlevel: -1,
|
|
},
|
|
},
|
|
axisLine: {
|
|
lineStyle: {
|
|
color: "#0c3b71",
|
|
},
|
|
},
|
|
axisLabel: {
|
|
color: "rgb(170,170,170)",
|
|
formatter: "{value} ",
|
|
},
|
|
},
|
|
{
|
|
type: "value",
|
|
position: "right",
|
|
splitLine: {
|
|
show: false,
|
|
lineStyle: {
|
|
color: ["#f2f2f2"],
|
|
},
|
|
},
|
|
axisLine: {
|
|
lineStyle: {
|
|
color: "#f2f2f2",
|
|
},
|
|
},
|
|
axisLabel: {
|
|
color: "rgb(170,170,170)",
|
|
formatter: "{value} %",
|
|
},
|
|
},
|
|
],
|
|
series: [
|
|
{
|
|
name: "完成数",
|
|
type: "bar",
|
|
color: "#72b85b",
|
|
data: totalCount,
|
|
barWidth: "20%",
|
|
barGap: "10%",
|
|
stack: null,
|
|
},
|
|
{
|
|
name: "完成率",
|
|
type: "line",
|
|
color: "#4b9bf3",
|
|
data: company,
|
|
yAxisIndex: 1,
|
|
smooth: true,
|
|
// zlevel:100,
|
|
},
|
|
{
|
|
name: "及时完成率",
|
|
type: "line",
|
|
color: "#FCD149",
|
|
data: department,
|
|
yAxisIndex: 1,
|
|
smooth: true,
|
|
// zlevel:100,
|
|
},
|
|
],
|
|
});
|
|
}
|
|
compare = (val1, val2) => {
|
|
return val2.NUM - val1.NUM;
|
|
};
|
|
getClassDepartment=()=>{
|
|
var orgId = this.props.login ? this.props.login.OrgId : '';
|
|
const jsonTemp = initFilter(orgId)
|
|
extendRule(jsonTemp, "DEPARTMENT_TYPE", 1, 2);
|
|
// extendRule(jsonTemp, 'Nav_Parent.PARENT_ID', 1, this.props.data.id);
|
|
extendRule(jsonTemp, 'Nav_Parent.Nav_Parent.NAME', 1, this.props?.login?.currActivatedMenu?.MENU_FORM_PARAMS);
|
|
extendOrder(jsonTemp, "PARENT_ID", 0);
|
|
extendOrder(jsonTemp, "NAME", 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, 2);
|
|
// extendRule(json, 'PARENT_DEPARTMENT_ID', 1, this.props.data.id);
|
|
// extendOrder(json, "PARENT_DEPARTMENT_ID", 0);
|
|
extendOrder(json, "FINISH_RATE", 1);
|
|
this.props.dispatch({
|
|
type: 'app/getDataByPost',
|
|
payload: json,
|
|
url: 'BI/SystemRunSummary/OrderEntities',
|
|
onComplete: (ret) => {
|
|
if (ret) {
|
|
let temp=[];
|
|
if(ret)
|
|
{
|
|
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+"%";
|
|
t.NUM = group[0].TOTAL_QTY === 0 ?0:group[0].FINISH_QTY/group[0].TOTAL_QTY
|
|
}
|
|
temp.push(t);
|
|
})
|
|
temp =temp.sort(this.compare);
|
|
this.setState({
|
|
detailData:temp
|
|
})
|
|
// 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);
|
|
// })
|
|
}
|
|
|
|
}
|
|
}
|
|
})
|
|
}
|
|
}
|
|
})
|
|
}
|
|
getShopDepartment=()=>{
|
|
var orgId = this.props.login ? this.props.login.OrgId : '';
|
|
const jsonTemp = initFilter(orgId)
|
|
extendRule(jsonTemp, "DEPARTMENT_TYPE", 1, 1);
|
|
// extendRule(jsonTemp, 'PARENT_ID', 1, this.props.data.id);
|
|
extendRule(jsonTemp, 'Nav_Parent.NAME', 1, this.props?.login?.currActivatedMenu?.MENU_FORM_PARAMS);
|
|
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, 1);
|
|
// extendRule(json, 'PARENT_DEPARTMENT_ID', 1, this.props.data.id);
|
|
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,
|
|
},()=>{
|
|
this.workTicket();
|
|
this.mainJobPie2();
|
|
})
|
|
// 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>
|
|
{/* {this.props.data.name} */}
|
|
<h1 style={{ textAlign: "center",marginTop:'30px',fontWeight:'bold'}}>{this.props?.login?.currActivatedMenu?.MENU_FORM_PARAMS} 安全生产标准化运行情况</h1>
|
|
<Row style={{ textAlign: 'center',fontSize:'15px'}}> <span>({startTime}-{endTime})</span></Row>
|
|
<br></br>
|
|
<span style={{width:"800px",marginLeft:"20px"}}>
|
|
<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={11}>
|
|
<h2 style={{textAlign:'left',fontWeight:'bold',marginLeft:"20px"}}><Icon type="appstore"/> 车间统计分析</h2>
|
|
<Table style={{width:'560px',marginLeft:"20px",textAlign:'center'}}
|
|
// scroll={{ y: 400 }}
|
|
dataSource={this.state.retData}
|
|
columns={this.state.columns}
|
|
pagination={false}
|
|
loading={false}
|
|
size="small"
|
|
bordered
|
|
/>
|
|
</Col>
|
|
<Col span={7}>
|
|
<h3 style={{textAlign:'center',fontWeight:'bold'}}>{this.props.data.name}安全任务完成情况</h3>
|
|
<div id="workTicket" style={{ height: '350px',marginLeft:"40px" ,marginRight:"10px" ,backgroundColor:"white",borderStyle:'solid',borderColor:'#ccc',borderWidth:'1px'}}></div>
|
|
</Col>
|
|
<Col span={6}>
|
|
<h3 style={{textAlign:'center',fontWeight:'bold'}}>{this.props.data.name}安全任务完成率</h3>
|
|
<div id="mainJobPie2" style={{ height: '350px',marginLeft:"0px" ,marginRight:"20px" ,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={24}>
|
|
<h2 style={{textAlign:'left',fontWeight:'bold',marginLeft:"30px"}}><Icon type="appstore"/> 班组统计分析</h2>
|
|
<Table style={{marginLeft:"20px",marginRight:"20px",width:'1150px',textAlign:'center'}}
|
|
// scroll={{ y: 400 }}
|
|
dataSource={this.state.detailData}
|
|
columns={this.state.detailColumns}
|
|
pagination={false}
|
|
loading={false}
|
|
size="small"
|
|
bordered
|
|
/>
|
|
</Col>
|
|
</Row>
|
|
|
|
</div>
|
|
</div >
|
|
}
|
|
}
|
|
export default connect(({ login, app }) => ({ login, app }))(BI007FormRunAnalysis)
|