import ModuleTitle from '@/components/ManagementPage/moduleTitle';
import { getDumuDetail } from '@/services/eqSelfInspection';
import { connect, useModel, useParams, useRequest } from '@umijs/max';
import { Affix, Checkbox, Col, Row, Spin, Table } from 'antd';
import { useEffect, useMemo, useState } from 'react';
import styles from './PatrolReportDetail.less';
import DosingFlowCom from './Table/DosingFlowCom';
import Empty from './Table/Empty';
import LiquidLevelCom from './Table/LiquidLevelCom';
import MandateBtn from './Table/MandateBtn';
import PressureGaugeCom from './Table/PressureGaugeCom';
import ReportCom from './Table/ReportCom';
import ReportDumCom from './Table/ReportDumCom';
import WaterInCom from './Table/WaterInCom';
import WaterQualityCom from './Table/WaterQualityCom';
function Detail(props) {
const { data, userList, projectId, dispatch, loading = false } = props;
const { routeId } = useParams();
const { queryMandate } = useModel('useMandate');
const [select, setSelect] = useState();
const [statusCheck, setStatusCheck] = useState([0, 1, 2]);
const sendMessageToUnity = (select, data) => {
setSelect(select);
if (window.HightlightEquipment) {
window.HightlightEquipment(data);
}
};
const result = useMemo(() => {
var resultArr = [];
var tempResult = data?.PatrolResult;
var tempArr = tempResult?.split(';');
const getTextColor = (status) => {
switch (status) {
case '警告':
return {
color: '#FFE26D',
className: styles.warn,
};
case '异常':
return {
color: '#FE5850',
className: styles.error,
};
default:
return {
color: '#12CEB3',
className: '',
};
}
};
if (tempArr?.length > 0) {
tempArr?.forEach((item, index) => {
var tempItem = item;
var itemSplit = tempItem.split(':');
if (itemSplit?.length > 1) {
var label = '';
var value = itemSplit[1];
if (index === 0) label = '设备自检';
else if (index === 1) label = '工艺自检';
else {
label = '安全自检';
value =
data?.secureStatus === 0
? itemSplit[1] !== '异常'
? '正常'
: '异常'
: '异常';
}
resultArr.push({
...getTextColor(value),
label,
value,
});
}
});
}
return resultArr;
}, [data]);
useEffect(() => {
queryMandate({
project_id: projectId,
id: routeId,
});
dispatch({
type: 'eqSelfInspection/fetchUserList',
payload: {
projectId,
},
});
}, []);
return (
自检时间:{data?.CreatedTime}
自检路线:{data?.RouteInfo?.Name}
工艺段:{data?.RouteInfo?.GroupID}
{result.map((item, index) => (
{index == 0 && '自检结果:'}
{item.label}-
{item.value}
))}
{
// 未勾选则认为全部显示
if (check.length == 0) {
setStatusCheck([1, 2, 3]);
} else {
setStatusCheck(check);
}
}}
style={{
width: '70%',
margin: '0 auto',
display: 'flex',
justifyContent: 'center',
marginBottom: '0.3rem',
}}
>
异常数据
警告数据
正常数据
{/* 设备自检报告 */}
{/* 工艺自检报告 */}
{/* 安全自检报告 */}
);
}
function DeviceReport(props) {
const { data } = props;
// 子集是否显示
const [subStatus, setSubStatus] = useState([1, 1, 1, 1, 1, 1]);
const subProps = { ...props, setSubStatus };
// 子集全部隐藏的情况下,父级也隐藏
const show = useMemo(() => {
let total = subStatus.reduce((item, total) => (total += item), 0);
return total > 0;
}, [subStatus]);
const changeStatus = (type, status) => {
setSubStatus((subStatus) => {
let newSubStatus = [...subStatus];
newSubStatus[type] = status;
return newSubStatus;
});
};
// if (!show) return null;
return (
{/* 设备自检报告 */}
设备自检
}
changeStatus={(status) => changeStatus(0, status)}
>
{/* 液位校验 */}
changeStatus(1, status)}
/>
{/* 加药流量校验 */}
changeStatus(2, status)}
/>
changeStatus(3, status)}
/>
changeStatus(4, status)}
/>
changeStatus(5, status)}
/>
);
}
function SecureReport(props) {
const { data } = props;
const [dumuList, setDumuList] = useState([]);
// 子集是否显示
const [subStatus, setSubStatus] = useState([1, 1, 1]);
const subProps = { ...props, setSubStatus };
// 子集全部隐藏的情况下,父级也隐藏
const show = useMemo(() => {
let total = subStatus.reduce((item, total) => (total += item), 0);
return total > 0;
}, [subStatus]);
const changeStatus = (type, status) => {
setSubStatus((subStatus) => {
let newSubStatus = [...subStatus];
newSubStatus[type] = status;
return newSubStatus;
});
};
const { run: detailRun } = useRequest(getDumuDetail, {
manual: true,
fetchKey: (id) => id,
onSuccess: (data) => {
var item = dumuList?.find((child) => child.id === data.id);
if (item) {
item.url = base64ToImageUrl(data.event_bg);
}
setDumuList([...dumuList]);
},
});
useEffect(() => {
setDumuList(data?.dumuList);
data?.dumuList?.map((item) => {
detailRun(item.id);
});
}, [data?.dumuList]);
// if (!show) return null;
return (
{/* 环境异常 */}
changeStatus(0, status)}
>
{/* 安防检测异常 */}
changeStatus(1, status)}
/>
{/* 密闭空间检测异常 */}
changeStatus(2, status)}
>
);
}
function AalysisTable(props) {
const { data = {}, statusCheck } = props;
const { FaultAnalysis } = data;
const errorCount = data?.FaultAnalysis?.length || 0;
const columns = [
{
title: '异常名称',
width: '18%',
dataIndex: 'device_name',
},
// {
// title: '位号',
// width: '15%',
// dataIndex: 'device_code',
// },
{
title: '可能原因',
width: '30%',
render: (record) => record.reason,
},
{
title: '解决方案',
render: (record) => {
if (record.fix_plan instanceof Array) {
return (
{record.fix_plan.map((item) => (
{item.content}
))}
);
} else {
return record.fix_plan;
}
},
},
];
if (statusCheck.length != 3) {
// 不显示异常数据时,隐藏次模块
if (!statusCheck.includes(1)) return null;
// 过滤异常并且此模块没有异常数据时,不显示此模块
if (statusCheck.includes(1) && errorCount == 0) return null;
}
return (
异常({errorCount})
,
}}
pagination={false}
/>
);
}
function base64ToImageUrl(base64String) {
const byteCharacters = atob(base64String);
const byteArrays = [];
for (let i = 0; i < byteCharacters.length; i++) {
byteArrays.push(byteCharacters.charCodeAt(i));
}
const byteArray = new Uint8Array(byteArrays);
const blob = new Blob([byteArray], { type: 'image/png' });
const imageUrl = URL.createObjectURL(blob);
return imageUrl;
}
export default connect(({ eqSelfInspection }) => ({
userList: eqSelfInspection.userList,
mandateInfo: eqSelfInspection.mandateInfo,
}))(Detail);