From 2818610b67d7d163341b341cdec7588224350730 Mon Sep 17 00:00:00 2001
From: Alexey <ay.nokhrin@autodrilling.ru>
Date: Mon, 31 May 2021 09:34:22 +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 | 86 ++++++++++++++++++++++--------------------
 1 file changed, 45 insertions(+), 41 deletions(-)

diff --git a/src/pages/Messages.jsx b/src/pages/Messages.jsx
index bbefeb7..28c4616 100644
--- a/src/pages/Messages.jsx
+++ b/src/pages/Messages.jsx
@@ -10,8 +10,6 @@ import Notification from '../components/Notification'
 
 const {Option} = Select
 
-
-
 // Словарь категорий для строк таблицы
 const categoryDictionary = {
   1: {title: 'Авария'},
@@ -19,54 +17,26 @@ 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,
-    filters: [
-      {text: 'Авария', value: '1'},
-      {text: 'Предупреждение', value: '2'},
-      {text: 'Информация', value: '3'},
-    ]
-  },
-  {
-    title: 'Сообщение',
-    key: 'message',
-    dataIndex: 'message',
-  },
-  {
-    title: 'Пользователь',
-    key: 'user',
-    dataIndex: 'user',
-  },
-];
-
-// Опции для фильра
-
 // Данные для таблицы
 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},
+    {label: 'Авария', value: '1'},
+    {label: 'Предупреждение', value: '2'},
+    {label: 'Информация', value: '3'},
   ]
 
   const children = filterOptions.map((line) => (<Option key={line.value}>{line.label}</Option>))
 
+  const handleChange = (filters) => {
+    setFilteredInfo({
+      filteredInfo: filters
+    })
+  }
+
   const handleReceiveMessages = (messages) => {
     if (messages) {
       setMessages(messages.items)
@@ -87,6 +57,40 @@ export default function Messages() {
     }
   }, [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',
+    },
+  ];
+
   return (
     <>
       <h2>Сообщения</h2>
@@ -97,7 +101,7 @@ export default function Messages() {
         allowClear
         placeholder="Фильтр сообщений"
         className="filter-selector"
-        // onChange={messagesFilter}
+        onChange={handleChange}
       >
         {children}
       </Select>