|
|
|
@ -1,14 +1,39 @@ |
|
|
|
import React, { useEffect, useState } from 'react' |
|
|
|
import CarouselList from './public/carousel-list'; |
|
|
|
|
|
|
|
import { Tooltip } from 'antd'; |
|
|
|
import { ApiTable, useFsRequest } from '$utils'; |
|
|
|
import moment from 'moment'; |
|
|
|
function AbnormalMonitoring(props) { |
|
|
|
|
|
|
|
const { data: logs = {} } = useFsRequest({ |
|
|
|
url: ApiTable.getLogs, |
|
|
|
query: { |
|
|
|
logState: false |
|
|
|
}, |
|
|
|
// pollingInterval: 10000
|
|
|
|
}); |
|
|
|
|
|
|
|
const dataSource = logs?.rows ? logs?.rows?.map(s => { |
|
|
|
return [ |
|
|
|
<div style={{ color: '#fff' }}> |
|
|
|
<Tooltip placement="top" title={s?.acquisitionTask?.taskName}> |
|
|
|
{s?.acquisitionTask?.taskName?.length > 20 ? s?.acquisitionTask?.taskNamesubstring(0, 20) + '...' : s?.acquisitionTask?.taskName} |
|
|
|
</Tooltip> |
|
|
|
</div>, |
|
|
|
moment(s?.startTime).format('YYYY-MM-DD HH:mm:ss'), |
|
|
|
moment(s?.endTime).valueOf() - moment(s?.startTime).valueOf() + '毫秒', |
|
|
|
<div style={{ color: 'rgba(245, 27, 27, 1)' }}> |
|
|
|
<Tooltip placement="top" title={s?.details}> |
|
|
|
{s?.details?.length > 20 ? s?.details.substring(0, 20) + '...' : s?.details} |
|
|
|
</Tooltip> |
|
|
|
</div> |
|
|
|
] |
|
|
|
}) : [] |
|
|
|
return <div style={{ height: 149, border: '1px solid #50c9d74d', backgroundImage: 'linear-gradient(180deg, rgba(0, 32, 74, 0) 3%, rgba(80, 201, 247, 0.1) 100%)' }}> |
|
|
|
<div className='center-card-title' style={{ marginBottom: 6 }}><div className='_icon_left' />异常监控<div className='_icon_right' /></div> |
|
|
|
<CarouselList |
|
|
|
header={['任务名称', '上次运行时间', '下次运行时间', '异常日志']} |
|
|
|
data={[[<div style={{ color: '#fff' }}>任务名称1</div>, 2, 3, 4], [2, 2, 3, 4], [3, 2, 3, 4], [4, 2, 3, 4], [5, 2, 3, 4]]} |
|
|
|
header={['任务名称', '采集时间', '耗时', '异常日志']} |
|
|
|
data={dataSource} |
|
|
|
rowNum={2} |
|
|
|
height={100} |
|
|
|
multiellipsis |
|
|
|
|
