import ModuleTitle from '@/components/ManagementPage/moduleTitle'; import TabsContent from '@/components/TabsContent'; import ThresholdDetail from '@/components/ThresholdDetail'; import { UnityAction } from '@/utils/utils'; import { Collapse, Spin, Table, Tabs } from 'antd'; import { useEffect, useState } from 'react'; import ThresholdBar from './ThresholdBar'; import styles from './VideoAnalysis.less'; const { TabPane } = Tabs; const { Panel } = Collapse; function VideoAnalysis(props) { const { videoNum, data, videoData, loading } = props; const [tab, setTab] = useState('1'); const allCount = Object.values(videoData).reduce( (total, item) => total + item?.length, 0, ); const [prevKey, setPrevKey] = useState(); const [selectedName, setSelectedName] = useState(''); const handleCollapse = (key) => { if (key === prevKey) return; setPrevKey(key); const device = data.list.find((item) => item.id === key)?.device_name; if (device) { UnityAction.sendMsg('SynCam', device); } }; useEffect(() => { UnityAction.on('SynCam', selectedItem); return () => UnityAction.off('SynCam', selectedItem); }, [data?.list]); //滚动到相应位置 const selectedItem = (e) => { setSelectedName(e); const dom = document.querySelector(`div[data-name="${e}"]`); if (dom) { let v = document.getElementById('videoContent'); v.scrollTop = dom.offsetTop; } }; const onTabChange = (tab) => { setTab(tab); // UnityAction.sendMsg('ProcessAnalysisType', tab); }; return ( ), }, { label: `全部(${allCount})`, key: '2', children: , }, ]} onChange={onTabChange} /> ); } function AnalysisContent({ data, selectedName, prevKey }) { const handleImgClick = (item) => { localStorage.setItem('preview', JSON.stringify(item.data)); UnityAction.sendMsg('SensorPic'); }; const renderContent = (key, item) => { let content = ''; switch (key) { case 1: content = ( <>
画面报警:
{item.event_type} handleImgClick(item)} />
); break; case 2: content = ( <>
参数:温度
阈值范围:
状态:异常
); break; case 3: content = ( <>
原液位:12.01
仪表液位:12.12
状态:异常
); break; } return content; }; return (
{data?.length > 0 ? ( data?.map((item) => (
视频报警
} onChange={(e) => { handleCollapse(item.id); }} >
{renderContent(1, item)}
)) ) : ( )}
); } function AllContent({ data = [], videoData = {} }) { const { environment_list = [], fluid_level_list = [] } = videoData; const [selectedRowKeys, setSelectedRowKeys] = useState([]); const columns1 = [ { title: '设备名称', render: (record) => (
{record.device_name}({record.device_code})
), }, { title: '参数', dataIndex: 'patrol_name', key: 'patrol_name', }, { title: '设定值范围', render: (record) => ( onClickThreshold(record)} /> ), }, { title: '状态', dataIndex: 'status', render: (status) => { switch (status) { case -1: case 0: return (
正常
); case 1: return (
异常
); case 2: return (
警告
); } }, }, ]; const columns2 = [ { title: '设备名称', render: (record) => (
{record.device_name}({record.device_code})
), }, { title: '液位数', dataIndex: 'origin_value', key: 'origin_value', }, { title: '差值', dataIndex: 'value', key: 'value', }, { title: '设定值范围', render: (record) => ( onClickThreshold(record)} /> ), }, { title: '状态', dataIndex: 'status', render: (status) => { switch (status) { case -1: case 0: return (
正常
); case 1: return (
异常
); case 2: return (
警告
); } }, }, ]; const columns3 = [ { title: '名称', render: (record) => (
{record.device_name}({record.device_code})
), }, { title: '描述', dataIndex: 'event_type', key: 'event_type', }, { title: '图片', render: (item) => ( handleImgClick(item)} /> ), }, ]; const onSelectRow = (record, index) => { const selectedList = [...selectedRowKeys]; if (selectedList[0] === index) return; selectedList[0] = index; setSelectedRowKeys(selectedList); UnityAction.sendMsg('SynDev', record.DeviceCode); }; const setRowClassName = (record, index) => { return index === selectedRowKeys[0] || record.DeviceCode == selectedRowKeys[0] ? styles.tableSelect : ''; }; return (
({ // onClick: () => onSelectRow(record, index), // })} pagination={false} scroll={{ y: 400 }} />
({ // onClick: () => onSelectRow(record, index), // })} pagination={false} scroll={{ y: 400 }} />
({ // onClick: () => onSelectRow(record, index), // })} pagination={false} scroll={{ y: 400 }} /> ); } export default VideoAnalysis;