流程可视化
This commit is contained in:
parent
f8f1b95f21
commit
0e25699153
265
src/components/CustomPages/SK/OperateLog.css
Normal file
265
src/components/CustomPages/SK/OperateLog.css
Normal file
@ -0,0 +1,265 @@
|
|||||||
|
.flowchart {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
/* 关键：内容过多时自动换行 */
|
||||||
|
gap: 16px;
|
||||||
|
/* 项之间的间距 */
|
||||||
|
padding: 10px 0;
|
||||||
|
width: 100%;
|
||||||
|
/* 确保容器宽度充足 */
|
||||||
|
}
|
||||||
|
|
||||||
|
.logListContainer {
|
||||||
|
padding-left: 30px;
|
||||||
|
/* 确保左侧始终有30px间距 */
|
||||||
|
width: calc(100% - 180px);
|
||||||
|
/* 减去左侧步骤区域的宽度，避免溢出 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 单个日志项样式 - 控制最小宽度避免过度挤压 */
|
||||||
|
|
||||||
|
|
||||||
|
.step {
|
||||||
|
width: 100px;
|
||||||
|
height: 40px;
|
||||||
|
background-color: #4472C4;
|
||||||
|
/* #f0f0f0; */
|
||||||
|
color: white;
|
||||||
|
border: 1px solid #ddd;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
margin-top: 20px;
|
||||||
|
position: relative;
|
||||||
|
border-radius: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stepno {
|
||||||
|
width: 100px;
|
||||||
|
height: 40px;
|
||||||
|
background-color: #A5A5A5;
|
||||||
|
/* #f0f0f0; */
|
||||||
|
color: white;
|
||||||
|
border: 1px solid #ddd;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
margin-top: 20px;
|
||||||
|
position: relative;
|
||||||
|
border-radius: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 长方形 */
|
||||||
|
.rectangle {
|
||||||
|
width: 20px;
|
||||||
|
height: 50px;
|
||||||
|
/* margin-top: -70px; */
|
||||||
|
margin-top: 8px;
|
||||||
|
margin-left: 45px;
|
||||||
|
position: relative;
|
||||||
|
background-color: #ADCDEA;
|
||||||
|
/* transform: rotate(-40deg); */
|
||||||
|
/* 旋转角度 */
|
||||||
|
}
|
||||||
|
|
||||||
|
.rectangleno {
|
||||||
|
width: 20px;
|
||||||
|
height: 50px;
|
||||||
|
/* margin-top: -70px; */
|
||||||
|
margin-top: 8px;
|
||||||
|
margin-left: 45px;
|
||||||
|
position: relative;
|
||||||
|
background-color: #A5A5A5;
|
||||||
|
/* transform: rotate(-40deg); */
|
||||||
|
/* 旋转角度 */
|
||||||
|
}
|
||||||
|
|
||||||
|
.rectangleno::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
bottom: -13px;
|
||||||
|
/* 根据需要调整 */
|
||||||
|
left: 50%;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
border-left: 20px solid transparent;
|
||||||
|
border-right: 20px solid transparent;
|
||||||
|
border-top: 20px solid #A5A5A5;
|
||||||
|
/* 线条颜色 #ddd*/
|
||||||
|
transform: translateX(-50%);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 模拟线条 */
|
||||||
|
/* .step:not(:last-child)::after { */
|
||||||
|
.rectangle::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
bottom: -13px;
|
||||||
|
/* 根据需要调整 */
|
||||||
|
left: 50%;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
border-left: 20px solid transparent;
|
||||||
|
border-right: 20px solid transparent;
|
||||||
|
border-top: 20px solid #ADCDEA;
|
||||||
|
/* 线条颜色 #ddd*/
|
||||||
|
transform: translateX(-50%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.step::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
/* bottom: -13px; */
|
||||||
|
/* 根据需要调整 */
|
||||||
|
/* left: 50%; */
|
||||||
|
margin-left: 150px;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
border-top: 20px solid transparent;
|
||||||
|
border-bottom: 20px solid transparent;
|
||||||
|
/* border-left: 20px solid transparent; */
|
||||||
|
border-left: 20px solid #ADCDEA;
|
||||||
|
/* border-color: #ADCDEA; */
|
||||||
|
/* border: 1px solid #A5A5A5; */
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/* border-left: 20px solid transparent;
|
||||||
|
border-right: 20px solid transparent; */
|
||||||
|
/* border-top: 20px solid #ADCDEA; */
|
||||||
|
/* 线条颜色 #ddd*/
|
||||||
|
/* transform: translateX(-50%); */
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* #ADCDEA 天蓝*/
|
||||||
|
/* #70AD47 绿色 */
|
||||||
|
/* #A5A5A5 灰色 深 */
|
||||||
|
/* #D9D9D9 灰色 */
|
||||||
|
/* #FFC000 橙色 浅 */
|
||||||
|
/* #ED7D31 橙色 深 */
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/* 横向布局 */
|
||||||
|
.flowchartx {
|
||||||
|
flex-direction: row;
|
||||||
|
/* justify-content: space-between; */
|
||||||
|
/* width: 100%; */
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 横向item */
|
||||||
|
.stepx {
|
||||||
|
/* margin-right: 15px; */
|
||||||
|
width: 120px;
|
||||||
|
height: 40px;
|
||||||
|
background-color: #70AD47;
|
||||||
|
color: white;
|
||||||
|
border: 1px solid white;
|
||||||
|
/* border: 1px solid #ddd; */
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
margin-top: 20px;
|
||||||
|
position: relative;
|
||||||
|
border-radius: 50px;
|
||||||
|
margin-left: 25px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 超时处理 */
|
||||||
|
.stepxOutTime {
|
||||||
|
/* margin-right: 15px; */
|
||||||
|
width: 120px;
|
||||||
|
height: 40px;
|
||||||
|
background-color: #FFC000;
|
||||||
|
color: white;
|
||||||
|
border: 1px solid white;
|
||||||
|
/* border: 1px solid #ddd; */
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
margin-top: 20px;
|
||||||
|
position: relative;
|
||||||
|
border-radius: 50px;
|
||||||
|
margin-left: 25px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 未处理 */
|
||||||
|
.stepxEnable {
|
||||||
|
/* margin-right: 15px; */
|
||||||
|
width: 120px;
|
||||||
|
height: 40px;
|
||||||
|
background-color: #A5A5A5;
|
||||||
|
color: white;
|
||||||
|
border: 1px solid white;
|
||||||
|
/* border: 1px solid #ddd; */
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
margin-top: 20px;
|
||||||
|
position: relative;
|
||||||
|
border-radius: 50px;
|
||||||
|
margin-left: 25px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stepxLeft50 {
|
||||||
|
margin-left: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 横向箭头线 */
|
||||||
|
.linex {
|
||||||
|
margin-left: 10px;
|
||||||
|
width: 60px;
|
||||||
|
height: 5px;
|
||||||
|
/* margin-top: -70px; */
|
||||||
|
/* margin-top: 8px; */
|
||||||
|
/* margin-left: -30px; */
|
||||||
|
margin-top: 40px;
|
||||||
|
position: relative;
|
||||||
|
background-color: #ADCDEA;
|
||||||
|
/* transform: rotate(-40deg); */
|
||||||
|
/* 旋转角度 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 横向箭头 */
|
||||||
|
.linex::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
margin-left: 30px;
|
||||||
|
margin-top: -5px;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
border-top: 8px solid transparent;
|
||||||
|
border-bottom: 8px solid transparent;
|
||||||
|
border-left: 8px solid #ADCDEA;
|
||||||
|
}
|
||||||
|
|
||||||
|
.discribeSpan {
|
||||||
|
display: flex;
|
||||||
|
width: 120px;
|
||||||
|
/* width: 100%; */
|
||||||
|
height: 70px;
|
||||||
|
margin-top: -25px;
|
||||||
|
border-radius: 5px;
|
||||||
|
background: #D9D9D9;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: flex-start;
|
||||||
|
margin-left: 25px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.discribeSpanUser {
|
||||||
|
margin-top: 28px;
|
||||||
|
font-size: smaller;
|
||||||
|
padding: 0 0 0 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.discribeSpanTime {
|
||||||
|
font-size: smaller;
|
||||||
|
padding: 0 0 0 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 横向布局 */
|
||||||
@ -1,13 +1,21 @@
|
|||||||
import { Button, Descriptions, Badge, Popconfirm, Row, Col, Form, Input, Select, Table } from 'antd';
|
import { Button, Descriptions, Badge, Popconfirm, Row, Col, Form, Input, Select, Table } from 'antd';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { initFilter, extendRule, extendInclude, setDataFieldValue, showApprove, guid, ShowDateTime } from '../../../utils/common';
|
import {
|
||||||
|
initFilter,
|
||||||
|
extendRule,
|
||||||
|
extendInclude,
|
||||||
|
setDataFieldValue,
|
||||||
|
showApprove,
|
||||||
|
guid,
|
||||||
|
ShowDateTime,
|
||||||
|
} from '../../../utils/common.js';
|
||||||
import ReactToPrint from 'react-to-print';
|
import ReactToPrint from 'react-to-print';
|
||||||
import { ExportToExcel } from '@woowalker/feui'
|
import { ExportToExcel } from '@woowalker/feui';
|
||||||
import XLSX from 'xlsx';
|
import XLSX from 'xlsx';
|
||||||
import { connect } from 'dva';
|
import { connect } from 'dva';
|
||||||
import moment from 'moment';
|
import moment from 'moment';
|
||||||
import { message } from 'antd/lib/index';
|
import { message } from 'antd/lib/index';
|
||||||
import styles from '../../../components/CustomPages/HI/OperateLog.css';
|
import styles from './OperateLog.css';
|
||||||
import config from '../../../config.js';
|
import config from '../../../config.js';
|
||||||
|
|
||||||
class SK006ShowOperateLog extends React.Component {
|
class SK006ShowOperateLog extends React.Component {
|
||||||
@ -17,7 +25,7 @@ class SK006ShowOperateLog extends React.Component {
|
|||||||
data: null,
|
data: null,
|
||||||
riskCount: 1,
|
riskCount: 1,
|
||||||
riskHeight: 50,
|
riskHeight: 50,
|
||||||
opEnd: null
|
opEnd: null,
|
||||||
// dateFirst: [
|
// dateFirst: [
|
||||||
// [{ OPERATEPOINT: 10 }, { OPERATEPOINT: 20 }, { OPERATEPOINT: 30 }, { OPERATEPOINT: 40 }],
|
// [{ OPERATEPOINT: 10 }, { OPERATEPOINT: 20 }, { OPERATEPOINT: 30 }, { OPERATEPOINT: 40 }],
|
||||||
// [{ OPERATEPOINT: 48 }, { OPERATEPOINT: 50 }, { OPERATEPOINT: 60 }, { OPERATEPOINT: 70 }, { OPERATEPOINT: 80 }],
|
// [{ OPERATEPOINT: 48 }, { OPERATEPOINT: 50 }, { OPERATEPOINT: 60 }, { OPERATEPOINT: 70 }, { OPERATEPOINT: 80 }],
|
||||||
@ -26,12 +34,11 @@ class SK006ShowOperateLog extends React.Component {
|
|||||||
// [{ OPERATEPOINT: 140 }, { OPERATEPOINT: 150 }, { OPERATEPOINT: 160 }, { OPERATEPOINT: 180 }, { OPERATEPOINT: 190 }, { OPERATEPOINT: 200 }, { OPERATEPOINT: 210 }, { OPERATEPOINT: 220 }]
|
// [{ OPERATEPOINT: 140 }, { OPERATEPOINT: 150 }, { OPERATEPOINT: 160 }, { OPERATEPOINT: 180 }, { OPERATEPOINT: 190 }, { OPERATEPOINT: 200 }, { OPERATEPOINT: 210 }, { OPERATEPOINT: 220 }]
|
||||||
// ]
|
// ]
|
||||||
// ]
|
// ]
|
||||||
}
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
componentDidMount() {
|
componentDidMount() {
|
||||||
if (this.props.data?.id)
|
if (this.props.data?.id) this.loadData(this.props.data?.id);
|
||||||
this.loadData(this.props.data?.id);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
componentWillReceiveProps(NextProps) {
|
componentWillReceiveProps(NextProps) {
|
||||||
@ -46,48 +53,47 @@ class SK006ShowOperateLog extends React.Component {
|
|||||||
this.props.dispatch({
|
this.props.dispatch({
|
||||||
type: 'app/getDataByPost',
|
type: 'app/getDataByPost',
|
||||||
payload: json,
|
payload: json,
|
||||||
url: 'SK/SKSecurityInspectionNotice/SKOrderEntities',
|
url: 'SK/SKSecurityInspectionNotice/OperateLogView',
|
||||||
onComplete: (ret) => {
|
onComplete: (ret) => {
|
||||||
if (ret) {
|
if (ret) {
|
||||||
let riskCount = 1
|
let riskCount = 1;
|
||||||
riskCount = ret.length - 3
|
riskCount = ret.length - 3;
|
||||||
var isEnd = false
|
var isEnd = false;
|
||||||
var opEnd = null
|
var opEnd = null;
|
||||||
if (ret[ret.length - 1].length == 1 && ret[ret.length - 1][0].OPERATEPOINT == 220) {
|
if (ret[ret.length - 1].length == 1 && ret[ret.length - 1][0].OPERATEPOINT == 220) {
|
||||||
isEnd = true
|
isEnd = true;
|
||||||
riskCount = riskCount - 1
|
riskCount = riskCount - 1;
|
||||||
opEnd = ret[ret.length - 1][0]
|
opEnd = ret[ret.length - 1][0];
|
||||||
}
|
}
|
||||||
|
|
||||||
let dataRiskMore = []
|
let dataRiskMore = [];
|
||||||
if (riskCount > 0) {
|
if (riskCount > 0) {
|
||||||
var countOpeate = ret.length
|
var countOpeate = ret.length;
|
||||||
if (isEnd) countOpeate--
|
if (isEnd) countOpeate--;
|
||||||
for (let i = 4; i < countOpeate; i++) {
|
for (let i = 4; i < countOpeate; i++) {
|
||||||
dataRiskMore.push(ret[i])
|
dataRiskMore.push(ret[i]);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
if (riskCount == 0) riskCount = 1
|
if (riskCount == 0) riskCount = 1;
|
||||||
let riskHeight = 65 * riskCount
|
let riskHeight = 65 * riskCount;
|
||||||
this.setState({
|
this.setState({
|
||||||
data: ret,
|
data: ret,
|
||||||
dataRiskMore: dataRiskMore,
|
dataRiskMore: dataRiskMore,
|
||||||
riskCount: riskCount,
|
riskCount: riskCount,
|
||||||
opEnd: opEnd,
|
opEnd: opEnd,
|
||||||
riskHeight: riskHeight
|
riskHeight: riskHeight,
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
});
|
||||||
|
};
|
||||||
render() {
|
render() {
|
||||||
const { data, riskCount, dataRiskMore, opEnd, riskHeight } = this.state;
|
const { data, riskCount, dataRiskMore, opEnd, riskHeight } = this.state;
|
||||||
const enums = this.props.data.enums ? this.props.data.enums : this.props.app.enums;
|
const enums = this.props.data.enums ? this.props.data.enums : this.props.app.enums;
|
||||||
return <div style={{ textAlign: 'center', margin: "30px 0 0 50px" }}>
|
return (
|
||||||
|
<div style={{ textAlign: 'center', margin: '30px 0 0 50px' }}>
|
||||||
|
<table style={{ marginBottom: '50px' }}>
|
||||||
<table style={{ marginBottom: "50px" }} >
|
<tbody>
|
||||||
<tbody >
|
|
||||||
{/* <tr>
|
{/* <tr>
|
||||||
<td style={{ width: "150px", textAlign: "center" }}>
|
<td style={{ width: "150px", textAlign: "center" }}>
|
||||||
<div className={styles.rectangle} id="step0"></div>
|
<div className={styles.rectangle} id="step0"></div>
|
||||||
@ -97,509 +103,77 @@ class SK006ShowOperateLog extends React.Component {
|
|||||||
</tr> */}
|
</tr> */}
|
||||||
|
|
||||||
{/* 检查任务 */}
|
{/* 检查任务 */}
|
||||||
<tr>
|
|
||||||
<td style={{ width: "150px", textAlign: "center" }}>
|
{data &&
|
||||||
<div className={styles.step} id="ste1">安全检查通知</div>
|
data?.map((item, index) => {
|
||||||
<div className={styles.rectangle} id="step1"></div>
|
// 判断当前item的logList中是否所有STATUS都是0
|
||||||
</td>
|
const allStatusZero = item.logList?.every((log) => log.STATUS === 0);
|
||||||
<td colSpan={10} style={{ paddingLeft: "30px" }}>
|
|
||||||
<div className={styles.flowchartx} >
|
|
||||||
{
|
{
|
||||||
data && data[0]?.map((item, index) => {
|
return (
|
||||||
let resultdiv = []
|
<div style={{ display: 'flex', flexDirection: 'row', alignItems: 'flex-start' }}>
|
||||||
for (let i = 0; i < 2; i++) {
|
<div style={{ width: '150px', textAlign: 'center', marginRight: '30px' }}>
|
||||||
if (i == 0) {
|
<div className={allStatusZero ? styles.stepno : styles.step} id="ste1">
|
||||||
resultdiv.push(
|
{item.FORM_NAME}
|
||||||
item.OPERTETIME ?
|
</div>
|
||||||
(
|
{index < data.length - 1 && (
|
||||||
//有操作
|
<div className={allStatusZero ? styles.rectangleno : styles.rectangle} id="step1"></div>
|
||||||
item.ISINTTIME ?
|
)}
|
||||||
(//按时完成 绿色
|
</div>
|
||||||
|
<div className={styles.logListContainer}>
|
||||||
|
<div className={styles.flowchartx}>
|
||||||
|
{item.logList &&
|
||||||
|
item.logList.map((item1, index1) => {
|
||||||
|
{
|
||||||
|
return (
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
display: 'flex',
|
||||||
|
flexDirection: 'row',
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'center',
|
||||||
|
}}
|
||||||
|
key={index1}
|
||||||
|
>
|
||||||
<div>
|
<div>
|
||||||
<div className={styles.stepx} id="step01">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
<div
|
||||||
<div id="step02" className={styles.discribeSpan}>
|
className={
|
||||||
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
item1.STATUS == 0
|
||||||
<span className={styles.discribeSpanTime}> 时间：{ShowDateTime(item.OPERTETIME, "MM-dd HH:mm")}</span>
|
? styles.stepxEnable
|
||||||
</div>
|
: item1.STATUS == 5
|
||||||
</div>
|
? styles.stepx
|
||||||
)
|
: styles.stepxOutTime
|
||||||
:
|
|
||||||
( //超时完成 橙色
|
|
||||||
<div>
|
|
||||||
<div className={styles.stepxOutTime} id="step01">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
|
||||||
<div id="step02" className={styles.discribeSpan}>
|
|
||||||
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
|
||||||
<span className={styles.discribeSpanTime}> 时间：{ShowDateTime(item.OPERTETIME, "MM-dd HH:mm")}</span>
|
|
||||||
</div>
|
|
||||||
</div>)
|
|
||||||
)
|
|
||||||
:
|
|
||||||
(
|
|
||||||
//没有操作 灰色
|
|
||||||
item.USRTNAME ? (
|
|
||||||
//有用户信息 写入用户
|
|
||||||
<div>
|
|
||||||
<div className={styles.stepxEnable} id="step01">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
|
||||||
<div id="step02" className={styles.discribeSpan}>
|
|
||||||
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
|
||||||
<span className={styles.discribeSpanTime}> 时间：</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
) : (
|
|
||||||
//没有用户信息
|
|
||||||
<div>
|
|
||||||
<div className={styles.stepxEnable} id="step01">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
)
|
|
||||||
)
|
|
||||||
} else if (index != data[0].length - 1) {
|
|
||||||
resultdiv.push(
|
|
||||||
<div className={styles.linex}></div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return resultdiv
|
|
||||||
})
|
|
||||||
}
|
}
|
||||||
|
id="step20"
|
||||||
|
>
|
||||||
|
{item1.NAME}
|
||||||
</div>
|
</div>
|
||||||
</td>
|
<div id="step21" className={styles.discribeSpan}>
|
||||||
</tr>
|
<span className={styles.discribeSpanUser}> 用户：{item1.USER_NAME}</span>
|
||||||
|
<span className={styles.discribeSpanTime}>
|
||||||
|
{' '}
|
||||||
|
时间：{ShowDateTime(item1.DEAL_DATE, 'MM-dd HH:mm')}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{index1 < item.logList.length - 1 ? <div className={styles.linex}></div> : null}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
})}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
})}
|
||||||
|
|
||||||
{/* 检查任务 */}
|
{/* 检查任务 */}
|
||||||
|
|
||||||
{/* 检查记录 */}
|
|
||||||
<tr>
|
|
||||||
<td style={{ width: "150px", textAlign: "center" }}>
|
|
||||||
<div className={styles.step} id="ste2">安全检查记录</div>
|
|
||||||
<div className={styles.rectangle} id="step2"></div>
|
|
||||||
</td>
|
|
||||||
<td colSpan={10} style={{ paddingLeft: "30px" }}>
|
|
||||||
<div className={styles.flowchartx} >
|
|
||||||
{
|
|
||||||
data && data[1]?.map((item, index) => {
|
|
||||||
let resultdiv = []
|
|
||||||
for (let i = 0; i < 2; i++) {
|
|
||||||
if (i == 0) {
|
|
||||||
resultdiv.push(
|
|
||||||
item.OPERTETIME ?
|
|
||||||
(
|
|
||||||
//有操作
|
|
||||||
item.ISINTTIME ?
|
|
||||||
(//按时完成 绿色
|
|
||||||
<div>
|
|
||||||
<div className={styles.stepx} id="step20">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
|
||||||
<div id="step21" className={styles.discribeSpan}>
|
|
||||||
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
|
||||||
<span className={styles.discribeSpanTime}> 时间：{ShowDateTime(item.OPERTETIME, "MM-dd HH:mm")}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
:
|
|
||||||
( //超时完成 橙色
|
|
||||||
<div>
|
|
||||||
<div className={styles.stepxOutTime} id="step20">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
|
||||||
<div id="step21" className={styles.discribeSpan}>
|
|
||||||
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
|
||||||
<span className={styles.discribeSpanTime}> 时间：{ShowDateTime(item.OPERTETIME, "MM-dd HH:mm")}</span>
|
|
||||||
</div>
|
|
||||||
</div>)
|
|
||||||
)
|
|
||||||
:
|
|
||||||
(
|
|
||||||
//没有操作 灰色
|
|
||||||
item.USRTNAME ? (
|
|
||||||
//有用户信息 写入用户
|
|
||||||
<div>
|
|
||||||
<div className={styles.stepxEnable} id="step20">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
|
||||||
<div id="step21" className={styles.discribeSpan}>
|
|
||||||
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
|
||||||
<span className={styles.discribeSpanTime}> 时间：</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
) : (
|
|
||||||
//没有用户信息
|
|
||||||
<div>
|
|
||||||
<div className={styles.stepxEnable} id="step20">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
)
|
|
||||||
)
|
|
||||||
} else if (index != data[1].length - 1) {
|
|
||||||
resultdiv.push(
|
|
||||||
<div className={styles.linex}></div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return resultdiv
|
|
||||||
})
|
|
||||||
}
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
{/* 检查记录 */}
|
|
||||||
|
|
||||||
{/* 检查记录汇总 */}
|
|
||||||
<tr>
|
|
||||||
<td style={{ width: "150px", textAlign: "center" }}>
|
|
||||||
<div className={styles.step} id="ste3">安全检查记录汇总</div>
|
|
||||||
<div className={styles.rectangle} id="step3"></div>
|
|
||||||
</td>
|
|
||||||
<td colSpan={10} style={{ paddingLeft: "30px" }}>
|
|
||||||
<div className={styles.flowchartx} >
|
|
||||||
{
|
|
||||||
data && data[2]?.map((item, index) => {
|
|
||||||
let resultdiv = []
|
|
||||||
for (let i = 0; i < 2; i++) {
|
|
||||||
if (i == 0) {
|
|
||||||
resultdiv.push(
|
|
||||||
item.OPERTETIME ?
|
|
||||||
(
|
|
||||||
//有操作
|
|
||||||
item.ISINTTIME ?
|
|
||||||
(//按时完成 绿色
|
|
||||||
<div>
|
|
||||||
<div className={styles.stepx} id="step30">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
|
||||||
<div id="step31" className={styles.discribeSpan}>
|
|
||||||
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
|
||||||
<span className={styles.discribeSpanTime}> 时间：{ShowDateTime(item.OPERTETIME, "MM-dd HH:mm")}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
:
|
|
||||||
( //超时完成 橙色
|
|
||||||
<div>
|
|
||||||
<div className={styles.stepxOutTime} id="step30">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
|
||||||
<div id="step31" className={styles.discribeSpan}>
|
|
||||||
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
|
||||||
<span className={styles.discribeSpanTime}> 时间：{ShowDateTime(item.OPERTETIME, "MM-dd HH:mm")}</span>
|
|
||||||
</div>
|
|
||||||
</div>)
|
|
||||||
)
|
|
||||||
:
|
|
||||||
(
|
|
||||||
//没有操作 灰色
|
|
||||||
item.USRTNAME ? (
|
|
||||||
//有用户信息 写入用户
|
|
||||||
<div>
|
|
||||||
<div className={styles.stepxEnable} id="step30">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
|
||||||
<div id="step31" className={styles.discribeSpan}>
|
|
||||||
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
|
||||||
<span className={styles.discribeSpanTime}> 时间：</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
) : (
|
|
||||||
//没有用户信息
|
|
||||||
<div>
|
|
||||||
<div className={styles.stepxEnable} id="step30">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
)
|
|
||||||
)
|
|
||||||
} else if (index != data[2].length - 1) {
|
|
||||||
resultdiv.push(
|
|
||||||
<div className={styles.linex}></div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return resultdiv
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
{/* 检查记录汇总 */}
|
|
||||||
|
|
||||||
{/* 隐患上报 */}
|
|
||||||
<tr>
|
|
||||||
<td style={{ width: "150px", textAlign: "center" }}>
|
|
||||||
<div className={styles.step} id="ste4">隐患上报</div>
|
|
||||||
<div className={styles.rectangle} id="step4"></div>
|
|
||||||
</td>
|
|
||||||
<td colSpan={10} style={{ paddingLeft: "30px" }}>
|
|
||||||
<div className={styles.flowchartx} >
|
|
||||||
{
|
|
||||||
data && data[3]?.map((item, index) => {
|
|
||||||
let resultdiv = []
|
|
||||||
for (let i = 0; i < 2; i++) {
|
|
||||||
if (i == 0) {
|
|
||||||
resultdiv.push(
|
|
||||||
item.OPERTETIME ?
|
|
||||||
(
|
|
||||||
//有操作
|
|
||||||
item.ISINTTIME ?
|
|
||||||
(//按时完成 绿色
|
|
||||||
<div>
|
|
||||||
<div className={styles.stepx} id="step40">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
|
||||||
<div id="step41" className={styles.discribeSpan}>
|
|
||||||
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
|
||||||
<span className={styles.discribeSpanTime}> 时间：{ShowDateTime(item.OPERTETIME, "MM-dd HH:mm")}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
:
|
|
||||||
( //超时完成 橙色
|
|
||||||
<div>
|
|
||||||
<div className={styles.stepxOutTime} id="step40">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
|
||||||
<div id="step41" className={styles.discribeSpan}>
|
|
||||||
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
|
||||||
<span className={styles.discribeSpanTime}> 时间：{ShowDateTime(item.OPERTETIME, "MM-dd HH:mm")}</span>
|
|
||||||
</div>
|
|
||||||
</div>)
|
|
||||||
)
|
|
||||||
:
|
|
||||||
(
|
|
||||||
//没有操作 灰色
|
|
||||||
item.USRTNAME ? (
|
|
||||||
//有用户信息 写入用户
|
|
||||||
<div>
|
|
||||||
<div className={styles.stepxEnable} id="step40">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
|
||||||
<div id="step41" className={styles.discribeSpan}>
|
|
||||||
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
|
||||||
<span className={styles.discribeSpanTime}> 时间：</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
) : (
|
|
||||||
//没有用户信息
|
|
||||||
<div>
|
|
||||||
<div className={styles.stepxEnable} id="step40">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
)
|
|
||||||
)
|
|
||||||
} else if (index != data[3].length - 1) {
|
|
||||||
resultdiv.push(
|
|
||||||
<div className={styles.linex}></div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return resultdiv
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
{/* 隐患上报 */}
|
|
||||||
|
|
||||||
{/* 隐患确认单 */}
|
|
||||||
<tr>
|
|
||||||
<td style={{ width: "150px", textAlign: "center" }}>
|
|
||||||
<div className={styles.step} id="ste5">隐患确认单</div>
|
|
||||||
<div className={styles.rectangle} id="step5"></div>
|
|
||||||
</td>
|
|
||||||
<td colSpan={10} style={{ paddingLeft: "30px" }}>
|
|
||||||
<div className={styles.flowchartx} >
|
|
||||||
{
|
|
||||||
data && data[4]?.map((item, index) => {
|
|
||||||
let resultdiv = []
|
|
||||||
for (let i = 0; i < 2; i++) {
|
|
||||||
if (i == 0) {
|
|
||||||
resultdiv.push(
|
|
||||||
item.OPERTETIME ?
|
|
||||||
(
|
|
||||||
//有操作
|
|
||||||
item.ISINTTIME ?
|
|
||||||
(//按时完成 绿色
|
|
||||||
<div>
|
|
||||||
<div className={styles.stepx} id="step50">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
|
||||||
<div id="step51" className={styles.discribeSpan}>
|
|
||||||
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
|
||||||
<span className={styles.discribeSpanTime}> 时间：{ShowDateTime(item.OPERTETIME, "MM-dd HH:mm")}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
:
|
|
||||||
( //超时完成 橙色
|
|
||||||
<div>
|
|
||||||
<div className={styles.stepxOutTime} id="step50">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
|
||||||
<div id="step51" className={styles.discribeSpan}>
|
|
||||||
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
|
||||||
<span className={styles.discribeSpanTime}> 时间：{ShowDateTime(item.OPERTETIME, "MM-dd HH:mm")}</span>
|
|
||||||
</div>
|
|
||||||
</div>)
|
|
||||||
)
|
|
||||||
:
|
|
||||||
(
|
|
||||||
//没有操作 灰色
|
|
||||||
item.USRTNAME ? (
|
|
||||||
//有用户信息 写入用户
|
|
||||||
<div>
|
|
||||||
<div className={styles.stepxEnable} id="step50">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
|
||||||
<div id="step51" className={styles.discribeSpan}>
|
|
||||||
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
|
||||||
<span className={styles.discribeSpanTime}> 时间：</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
) : (
|
|
||||||
//没有用户信息
|
|
||||||
<div>
|
|
||||||
<div className={styles.stepxEnable} id="step50">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
)
|
|
||||||
)
|
|
||||||
} else if (index != data[4].length - 1) {
|
|
||||||
resultdiv.push(
|
|
||||||
<div className={styles.linex}></div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return resultdiv
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
{/* 隐患确认单 */}
|
|
||||||
|
|
||||||
{/* 隐患整改通知 */}
|
|
||||||
<tr>
|
|
||||||
<td style={{ width: "150px", textAlign: "center" }}>
|
|
||||||
<div className={styles.step} id="ste6">隐患整改通知</div>
|
|
||||||
<div className={styles.rectangle} id="step6"></div>
|
|
||||||
</td>
|
|
||||||
<td colSpan={10} style={{ paddingLeft: "30px" }}>
|
|
||||||
<div className={styles.flowchartx} >
|
|
||||||
{
|
|
||||||
data && data[5]?.map((item, index) => {
|
|
||||||
let resultdiv = []
|
|
||||||
for (let i = 0; i < 2; i++) {
|
|
||||||
if (i == 0) {
|
|
||||||
resultdiv.push(
|
|
||||||
item.OPERTETIME ?
|
|
||||||
(
|
|
||||||
//有操作
|
|
||||||
item.ISINTTIME ?
|
|
||||||
(//按时完成 绿色
|
|
||||||
<div>
|
|
||||||
<div className={styles.stepx} id="step60">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
|
||||||
<div id="step61" className={styles.discribeSpan}>
|
|
||||||
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
|
||||||
<span className={styles.discribeSpanTime}> 时间：{ShowDateTime(item.OPERTETIME, "MM-dd HH:mm")}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
:
|
|
||||||
( //超时完成 橙色
|
|
||||||
<div>
|
|
||||||
<div className={styles.stepxOutTime} id="step60">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
|
||||||
<div id="step61" className={styles.discribeSpan}>
|
|
||||||
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
|
||||||
<span className={styles.discribeSpanTime}> 时间：{ShowDateTime(item.OPERTETIME, "MM-dd HH:mm")}</span>
|
|
||||||
</div>
|
|
||||||
</div>)
|
|
||||||
)
|
|
||||||
:
|
|
||||||
(
|
|
||||||
//没有操作 灰色
|
|
||||||
item.USRTNAME ? (
|
|
||||||
//有用户信息 写入用户
|
|
||||||
<div>
|
|
||||||
<div className={styles.stepxEnable} id="step60">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
|
||||||
<div id="step61" className={styles.discribeSpan}>
|
|
||||||
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
|
||||||
<span className={styles.discribeSpanTime}> 时间：</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
) : (
|
|
||||||
//没有用户信息
|
|
||||||
<div>
|
|
||||||
<div className={styles.stepxEnable} id="step60">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
)
|
|
||||||
)
|
|
||||||
} else if (index != data[5].length - 1) {
|
|
||||||
resultdiv.push(
|
|
||||||
<div className={styles.linex}></div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return resultdiv
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
{/* 隐患整改通知 */}
|
|
||||||
|
|
||||||
{/* 隐患整改记录 */}
|
|
||||||
<tr>
|
|
||||||
<td style={{ width: "150px", textAlign: "center" }}>
|
|
||||||
<div className={styles.step} id="ste7">隐患整改记录</div>
|
|
||||||
{/* <div className={styles.rectangle} id="step7"></div> */}
|
|
||||||
</td>
|
|
||||||
<td colSpan={10} style={{ paddingLeft: "30px" }}>
|
|
||||||
<div className={styles.flowchartx} >
|
|
||||||
{
|
|
||||||
data && data[6]?.map((item, index) => {
|
|
||||||
let resultdiv = []
|
|
||||||
for (let i = 0; i < 2; i++) {
|
|
||||||
if (i == 0) {
|
|
||||||
resultdiv.push(
|
|
||||||
item.OPERTETIME ?
|
|
||||||
(
|
|
||||||
//有操作
|
|
||||||
item.ISINTTIME ?
|
|
||||||
(//按时完成 绿色
|
|
||||||
<div>
|
|
||||||
<div className={styles.stepx} id="step70">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
|
||||||
<div id="step71" className={styles.discribeSpan}>
|
|
||||||
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
|
||||||
<span className={styles.discribeSpanTime}> 时间：{ShowDateTime(item.OPERTETIME, "MM-dd HH:mm")}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
:
|
|
||||||
( //超时完成 橙色
|
|
||||||
<div>
|
|
||||||
<div className={styles.stepxOutTime} id="step70">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
|
||||||
<div id="step71" className={styles.discribeSpan}>
|
|
||||||
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
|
||||||
<span className={styles.discribeSpanTime}> 时间：{ShowDateTime(item.OPERTETIME, "MM-dd HH:mm")}</span>
|
|
||||||
</div>
|
|
||||||
</div>)
|
|
||||||
)
|
|
||||||
:
|
|
||||||
(
|
|
||||||
//没有操作 灰色
|
|
||||||
item.USRTNAME ? (
|
|
||||||
//有用户信息 写入用户
|
|
||||||
<div>
|
|
||||||
<div className={styles.stepxEnable} id="step70">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
|
||||||
<div id="step71" className={styles.discribeSpan}>
|
|
||||||
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
|
||||||
<span className={styles.discribeSpanTime}> 时间：</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
) : (
|
|
||||||
//没有用户信息
|
|
||||||
<div>
|
|
||||||
<div className={styles.stepxEnable} id="step70">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
)
|
|
||||||
)
|
|
||||||
} else if (index != data[6].length - 1) {
|
|
||||||
resultdiv.push(
|
|
||||||
<div className={styles.linex}></div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return resultdiv
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
{/* 隐患整改记录 */}
|
{/* 隐患整改记录 */}
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
export default connect(({ login, app }) => ({ login, app }))(SK006ShowOperateLog)
|
export default connect(({ login, app }) => ({ login, app }))(SK006ShowOperateLog);
|
||||||
|
|||||||
605
src/components/CustomPages/SK/SK006ShowOperateLogOld.js
Normal file
605
src/components/CustomPages/SK/SK006ShowOperateLogOld.js
Normal file
@ -0,0 +1,605 @@
|
|||||||
|
import { Button, Descriptions, Badge, Popconfirm, Row, Col, Form, Input, Select, Table } from 'antd';
|
||||||
|
import React from 'react';
|
||||||
|
import { initFilter, extendRule, extendInclude, setDataFieldValue, showApprove, guid, ShowDateTime } from '../../../utils/common.js';
|
||||||
|
import ReactToPrint from 'react-to-print';
|
||||||
|
import { ExportToExcel } from '@woowalker/feui'
|
||||||
|
import XLSX from 'xlsx';
|
||||||
|
import { connect } from 'dva';
|
||||||
|
import moment from 'moment';
|
||||||
|
import { message } from 'antd/lib/index';
|
||||||
|
import styles from '../../../components/CustomPages/HI/OperateLog.css';
|
||||||
|
import config from '../../../config.js';
|
||||||
|
|
||||||
|
class SK006ShowOperateLog extends React.Component {
|
||||||
|
constructor(props) {
|
||||||
|
super(props);
|
||||||
|
this.state = {
|
||||||
|
data: null,
|
||||||
|
riskCount: 1,
|
||||||
|
riskHeight: 50,
|
||||||
|
opEnd: null
|
||||||
|
// dateFirst: [
|
||||||
|
// [{ OPERATEPOINT: 10 }, { OPERATEPOINT: 20 }, { OPERATEPOINT: 30 }, { OPERATEPOINT: 40 }],
|
||||||
|
// [{ OPERATEPOINT: 48 }, { OPERATEPOINT: 50 }, { OPERATEPOINT: 60 }, { OPERATEPOINT: 70 }, { OPERATEPOINT: 80 }],
|
||||||
|
// [{ OPERATEPOINT: 130 }],
|
||||||
|
// [
|
||||||
|
// [{ OPERATEPOINT: 140 }, { OPERATEPOINT: 150 }, { OPERATEPOINT: 160 }, { OPERATEPOINT: 180 }, { OPERATEPOINT: 190 }, { OPERATEPOINT: 200 }, { OPERATEPOINT: 210 }, { OPERATEPOINT: 220 }]
|
||||||
|
// ]
|
||||||
|
// ]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
componentDidMount() {
|
||||||
|
if (this.props.data?.id)
|
||||||
|
this.loadData(this.props.data?.id);
|
||||||
|
}
|
||||||
|
|
||||||
|
componentWillReceiveProps(NextProps) {
|
||||||
|
if (NextProps.data?.id && this.props.data?.id != NextProps.data?.id) {
|
||||||
|
this.loadData(NextProps.data?.id);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
loadData = (id) => {
|
||||||
|
var orgId = this.props.login ? this.props.login.OrgId : '';
|
||||||
|
let json = initFilter(orgId, id);
|
||||||
|
this.props.dispatch({
|
||||||
|
type: 'app/getDataByPost',
|
||||||
|
payload: json,
|
||||||
|
url: 'SK/SKSecurityInspectionNotice/SKOrderEntities',
|
||||||
|
onComplete: (ret) => {
|
||||||
|
if (ret) {
|
||||||
|
let riskCount = 1
|
||||||
|
riskCount = ret.length - 3
|
||||||
|
var isEnd = false
|
||||||
|
var opEnd = null
|
||||||
|
if (ret[ret.length - 1].length == 1 && ret[ret.length - 1][0].OPERATEPOINT == 220) {
|
||||||
|
isEnd = true
|
||||||
|
riskCount = riskCount - 1
|
||||||
|
opEnd = ret[ret.length - 1][0]
|
||||||
|
}
|
||||||
|
|
||||||
|
let dataRiskMore = []
|
||||||
|
if (riskCount > 0) {
|
||||||
|
var countOpeate = ret.length
|
||||||
|
if (isEnd) countOpeate--
|
||||||
|
for (let i = 4; i < countOpeate; i++) {
|
||||||
|
dataRiskMore.push(ret[i])
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (riskCount == 0) riskCount = 1
|
||||||
|
let riskHeight = 65 * riskCount
|
||||||
|
this.setState({
|
||||||
|
data: ret,
|
||||||
|
dataRiskMore: dataRiskMore,
|
||||||
|
riskCount: riskCount,
|
||||||
|
opEnd: opEnd,
|
||||||
|
riskHeight: riskHeight
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
render() {
|
||||||
|
const { data, riskCount, dataRiskMore, opEnd, riskHeight } = this.state;
|
||||||
|
const enums = this.props.data.enums ? this.props.data.enums : this.props.app.enums;
|
||||||
|
return <div style={{ textAlign: 'center', margin: "30px 0 0 50px" }}>
|
||||||
|
|
||||||
|
|
||||||
|
<table style={{ marginBottom: "50px" }} >
|
||||||
|
<tbody >
|
||||||
|
{/* <tr>
|
||||||
|
<td style={{ width: "150px", textAlign: "center" }}>
|
||||||
|
<div className={styles.rectangle} id="step0"></div>
|
||||||
|
</td>
|
||||||
|
<td colSpan={10}>
|
||||||
|
</td>
|
||||||
|
</tr> */}
|
||||||
|
|
||||||
|
{/* 检查任务 */}
|
||||||
|
<tr>
|
||||||
|
<td style={{ width: "150px", textAlign: "center" }}>
|
||||||
|
<div className={styles.step} id="ste1">安全检查通知</div>
|
||||||
|
<div className={styles.rectangle} id="step1"></div>
|
||||||
|
</td>
|
||||||
|
<td colSpan={10} style={{ paddingLeft: "30px" }}>
|
||||||
|
<div className={styles.flowchartx} >
|
||||||
|
{
|
||||||
|
data && data[0]?.map((item, index) => {
|
||||||
|
let resultdiv = []
|
||||||
|
for (let i = 0; i < 2; i++) {
|
||||||
|
if (i == 0) {
|
||||||
|
resultdiv.push(
|
||||||
|
item.OPERTETIME ?
|
||||||
|
(
|
||||||
|
//有操作
|
||||||
|
item.ISINTTIME ?
|
||||||
|
(//按时完成 绿色
|
||||||
|
<div>
|
||||||
|
<div className={styles.stepx} id="step01">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
||||||
|
<div id="step02" className={styles.discribeSpan}>
|
||||||
|
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
||||||
|
<span className={styles.discribeSpanTime}> 时间：{ShowDateTime(item.OPERTETIME, "MM-dd HH:mm")}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
:
|
||||||
|
( //超时完成 橙色
|
||||||
|
<div>
|
||||||
|
<div className={styles.stepxOutTime} id="step01">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
||||||
|
<div id="step02" className={styles.discribeSpan}>
|
||||||
|
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
||||||
|
<span className={styles.discribeSpanTime}> 时间：{ShowDateTime(item.OPERTETIME, "MM-dd HH:mm")}</span>
|
||||||
|
</div>
|
||||||
|
</div>)
|
||||||
|
)
|
||||||
|
:
|
||||||
|
(
|
||||||
|
//没有操作 灰色
|
||||||
|
item.USRTNAME ? (
|
||||||
|
//有用户信息 写入用户
|
||||||
|
<div>
|
||||||
|
<div className={styles.stepxEnable} id="step01">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
||||||
|
<div id="step02" className={styles.discribeSpan}>
|
||||||
|
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
||||||
|
<span className={styles.discribeSpanTime}> 时间：</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
//没有用户信息
|
||||||
|
<div>
|
||||||
|
<div className={styles.stepxEnable} id="step01">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
} else if (index != data[0].length - 1) {
|
||||||
|
resultdiv.push(
|
||||||
|
<div className={styles.linex}></div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return resultdiv
|
||||||
|
})
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
{/* 检查任务 */}
|
||||||
|
|
||||||
|
{/* 检查记录 */}
|
||||||
|
<tr>
|
||||||
|
<td style={{ width: "150px", textAlign: "center" }}>
|
||||||
|
<div className={styles.step} id="ste2">安全检查记录</div>
|
||||||
|
<div className={styles.rectangle} id="step2"></div>
|
||||||
|
</td>
|
||||||
|
<td colSpan={10} style={{ paddingLeft: "30px" }}>
|
||||||
|
<div className={styles.flowchartx} >
|
||||||
|
{
|
||||||
|
data && data[1]?.map((item, index) => {
|
||||||
|
let resultdiv = []
|
||||||
|
for (let i = 0; i < 2; i++) {
|
||||||
|
if (i == 0) {
|
||||||
|
resultdiv.push(
|
||||||
|
item.OPERTETIME ?
|
||||||
|
(
|
||||||
|
//有操作
|
||||||
|
item.ISINTTIME ?
|
||||||
|
(//按时完成 绿色
|
||||||
|
<div>
|
||||||
|
<div className={styles.stepx} id="step20">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
||||||
|
<div id="step21" className={styles.discribeSpan}>
|
||||||
|
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
||||||
|
<span className={styles.discribeSpanTime}> 时间：{ShowDateTime(item.OPERTETIME, "MM-dd HH:mm")}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
:
|
||||||
|
( //超时完成 橙色
|
||||||
|
<div>
|
||||||
|
<div className={styles.stepxOutTime} id="step20">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
||||||
|
<div id="step21" className={styles.discribeSpan}>
|
||||||
|
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
||||||
|
<span className={styles.discribeSpanTime}> 时间：{ShowDateTime(item.OPERTETIME, "MM-dd HH:mm")}</span>
|
||||||
|
</div>
|
||||||
|
</div>)
|
||||||
|
)
|
||||||
|
:
|
||||||
|
(
|
||||||
|
//没有操作 灰色
|
||||||
|
item.USRTNAME ? (
|
||||||
|
//有用户信息 写入用户
|
||||||
|
<div>
|
||||||
|
<div className={styles.stepxEnable} id="step20">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
||||||
|
<div id="step21" className={styles.discribeSpan}>
|
||||||
|
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
||||||
|
<span className={styles.discribeSpanTime}> 时间：</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
//没有用户信息
|
||||||
|
<div>
|
||||||
|
<div className={styles.stepxEnable} id="step20">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
} else if (index != data[1].length - 1) {
|
||||||
|
resultdiv.push(
|
||||||
|
<div className={styles.linex}></div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return resultdiv
|
||||||
|
})
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
{/* 检查记录 */}
|
||||||
|
|
||||||
|
{/* 检查记录汇总 */}
|
||||||
|
<tr>
|
||||||
|
<td style={{ width: "150px", textAlign: "center" }}>
|
||||||
|
<div className={styles.step} id="ste3">安全检查记录汇总</div>
|
||||||
|
<div className={styles.rectangle} id="step3"></div>
|
||||||
|
</td>
|
||||||
|
<td colSpan={10} style={{ paddingLeft: "30px" }}>
|
||||||
|
<div className={styles.flowchartx} >
|
||||||
|
{
|
||||||
|
data && data[2]?.map((item, index) => {
|
||||||
|
let resultdiv = []
|
||||||
|
for (let i = 0; i < 2; i++) {
|
||||||
|
if (i == 0) {
|
||||||
|
resultdiv.push(
|
||||||
|
item.OPERTETIME ?
|
||||||
|
(
|
||||||
|
//有操作
|
||||||
|
item.ISINTTIME ?
|
||||||
|
(//按时完成 绿色
|
||||||
|
<div>
|
||||||
|
<div className={styles.stepx} id="step30">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
||||||
|
<div id="step31" className={styles.discribeSpan}>
|
||||||
|
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
||||||
|
<span className={styles.discribeSpanTime}> 时间：{ShowDateTime(item.OPERTETIME, "MM-dd HH:mm")}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
:
|
||||||
|
( //超时完成 橙色
|
||||||
|
<div>
|
||||||
|
<div className={styles.stepxOutTime} id="step30">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
||||||
|
<div id="step31" className={styles.discribeSpan}>
|
||||||
|
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
||||||
|
<span className={styles.discribeSpanTime}> 时间：{ShowDateTime(item.OPERTETIME, "MM-dd HH:mm")}</span>
|
||||||
|
</div>
|
||||||
|
</div>)
|
||||||
|
)
|
||||||
|
:
|
||||||
|
(
|
||||||
|
//没有操作 灰色
|
||||||
|
item.USRTNAME ? (
|
||||||
|
//有用户信息 写入用户
|
||||||
|
<div>
|
||||||
|
<div className={styles.stepxEnable} id="step30">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
||||||
|
<div id="step31" className={styles.discribeSpan}>
|
||||||
|
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
||||||
|
<span className={styles.discribeSpanTime}> 时间：</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
//没有用户信息
|
||||||
|
<div>
|
||||||
|
<div className={styles.stepxEnable} id="step30">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
} else if (index != data[2].length - 1) {
|
||||||
|
resultdiv.push(
|
||||||
|
<div className={styles.linex}></div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return resultdiv
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
{/* 检查记录汇总 */}
|
||||||
|
|
||||||
|
{/* 隐患上报 */}
|
||||||
|
<tr>
|
||||||
|
<td style={{ width: "150px", textAlign: "center" }}>
|
||||||
|
<div className={styles.step} id="ste4">隐患上报</div>
|
||||||
|
<div className={styles.rectangle} id="step4"></div>
|
||||||
|
</td>
|
||||||
|
<td colSpan={10} style={{ paddingLeft: "30px" }}>
|
||||||
|
<div className={styles.flowchartx} >
|
||||||
|
{
|
||||||
|
data && data[3]?.map((item, index) => {
|
||||||
|
let resultdiv = []
|
||||||
|
for (let i = 0; i < 2; i++) {
|
||||||
|
if (i == 0) {
|
||||||
|
resultdiv.push(
|
||||||
|
item.OPERTETIME ?
|
||||||
|
(
|
||||||
|
//有操作
|
||||||
|
item.ISINTTIME ?
|
||||||
|
(//按时完成 绿色
|
||||||
|
<div>
|
||||||
|
<div className={styles.stepx} id="step40">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
||||||
|
<div id="step41" className={styles.discribeSpan}>
|
||||||
|
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
||||||
|
<span className={styles.discribeSpanTime}> 时间：{ShowDateTime(item.OPERTETIME, "MM-dd HH:mm")}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
:
|
||||||
|
( //超时完成 橙色
|
||||||
|
<div>
|
||||||
|
<div className={styles.stepxOutTime} id="step40">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
||||||
|
<div id="step41" className={styles.discribeSpan}>
|
||||||
|
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
||||||
|
<span className={styles.discribeSpanTime}> 时间：{ShowDateTime(item.OPERTETIME, "MM-dd HH:mm")}</span>
|
||||||
|
</div>
|
||||||
|
</div>)
|
||||||
|
)
|
||||||
|
:
|
||||||
|
(
|
||||||
|
//没有操作 灰色
|
||||||
|
item.USRTNAME ? (
|
||||||
|
//有用户信息 写入用户
|
||||||
|
<div>
|
||||||
|
<div className={styles.stepxEnable} id="step40">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
||||||
|
<div id="step41" className={styles.discribeSpan}>
|
||||||
|
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
||||||
|
<span className={styles.discribeSpanTime}> 时间：</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
//没有用户信息
|
||||||
|
<div>
|
||||||
|
<div className={styles.stepxEnable} id="step40">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
} else if (index != data[3].length - 1) {
|
||||||
|
resultdiv.push(
|
||||||
|
<div className={styles.linex}></div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return resultdiv
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
{/* 隐患上报 */}
|
||||||
|
|
||||||
|
{/* 隐患确认单 */}
|
||||||
|
<tr>
|
||||||
|
<td style={{ width: "150px", textAlign: "center" }}>
|
||||||
|
<div className={styles.step} id="ste5">隐患确认单</div>
|
||||||
|
<div className={styles.rectangle} id="step5"></div>
|
||||||
|
</td>
|
||||||
|
<td colSpan={10} style={{ paddingLeft: "30px" }}>
|
||||||
|
<div className={styles.flowchartx} >
|
||||||
|
{
|
||||||
|
data && data[4]?.map((item, index) => {
|
||||||
|
let resultdiv = []
|
||||||
|
for (let i = 0; i < 2; i++) {
|
||||||
|
if (i == 0) {
|
||||||
|
resultdiv.push(
|
||||||
|
item.OPERTETIME ?
|
||||||
|
(
|
||||||
|
//有操作
|
||||||
|
item.ISINTTIME ?
|
||||||
|
(//按时完成 绿色
|
||||||
|
<div>
|
||||||
|
<div className={styles.stepx} id="step50">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
||||||
|
<div id="step51" className={styles.discribeSpan}>
|
||||||
|
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
||||||
|
<span className={styles.discribeSpanTime}> 时间：{ShowDateTime(item.OPERTETIME, "MM-dd HH:mm")}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
:
|
||||||
|
( //超时完成 橙色
|
||||||
|
<div>
|
||||||
|
<div className={styles.stepxOutTime} id="step50">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
||||||
|
<div id="step51" className={styles.discribeSpan}>
|
||||||
|
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
||||||
|
<span className={styles.discribeSpanTime}> 时间：{ShowDateTime(item.OPERTETIME, "MM-dd HH:mm")}</span>
|
||||||
|
</div>
|
||||||
|
</div>)
|
||||||
|
)
|
||||||
|
:
|
||||||
|
(
|
||||||
|
//没有操作 灰色
|
||||||
|
item.USRTNAME ? (
|
||||||
|
//有用户信息 写入用户
|
||||||
|
<div>
|
||||||
|
<div className={styles.stepxEnable} id="step50">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
||||||
|
<div id="step51" className={styles.discribeSpan}>
|
||||||
|
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
||||||
|
<span className={styles.discribeSpanTime}> 时间：</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
//没有用户信息
|
||||||
|
<div>
|
||||||
|
<div className={styles.stepxEnable} id="step50">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
} else if (index != data[4].length - 1) {
|
||||||
|
resultdiv.push(
|
||||||
|
<div className={styles.linex}></div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return resultdiv
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
{/* 隐患确认单 */}
|
||||||
|
|
||||||
|
{/* 隐患整改通知 */}
|
||||||
|
<tr>
|
||||||
|
<td style={{ width: "150px", textAlign: "center" }}>
|
||||||
|
<div className={styles.step} id="ste6">隐患整改通知</div>
|
||||||
|
<div className={styles.rectangle} id="step6"></div>
|
||||||
|
</td>
|
||||||
|
<td colSpan={10} style={{ paddingLeft: "30px" }}>
|
||||||
|
<div className={styles.flowchartx} >
|
||||||
|
{
|
||||||
|
data && data[5]?.map((item, index) => {
|
||||||
|
let resultdiv = []
|
||||||
|
for (let i = 0; i < 2; i++) {
|
||||||
|
if (i == 0) {
|
||||||
|
resultdiv.push(
|
||||||
|
item.OPERTETIME ?
|
||||||
|
(
|
||||||
|
//有操作
|
||||||
|
item.ISINTTIME ?
|
||||||
|
(//按时完成 绿色
|
||||||
|
<div>
|
||||||
|
<div className={styles.stepx} id="step60">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
||||||
|
<div id="step61" className={styles.discribeSpan}>
|
||||||
|
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
||||||
|
<span className={styles.discribeSpanTime}> 时间：{ShowDateTime(item.OPERTETIME, "MM-dd HH:mm")}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
:
|
||||||
|
( //超时完成 橙色
|
||||||
|
<div>
|
||||||
|
<div className={styles.stepxOutTime} id="step60">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
||||||
|
<div id="step61" className={styles.discribeSpan}>
|
||||||
|
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
||||||
|
<span className={styles.discribeSpanTime}> 时间：{ShowDateTime(item.OPERTETIME, "MM-dd HH:mm")}</span>
|
||||||
|
</div>
|
||||||
|
</div>)
|
||||||
|
)
|
||||||
|
:
|
||||||
|
(
|
||||||
|
//没有操作 灰色
|
||||||
|
item.USRTNAME ? (
|
||||||
|
//有用户信息 写入用户
|
||||||
|
<div>
|
||||||
|
<div className={styles.stepxEnable} id="step60">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
||||||
|
<div id="step61" className={styles.discribeSpan}>
|
||||||
|
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
||||||
|
<span className={styles.discribeSpanTime}> 时间：</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
//没有用户信息
|
||||||
|
<div>
|
||||||
|
<div className={styles.stepxEnable} id="step60">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
} else if (index != data[5].length - 1) {
|
||||||
|
resultdiv.push(
|
||||||
|
<div className={styles.linex}></div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return resultdiv
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
{/* 隐患整改通知 */}
|
||||||
|
|
||||||
|
{/* 隐患整改记录 */}
|
||||||
|
<tr>
|
||||||
|
<td style={{ width: "150px", textAlign: "center" }}>
|
||||||
|
<div className={styles.step} id="ste7">隐患整改记录</div>
|
||||||
|
{/* <div className={styles.rectangle} id="step7"></div> */}
|
||||||
|
</td>
|
||||||
|
<td colSpan={10} style={{ paddingLeft: "30px" }}>
|
||||||
|
<div className={styles.flowchartx} >
|
||||||
|
{
|
||||||
|
data && data[6]?.map((item, index) => {
|
||||||
|
let resultdiv = []
|
||||||
|
for (let i = 0; i < 2; i++) {
|
||||||
|
if (i == 0) {
|
||||||
|
resultdiv.push(
|
||||||
|
item.OPERTETIME ?
|
||||||
|
(
|
||||||
|
//有操作
|
||||||
|
item.ISINTTIME ?
|
||||||
|
(//按时完成 绿色
|
||||||
|
<div>
|
||||||
|
<div className={styles.stepx} id="step70">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
||||||
|
<div id="step71" className={styles.discribeSpan}>
|
||||||
|
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
||||||
|
<span className={styles.discribeSpanTime}> 时间：{ShowDateTime(item.OPERTETIME, "MM-dd HH:mm")}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
:
|
||||||
|
( //超时完成 橙色
|
||||||
|
<div>
|
||||||
|
<div className={styles.stepxOutTime} id="step70">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
||||||
|
<div id="step71" className={styles.discribeSpan}>
|
||||||
|
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
||||||
|
<span className={styles.discribeSpanTime}> 时间：{ShowDateTime(item.OPERTETIME, "MM-dd HH:mm")}</span>
|
||||||
|
</div>
|
||||||
|
</div>)
|
||||||
|
)
|
||||||
|
:
|
||||||
|
(
|
||||||
|
//没有操作 灰色
|
||||||
|
item.USRTNAME ? (
|
||||||
|
//有用户信息 写入用户
|
||||||
|
<div>
|
||||||
|
<div className={styles.stepxEnable} id="step70">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
||||||
|
<div id="step71" className={styles.discribeSpan}>
|
||||||
|
<span className={styles.discribeSpanUser}> 用户：{item.USRTNAME}</span>
|
||||||
|
<span className={styles.discribeSpanTime}> 时间：</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
//没有用户信息
|
||||||
|
<div>
|
||||||
|
<div className={styles.stepxEnable} id="step70">{enums.SKOPERATEPOINT_Enums.enums[item.OPERATEPOINT]}</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
} else if (index != data[6].length - 1) {
|
||||||
|
resultdiv.push(
|
||||||
|
<div className={styles.linex}></div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return resultdiv
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
{/* 隐患整改记录 */}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
}
|
||||||
|
export default connect(({ login, app }) => ({ login, app }))(SK006ShowOperateLog)
|
||||||
Loading…
Reference in New Issue
Block a user