2031 lines
65 KiB
JavaScript
2031 lines
65 KiB
JavaScript
import React, { useState, useEffect, useRef, Component } from 'react';
|
||
import { connect } from 'dva';
|
||
import storage from '../utils/storage';
|
||
import IconFont from '../utils/iconFont';
|
||
import { initFilter, addRuleAndGroups, guid, extendInclude, extendRule, extend, extendOrder } from '../utils/common';
|
||
import './home.less';
|
||
// 组件库
|
||
import {
|
||
Table,
|
||
Modal,
|
||
Row,
|
||
Col,
|
||
Icon,
|
||
Button,
|
||
Input,
|
||
DatePicker,
|
||
Form,
|
||
Select,
|
||
notification,
|
||
Popconfirm,
|
||
Divider,
|
||
Space,
|
||
Descriptions,
|
||
message,
|
||
Carousel,
|
||
} from 'antd';
|
||
import FormPage from '../components/FormPage';
|
||
import backlog from '../assets/home/backlog.png';
|
||
import backlog_i from '../assets/home/backlog_icon.png';
|
||
import styles from './dashboard.css';
|
||
import 'slick-carousel/slick/slick.css';
|
||
import 'slick-carousel/slick/slick-theme.css';
|
||
import moment from 'moment';
|
||
import flow from '../assets/home/flow.png';
|
||
import flow_i from '../assets/home/remind_icon.png';
|
||
import finished from '../assets/home/finished.png';
|
||
import finished_i from '../assets/home/finished_icon.png';
|
||
import remind from '../assets/home/remind.png';
|
||
import remind_i from '../assets/home/red-err.png';
|
||
import echarts from 'echarts';
|
||
import config from '../config';
|
||
import Toggle from './toggle';
|
||
import RisiLevel from '../components/MainPage/RiskLevel';
|
||
import ClassCompletion from '../components/MainPage/ClassCompletion';
|
||
import WorkTicket from '../components/MainPage/WorkTicket';
|
||
import MonthDanger from '../components/MainPage/MonthDanger';
|
||
import SafeCheck from '../components/MainPage/SafeCheck';
|
||
|
||
const Option = Select.Option;
|
||
const RangePicker = DatePicker.RangePicker;
|
||
|
||
const formItemLayout = {
|
||
labelCol: { span: 6 },
|
||
wrapperCol: { span: 14 },
|
||
};
|
||
|
||
const openNotification = (placement) => {
|
||
notification.info({
|
||
duration: null,
|
||
top: 43,
|
||
message: `签名照上传提示：`,
|
||
description: '您还没上传自己的签名照片，请在我的资料中尽快上传您的签名照！',
|
||
placement,
|
||
});
|
||
};
|
||
|
||
const openNotificationMobile = (placement) => {
|
||
notification.info({
|
||
duration: 20,
|
||
message: `友情提示：`,
|
||
description: '您当前用的是手机在访问，为有更好体验，建议使用电脑访问！',
|
||
placement,
|
||
});
|
||
};
|
||
const contentStyle = {
|
||
height: '400px',
|
||
lineHeight: '400px',
|
||
textAlign: 'center',
|
||
background: '#364d79',
|
||
};
|
||
|
||
class Home extends React.Component {
|
||
_isMounted = false; // 标记组件是否已挂载
|
||
|
||
constructor(props) {
|
||
super(props);
|
||
this.state = {
|
||
isDoubleClick: false,
|
||
isNaN: false,
|
||
scoreVisible: false,
|
||
scoreTotalVisible: false,
|
||
scoreNaVisible: false,
|
||
standardScore: [],
|
||
standardScoreTemp: [],
|
||
standardScoreNaN: [],
|
||
visible: false,
|
||
safetySloganOne: '',
|
||
animationDuration: 20,
|
||
sliderColor: '#de4e58',
|
||
sliderSize: '24px',
|
||
safetySloganTwo: '',
|
||
noticeTitle: '',
|
||
tmpData: {},
|
||
tableKey: '1',
|
||
pagination: {},
|
||
retData: [],
|
||
chartData: [],
|
||
displayStr: '',
|
||
displayNum: 16,
|
||
columnData: [],
|
||
columnFields: [],
|
||
delayData: [],
|
||
Workbench: {
|
||
StockDetail: [],
|
||
ApprovalCount: 0,
|
||
InComingCount: 0,
|
||
OutingCount: 0,
|
||
ProductingCount: 0,
|
||
}, //工作台模型
|
||
showLoading: false, //待办事项数据刷新提示
|
||
searchVisible: false, //弹窗显示
|
||
searchTodayVisible: false, //弹窗显示
|
||
columns: [],
|
||
searchColumns: [],
|
||
scoreColumns: [],
|
||
scoreTotalColumns: [],
|
||
tableData: [
|
||
{
|
||
//工作台四个展示模块
|
||
key: '1',
|
||
bgImg: backlog,
|
||
title: window.navigator.userAgent.indexOf('Windows') < 1 ? '待办' : '待办事项',
|
||
total: '0',
|
||
iconImg: backlog_i,
|
||
iconDisplay: 'block',
|
||
},
|
||
{
|
||
key: '4',
|
||
bgImg: remind,
|
||
title: window.navigator.userAgent.indexOf('Windows') < 1 ? '超时' : '待办超时',
|
||
total: '0',
|
||
iconImg: remind_i,
|
||
iconDisplay: 'none',
|
||
},
|
||
{
|
||
key: '2',
|
||
bgImg: flow,
|
||
title: window.navigator.userAgent.indexOf('Windows') < 1 ? '已办' : '已办事项',
|
||
total: '0',
|
||
iconImg: flow_i,
|
||
iconDisplay: 'none',
|
||
},
|
||
{
|
||
key: '3',
|
||
bgImg: finished,
|
||
title: '今日提醒',
|
||
total: '0',
|
||
iconImg: finished_i,
|
||
iconDisplay: 'none',
|
||
},
|
||
],
|
||
visibleTitle: '', //点击title
|
||
isSearch: false, // 是否搜索
|
||
querySearch: {}, //搜索集合
|
||
visibleStartTime: [],
|
||
visibleEndTime: [],
|
||
currentpageIndex: '1',
|
||
departmentName: '',
|
||
stardardScoreQty: '0',
|
||
riskLevelPage: [],
|
||
departmentCompletionData: [],
|
||
workTicketData: [],
|
||
// 用户层级id
|
||
deparmentID: '',
|
||
deparmentType: 0,
|
||
dangerList: {},
|
||
//弹窗显示参数 wyw
|
||
detailForm: {
|
||
isShow: false,
|
||
formCode: '',
|
||
title: '',
|
||
},
|
||
taskSelects: [],
|
||
mineType: localStorage.getItem('currentMineType') === '20' ? '10' : localStorage.getItem('currentMineType'),
|
||
};
|
||
// this.enums = [];
|
||
this.reportType = '';
|
||
this.hiddenTop = 10;
|
||
this.jobTop = 10;
|
||
this.teamTop = 8;
|
||
this.tempTime = moment(new Date()).add(-3, 'month').format('YYYY-MM-DD');
|
||
this.resizeRef = React.createRef();
|
||
}
|
||
|
||
componentDidMount() {
|
||
this._isMounted = true; // 组件挂载时设为true
|
||
const currentPath = this.props.location.pathname;
|
||
// if (localStorage.getItem("webOrgId") == '00300000-0000-0000-0000-000000000000' && currentPath !== '/grouphome') {
|
||
// this.props.history.replace('/grouphome')
|
||
// return
|
||
// }
|
||
if (window.navigator.userAgent.indexOf('Windows') < 1) {
|
||
window.location.replace(config.guideH5Host);
|
||
openNotificationMobile('bottomRight');
|
||
return; // 阻止后续代码执行
|
||
//alert('手机');
|
||
}
|
||
this.setState({
|
||
columns: [
|
||
{
|
||
width: '450px',
|
||
title: '任务名称',
|
||
dataIndex: 'NOTICE_TITLE',
|
||
key: 'NOTICE_TITLE',
|
||
render: (text, record) => (
|
||
<span>
|
||
<a
|
||
onClick={() =>
|
||
this.showEditModal(record.SOURCE_DATA_ID, record.SOURCE_FORMCODE, record.ID, record.NOTICE_TITLE)
|
||
}
|
||
>
|
||
{record.NOTICE_TITLE}
|
||
</a>
|
||
</span>
|
||
),
|
||
},
|
||
{
|
||
title: '开始时间',
|
||
dataIndex: 'TASK_STARTDT',
|
||
key: 'TASK_STARTDT',
|
||
},
|
||
{
|
||
title: '结束时间',
|
||
dataIndex: 'TASK_ENDDT',
|
||
key: 'TASK_ENDDT',
|
||
},
|
||
{
|
||
title: '预警状态',
|
||
dataIndex: 'NOTICE_TYPE',
|
||
key: 'NOTICE_TYPE',
|
||
render: (text, record) => this.ShowState(record),
|
||
},
|
||
],
|
||
scoreNoneColumns: [
|
||
{
|
||
width: '80px',
|
||
title: '生产单元',
|
||
dataIndex: 'Nav_ProductionUnit.NAME',
|
||
key: 'Nav_ProductionUnit.NAME',
|
||
},
|
||
{
|
||
width: '80px',
|
||
title: '一级要素',
|
||
dataIndex: 'Nav_Primary.NAME',
|
||
key: 'Nav_Primary.NAME',
|
||
},
|
||
{
|
||
width: '80px',
|
||
title: '二级要素',
|
||
dataIndex: 'Nav_Second.NAME',
|
||
key: 'Nav_Second.NAME',
|
||
},
|
||
{
|
||
width: '50px',
|
||
title: '考评项目',
|
||
dataIndex: 'EVALUATION_ITEM',
|
||
key: 'EVALUATION_ITEM',
|
||
render: (text, record) => (
|
||
<span>{this.props.app.enums?.PEEvaluationItemEnum.enums[record.EVALUATION_ITEM]}</span>
|
||
),
|
||
},
|
||
{
|
||
// width: "450px",
|
||
title: '考评内容',
|
||
dataIndex: 'CONTENTS',
|
||
key: 'CONTENTS',
|
||
},
|
||
{
|
||
width: '50px',
|
||
title: '扣分分值',
|
||
dataIndex: 'NON_STANDARDIZED_SCORE',
|
||
key: 'NON_STANDARDIZED_SCORE',
|
||
},
|
||
{
|
||
width: '400px',
|
||
title: '不符合说明',
|
||
dataIndex: 'NON_CONFORMANCE',
|
||
key: 'NON_CONFORMANCE',
|
||
},
|
||
{
|
||
width: '100px',
|
||
title: '评价方法',
|
||
dataIndex: 'Nav_EvaluationMethod',
|
||
key: 'Nav_EvaluationMethod',
|
||
render: (text, record) => (
|
||
<span>
|
||
{record.Nav_EvaluationMethod &&
|
||
record.Nav_EvaluationMethod?.map((item, i) => {
|
||
return (
|
||
<tr>
|
||
<label> {item.Nav_Method?.NAME}</label>
|
||
</tr>
|
||
);
|
||
})}
|
||
</span>
|
||
),
|
||
},
|
||
],
|
||
scoreColumns: [
|
||
{
|
||
width: '80px',
|
||
title: '生产单元',
|
||
dataIndex: 'Nav_ProductionUnit.NAME',
|
||
key: 'Nav_ProductionUnit.NAME',
|
||
},
|
||
{
|
||
width: '80px',
|
||
title: '一级要素',
|
||
dataIndex: 'Nav_Primary.NAME',
|
||
key: 'Nav_Primary.NAME',
|
||
},
|
||
{
|
||
width: '80px',
|
||
title: '二级要素',
|
||
dataIndex: 'Nav_Second.NAME',
|
||
key: 'Nav_Second.NAME',
|
||
},
|
||
{
|
||
width: '80px',
|
||
title: '三级要素',
|
||
dataIndex: 'Nav_Three.NAME',
|
||
key: 'Nav_Three.NAME',
|
||
},
|
||
{
|
||
width: '50px',
|
||
title: '考评项目',
|
||
dataIndex: 'EVALUATION_ITEM',
|
||
key: 'EVALUATION_ITEM',
|
||
render: (text, record) => (
|
||
<span>{this.props.app.enums?.PEEvaluationItemEnum.enums[record.EVALUATION_ITEM]}</span>
|
||
),
|
||
},
|
||
{
|
||
// width: "500px",
|
||
title: '考评内容',
|
||
dataIndex: 'CONTENTS',
|
||
key: 'CONTENTS',
|
||
},
|
||
{
|
||
width: '100px',
|
||
title: '评分办法',
|
||
dataIndex: 'DESCRIPTION',
|
||
key: 'DESCRIPTION',
|
||
},
|
||
{
|
||
width: '50px',
|
||
title: '标准分',
|
||
dataIndex: 'STANDARDIZED_SCORE',
|
||
key: 'STANDARDIZED_SCORE',
|
||
},
|
||
{
|
||
width: '50px',
|
||
title: '实得分',
|
||
dataIndex: 'RESULT_SCORE',
|
||
key: 'RESULT_SCORE',
|
||
},
|
||
{
|
||
width: '200px',
|
||
title: '不符合说明',
|
||
dataIndex: 'NON_CONFORMANCE',
|
||
key: 'NON_CONFORMANCE',
|
||
},
|
||
,
|
||
{
|
||
width: '80px',
|
||
title: '评价结论',
|
||
dataIndex: 'EVALUATION_RESULT',
|
||
key: 'EVALUATION_RESULT',
|
||
render: (text, record) => (
|
||
<span>{this.props.app.enums?.PEEvaluationResultEnum.enums[record.EVALUATION_RESULT]}</span>
|
||
),
|
||
},
|
||
{
|
||
width: '100px',
|
||
title: '评价方法',
|
||
dataIndex: 'Nav_EvaluationMethod',
|
||
key: 'Nav_EvaluationMethod',
|
||
render: (text, record) => (
|
||
<span>
|
||
{record.Nav_EvaluationMethod &&
|
||
record.Nav_EvaluationMethod?.map((item, i) => {
|
||
return (
|
||
<tr>
|
||
<label> {item.Nav_Method?.NAME}</label>
|
||
</tr>
|
||
);
|
||
})}
|
||
</span>
|
||
),
|
||
},
|
||
],
|
||
scoreTotalColumns: [
|
||
{
|
||
title: '生产单元',
|
||
dataIndex: 'Nav_ProductionUnit.NAME',
|
||
key: 'Nav_ProductionUnit.NAME',
|
||
},
|
||
{
|
||
title: '标准化得分',
|
||
dataIndex: 'NON_STANDARDIZED_SCORE',
|
||
key: 'NON_STANDARDIZED_SCORE',
|
||
},
|
||
{
|
||
title: '操作',
|
||
dataIndex: '',
|
||
key: '',
|
||
render: (text, record) => (
|
||
<span>
|
||
{
|
||
<tr>
|
||
{' '}
|
||
<Button onClick={() => this.showStandardScoreModal()}>全部</Button>
|
||
<Button onClick={() => this.showStandardScoreModal(1)}>不符合项</Button>
|
||
</tr>
|
||
}
|
||
</span>
|
||
),
|
||
},
|
||
],
|
||
});
|
||
this.getTeam();
|
||
this.getHomeTitle();
|
||
//定时器功能，暂时不开启
|
||
this.timerID = setInterval(() => {
|
||
if (this._isMounted) {
|
||
this.getBaseInfoData(1, this.state.tableKey, 5);
|
||
}
|
||
}, 120000);
|
||
this.showModalSign();
|
||
this.getBaseInfoData(1, 1, 5);
|
||
this.setMessageData();
|
||
}
|
||
componentWillUnmount() {
|
||
this._isMounted = false; // 组件卸载时设为false
|
||
if (this.timerID) {
|
||
clearInterval(this.timerID);
|
||
this.timerID = null;
|
||
}
|
||
}
|
||
|
||
showModalSign = () => {
|
||
var userId = storage('lacal').getItem('userid')?.val; //登录后有存储登录信息
|
||
var orgId = storage('lacal').getItem('webOrgId')?.val; //登录后有存储登录信息
|
||
|
||
let json = initFilter(orgId);
|
||
this.props.dispatch({
|
||
type: 'app/getDataByPost',
|
||
payload: json,
|
||
url: 'FM/User/UserSign', //验证是否有签名照
|
||
onComplete: (ret) => {
|
||
//返回查询结果ret
|
||
if (this._isMounted && ret) {
|
||
//判断是否有记录
|
||
openNotification('topRight');
|
||
}
|
||
},
|
||
});
|
||
};
|
||
getHomeTitle = () => {
|
||
var orgId = storage('lacal').getItem('webOrgId')?.val; //登录后有存储登录信息
|
||
let json = initFilter(orgId);
|
||
this.props.dispatch({
|
||
type: 'app/getDataByPost',
|
||
payload: json,
|
||
url: 'PF/HomeTitle/OrderPaged',
|
||
onComplete: (ret) => {
|
||
if (this._isMounted && ret) {
|
||
const safetySlogan = ret[0].TITLE;
|
||
// 计算文本长度（中文按1个字符，英文/数字按0.5个字符计算）
|
||
const charCount = safetySlogan.replace(/[a-zA-Z0-9]/g, 'aa').length;
|
||
|
||
// 设置基础速率：每4个字符需要1秒
|
||
const baseSpeed = 4;
|
||
// 计算动画时间（最低5秒，最高60秒）
|
||
const duration = Math.max(5, Math.min(60, charCount / baseSpeed));
|
||
this.setState({
|
||
safetySloganOne: safetySlogan,
|
||
// safetySloganOne: "1.安全方针：以人为本、关注健康、依法治企、安全发展。 2.安全理念：一切风险皆可控，一切事故皆可防！3.安全方针：以人为本、关注健康、依法治企、安全发展。4.安全方针：以人为本、关注健康、依法治企、安全发展。5.安全方针：以人为本、关注健康、依法治企、安全发展。 6.安全理念：一切风险皆可控，一切事故皆可防！7.安全方针：以人为本、关注健康、依法治企、安全发展。8.安全方针：以人为本、关注健康、依法治企、安全发展。",
|
||
animationDuration: duration,
|
||
sliderColor: ret[0].COCOR,
|
||
sliderSize: ret[0].FONTSIZE,
|
||
});
|
||
}
|
||
},
|
||
});
|
||
};
|
||
|
||
getTeam = () => {
|
||
var userId = storage('lacal').getItem('userid')?.val; //登录后有存储登录信息
|
||
var orgId = storage('lacal').getItem('webOrgId')?.val; //登录后有存储登录信息
|
||
let json = initFilter(orgId);
|
||
extendRule(json, 'ID', 1, userId);
|
||
extendInclude(json, 'Nav_Department');
|
||
this.props.dispatch({
|
||
type: 'app/getDataByPost',
|
||
payload: json,
|
||
url: 'FM/User/Get',
|
||
onComplete: (ret) => {
|
||
if (this._isMounted && ret && ret.Nav_Department) {
|
||
this.setState({
|
||
departmentName: ret.Nav_Department.NAME,
|
||
deparmentType: ret.Nav_Department.DEPARTMENT_TYPE,
|
||
deparmentID: ret.DEPARTMENT_ID,
|
||
});
|
||
this.departmentCompletion();
|
||
this.workTicket(); //工作票完成率前十(统计图)
|
||
this.riskLevel(); //岗位风险等级(饼图)
|
||
this.getStandardScore(ret.MineType); //获取标准化评分
|
||
this.hiddenDanger();
|
||
}
|
||
},
|
||
});
|
||
};
|
||
getStandardScore = (MineType) => {
|
||
//标准化得分
|
||
var orgId = storage('lacal').getItem('webOrgId')?.val; //登录后有存储登录信息
|
||
let json = '';
|
||
if (this.state.mineType) {
|
||
json = initFilter(orgId, this.state.mineType);
|
||
} else {
|
||
json = initFilter(orgId, MineType);
|
||
}
|
||
|
||
this.props.dispatch({
|
||
type: 'app/getDataByPost',
|
||
payload: json,
|
||
url: 'PE/PESafetyEvaluationRecord/HomeGet',
|
||
onComplete: (ret) => {
|
||
if (ret && ret.Nav_Details) {
|
||
this.setState({
|
||
standardScore: ret,
|
||
stardardScoreQty: ((ret.RESULT_TOTAL / ret.STAND_TOTAL) * 100).toFixed(2),
|
||
});
|
||
}
|
||
},
|
||
});
|
||
};
|
||
getEnums = () => {
|
||
this.props.dispatch({
|
||
type: 'app/getDataByGet',
|
||
url: 'PF/Extend/GetAllEnum',
|
||
onComplete: (ret) => {
|
||
if (ret) {
|
||
this.enums = ret;
|
||
}
|
||
},
|
||
});
|
||
};
|
||
//班组作业完成率前八
|
||
departmentCompletion = () => {
|
||
const userInfo = storage('lacal').getItem('webUserInfo').val;
|
||
let json = initFilter(this.props.login.OrgId, this.state.mineType, 'NUM', 'desc');
|
||
this.props.dispatch({
|
||
type: 'app/getDataByPost',
|
||
url: 'BI/BIStatiscialAnalysisController/GetDepartmentCompletionSort',
|
||
payload: json,
|
||
onlyData: false,
|
||
onComplete: (data) => {
|
||
if (data && data.IsSuccessful) {
|
||
if (data.Data && data.Data.length > 0) {
|
||
this.setState({
|
||
departmentCompletionData: data.Data,
|
||
});
|
||
}
|
||
}
|
||
},
|
||
});
|
||
};
|
||
//工作票完成情况统计图
|
||
workTicket = () => {
|
||
const userInfo = storage('lacal').getItem('webUserInfo').val;
|
||
let json = initFilter(this.props.login.OrgId, this.state.mineType, 'NUM', 'desc');
|
||
this.props.dispatch({
|
||
type: 'app/getDataByPost',
|
||
url: 'BI/BIStatiscialAnalysisController/GetJobCompletionSort',
|
||
payload: json,
|
||
onlyData: false,
|
||
onComplete: (data) => {
|
||
if (data && data.IsSuccessful) {
|
||
if (data.Data && data.Data.length > 0) {
|
||
this.setState({
|
||
workTicketData: data.Data,
|
||
});
|
||
}
|
||
}
|
||
},
|
||
});
|
||
};
|
||
// hiddenDanger
|
||
hiddenDanger = () => {
|
||
const userInfo = storage('lacal').getItem('webUserInfo').val;
|
||
let json = initFilter(this.props.login.OrgId, this.state.mineType, 'NUM');
|
||
this.props.dispatch({
|
||
type: 'app/getDataByPost',
|
||
url: 'BI/BIHome/GetHomeInfo',
|
||
payload: json,
|
||
onlyData: false,
|
||
onComplete: (data) => {
|
||
if (data && data.IsSuccessful) {
|
||
this.hiddenTop = data.Data.length;
|
||
this.setState({
|
||
dangerList: data.Data,
|
||
});
|
||
//图标2
|
||
}
|
||
},
|
||
});
|
||
};
|
||
//风险等级占比
|
||
riskLevel = () => {
|
||
const userInfo = storage('lacal').getItem('webUserInfo').val;
|
||
let json = initFilter(this.props.login.OrgId);
|
||
extendOrder(json, 'NUM', 0);
|
||
extendRule(json, 'COLOR', 1, this.state.mineType);
|
||
this.props.dispatch({
|
||
type: 'app/getDataByPost',
|
||
url: 'FM/RiskLevelProportion/OrderPaged',
|
||
payload: json,
|
||
onlyData: false,
|
||
onComplete: (data) => {
|
||
if (data && data.IsSuccessful) {
|
||
if (data.Data && data.Data.length > 0) {
|
||
this.setState({
|
||
riskLevelPage: data.Data,
|
||
});
|
||
}
|
||
}
|
||
},
|
||
});
|
||
};
|
||
//获取数据
|
||
getBaseInfoData = (pagination, key, limit) => {
|
||
const current = pagination ? pagination.current : 1;
|
||
const json = initFilter(this.props.login.OrgId, '', 'CODE', 1, current);
|
||
//extendRule(json, "NOTICE_STATUS", 1, 0);
|
||
const querySearch = this.state.querySearch;
|
||
for (var item in querySearch) {
|
||
if (item == 'searchName') {
|
||
extendRule(json, 'NOTICE_TITLE', 9, querySearch[item]);
|
||
}
|
||
if (item == 'searchCode') {
|
||
extendRule(json, 'CODE', 9, querySearch[item]);
|
||
}
|
||
if (item == 'startTime1') {
|
||
extendRule(json, 'TASK_STARTDT', 6, querySearch[item]);
|
||
}
|
||
if (item == 'startTime2') {
|
||
extendRule(json, 'TASK_STARTDT', 4, querySearch[item]);
|
||
}
|
||
if (item == 'endTime1') {
|
||
extendRule(json, 'TASK_ENDDT', 6, querySearch[item]);
|
||
}
|
||
if (item == 'endTime2') {
|
||
extendRule(json, 'TASK_ENDDT', 4, querySearch[item]);
|
||
}
|
||
if (item == 'searchStatus') {
|
||
extendRule(json, 'NOTICE_STATUS', 1, querySearch[item]);
|
||
}
|
||
}
|
||
json.Limit = limit;
|
||
//json.Limit = 10;
|
||
json.Parameter1 = key; //1待办事项2已办事项3今日新增4待办超时
|
||
|
||
this.props.dispatch({
|
||
type: 'app/getDataByPost',
|
||
url: 'FM/FMNotificationTask/HomeOrderPaged',
|
||
payload: json,
|
||
onlyData: false,
|
||
onComplete: (re) => {
|
||
if (this._isMounted && re && re.IsSuccessful && re.Data.newData) {
|
||
this.state.tableData[0].total = re.Data.todoCount;
|
||
this.state.tableData[1].total = re.Data.timeOverCount;
|
||
this.state.tableData[2].total = re.Data.doneCount;
|
||
this.state.tableData[3].total = re.Data.todayNewCount;
|
||
|
||
if (limit != null || limit != undefined) {
|
||
this.setState({
|
||
retData: re.Data.newData,
|
||
});
|
||
} else {
|
||
var pageInfo = {};
|
||
pageInfo.current = current;
|
||
pageInfo.total = Math.ceil(re.Data.TotalCount, 10);
|
||
this.setState({
|
||
retDataAll: re.Data.newData,
|
||
pagination: pageInfo,
|
||
});
|
||
}
|
||
}
|
||
},
|
||
});
|
||
};
|
||
|
||
clearData = () => {
|
||
let newtmpData = { ...this.state.tmpData };
|
||
if (newtmpData['data'] != null) {
|
||
newtmpData['data'].id = '';
|
||
newtmpData['data'].homeReload = false;
|
||
}
|
||
newtmpData.formCode = '';
|
||
this.setState({
|
||
visible: false,
|
||
tmpData: [], //newtmpData
|
||
});
|
||
};
|
||
clearScoreData = () => {
|
||
this.setState({
|
||
scoreVisible: false,
|
||
// standardScore: [],//newtmpData
|
||
});
|
||
};
|
||
handleCancel = () => {
|
||
// 退出弹窗
|
||
if (this.state.isDoubleClick) {
|
||
this.getBaseInfoData(1, this.state.tableKey, null);
|
||
} else {
|
||
this.getBaseInfoData(1, this.state.tableKey, 5);
|
||
}
|
||
this.clearData();
|
||
};
|
||
closeModal = () => {
|
||
// 退出弹窗
|
||
this.clearData();
|
||
};
|
||
|
||
showEditModal = (dataId, formCode, TaskID, title, taskCode) => {
|
||
// this.props.dispatch({
|
||
// type: "app/getDataByPost",
|
||
// url: "BI/BIController/getVersion",
|
||
// onComplete: (ret) => {
|
||
// if (ret > config.version) {
|
||
// window.localStorage.clear();
|
||
// message.success("清除成功，即将重新加载页面", 2, () => {
|
||
// setTimeout(() => window.location.reload(true), 500);
|
||
// });
|
||
// }
|
||
// },
|
||
// });
|
||
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,
|
||
})
|
||
);
|
||
};
|
||
showTodayModal = (dataId, formCode, TaskID, title, taskCode, taskStartdt, taskStatus) => {
|
||
const newtmpData = {
|
||
data: {
|
||
id: dataId,
|
||
TaskID: TaskID,
|
||
onCancel: this.handleCancel,
|
||
taskCode: taskCode,
|
||
tableKey: this.state.tableKey,
|
||
noticeTitle: title,
|
||
taskStartdt: taskStartdt,
|
||
taskStatus: taskStatus,
|
||
homeReload: true,
|
||
},
|
||
formCode: 'PF135',
|
||
};
|
||
this.setState(
|
||
{
|
||
noticeTitle: '今日提醒',
|
||
taskCode: taskCode,
|
||
tmpData: newtmpData,
|
||
currActivatedMenu: '',
|
||
},
|
||
() =>
|
||
this.setState({
|
||
visible: true,
|
||
})
|
||
);
|
||
};
|
||
|
||
setMessageData = (dataSource) => {
|
||
const data = dataSource ? dataSource : this.props.taskData;
|
||
};
|
||
//点击切换四个统计模块更改列表数据
|
||
totalModuleClick = (item) => {
|
||
const { tableData } = this.state;
|
||
tableData.map((_item, i) => {
|
||
if (_item.key == item.key) {
|
||
if (item.key == '2') {
|
||
this.state.columns = [
|
||
{
|
||
width: '450px',
|
||
title: '任务名称',
|
||
dataIndex: 'NOTICE_TITLE',
|
||
key: 'NOTICE_TITLE',
|
||
render: (text, record) => (
|
||
<span>
|
||
<a
|
||
onClick={() =>
|
||
this.showEditModal(
|
||
record.SOURCE_DATA_ID,
|
||
record.SOURCE_FORMCODE,
|
||
record.ID,
|
||
record.NOTICE_TITLE,
|
||
record.CODE
|
||
)
|
||
}
|
||
>
|
||
{record.NOTICE_TITLE}
|
||
</a>
|
||
</span>
|
||
),
|
||
},
|
||
{
|
||
title: '开始时间',
|
||
dataIndex: 'TASK_STARTDT',
|
||
key: 'TASK_STARTDT',
|
||
},
|
||
{
|
||
title: '结束时间',
|
||
dataIndex: 'TASK_ENDDT',
|
||
key: 'TASK_ENDDT',
|
||
},
|
||
{
|
||
title: '办结时间',
|
||
dataIndex: 'TASK_DT',
|
||
key: 'TASK_DT',
|
||
},
|
||
];
|
||
} else if (item.key == '3') {
|
||
this.state.columns = [
|
||
{
|
||
title: '提醒内容',
|
||
dataIndex: 'NOTICE_TITLE',
|
||
key: 'NOTICE_TITLE',
|
||
render: (text, record) => (
|
||
<span>
|
||
<a
|
||
onClick={() =>
|
||
this.showTodayModal(
|
||
record.SOURCE_DATA_ID,
|
||
record.SOURCE_FORMCODE,
|
||
record.ID,
|
||
record.NOTICE_TITLE,
|
||
record.CODE,
|
||
record.TASK_STARTDT,
|
||
record.NOTICE_STATUS
|
||
)
|
||
}
|
||
>
|
||
{record.NOTICE_TITLE}
|
||
</a>
|
||
</span>
|
||
),
|
||
},
|
||
{
|
||
width: '150px',
|
||
title: '提醒时间',
|
||
dataIndex: 'TASK_STARTDT',
|
||
key: 'TASK_STARTDT',
|
||
},
|
||
{
|
||
width: '150px',
|
||
title: '状态',
|
||
dataIndex: 'NOTICE_STATUS',
|
||
key: 'NOTICE_STATUS',
|
||
render: (text, record) => this.ShowStatus(record),
|
||
},
|
||
];
|
||
} else {
|
||
this.state.columns = [
|
||
{
|
||
width: '450px',
|
||
title: '任务名称',
|
||
dataIndex: 'NOTICE_TITLE',
|
||
key: 'NOTICE_TITLE',
|
||
render: (text, record) => (
|
||
<span>
|
||
<a
|
||
onClick={() =>
|
||
this.showEditModal(
|
||
record.SOURCE_DATA_ID,
|
||
record.SOURCE_FORMCODE,
|
||
record.ID,
|
||
record.NOTICE_TITLE,
|
||
record.CODE
|
||
)
|
||
}
|
||
>
|
||
{record.NOTICE_TITLE}
|
||
</a>
|
||
</span>
|
||
),
|
||
},
|
||
{
|
||
title: '开始时间',
|
||
dataIndex: 'TASK_STARTDT',
|
||
key: 'TASK_STARTDT',
|
||
},
|
||
{
|
||
title: '结束时间',
|
||
dataIndex: 'TASK_ENDDT',
|
||
key: 'TASK_ENDDT',
|
||
},
|
||
{
|
||
title: '预警状态',
|
||
dataIndex: 'NOTICE_TYPE',
|
||
key: 'NOTICE_TYPE',
|
||
render: (text, record) => this.ShowState(record),
|
||
},
|
||
];
|
||
}
|
||
_item.iconDisplay = 'block';
|
||
this.setState({
|
||
tableKey: item.key,
|
||
isDoubleClick: false,
|
||
});
|
||
if (window.navigator.userAgent.indexOf('Windows') < 1) {
|
||
this.getBaseInfoData(1, item.key, 10);
|
||
} else {
|
||
this.getBaseInfoData(1, item.key, 5);
|
||
}
|
||
} else {
|
||
_item.iconDisplay = 'none';
|
||
}
|
||
});
|
||
};
|
||
// 双击切换四个统计模块获取全部信息
|
||
totalMoonDoubleClick = (item) => {
|
||
const { tableData } = this.state;
|
||
tableData.map((_item) => {
|
||
if (_item.key == item.key) {
|
||
if (item.key == '2') {
|
||
this.state.searchColumns = [
|
||
{
|
||
width: '450px',
|
||
title: '任务名称',
|
||
dataIndex: 'NOTICE_TITLE',
|
||
key: 'NOTICE_TITLE',
|
||
render: (text, record) => (
|
||
<span>
|
||
<a
|
||
onClick={() =>
|
||
this.showEditModal(
|
||
record.SOURCE_DATA_ID,
|
||
record.SOURCE_FORMCODE,
|
||
record.ID,
|
||
record.NOTICE_TITLE,
|
||
record.CODE
|
||
)
|
||
}
|
||
>
|
||
{record.NOTICE_TITLE}
|
||
</a>
|
||
</span>
|
||
),
|
||
},
|
||
{
|
||
title: '开始时间',
|
||
dataIndex: 'TASK_STARTDT',
|
||
key: 'TASK_STARTDT',
|
||
},
|
||
{
|
||
title: '结束时间',
|
||
dataIndex: 'TASK_ENDDT',
|
||
key: 'TASK_ENDDT',
|
||
},
|
||
{
|
||
title: '办结时间',
|
||
dataIndex: 'TASK_DT',
|
||
key: 'TASK_DT',
|
||
},
|
||
];
|
||
this.setState({
|
||
searchVisible: true,
|
||
searchTodayVisible: false,
|
||
querySearch: {},
|
||
});
|
||
} else if (item.key === '3') {
|
||
this.state.searchColumns = [
|
||
{
|
||
width: '450px',
|
||
title: '提醒内容',
|
||
dataIndex: 'NOTICE_TITLE',
|
||
key: 'NOTICE_TITLE',
|
||
render: (text, record) => (
|
||
<span>
|
||
<a
|
||
onClick={() =>
|
||
this.showTodayModal(
|
||
record.SOURCE_DATA_ID,
|
||
record.SOURCE_FORMCODE,
|
||
record.ID,
|
||
record.NOTICE_TITLE,
|
||
record.CODE,
|
||
record.TASK_STARTDT,
|
||
record.NOTICE_STATUS
|
||
)
|
||
}
|
||
>
|
||
{record.NOTICE_TITLE}
|
||
</a>
|
||
</span>
|
||
),
|
||
},
|
||
{
|
||
title: '提醒时间',
|
||
dataIndex: 'TASK_STARTDT',
|
||
key: 'TASK_STARTDT',
|
||
},
|
||
{
|
||
title: '状态',
|
||
dataIndex: 'NOTICE_STATUS',
|
||
key: 'NOTICE_STATUS',
|
||
render: (text, record) => this.ShowStatus(record),
|
||
},
|
||
];
|
||
this.setState({
|
||
searchVisible: false,
|
||
searchTodayVisible: true,
|
||
querySearch: {},
|
||
});
|
||
} else {
|
||
this.state.searchColumns = [
|
||
{
|
||
width: '450px',
|
||
title: '任务名称',
|
||
dataIndex: 'NOTICE_TITLE',
|
||
key: 'NOTICE_TITLE',
|
||
render: (text, record) => (
|
||
<span>
|
||
<a
|
||
onClick={() =>
|
||
this.showEditModal(
|
||
record.SOURCE_DATA_ID,
|
||
record.SOURCE_FORMCODE,
|
||
record.ID,
|
||
record.NOTICE_TITLE,
|
||
record.CODE
|
||
)
|
||
}
|
||
>
|
||
{record.NOTICE_TITLE}
|
||
</a>
|
||
</span>
|
||
),
|
||
},
|
||
{
|
||
title: '开始时间',
|
||
dataIndex: 'TASK_STARTDT',
|
||
key: 'TASK_STARTDT',
|
||
},
|
||
{
|
||
title: '结束时间',
|
||
dataIndex: 'TASK_ENDDT',
|
||
key: 'TASK_ENDDT',
|
||
},
|
||
{
|
||
title: '预警状态',
|
||
dataIndex: 'NOTICE_TYPE',
|
||
key: 'NOTICE_TYPE',
|
||
render: (text, record) => this.ShowState(record),
|
||
},
|
||
];
|
||
this.setState({
|
||
searchVisible: true,
|
||
searchTodayVisible: false,
|
||
querySearch: {},
|
||
});
|
||
}
|
||
}
|
||
});
|
||
this.setState(
|
||
{
|
||
tableData,
|
||
currentpageIndex: item.key,
|
||
isDoubleClick: true,
|
||
},
|
||
() => {
|
||
this.getBaseInfoData(1, item.key);
|
||
}
|
||
);
|
||
};
|
||
// 开始时间
|
||
selectChange = (value) => {
|
||
const { querySearch } = this.state;
|
||
querySearch.searchStatus = value;
|
||
this.setState(
|
||
{
|
||
querySearch,
|
||
},
|
||
() => {}
|
||
);
|
||
};
|
||
// 开始时间
|
||
startChange = (dates, dateStr) => {
|
||
const { querySearch } = this.state;
|
||
if (dates.length != 2) {
|
||
this.setState({
|
||
visibleStartTime: [],
|
||
querySearch: {},
|
||
});
|
||
return;
|
||
}
|
||
this.state.visibleStartTime = dates;
|
||
querySearch.startTime1 = this.state.visibleStartTime[0].format('YYYY-MM-DD HH:mm:ss');
|
||
querySearch.startTime2 = this.state.visibleStartTime[1].format('YYYY-MM-DD HH:mm:ss');
|
||
this.setState(
|
||
{
|
||
querySearch,
|
||
},
|
||
() => {}
|
||
);
|
||
};
|
||
// 结束时间
|
||
endChange = (dates, dateStr) => {
|
||
const { querySearch } = this.state;
|
||
if (dates.length != 2) {
|
||
this.setState({
|
||
visibleEndTime: [],
|
||
querySearch: {},
|
||
});
|
||
return;
|
||
}
|
||
this.state.visibleEndTime = dates;
|
||
querySearch.endTime1 = this.state.visibleEndTime[0].format('YYYY-MM-DD HH:mm:ss');
|
||
querySearch.endTime2 = this.state.visibleEndTime[1].format('YYYY-MM-DD HH:mm:ss');
|
||
this.setState({ querySearch });
|
||
};
|
||
// 搜索
|
||
handleSearch = (item) => {
|
||
this.getBaseInfoData(1, item, null);
|
||
};
|
||
closeTasks() {
|
||
const json = initFilter(this.props.login.OrgId, '', 'CODE', 1);
|
||
let ids = [];
|
||
let names = [];
|
||
this.state.taskSelects.forEach((element) => {
|
||
ids.push(element.ID);
|
||
names.push({
|
||
title: element.NOTICE_TITLE,
|
||
startTime: element.TASK_STARTDT,
|
||
endTime: element.TASK_ENDDT,
|
||
});
|
||
});
|
||
json.Parameter1 = ids.join(',');
|
||
json.Parameter2 = JSON.stringify(names);
|
||
this.props.dispatch({
|
||
type: 'app/getDataByPost',
|
||
url: 'BI/BITask/CloseTask',
|
||
payload: json,
|
||
onlyData: false,
|
||
onComplete: (ret) => {
|
||
message.success('申请成功！');
|
||
},
|
||
});
|
||
}
|
||
// input输入
|
||
vauleChange = (e) => {
|
||
const { querySearch } = this.state;
|
||
if (e.target.value) {
|
||
switch (e.target.name) {
|
||
case 'searchName':
|
||
querySearch[e.target.name] = e.target.value;
|
||
this.setState({ querySearch });
|
||
break;
|
||
case 'searchCode':
|
||
querySearch[e.target.name] = e.target.value;
|
||
this.setState({ querySearch });
|
||
break;
|
||
case 'searchType':
|
||
querySearch[e.target.name] = e.target.value;
|
||
this.setState({ querySearch });
|
||
break;
|
||
case 'searchContent':
|
||
querySearch[e.target.name] = e.target.value;
|
||
this.setState({ querySearch });
|
||
break;
|
||
}
|
||
} else {
|
||
this.setState({ querySearch: {} });
|
||
}
|
||
};
|
||
closeModal = () => {
|
||
this.setState({
|
||
searchVisible: false,
|
||
searchTodayVisible: false,
|
||
querySearch: {},
|
||
});
|
||
};
|
||
ShowState(obj) {
|
||
var thisResult = (Date.parse(obj.TASK_ENDDT) - Date.parse(Date())) / 3600 / 1000;
|
||
if (thisResult > 0) {
|
||
return '正常';
|
||
} else {
|
||
return <span style={{ color: 'red' }}>超期</span>;
|
||
}
|
||
}
|
||
ShowStatus(obj) {
|
||
if (obj.NOTICE_STATUS === 0) {
|
||
return <span style={{ color: 'red' }}>未读</span>;
|
||
} else if (obj.NOTICE_STATUS === 3) {
|
||
return <span style={{ color: 'blue' }}>已读</span>;
|
||
} else {
|
||
return '已办';
|
||
}
|
||
}
|
||
handleSelect = (e) => {
|
||
const { querySearch } = this.state;
|
||
if (e != undefined) {
|
||
querySearch.status = e;
|
||
} else {
|
||
querySearch.status = '';
|
||
}
|
||
this.setState({ querySearch });
|
||
};
|
||
showStandardScoreTotalModal = () => {
|
||
this.setState({
|
||
scoreTotalVisible: true,
|
||
});
|
||
};
|
||
showStandardScoreModal = (item) => {
|
||
let temp = false;
|
||
if (this.state.standardScore && this.state.standardScore.Nav_Details) {
|
||
this.state.standardScore.Nav_Details.forEach((t) => {
|
||
if (t.THREE_ELEMENTS_ID) {
|
||
temp = true;
|
||
}
|
||
});
|
||
}
|
||
if (item) {
|
||
let dataTemp = this.state.standardScore.Nav_Details.filter(
|
||
(t) => t.NON_CONFORMANCE != null && t.NON_CONFORMANCE != ''
|
||
);
|
||
let tmpData = dataTemp.map((item, i) => {
|
||
item['ROW_NO'] = i + 1;
|
||
return item;
|
||
});
|
||
let aa = {
|
||
CONTENTS: '合计扣分：',
|
||
NON_STANDARDIZED_SCORE: this.state.standardScore.NON_STANDARDIZED_SCORE,
|
||
};
|
||
tmpData.push(aa);
|
||
this.setState({
|
||
isNaN: temp,
|
||
standardScoreNaN: tmpData,
|
||
scoreNaVisible: true,
|
||
});
|
||
} else {
|
||
let dataTemp = this.state.standardScore.Nav_Details;
|
||
let tmpData = dataTemp.map((item, i) => {
|
||
item['ROW_NO'] = i + 1;
|
||
return item;
|
||
});
|
||
let aa = {
|
||
DESCRIPTION: '合计：',
|
||
STANDARDIZED_SCORE: this.state.standardScore.STAND_TOTAL,
|
||
RESULT_SCORE: this.state.standardScore.RESULT_TOTAL,
|
||
NON_CONFORMANCE: '标准化得分：' + this.state.standardScore.STANDARDIZED_RESULT,
|
||
};
|
||
tmpData.push(aa);
|
||
this.setState({
|
||
isNaN: temp,
|
||
standardScoreTemp: tmpData,
|
||
scoreVisible: true,
|
||
});
|
||
}
|
||
};
|
||
clearScoreTotalData = () => {
|
||
this.setState({
|
||
scoreTotalVisible: false,
|
||
});
|
||
};
|
||
clearScoreNaData = () => {
|
||
this.setState({
|
||
scoreNaVisible: false,
|
||
});
|
||
};
|
||
useEffect = () => {
|
||
// 监听的函数
|
||
const resize = new ResizeObserver((e) => {
|
||
if (!Array.isArray(e) || !e.length) return;
|
||
for (const ent of e) {
|
||
resizeChange(ent);
|
||
}
|
||
});
|
||
// 传入监听对象
|
||
resize.observe(resizeRef.current);
|
||
// 及时销毁监听函数（重要!!!）
|
||
return () => {
|
||
resize.unobserve(resizeRef?.current);
|
||
};
|
||
};
|
||
|
||
//显示详情弹窗
|
||
showDetailModal = (formCode) => {
|
||
var titleTemp =""
|
||
// this.state.mineType == 20
|
||
// ? '尾矿库'
|
||
// : this.state.mineType == 10
|
||
// ? '选矿厂'
|
||
// : this.state.mineType == 31
|
||
// ? '职能口'
|
||
// : this.state.mineType == 32
|
||
// ? '非金属'
|
||
// : '露天矿';
|
||
if (formCode == 'BI054_HOMEDETAIL') {
|
||
titleTemp += '安全检查次数统计（近12月）';
|
||
} else if (formCode == 'BI055_HOMEDETAIL') {
|
||
titleTemp += '月度隐患整改情况（近12月）';
|
||
} else if (formCode == 'BI001_HOMEDETAIL') {
|
||
titleTemp += '班组活动任务完成详情（近12月）';
|
||
} else if (formCode == 'BI002_HOMEDETAIL') {
|
||
titleTemp += '工作票完成详情（近12月）';
|
||
} else if (formCode == 'BI013_RISKANALYSISMODEL') {
|
||
titleTemp += '风险管理统计分析';
|
||
}
|
||
|
||
const newtmpData = {
|
||
data: {
|
||
id: guid(),
|
||
mineType: this.state.mineType,
|
||
onCancel: this.handleCancel,
|
||
homeReload: true,
|
||
},
|
||
formCode: formCode,
|
||
};
|
||
this.setState({ tmpData: newtmpData }, () => {
|
||
var detailForm = {
|
||
isShow: true,
|
||
formCode: formCode,
|
||
title: titleTemp,
|
||
};
|
||
this.setState({
|
||
detailForm: detailForm,
|
||
});
|
||
});
|
||
};
|
||
|
||
//详情弹窗关闭（隐藏）
|
||
detailFormClose = () => {
|
||
var detailForm = {
|
||
isShow: false,
|
||
formCode: '',
|
||
title: '',
|
||
};
|
||
this.setState({
|
||
detailForm: detailForm,
|
||
});
|
||
};
|
||
|
||
render() {
|
||
const { tableData } = this.state;
|
||
const thingsData = this.state.delayData;
|
||
const settings = {
|
||
dots: false,
|
||
autoplay: false,
|
||
infinite: true,
|
||
speed: 500,
|
||
slidesToShow: 1,
|
||
slidesToScroll: 1,
|
||
className: styles.slideHeight,
|
||
fade: true,
|
||
};
|
||
// 在render方法中添加动态样式计算
|
||
const { safetySloganOne, animationDuration, sliderColor, sliderSize } = this.state;
|
||
|
||
const rowSelection = {
|
||
onChange: (selectedRowKeys, selectedRows) => {
|
||
this.state.taskSelects = selectedRows;
|
||
},
|
||
};
|
||
const empty = <Col md={6} sm={24}></Col>;
|
||
return (
|
||
<div
|
||
className="route-home"
|
||
style={{
|
||
padding: '0 10px',
|
||
minHeight: '735px',
|
||
}}
|
||
ref={this.resizeRef}
|
||
>
|
||
<div style={{ display: 'inline-block' }}>
|
||
<Modal
|
||
visible={this.state.detailForm.isShow}
|
||
title={this.state.detailForm.title}
|
||
maskClosable={false}
|
||
closeModal={this.detailFormClose}
|
||
onCancel={this.detailFormClose}
|
||
footer={null}
|
||
width="1300px"
|
||
>
|
||
<FormPage {...this.state.tmpData} />
|
||
</Modal>
|
||
<Modal
|
||
visible={this.state.scoreTotalVisible}
|
||
title="标准化得分汇总"
|
||
maskClosable={false}
|
||
onCancel={this.clearScoreTotalData}
|
||
footer={null}
|
||
className="antd-modal-fullscreen"
|
||
closeModal={this.clearScoreTotalData}
|
||
>
|
||
<Table
|
||
dataSource={this.state.standardScore.Nav_IngoreDetails}
|
||
columns={this.state.scoreTotalColumns}
|
||
pagination={false}
|
||
bordered
|
||
loading={this.state.showLoading}
|
||
size="small"
|
||
/>
|
||
</Modal>
|
||
<Modal
|
||
visible={this.state.scoreVisible}
|
||
title="标准化得分明细"
|
||
maskClosable={false}
|
||
onCancel={this.clearScoreData}
|
||
footer={null}
|
||
className="antd-modal-fullscreen"
|
||
closeModal={this.clearScoreData}
|
||
>
|
||
<Table
|
||
dataSource={this.state.standardScoreTemp}
|
||
columns={this.state.scoreColumns}
|
||
pagination={false}
|
||
bordered
|
||
loading={this.state.showLoading}
|
||
size="small"
|
||
/>
|
||
</Modal>
|
||
<Modal
|
||
visible={this.state.scoreNaVisible}
|
||
title="不符合项明细"
|
||
maskClosable={false}
|
||
onCancel={this.clearScoreNaData}
|
||
footer={null}
|
||
className="antd-modal-fullscreen"
|
||
closeModal={this.clearScoreNaData}
|
||
>
|
||
<Table
|
||
dataSource={this.state.standardScoreNaN}
|
||
columns={this.state.scoreNoneColumns}
|
||
pagination={false}
|
||
bordered
|
||
loading={this.state.showLoading}
|
||
size="small"
|
||
/>
|
||
</Modal>
|
||
<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>
|
||
</div>
|
||
<Row gutter={12}>
|
||
{/* 五个图标模块 */}
|
||
<Col span={this.state.displayNum}>
|
||
<Col span={5} style={{ display: this.state.displayStr }}>
|
||
<div
|
||
onClick={() => this.showStandardScoreTotalModal()}
|
||
style={{
|
||
// padding: "0px",
|
||
height: '236px',
|
||
borderRadius: '10px',
|
||
padding: '10px',
|
||
cursor: 'pointer',
|
||
}}
|
||
className="backlog-background-style4"
|
||
>
|
||
<Icon
|
||
type={'rocket'}
|
||
className="backlog-icontitle-style"
|
||
style={{
|
||
marginLeft: '12px',
|
||
}}
|
||
></Icon>
|
||
<div
|
||
style={{
|
||
display: 'flex',
|
||
flexDirection: 'column',
|
||
justifyContent: 'space-between',
|
||
}}
|
||
>
|
||
<div
|
||
className={'backlog-style'}
|
||
style={{
|
||
fontSize: '38pt',
|
||
marginBottom: '20px',
|
||
display: 'flex',
|
||
alignItems: 'center',
|
||
marginLeft: '12px',
|
||
}}
|
||
>
|
||
{/* {83.6} */}
|
||
{this.state.stardardScoreQty}
|
||
{/* {this.state.uitem} */}
|
||
</div>
|
||
<div
|
||
className="backlog-title-style"
|
||
style={{
|
||
marginBottom: '20px',
|
||
marginTop: '10px',
|
||
marginLeft: '12px',
|
||
}}
|
||
>
|
||
标准化得分
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</Col>
|
||
<Col span={19}>
|
||
<Row gutter={10}>
|
||
<Col span={24}>
|
||
<div className="slide-content">
|
||
<div className="slide-icon-style">
|
||
<Icon type="sound" style={{ fontSize: '28px' }}></Icon>
|
||
</div>
|
||
<div
|
||
className="slide-style"
|
||
style={{
|
||
'--animation-duration': `${animationDuration}s`, // 动态设置动画时长
|
||
'--slider-color': `${sliderColor}`, // 动态设置颜色
|
||
'--slider-size': `${sliderSize}px`, // 动态设置颜色
|
||
}}
|
||
>
|
||
<p className="slide-text-style">{safetySloganOne || '暂无公告'}</p>
|
||
</div>
|
||
</div>
|
||
</Col>
|
||
</Row>
|
||
<Row gutter={10}>
|
||
<Col span={24}>
|
||
<Row gutter={12}>
|
||
{tableData.map((item) => {
|
||
return (
|
||
<Col span={this.state.displayStr ? 6 : 6}>
|
||
<div
|
||
onClick={() => this.totalModuleClick(item)}
|
||
onDoubleClick={() => this.totalMoonDoubleClick(item)}
|
||
style={{
|
||
padding: '0px',
|
||
height: '176px',
|
||
borderRadius: '10px',
|
||
cursor: 'pointer',
|
||
}}
|
||
className={
|
||
item.title === '待办事项'
|
||
? 'backlog-background-style'
|
||
: item.title === '待办超时'
|
||
? 'backlog-background-style1'
|
||
: item.title === '已办事项'
|
||
? 'backlog-background-style2'
|
||
: item.title === '今日提醒'
|
||
? 'backlog-background-style3'
|
||
: 'backlog-background-style4'
|
||
}
|
||
>
|
||
<Icon
|
||
type={
|
||
item.title === '待办事项'
|
||
? 'schedule'
|
||
: item.title === '待办超时'
|
||
? 'hourglass'
|
||
: item.title === '已办事项'
|
||
? 'check-circle'
|
||
: item.title === '今日提醒'
|
||
? 'bulb'
|
||
: 'rocket'
|
||
}
|
||
className={
|
||
item.title === '待办事项'
|
||
? 'backlog-icontitle-style1'
|
||
: item.title === '待办超时'
|
||
? 'backlog-icontitle-style2'
|
||
: item.title === '已办事项'
|
||
? 'backlog-icontitle-style3'
|
||
: item.title === '今日提醒'
|
||
? 'backlog-icontitle-style4'
|
||
: 'backlog-icontitle-style'
|
||
}
|
||
></Icon>
|
||
|
||
<div className={item.total > 9999 ? 'backlog-style4' : 'backlog-style'}>{item.total}</div>
|
||
<div className="backlog-title-style">{item.title}</div>
|
||
<div
|
||
className={
|
||
item.title === '待办事项'
|
||
? 'backlog-icon-style3'
|
||
: item.title === '待办超时'
|
||
? 'backlog-icon-style4'
|
||
: item.title === '已办事项'
|
||
? 'backlog-icon-style5'
|
||
: item.title === '今日提醒'
|
||
? 'backlog-icon-style6'
|
||
: 'backlog-icon-style7'
|
||
}
|
||
style={{ display: item.iconDisplay }}
|
||
></div>
|
||
</div>
|
||
</Col>
|
||
);
|
||
})}
|
||
</Row>
|
||
</Col>
|
||
</Row>
|
||
</Col>
|
||
</Col>
|
||
|
||
{/* 通知 */}
|
||
<Col span={8} rowSpan={2} style={{ display: this.state.displayStr, height: '100%' }}>
|
||
<div
|
||
className="dashboard-div-style"
|
||
style={{
|
||
height: '236px',
|
||
}}
|
||
>
|
||
<div className="dashboard-div-style">
|
||
<div className="statistical-title-style">
|
||
<div className="badge-style">
|
||
<Icon type="pie-chart" style={{ color: '#5f6ac2', marginRight: '4px' }}></Icon>
|
||
风险等级占比
|
||
</div>
|
||
{this.state.riskLevelPage.length > 0 ? (
|
||
<span
|
||
style={{
|
||
fontSize: '14px',
|
||
float: 'right',
|
||
marginRight: '16px',
|
||
// marginTop: "4px",
|
||
}}
|
||
>
|
||
<div onClick={() => this.showDetailModal('BI013_RISKANALYSISMODEL')}>
|
||
<IconFont
|
||
type="icon-24gl-expand2"
|
||
style={{
|
||
fontSize: '18px',
|
||
color: '#333333',
|
||
cursor: 'pointer',
|
||
}}
|
||
></IconFont>
|
||
</div>
|
||
</span>
|
||
) : null}
|
||
</div>
|
||
{this.state.riskLevelPage.length > 0 ? <RisiLevel riskLevelPage={this.state.riskLevelPage} /> : null}
|
||
</div>
|
||
</div>
|
||
</Col>
|
||
</Row>
|
||
<Row
|
||
gutter={12}
|
||
style={{
|
||
marginTop: '14px',
|
||
height: 'calc((100% - 270px) / 2)',
|
||
minHeight: '260px',
|
||
}}
|
||
>
|
||
{/* 列表 */}
|
||
<Col span={this.state.displayNum} style={{ height: '100%' }}>
|
||
<div
|
||
className="dashboard-div-style"
|
||
style={{
|
||
overflow: 'auto',
|
||
}}
|
||
>
|
||
<Table
|
||
dataSource={this.state.retData}
|
||
columns={this.state.columns}
|
||
pagination={false}
|
||
loading={this.state.showLoading}
|
||
size="small"
|
||
padding="100px"
|
||
/>
|
||
</div>
|
||
</Col>
|
||
<Modal
|
||
visible={this.state.searchVisible}
|
||
zIndex={999}
|
||
title={this.state.visibleTitle}
|
||
maskClosable={false}
|
||
onCancel={this.closeModal}
|
||
footer={false}
|
||
className="antd-modal-fullscreen"
|
||
>
|
||
<div>
|
||
<Form>
|
||
<Row style={{ marginTop: '50px' }}>
|
||
<Col span={5}>
|
||
<Form.Item label={'名称'} {...formItemLayout}>
|
||
<Input
|
||
value={this.state.querySearch.searchName}
|
||
placeholder={'请输入任务名称'}
|
||
name="searchName"
|
||
onChange={this.vauleChange}
|
||
/>
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={6}>
|
||
<Form.Item label={'开始时间'} {...formItemLayout}>
|
||
<RangePicker value={this.state.visibleStartTime} onChange={this.startChange} />
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={6}>
|
||
<Form.Item label={'结束时间'} {...formItemLayout}>
|
||
<RangePicker value={this.state.visibleEndTime} onChange={this.endChange} />
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={2}>
|
||
<Button
|
||
type={'primary'}
|
||
icon={'search'}
|
||
onClick={() => this.handleSearch(this.state.currentpageIndex)}
|
||
>
|
||
搜索
|
||
</Button>
|
||
</Col>
|
||
{/* <Col span={2}>
|
||
<Popconfirm
|
||
title="是否确认申请关闭所选择的待办任务?"
|
||
onConfirm={()=>{
|
||
this.closeTasks()
|
||
}}
|
||
okText="确认"
|
||
cancelText="取消"
|
||
>
|
||
<Button type={"danger"} href="#">申请关闭</Button>
|
||
</Popconfirm>
|
||
</Col> */}
|
||
</Row>
|
||
</Form>
|
||
<Table
|
||
rowSelection={rowSelection}
|
||
dataSource={this.state.retDataAll}
|
||
columns={this.state.searchColumns}
|
||
pagination={this.state.pagination}
|
||
onChange={(num) => this.getBaseInfoData(num, this.state.currentpageIndex, null)}
|
||
loading={this.state.showLoading}
|
||
size="small"
|
||
/>
|
||
</div>
|
||
</Modal>
|
||
<Modal
|
||
visible={this.state.searchTodayVisible}
|
||
title={this.state.visibleTitle}
|
||
maskClosable={false}
|
||
zIndex={999}
|
||
onCancel={this.closeModal}
|
||
footer={false}
|
||
className="antd-modal-fullscreen"
|
||
>
|
||
<div>
|
||
<Form>
|
||
<Row style={{ marginTop: '50px' }}>
|
||
<Col span={5}>
|
||
<Form.Item label={'提醒内容'} {...formItemLayout}>
|
||
<Input
|
||
value={this.state.querySearch.searchName}
|
||
placeholder={'请输入提醒内容'}
|
||
name="searchName"
|
||
onChange={this.vauleChange}
|
||
/>
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={6}>
|
||
<Form.Item label={'开始时间'} {...formItemLayout}>
|
||
<RangePicker
|
||
value={this.state.visibleStartTime}
|
||
// defaultValue={[moment(moment(this.state.querySearch.startTime1), "YYYY-MM-DD"), moment(moment(this.state.querySearch.startTime2), "YYYY-MM-DD")]}
|
||
onChange={this.startChange}
|
||
/>
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={6}>
|
||
<Form.Item label={'结束时间'} {...formItemLayout}>
|
||
<RangePicker
|
||
value={this.state.visibleEndTime}
|
||
// defaultValue={[moment(moment(this.state.querySearch.startTime1), "YYYY-MM-DD"), moment(moment(this.state.querySearch.startTime2), "YYYY-MM-DD")]}
|
||
onChange={this.endChange}
|
||
/>
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={3}>
|
||
<Form.Item label={'状态'} {...formItemLayout}>
|
||
<Select
|
||
value={this.state.querySearch.searchStatus}
|
||
// defaultValue={[moment(moment(this.state.querySearch.startTime1), "YYYY-MM-DD"), moment(moment(this.state.querySearch.startTime2), "YYYY-MM-DD")]}
|
||
onChange={this.selectChange}
|
||
>
|
||
<Option value="0">未读</Option>
|
||
<Option value="3">已读</Option>
|
||
<Option value="1">已办</Option>
|
||
</Select>
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={2}>
|
||
<Button
|
||
type={'primary'}
|
||
icon={'search'}
|
||
onClick={() => this.handleSearch(this.state.currentpageIndex)}
|
||
>
|
||
搜索
|
||
</Button>
|
||
</Col>
|
||
</Row>
|
||
</Form>
|
||
<Table
|
||
dataSource={this.state.retDataAll}
|
||
columns={this.state.searchColumns}
|
||
pagination={this.state.pagination}
|
||
onChange={(num) => this.getBaseInfoData(num, this.state.currentpageIndex, null)}
|
||
loading={this.state.showLoading}
|
||
size="small"
|
||
/>
|
||
</div>
|
||
</Modal>
|
||
{/* 岗位风险类别 */}
|
||
<Col span={8} style={{ display: this.state.displayStr, height: '100%' }}>
|
||
<div
|
||
className="dashboard-div-style"
|
||
style={{
|
||
borderRadius: '10px',
|
||
height: '100%',
|
||
backgroundColor: 'white',
|
||
}}
|
||
>
|
||
<div className="statistical-title-style">
|
||
<div className="badge-style">
|
||
<Icon type="bar-chart" style={{ color: '#5f6ac2', marginRight: '4px' }}></Icon>
|
||
班组活动完成率
|
||
</div>
|
||
{this.state.departmentCompletionData.length > 0 ? (
|
||
<span
|
||
style={{
|
||
fontSize: '14px',
|
||
float: 'right',
|
||
marginRight: '16px',
|
||
marginTop: '4px',
|
||
}}
|
||
>
|
||
<div onClick={() => this.showDetailModal('BI001_HOMEDETAIL')}>
|
||
<IconFont
|
||
type="icon-24gl-expand2"
|
||
style={{
|
||
fontSize: '18px',
|
||
color: '#333333',
|
||
cursor: 'pointer',
|
||
}}
|
||
></IconFont>
|
||
</div>
|
||
</span>
|
||
) : null}
|
||
</div>
|
||
<br />
|
||
<div style={{ width: '100%', height: '100%' }}>
|
||
{this.state.departmentCompletionData.length > 0 ? (
|
||
<ClassCompletion departmentCompletionData={this.state.departmentCompletionData} />
|
||
) : null}
|
||
</div>
|
||
{/* <Toggle getNum={this.getChildCount}></Toggle> */}
|
||
</div>
|
||
</Col>
|
||
</Row>
|
||
<Row
|
||
gutter={12}
|
||
style={{
|
||
display: this.state.displayStr,
|
||
marginTop: '12px',
|
||
height: 'calc((100% - 300px) / 2)',
|
||
minHeight: '256px',
|
||
}}
|
||
>
|
||
{/* 工作票完成情况前十 */}
|
||
{/* 隐患整改完成情况排名前十 */}
|
||
<Col span={8} style={{ display: this.state.displayStr, height: '100%' }}>
|
||
<div
|
||
className="dashboard-div-style"
|
||
style={{
|
||
borderRadius: '10px',
|
||
height: '100%',
|
||
backgroundColor: 'white',
|
||
}}
|
||
>
|
||
<div className="statistical-title-style">
|
||
<div className="badge-style">
|
||
<Icon type="bar-chart" style={{ color: '#5f6ac2', marginRight: '4px' }}></Icon>
|
||
工作票完成数
|
||
</div>
|
||
{this.state.workTicketData.length > 0 ? (
|
||
<span
|
||
style={{
|
||
fontSize: '14px',
|
||
float: 'right',
|
||
marginRight: '16px',
|
||
marginTop: '4px',
|
||
}}
|
||
>
|
||
<div onClick={() => this.showDetailModal('BI002_HOMEDETAIL')}>
|
||
<IconFont
|
||
type="icon-24gl-expand2"
|
||
style={{
|
||
fontSize: '18px',
|
||
color: '#333333',
|
||
cursor: 'pointer',
|
||
}}
|
||
></IconFont>
|
||
</div>
|
||
</span>
|
||
) : null}
|
||
</div>
|
||
<br />
|
||
{this.state.workTicketData.length > 0 ? <WorkTicket workTicketData={this.state.workTicketData} /> : null}
|
||
</div>
|
||
</Col>
|
||
{/* 隐患整改情况 */}
|
||
<Col span={8} style={{ display: this.state.displayStr, height: '100%' }}>
|
||
<div
|
||
className="dashboard-div-style"
|
||
style={{
|
||
borderRadius: '10px',
|
||
height: '100%',
|
||
backgroundColor: 'white',
|
||
}}
|
||
>
|
||
<div className="statistical-title-style">
|
||
<div className="badge-style">
|
||
<Icon type="bar-chart" style={{ color: '#5f6ac2', marginRight: '4px' }}></Icon>
|
||
月度隐患整改情况
|
||
</div>
|
||
{this.state.dangerList.ListC && this.state.dangerList.ListC.length > 0 ? (
|
||
<span
|
||
style={{
|
||
fontSize: '14px',
|
||
float: 'right',
|
||
marginRight: '16px',
|
||
marginTop: '4px',
|
||
}}
|
||
>
|
||
<div onClick={() => this.showDetailModal('BI055_HOMEDETAIL')}>
|
||
<IconFont
|
||
type="icon-24gl-expand2"
|
||
style={{
|
||
fontSize: '18px',
|
||
color: '#333333',
|
||
cursor: 'pointer',
|
||
}}
|
||
></IconFont>
|
||
</div>
|
||
</span>
|
||
) : null}
|
||
</div>
|
||
<br />
|
||
{this.state.dangerList.ListC && this.state.dangerList.ListC.length > 0 ? (
|
||
<MonthDanger ListC={this.state.dangerList.ListC} />
|
||
) : null}
|
||
{/* <Toggle getNum={this.getHiddenCount}></Toggle> */}
|
||
</div>
|
||
</Col>
|
||
{/* 风险类别占比、风险等级占比 */}
|
||
<Col span={8} style={{ display: this.state.displayStr, height: '100%' }}>
|
||
<div className="dashboard-div-style">
|
||
<div className="statistical-title-style">
|
||
{/* {this.state.departmentName}作业完成情况 */}
|
||
<div className="badge-style">
|
||
<Icon type="bar-chart" style={{ color: '#5f6ac2', marginRight: '4px' }}></Icon>
|
||
安全检查次数统计
|
||
</div>
|
||
{this.state.dangerList.ListSafeCheckYearMonth &&
|
||
this.state.dangerList.ListSafeCheckYearMonth.length > 0 ? (
|
||
<span
|
||
style={{
|
||
fontSize: '14px',
|
||
float: 'right',
|
||
marginRight: '16px',
|
||
marginTop: '4px',
|
||
}}
|
||
>
|
||
<div onClick={() => this.showDetailModal('BI054_HOMEDETAIL')}>
|
||
<IconFont
|
||
type="icon-24gl-expand2"
|
||
style={{
|
||
fontSize: '18px',
|
||
color: '#333333',
|
||
cursor: 'pointer',
|
||
}}
|
||
></IconFont>
|
||
</div>
|
||
</span>
|
||
) : null}
|
||
</div>
|
||
<br />
|
||
{this.state.dangerList.ListSafeCheckYearMonth &&
|
||
this.state.dangerList.ListSafeCheckYearMonth.length > 0 ? (
|
||
<SafeCheck ListSafeCheckYearMonth={this.state.dangerList.ListSafeCheckYearMonth} />
|
||
) : null}
|
||
</div>
|
||
</Col>
|
||
</Row>
|
||
</div>
|
||
);
|
||
}
|
||
}
|
||
export default connect(({ login, app }) => ({ login, app }))(Home);
|