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);