From cc6f083388554d04a8da1442aca565bee5a0a7f1 Mon Sep 17 00:00:00 2001 From: Alexey Date: Tue, 1 Jun 2021 12:20:29 +0500 Subject: [PATCH] =?UTF-8?q?=D0=A4=D0=B8=D0=BB=D1=8C=D1=82=D1=80=D0=B0?= =?UTF-8?q?=D1=86=D0=B8=D1=8F=20=D1=81=D0=BE=D0=BE=D0=B1=D1=89=D0=B5=D0=BD?= =?UTF-8?q?=D0=B8=D0=B9=20=D0=B2=20=D1=88=D0=B0=D0=BF=D0=BA=D0=B5=20=D1=82?= =?UTF-8?q?=D0=B0=D0=B1=D0=BB=D0=B8=D1=86=D1=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/Messages.jsx | 165 ++++++++++++++++++++++++----------------- 1 file changed, 97 insertions(+), 68 deletions(-) diff --git a/src/pages/Messages.jsx b/src/pages/Messages.jsx index 28c4616..53e6bc8 100644 --- a/src/pages/Messages.jsx +++ b/src/pages/Messages.jsx @@ -1,14 +1,16 @@ -import {Button, Table, Select} from 'antd'; +import {Button, Table, Select, DatePicker, ConfigProvider} from 'antd'; import {MessageService} from '../services/api' import {useState, useEffect} from 'react' import {useParams} from 'react-router-dom' -import {Subscribe} from '../services/signalr' import Loader from '../components/Loader' -import moment from 'moment' import '../styles/message.css' -import Notification from '../components/Notification' +import notify from '../components/notify' +import locale from "antd/lib/locale/ru_RU"; +import moment from 'moment' const {Option} = Select +const pageSize = 26 +const {RangePicker} = DatePicker; // Словарь категорий для строк таблицы const categoryDictionary = { @@ -17,79 +19,94 @@ const categoryDictionary = { 3: {title: 'Информация'}, } +const columns = [ + { + title: 'Дата', + key: 'date', + dataIndex: 'date', + render: (item) => moment(item).format('DD MMM YYYY, HH:MM:ss'), + }, + { + title: 'Категория', + key: 'categoryId', + dataIndex: 'categoryId', + render: (_, item) => categoryDictionary[item.categoryId].title, + style: (_, item) => categoryDictionary[item.categoryId].style, + ellipsis: true, + }, + { + title: 'Сообщение', + key: 'message', + dataIndex: 'message', + }, + { + title: 'Пользователь', + key: 'user', + dataIndex: 'user', + }, +]; + +const filterOptions = [ + {label: 'Авария', value: 1}, + {label: 'Предупреждение', value: 2}, + {label: 'Информация', value: 3}, +] + // Данные для таблицы export default function Messages() { let {id} = useParams() const [messages, setMessages] = useState([]) - const [filteredInfo, setFilteredInfo] = useState({}) - const [loader] = useState(false) - const filterOptions = [ - {label: 'Авария', value: '1'}, - {label: 'Предупреждение', value: '2'}, - {label: 'Информация', value: '3'}, - ] + const [pagination, setPagination] = useState(null) + const [page, setPage] = useState(1) + const [range, setRange] = useState([]) + const [categories, setCategories] = useState([]) - const children = filterOptions.map((line) => ()) + const [loader, setLoader] = useState(false) - const handleChange = (filters) => { - setFilteredInfo({ - filteredInfo: filters - }) + + const children = filterOptions.map((line) => ) + + const onChangeRange = (range) => { + setRange(range) } - const handleReceiveMessages = (messages) => { - if (messages) { - setMessages(messages.items) + const GetMessages = async() => { + setLoader(true) + try { + let begin = null + let end = null + if(range?.length>1){ + begin = range[0].toISOString() + end = range[1].toISOString() + } + let paginatedMessages = await MessageService.getMessage(`${id}`, + (page - 1) * pageSize, + pageSize, + categories, + begin, + end) + setMessages(paginatedMessages.items.map(m => { + return { + key: m.id, + categoryids: categoryDictionary[m.categoryId], + begin: m.date, + ...m + } + })) + setPagination({ + total: paginatedMessages.count, + current: Math.floor(paginatedMessages.skip / pageSize), + }) + } catch (ex) { + notify(`Не удалось загрузить сообщения по скважине "${id}"`, 'error') + console.log(ex) } + setLoader(false) } useEffect(() => { - MessageService.getMessage(id) - .then(handleReceiveMessages) - .catch((ex) => { - Notification(`Не удалось загрузить сообщения по скважине "${id}"`, 'error') - console.log(ex) - }) - - let unSubscribeMessagesHub = Subscribe('ReceiveMessages', `well_${id}`, handleReceiveMessages) - return () => { - unSubscribeMessagesHub() - } - }, [id]) - - const columns = [ - { - title: 'Дата', - key: 'date', - dataIndex: 'date', - render: (item) => moment(item).format('DD MMM YYYY, HH:MM:ss'), - }, - { - title: 'Категория', - key: 'categoryId', - dataIndex: 'categoryId', - render: (_, item) => categoryDictionary[item.categoryId].title, - style: (_, item) => categoryDictionary[item.categoryId].style, - filters: [ - {text: 'Авария', value: '1'}, - {text: 'Предупреждение', value: '2'}, - {text: 'Информация', value: '3'}, - ], - filteredValue: filteredInfo.categoryId, - onFilter: (value, record) => record.categoryId.toString() === value, - ellipsis: true, - }, - { - title: 'Сообщение', - key: 'message', - dataIndex: 'message', - }, - { - title: 'Пользователь', - key: 'user', - dataIndex: 'user', - }, - ]; + GetMessages() + }, [page, categories, range]) return ( <> @@ -101,10 +118,16 @@ export default function Messages() { allowClear placeholder="Фильтр сообщений" className="filter-selector" - onChange={handleChange} - > + value={categories} + onChange = {setCategories}> {children} + + +