432 lines
14 KiB
JavaScript
432 lines
14 KiB
JavaScript
|
import React from 'react'
|
|||
|
|
import { connect } from 'dva'
|
|||
|
|
import { initFilter, extendRule, extendInclude, getIsPC, openNotificationMobile } from "../../../utils/common"
|
|||
|
|
import { ChartBarShow_Vertical, LineShow } from "../../../utils/commonEcharsShow"
|
|||
|
|
import { notification, Button, Descriptions } from 'antd';
|
|||
|
|
import echarts from 'echarts';
|
|||
|
|
import styles from '../HI/StepForm.css';
|
|||
|
|
|
|||
|
|
const formItemLayout = {
|
|||
|
|
labelCol: { span: 6 },
|
|||
|
|
wrapperCol: { span: 14 },
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
class BI051BSCompanyYear extends React.Component {
|
|||
|
|
|
|||
|
|
constructor(props) {
|
|||
|
|
super(props);
|
|||
|
|
this.state = {
|
|||
|
|
data: {
|
|||
|
|
titleDate: ' ',
|
|||
|
|
countPlan: ' ',
|
|||
|
|
countFinishIntTime: ' ',
|
|||
|
|
countFinishOutTime: ' ',
|
|||
|
|
countNotFinish: ' ',
|
|||
|
|
count1: 0,
|
|||
|
|
count2: 0,
|
|||
|
|
count3: 0,
|
|||
|
|
count4: 0,
|
|||
|
|
parm7: "",
|
|||
|
|
parm8: "",
|
|||
|
|
|
|||
|
|
count21: 0,
|
|||
|
|
count22: 0,
|
|||
|
|
count23: 0,
|
|||
|
|
parm27: "",
|
|||
|
|
|
|||
|
|
year: (new Date()).getFullYear(),
|
|||
|
|
company: '公司级'
|
|||
|
|
},
|
|||
|
|
listSafeCheckYear: [],
|
|||
|
|
listCheckTypeYear: [],
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
componenthidMount() {
|
|||
|
|
if (!getIsPC()) {
|
|||
|
|
openNotificationMobile('bottomRight', notification)
|
|||
|
|
this.state.displayStr = 'none';
|
|||
|
|
this.state.displayNum = 24;
|
|||
|
|
//alert('手机');
|
|||
|
|
} else {
|
|||
|
|
this.state.displayStr = '';
|
|||
|
|
this.state.displayNum = 16;
|
|||
|
|
//alert('PC');
|
|||
|
|
}
|
|||
|
|
this.loadData()
|
|||
|
|
|
|||
|
|
//定时器功能，暂时不开启
|
|||
|
|
// this.timerID = setInterval(() => this.getBaseInfoData(1, this.state.tableKey, 5), 120000);
|
|||
|
|
|
|||
|
|
};
|
|||
|
|
componentDidMount() {
|
|||
|
|
this.loadData()
|
|||
|
|
}
|
|||
|
|
componentWillUnmount() {
|
|||
|
|
// this.timerID && clearTimeout(this.timerID);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//加载数据赋值
|
|||
|
|
loadData = () => {
|
|||
|
|
var orgId = this.props.login ? this.props.login.OrgId : '';
|
|||
|
|
let json = initFilter(orgId);
|
|||
|
|
this.props.dispatch({
|
|||
|
|
type: 'app/getDataByPost',
|
|||
|
|
payload: json,
|
|||
|
|
url: 'BI/BISafeYear/BISafeYearShow',
|
|||
|
|
onComplete: (data) => {
|
|||
|
|
if (data) {
|
|||
|
|
var count1 = 0
|
|||
|
|
var count2 = 0
|
|||
|
|
var count3 = 0
|
|||
|
|
var count4 = 0
|
|||
|
|
var parm7 = ""
|
|||
|
|
var parm8 = ""
|
|||
|
|
|
|||
|
|
var count21 = 0
|
|||
|
|
var count22 = 0
|
|||
|
|
var count23 = 0
|
|||
|
|
var parm27 = ""
|
|||
|
|
|
|||
|
|
//数量赋值
|
|||
|
|
if (data.listSummary != null && data.listSummary.length == 2) {
|
|||
|
|
data.listSummary.forEach((item) => {
|
|||
|
|
if (item.PART == 1) {
|
|||
|
|
count1 = item.Count1
|
|||
|
|
count2 = item.Count2
|
|||
|
|
count3 = item.Count3
|
|||
|
|
count4 = item.Count4
|
|||
|
|
parm7 = item.Parameter7
|
|||
|
|
parm8 = item.Parameter8
|
|||
|
|
} else if (item.PART == 3) {
|
|||
|
|
count21 = item.Count1
|
|||
|
|
count22 = item.Count2
|
|||
|
|
count23 = item.Count3
|
|||
|
|
parm27 = item.Parameter7
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
var year = (new Date()).getFullYear()
|
|||
|
|
if (data.listSafeCheckYear != null && data.listSafeCheckYear.length > 0)
|
|||
|
|
year = data.listSafeCheckYear[0].YEAR
|
|||
|
|
var companyName = (data.NAME == undefined || data.NAME == null) ? "公司级" : data.NAME
|
|||
|
|
this.setState({
|
|||
|
|
data: {
|
|||
|
|
count1: count1,
|
|||
|
|
count2: count2,
|
|||
|
|
count3: count3,
|
|||
|
|
count4: count4,
|
|||
|
|
parm7: parm7,
|
|||
|
|
parm8: parm8,
|
|||
|
|
|
|||
|
|
count21: count21,
|
|||
|
|
count22: count22,
|
|||
|
|
count23: count23,
|
|||
|
|
parm27: parm27,
|
|||
|
|
|
|||
|
|
listSafeCheckYear: data.listSafeCheckYear,
|
|||
|
|
listCheckTypeYear: data.listCheckTypeYear,
|
|||
|
|
year: year,
|
|||
|
|
company: companyName
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
ChartBarShow_Vertical(echarts, 'divRisk', data.listCheckTypeYear, '安全检查隐患整改统计图（近12个月）')
|
|||
|
|
|
|||
|
|
var dataXAxis = []
|
|||
|
|
var dataSeries = []
|
|||
|
|
if (data.listCheckTypeYear != null && data.listCheckTypeYear != undefined && data.listCheckTypeYear.length > 0) {
|
|||
|
|
data.listCheckTypeYear.forEach((item) => {
|
|||
|
|
dataXAxis.push(item.YEAR + "-" + item.MONTH)
|
|||
|
|
dataSeries.push(item.FINISHPERCENT)
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
LineShow(echarts, 'divRiskPercent', '安全检查隐患整改率（近12个月）', dataXAxis, dataSeries)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 搜索
|
|||
|
|
handleSearch = (item) => {
|
|||
|
|
this.getBaseInfoData(1, item, null);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
closeModal = () => {
|
|||
|
|
this.setState({
|
|||
|
|
searchVisible: false,
|
|||
|
|
searchTodayVisible: false,
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
// ChartBarShow_Vertical(echarts, divId, data, title) {
|
|||
|
|
// var element = document.getElementById(divId)
|
|||
|
|
// if (element != undefined && data != null && data.length > 0) {
|
|||
|
|
// var myChart = echarts.init(element);
|
|||
|
|
// var series = []
|
|||
|
|
// var xAxisData = []
|
|||
|
|
// var yAxisData1 = []
|
|||
|
|
// var yAxisData2 = []
|
|||
|
|
// var yAxisData3 = []
|
|||
|
|
|
|||
|
|
// data.forEach((item) => {
|
|||
|
|
// xAxisData.push(item.YEAR + "-" + item.MONTH)
|
|||
|
|
// yAxisData1.push(item.INTTIMECOUNT)
|
|||
|
|
// yAxisData2.push(item.OUTTIMECOUNT)
|
|||
|
|
// yAxisData3.push(item.NOTFINISHCOUN)
|
|||
|
|
// })
|
|||
|
|
|
|||
|
|
// var option = {
|
|||
|
|
// title: {
|
|||
|
|
// text: title,
|
|||
|
|
// left: 'center'
|
|||
|
|
// },
|
|||
|
|
// tooltip: {
|
|||
|
|
// trigger: 'axis',
|
|||
|
|
// axisPointer: {
|
|||
|
|
// type: 'shadow'
|
|||
|
|
// }
|
|||
|
|
// },
|
|||
|
|
// legend: {
|
|||
|
|
// bottom: '0px'
|
|||
|
|
// },
|
|||
|
|
// grid: {
|
|||
|
|
// left: '3%',
|
|||
|
|
// right: '4%',
|
|||
|
|
// bottom: '10%',
|
|||
|
|
// containLabel: true
|
|||
|
|
// },
|
|||
|
|
// xAxis: {
|
|||
|
|
// type: 'category',
|
|||
|
|
// data: xAxisData
|
|||
|
|
// },
|
|||
|
|
// yAxis: {
|
|||
|
|
// type: 'value'
|
|||
|
|
// },
|
|||
|
|
// series: [
|
|||
|
|
// {
|
|||
|
|
// name: '按期整改',
|
|||
|
|
// type: 'bar',
|
|||
|
|
// stack: 'total',
|
|||
|
|
// label: {
|
|||
|
|
// show: true
|
|||
|
|
// },
|
|||
|
|
// emphasis: {
|
|||
|
|
// focus: 'series'
|
|||
|
|
// },
|
|||
|
|
// data: yAxisData1
|
|||
|
|
// },
|
|||
|
|
// {
|
|||
|
|
// name: '延期整改',
|
|||
|
|
// type: 'bar',
|
|||
|
|
// stack: 'total',
|
|||
|
|
// label: {
|
|||
|
|
// show: true
|
|||
|
|
// },
|
|||
|
|
// emphasis: {
|
|||
|
|
// focus: 'series'
|
|||
|
|
// },
|
|||
|
|
// data: yAxisData2
|
|||
|
|
// },
|
|||
|
|
// {
|
|||
|
|
// name: '未完成',
|
|||
|
|
// type: 'bar',
|
|||
|
|
// stack: 'total',
|
|||
|
|
// label: {
|
|||
|
|
// show: true
|
|||
|
|
// },
|
|||
|
|
// emphasis: {
|
|||
|
|
// focus: 'series'
|
|||
|
|
// },
|
|||
|
|
// data: yAxisData3
|
|||
|
|
// }
|
|||
|
|
// ]
|
|||
|
|
// };
|
|||
|
|
// // 使用刚指定的配置项和数据显示图表。
|
|||
|
|
// myChart.setOption(option);
|
|||
|
|
// }
|
|||
|
|
// }
|
|||
|
|
|
|||
|
|
// LineShow(echarts, divId, title, dataXAxis, dataSeries) {
|
|||
|
|
|
|||
|
|
// var chartDom = document.getElementById(divId);
|
|||
|
|
// if (chartDom != null && chartDom != undefined) {
|
|||
|
|
// var myChart = echarts.init(chartDom);
|
|||
|
|
// var option;
|
|||
|
|
// option = {
|
|||
|
|
// title: {
|
|||
|
|
// text: title,
|
|||
|
|
// left: 'center'
|
|||
|
|
// },
|
|||
|
|
// label: {
|
|||
|
|
// show: true,
|
|||
|
|
// position: 'top'
|
|||
|
|
// },
|
|||
|
|
// xAxis: {
|
|||
|
|
// type: 'category',
|
|||
|
|
// data: dataXAxis
|
|||
|
|
// },
|
|||
|
|
// yAxis: {
|
|||
|
|
// type: 'value'
|
|||
|
|
// },
|
|||
|
|
// series: [
|
|||
|
|
// {
|
|||
|
|
// data: dataSeries,
|
|||
|
|
// type: 'line'
|
|||
|
|
// }
|
|||
|
|
// ]
|
|||
|
|
// };
|
|||
|
|
|
|||
|
|
// option && myChart.setOption(option);
|
|||
|
|
// }
|
|||
|
|
// }
|
|||
|
|
|
|||
|
|
render() {
|
|||
|
|
const { data } = this.state;
|
|||
|
|
return <div>
|
|||
|
|
<div className={styles.routeHome}>
|
|||
|
|
<h1 className={styles.showPrintHead}> {data.company} <a href='#' style={{ fontWeight: '600', color: 'black' }}>{data.year}年度</a>安全检查情况综合统计分析</h1> {/* {this.props?.login?.currActivatedMenu?.MENU_FORM_PARAMS == "30" ? "矿山部" : "选矿部"} */}
|
|||
|
|
{/* <h3 style={{ textAlign: 'center' }}>({data.titleDate})</h3> */}
|
|||
|
|
<div style={{ width: '100%', height: '80px' }}>
|
|||
|
|
<ul className={styles.menuPie} >
|
|||
|
|
<li>计划检查数<br />{data.count1}</li>
|
|||
|
|
<li>按时已办<br />{data.count2}</li>
|
|||
|
|
<li>超时已办<br />{data.count3}</li>
|
|||
|
|
<li>未完成数<br /><a href='#' style={{ color: 'red' }}>{data.count4}</a></li>
|
|||
|
|
<li>完成率<br /><a href='#' style={{ color: 'red' }}>{data.parm7}</a></li>
|
|||
|
|
<li>及时完成率<br /><a href='#' style={{ color: 'red' }}>{data.parm8}</a></li>
|
|||
|
|
</ul>
|
|||
|
|
</div>
|
|||
|
|
<hr />
|
|||
|
|
{/* 表一 */}
|
|||
|
|
<div>
|
|||
|
|
<div style={{ float: 'left' }}>
|
|||
|
|
{
|
|||
|
|
data?.listSafeCheckYear ? (
|
|||
|
|
<ul className={styles.menuPie2} >
|
|||
|
|
{
|
|||
|
|
data.listSafeCheckYear.map((item) => {
|
|||
|
|
if (item.NAME != '合计') {
|
|||
|
|
return <li>
|
|||
|
|
{item.NAME} <br /> {item.COUNTTOTAL}
|
|||
|
|
</li>
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
</ul>
|
|||
|
|
) : (
|
|||
|
|
<ul className={styles.menuPie2} >
|
|||
|
|
<li>公司级</li>
|
|||
|
|
<li>部门级</li>
|
|||
|
|
<li>车间级</li>
|
|||
|
|
<li>班组级</li>
|
|||
|
|
</ul>
|
|||
|
|
)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
<div style={{ float: 'left' }}>
|
|||
|
|
<table className={styles.tableRow}>
|
|||
|
|
<tbody>
|
|||
|
|
<tr>
|
|||
|
|
<th>序号</th>
|
|||
|
|
<th>检查层级</th>
|
|||
|
|
<th>1月</th>
|
|||
|
|
<th>2月</th>
|
|||
|
|
<th>3月</th>
|
|||
|
|
<th>4月</th>
|
|||
|
|
<th>5月</th>
|
|||
|
|
<th>6月</th>
|
|||
|
|
<th>7月</th>
|
|||
|
|
<th>8月</th>
|
|||
|
|
<th>9月</th>
|
|||
|
|
<th>10月</th>
|
|||
|
|
<th>11月</th>
|
|||
|
|
<th>12月</th>
|
|||
|
|
<th>合计</th>
|
|||
|
|
</tr>
|
|||
|
|
{
|
|||
|
|
data?.listSafeCheckYear ? (data.listSafeCheckYear.map((item, i) => {
|
|||
|
|
if (item.NAME == '合计') {
|
|||
|
|
return <tr>
|
|||
|
|
<td colSpan={2}>{item.NAME}</td>
|
|||
|
|
<td>{item.COUNTJANUARY == 0 ? '' : item.COUNTJANUARY}</td>
|
|||
|
|
<td>{item.COUNTFEBRUARY == 0 ? '' : item.COUNTFEBRUARY}</td>
|
|||
|
|
<td>{item.COUNTMARCH == 0 ? '' : item.COUNTMARCH}</td>
|
|||
|
|
<td>{item.COUNTAPRIL == 0 ? '' : item.COUNTAPRIL}</td>
|
|||
|
|
<td>{item.COUNTMAY == 0 ? '' : item.COUNTMAY}</td>
|
|||
|
|
<td>{item.COUNTJUNE == 0 ? '' : item.COUNTJUNE}</td>
|
|||
|
|
<td>{item.COUNTJULY == 0 ? '' : item.COUNTJULY}</td>
|
|||
|
|
<td>{item.COUNTAUGUST == 0 ? '' : item.COUNTAUGUST}</td>
|
|||
|
|
<td>{item.COUNTSEPTEMBER == 0 ? '' : item.COUNTSEPTEMBER}</td>
|
|||
|
|
<td>{item.COUNTOCTOBER == 0 ? '' : item.COUNTOCTOBER}</td>
|
|||
|
|
<td>{item.COUNTNOVEMBER == 0 ? '' : item.COUNTNOVEMBER}</td>
|
|||
|
|
<td>{item.COUNTDECEMBER == 0 ? '' : item.COUNTDECEMBER}</td>
|
|||
|
|
<td>{item.COUNTTOTAL == 0 ? '' : item.COUNTTOTAL}</td>
|
|||
|
|
</tr>
|
|||
|
|
} else {
|
|||
|
|
return <tr>
|
|||
|
|
<td>{item.ROW_NO + 1}</td>
|
|||
|
|
<td>{item.NAME}</td>
|
|||
|
|
<td>{item.COUNTJANUARY}</td>
|
|||
|
|
<td>{item.COUNTFEBRUARY}</td>
|
|||
|
|
<td>{item.COUNTMARCH}</td>
|
|||
|
|
<td>{item.COUNTAPRIL}</td>
|
|||
|
|
<td>{item.COUNTMAY}</td>
|
|||
|
|
<td>{item.COUNTJUNE}</td>
|
|||
|
|
<td>{item.COUNTJULY}</td>
|
|||
|
|
<td>{item.COUNTAUGUST}</td>
|
|||
|
|
<td>{item.COUNTSEPTEMBER}</td>
|
|||
|
|
<td>{item.COUNTOCTOBER}</td>
|
|||
|
|
<td>{item.COUNTNOVEMBER}</td>
|
|||
|
|
<td>{item.COUNTDECEMBER}</td>
|
|||
|
|
<td>{item.COUNTTOTAL}</td>
|
|||
|
|
</tr>
|
|||
|
|
}
|
|||
|
|
})) : (
|
|||
|
|
<tr>
|
|||
|
|
<td colSpan={15}>数据加载中...</td>
|
|||
|
|
</tr>
|
|||
|
|
)
|
|||
|
|
}
|
|||
|
|
</tbody>
|
|||
|
|
</table>
|
|||
|
|
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
{/* 表一 */}
|
|||
|
|
|
|||
|
|
<div >
|
|||
|
|
<div style={{ width: '100%', height: '450px', float: 'left', marginTop: '15px' }}> {/* */}
|
|||
|
|
<div style={{ height: '2px', width: '100%', border: '1px dashed rgba(0, 0, 0, 0.65)' }} ></div>
|
|||
|
|
|
|||
|
|
<div style={{ float: 'left', width: '150px' }}>
|
|||
|
|
<ul className={styles.menuPie2} style={{ marginTop: '80px' }} >
|
|||
|
|
<li>隐患数<br />{data.count21}</li>
|
|||
|
|
<li>延期整改数<br />{data.count22}</li>
|
|||
|
|
<li>按期整改数<br />{data.count23}</li>
|
|||
|
|
<li>整改率<br />{data.parm27}</li>
|
|||
|
|
</ul>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div id='divRisk' style={{ width: '40%', height: '430px', float: 'left', marginTop: '20px' }}>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div id='divRiskPercent' style={{ width: '40%', height: '430px', float: 'left', marginTop: '20px' }}>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div >
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
export default connect(({ login, app }) => ({ login, app }))(BI051BSCompanyYear)
|