357 lines
12 KiB
JavaScript
357 lines
12 KiB
JavaScript
import React, { useState, useEffect, useRef, Component } from 'react'
|
|
import { connect } from 'dva'
|
|
import { initFilter, addRuleAndGroups, guid, extendInclude, extendRule, extendOrder, extend } from "../../../utils/common"
|
|
import { Table, Row, Col, Button, Select,DatePicker ,Form,Spin,message,Modal} from 'antd';
|
|
import echarts from 'echarts';
|
|
import moment from 'moment'
|
|
import FormPage from '../../../components/FormPage'
|
|
import { IFComponent } from '@woowalker/feui';
|
|
import DropDownPagination from '../../common/DropDownPaginationEx'
|
|
import XLSX from 'xlsx';
|
|
const { Option } = Select;
|
|
class BI030FormRunAnalysis extends React.Component {
|
|
constructor(props) {
|
|
super(props);
|
|
this.state = {
|
|
startTime:moment(this.getDate(), 'YYYY-MM-DD 00:00:00'),//moment(new Date()).add(-1, "month").format('YYYY-MM-DD 00:00:00'),
|
|
endTime:moment(this.getEndDate(), 'YYYY-MM-DD 23:59:59'),
|
|
mouldSelect:'',
|
|
visible:false,
|
|
pagination: {},
|
|
tmpData:[],
|
|
departData:[],
|
|
retData:[],
|
|
columns:[
|
|
{
|
|
width: "100px",
|
|
title: '组织',
|
|
dataIndex: 'MOUDLE_NAME',
|
|
key: 'MOUDLE_NAME',
|
|
},
|
|
{
|
|
width: "80px",
|
|
title: '总任务数',
|
|
dataIndex: 'TOTAL_QTY',
|
|
key: 'TOTAL_QTY',
|
|
render: (text, record) => (
|
|
<span>
|
|
<a onClick={() => this.showEditModal(record,'')}>{record.TOTAL_QTY}</a>
|
|
</span>
|
|
),
|
|
},
|
|
{
|
|
width: "80px",
|
|
title: '正常已办',
|
|
dataIndex: 'FINISH_QTY',
|
|
key: 'FINISH_QTY',
|
|
render: (text, record) => (
|
|
<span>
|
|
<a onClick={() => this.showEditModal(record,1)}>{record.FINISH_QTY}</a>
|
|
</span>
|
|
),
|
|
},
|
|
{
|
|
width: "80px",
|
|
title: '超时已办',
|
|
dataIndex: 'OVER_FINISH_QTY',
|
|
key: 'OVER_FINISH_QTY',
|
|
render: (text, record) => (
|
|
<span>
|
|
<a onClick={() => this.showEditModal(record,2)}>{record.OVER_FINISH_QTY}</a>
|
|
</span>
|
|
),
|
|
},
|
|
{
|
|
width: "80px",
|
|
title: '进行中',
|
|
dataIndex: 'UNFINISH_QTY',
|
|
key: 'UNFINISH_QTY',
|
|
render: (text, record) => (
|
|
<span>
|
|
<a onClick={() => this.showEditModal(record,0)}>{record.UNFINISH_QTY}</a>
|
|
</span>
|
|
),
|
|
},
|
|
{
|
|
width: "80px",
|
|
title: '超期未完成',
|
|
dataIndex: 'OVER_UNFINISH_QTY',
|
|
key: 'OVER_UNFINISH_QTY',
|
|
render: (text, record) => (
|
|
<span>
|
|
<a onClick={() => this.showEditModal(record,4)}>{record.OVER_UNFINISH_QTY}</a>
|
|
</span>
|
|
),
|
|
},
|
|
{
|
|
width: "80px",
|
|
title: '完成率',
|
|
dataIndex: 'FINISH_RATE',
|
|
key: 'FINISH_RATE',
|
|
},
|
|
{
|
|
width: "80px",
|
|
title: '及时完成率',
|
|
dataIndex: 'NORMAL_FINISH_RATE',
|
|
key: 'NORMAL_FINISH_RATE',
|
|
},
|
|
// {
|
|
// width: "100px",
|
|
// title: '质量分析(班前会)',
|
|
// dataIndex: 'REMARK',
|
|
// key: 'REMARK',
|
|
// }
|
|
]
|
|
};
|
|
};
|
|
handleCancel = () => { // 退出弹窗
|
|
let newtmpData = { ...this.state.tmpData }
|
|
newtmpData["data"]= '';
|
|
newtmpData.formCode = '';
|
|
this.setState({
|
|
visible:false,
|
|
tmpData: [],//newtmpData
|
|
})
|
|
}
|
|
showEditModal = (record,temp) => {
|
|
|
|
const newtmpData = {
|
|
data: {
|
|
MOUDLE_NAME: record.MOUDLE_NAME,
|
|
FORM_NAME: temp,
|
|
startTime:moment(this.state.startTime).format('YYYY-MM-DD HH:mm:ss'),
|
|
endTime:moment(this.state.endTime).format('YYYY-MM-DD HH:mm:ss'), onCancel: this.handleCancel, noticeTitle: "任务明细",
|
|
homeReload: true
|
|
},
|
|
formCode: 'PF141',
|
|
}
|
|
this.setState({
|
|
noticeTitle: "任务明细",
|
|
tmpData: newtmpData,
|
|
currActivatedMenu: ''
|
|
}, () => this.setState({
|
|
visible: true
|
|
}));
|
|
}
|
|
|
|
componentDidMount() {
|
|
this.getBaseInfoData();
|
|
};
|
|
//获取数据
|
|
getBaseInfoData = () => {
|
|
let retDataTemp=[]
|
|
const{retData,startTime,endTime}=this.state
|
|
let time=startTime
|
|
if(startTime === null)
|
|
{
|
|
message.error('请选择开始时间');
|
|
}
|
|
let time2=endTime
|
|
if(endTime === null)
|
|
{
|
|
message.error('请选择结束时间');
|
|
}
|
|
|
|
{
|
|
time=moment(startTime).format('YYYY-MM-DD HH:mm:ss')
|
|
time2=moment(endTime).format('YYYY-MM-DD HH:mm:ss')
|
|
const json = initFilter(this.props.login.OrgId,this.state.mouldSelect,'','','',time,time2,this.state.mouldSelect)
|
|
//extendOrder(json, "NUM", 0);
|
|
this.props.dispatch({
|
|
type: 'app/getDataByPost',
|
|
url: 'BI/BIStatiscialAnalysisController/GetFormRunDay',//BI/FormRunAnalysis/OrderEntities
|
|
payload: json,
|
|
onlyData: false,
|
|
onComplete: (ret) => {
|
|
if(ret && ret.Data)
|
|
{
|
|
|
|
this.setState({retData :ret.Data})
|
|
}
|
|
}
|
|
})
|
|
}
|
|
|
|
};
|
|
startChange=(value)=>{
|
|
this.setState({
|
|
startTime:value
|
|
})
|
|
};
|
|
endChange=(value)=>{
|
|
this.setState({
|
|
endTime:value
|
|
})
|
|
};
|
|
handleChange=(value)=>{
|
|
this.setState({
|
|
mouldSelect: value
|
|
})
|
|
}
|
|
onSelectDepartment=(departData,record)=>{
|
|
if (departData && departData.data && departData.data.length > 0) {
|
|
this.setState({
|
|
departData: {
|
|
...this.state.departData,
|
|
// DEPARTMENT_ID: departData.data[0],
|
|
Nav_Department: { NAME: departData.record.NAME }
|
|
},
|
|
DEPARTMENT_ID: departData.data[0],
|
|
})
|
|
}
|
|
else {
|
|
this.setState({
|
|
departData: {
|
|
...this.state.departData,
|
|
Nav_Department: { NAME: null },
|
|
},
|
|
DEPARTMENT_ID: null,
|
|
})
|
|
};
|
|
}
|
|
getDate=()=>{
|
|
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, "day").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).add(-1, "day").add(23,'hour').add(59,'m').add(59,'s')//format('YYYY-MM-DD 23:59:59')
|
|
return pastDate;
|
|
}
|
|
|
|
onTableBtnExport() {
|
|
console.log(this.state.retData)
|
|
if (this.state.retData.length == 0) {
|
|
message.warning("没有数据无需导出!");
|
|
return;
|
|
}
|
|
//excel的表头
|
|
const tHeader = ["组织","总任务数","正常已办","超时已办","未完成","完成率","及时完成率"];
|
|
// 字段和table表格中对应
|
|
const fitlerVal = ["MOUDLE_NAME","TOTAL_QTY","FINISH_QTY","OVER_FINISH_QTY","UNFINISH_QTY","FINISH_RATE","NORMAL_FINISH_RATE"];
|
|
const res = this.state.retData.map((v) => fitlerVal.map((j) => v[j]));
|
|
// const jsonWorkSheet = XLSX.utils.json_to_sheet(tHeader,res,"矿山安全生产标准化系统运行情况报表.xlsx");
|
|
const jsonWorkSheet = XLSX.utils.json_to_sheet(res,tHeader);
|
|
jsonWorkSheet.A1.v='组织';
|
|
jsonWorkSheet.B1.v='总任务数';
|
|
jsonWorkSheet.C1.v='正常已办';
|
|
jsonWorkSheet.D1.v='超时已办';
|
|
jsonWorkSheet.E1.v='未完成';
|
|
jsonWorkSheet.F1.v='完成率';
|
|
jsonWorkSheet.G1.v='及时完成率';
|
|
// jsonWorkSheet.H1.v='质量分析(班前会)';
|
|
const sheetName = "矿山安全生产标准化系统运行情况报表";
|
|
const workBook = {
|
|
SheetNames: [sheetName],
|
|
Sheets: {
|
|
[sheetName]: jsonWorkSheet,
|
|
}
|
|
};
|
|
// const workBook = XLSX.utils.table_to_book("矿山安全生产标准化系统运行情况报表",jsonWorkSheet);
|
|
return XLSX.writeFile(workBook, "矿山安全生产标准化系统运行情况报表.xlsx");
|
|
}
|
|
|
|
render() {
|
|
const formItemLayout = {
|
|
labelCol: { span: 6 },
|
|
wrapperCol: { span: 18 },
|
|
}
|
|
const {loading} = this.props;
|
|
|
|
return (
|
|
<div>
|
|
<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>
|
|
<Spin spinning={loading.global}>
|
|
<h1 style={{ textAlign: "center" }}>矿山安全生产标准化系统运行情况报表</h1>
|
|
<Row style={{width:"1250px",margin:"auto"}}>
|
|
<Col span={5}>
|
|
<Form.Item
|
|
label={'组织层级：'}
|
|
{...formItemLayout}
|
|
>
|
|
<Select
|
|
// defaultValue="风险管理"
|
|
style={{width:'180px'}}
|
|
onChange={this.handleChange}
|
|
>
|
|
<Option value="2">班组级</Option>
|
|
<Option value="1">车间级</Option>
|
|
<Option value="0">部门级</Option>
|
|
<Option value="3">公司级</Option>
|
|
</Select>
|
|
</Form.Item>
|
|
</Col>
|
|
<Col span={5} style={{ marginLeft: "10px" }}>
|
|
<Form.Item
|
|
label={'开始时间：'}
|
|
{...formItemLayout}
|
|
>
|
|
<DatePicker showTime
|
|
// defaultValue={moment(this.state.startTime, 'YYYY-MM-DD 00:00:00')}
|
|
value={this.state.startTime}
|
|
format="YYYY-MM-DD HH:mm:ss" onChange={this.startChange}/>
|
|
</Form.Item>
|
|
|
|
</Col>
|
|
|
|
<Col span={5} style={{ marginLeft: "10px" }}>
|
|
<Form.Item
|
|
label={'结束时间：'}
|
|
{...formItemLayout}
|
|
>
|
|
<DatePicker showTime
|
|
// defaultValue={moment(this.state.endTime, 'YYYY-MM-DD 23:59:59')}
|
|
value={this.state.endTime}
|
|
format="YYYY-MM-DD HH:mm:ss" onChange={this.endChange}/>
|
|
</Form.Item>
|
|
</Col>
|
|
<Col span={1} style={{ marginLeft: "20px" }}><Button type='primary' onClick={() => this.getBaseInfoData()}>查询</Button></Col>
|
|
<Col span={1} style={{ marginLeft: "20px" }}><Button icon="export" onClick={() => this.onTableBtnExport()}>导出</Button></Col>
|
|
</Row>
|
|
<Row style={{ marginTop: "14px" }}>
|
|
<div id="exportToExcel">
|
|
<Table style={{ width:"1250px",margin:"auto",alignContent:"center",backgroundColor:"white"}}
|
|
dataSource={this.state.retData}
|
|
columns={this.state.columns}
|
|
pagination={false}
|
|
bordered
|
|
loading={this.state.showLoading}
|
|
size="small"
|
|
rowKey="2"
|
|
/>
|
|
</div>
|
|
|
|
</Row>
|
|
{/* <Row>
|
|
<h5 style={{ textAlign: "center" }}>数据统计截止到{this.state.modifyTime}</h5>
|
|
</Row> */}
|
|
</Spin>
|
|
</div>
|
|
)
|
|
}
|
|
}
|
|
export default connect(({ login, app,loading }) => ({ login, app,loading }))(BI030FormRunAnalysis)
|