import {useState, useEffect} from 'react' import {MessageService} from '../services/api' import {Subscribe} from '../services/signalr' import moment from 'moment' import notify from "../components/notify" import '../styles/message.css' import {Table} from "antd"; import LoaderPortal from "./LoaderPortal" // Словарь категорий для строк таблицы const categoryDictionary = { 1: {title: 'Важное'}, 2: {title: 'Предупреждение'}, 3: {title: 'Информация'}, } // Конфигурация таблицы const columns = [ { title: 'Дата', dataIndex: 'date', render: (item) => moment(item).format('DD MMM YYYY, HH:MM:ss'), sorter: (a, b) => new Date(b.date) - new Date(a.date), sortDirections: ['descend', 'ascend'], }, { title: 'Категория', dataIndex: 'categoryId', render: (_, item) => categoryDictionary[item.categoryId].title, style: (_, item) => categoryDictionary[item.categoryId].style, sorter: (a, b) => a.categoryId - b.categoryId, sortDirections: ['descend', 'ascend'], }, { title: 'Сообщение', dataIndex: 'message', onFilter: (value, record) => record.name.indexOf(value) === 0, }, { title: 'Пользователь', dataIndex: 'user', }, ]; export default function ActiveMessagesOnline({idWell}) { const [messages, setMessages] = useState([]) const [loader, setLoader] = useState(false) const handleReceiveMessages = (messages) => { if (messages) { setMessages(messages.items.splice(0, 4)) } } useEffect(() => { setLoader(true) let promiseMessages = MessageService.getMessage(idWell) .then(handleReceiveMessages) .catch((ex) => { notify(`Не удалось загрузить сообщения по скважине "${idWell}"`, 'error') console.log(ex) }) Promise.all([promiseMessages]).then(()=>setLoader(false)) let unSubscribeMessagesHub = Subscribe('hubs/telemetry','ReceiveMessages', `well_${idWell}`, handleReceiveMessages) return () => { unSubscribeMessagesHub() } }, [idWell]) return ( `event_message_${record.categoryId} event_message`} className={'message_table'} size={'small'} pagination={false} rowKey={(record) => record.id} /> ) }