From cf4fd0f36d1bc53e954ce89bfb3c7973f7cf3cc6 Mon Sep 17 00:00:00 2001
From: Alexey <ay.nokhrin@autodrilling.ru>
Date: Fri, 28 May 2021 12:04:38 +0500
Subject: [PATCH] =?UTF-8?q?=D0=98=D1=81=D0=BF=D1=80=D0=B0=D0=B2=D0=BB?=
 =?UTF-8?q?=D0=B5=D0=BD=D1=8B=20=D1=81=D1=82=D0=B8=D0=BB=D0=B8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/Analysis.jsx      |  4 +++
 src/pages/Archive.jsx       | 15 ++++----
 src/pages/Files.jsx         |  2 +-
 src/pages/Main.jsx          |  1 -
 src/pages/Messages.jsx      | 68 +++++++++++++++++++++++++++----------
 src/pages/TelemetryView.jsx |  1 -
 src/styles/App.less         | 15 +++++---
 7 files changed, 72 insertions(+), 34 deletions(-)

diff --git a/src/pages/Analysis.jsx b/src/pages/Analysis.jsx
index 1e97cf2..17186de 100644
--- a/src/pages/Analysis.jsx
+++ b/src/pages/Analysis.jsx
@@ -1,7 +1,11 @@
+// import {UserOfWells} from "../components/UserOfWells";
+
 export default function Analysis(props) {
   return (
     <div className="menu_title">
       <h2>Анализ</h2>
+      {/*<UserOfWells data={saubData}/>*/}
+      <hr/>
     </div>
   )
 }
\ No newline at end of file
diff --git a/src/pages/Archive.jsx b/src/pages/Archive.jsx
index 1e0e841..f56e1e1 100644
--- a/src/pages/Archive.jsx
+++ b/src/pages/Archive.jsx
@@ -148,19 +148,18 @@ export default function Archive(props) {
   const colSpan = 24 / (paramsGroups.length)
 
   return (<div className="content-sheet">
-    <div className="menu_title">
+    <div className="menu-title">
       <h2>Архив</h2>
-      <span style={{flexGrow: 10}}></span>
+      <span style={{flexGrow: 10}}>&nbsp;</span>
       <UserOfWells data={saubData}/>
     </div>
     <hr/>
     <div className="content-sheet">
-      <Button type="primary" style={{
-        borderRadius: '5px',
-        font: 'bold',
-        textAlign: 'center',
-        margin: '5px 5px',
-      }}>Добавить график</Button>
+      <Button type="primary"
+              className="submit-button"
+      >
+        Добавить график
+      </Button>
       Интервал:&nbsp;
       <Select defaultValue="600" onChange={setChartInterval}>
         <Option value='600'>10 минут</Option>
diff --git a/src/pages/Files.jsx b/src/pages/Files.jsx
index 360b9eb..9ec760b 100644
--- a/src/pages/Files.jsx
+++ b/src/pages/Files.jsx
@@ -1,6 +1,6 @@
 export default function Files(props) {
   return (
-    <div className="menu_title">
+    <div className="menu-title">
       <h2>Файлы</h2>
     </div>
   )
diff --git a/src/pages/Main.jsx b/src/pages/Main.jsx
index 946c51d..8ca4432 100644
--- a/src/pages/Main.jsx
+++ b/src/pages/Main.jsx
@@ -3,7 +3,6 @@ import Wells from './Wells'
 import PageHeader from './Header'
 import Well from "../components/Well";
 import {Redirect, Route, Switch} from "react-router-dom";
-import Notification from "../components/Notification";
 
 const {Content} = Layout
 
diff --git a/src/pages/Messages.jsx b/src/pages/Messages.jsx
index 18c8afd..bbefeb7 100644
--- a/src/pages/Messages.jsx
+++ b/src/pages/Messages.jsx
@@ -1,13 +1,16 @@
-import {Table} from 'antd';
+import {Button, Table, Select} 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 moment from 'moment'
 import '../styles/message.css'
 import Notification from '../components/Notification'
 
+const {Option} = Select
+
+
 
 // Словарь категорий для строк таблицы
 const categoryDictionary = {
@@ -23,8 +26,6 @@ const columns = [
     key: 'date',
     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: 'Категория',
@@ -32,14 +33,16 @@ const columns = [
     dataIndex: 'categoryId',
     render: (_, item) => categoryDictionary[item.categoryId].title,
     style: (_, item) => categoryDictionary[item.categoryId].style,
-    sorter: (a, b) => a.categoryId - b.categoryId,
-    sortDirections: ['descend', 'ascend'],
+    filters: [
+      {text: 'Авария', value: '1'},
+      {text: 'Предупреждение', value: '2'},
+      {text: 'Информация', value: '3'},
+    ]
   },
   {
     title: 'Сообщение',
     key: 'message',
     dataIndex: 'message',
-    onFilter: (value, record) => record.name.indexOf(value) === 0,
   },
   {
     title: 'Пользователь',
@@ -48,12 +51,22 @@ const columns = [
   },
 ];
 
+// Опции для фильра
+
 // Данные для таблицы
 export default function Messages() {
   let {id} = useParams()
   const [messages, setMessages] = useState([])
   const [loader] = useState(false)
 
+  const filterOptions = [
+    {label: 'Авария', value: 1},
+    {label: 'Предупреждение', value: 2},
+    {label: 'Информация', value: 3},
+  ]
+
+  const children = filterOptions.map((line) => (<Option key={line.value}>{line.label}</Option>))
+
   const handleReceiveMessages = (messages) => {
     if (messages) {
       setMessages(messages.items)
@@ -61,34 +74,53 @@ export default function Messages() {
   }
 
   useEffect(() => {
-      MessageService.getMessage(id)
-        .then(handleReceiveMessages)
-        .catch ((ex) => {
-      Notification(`Не удалось загрузить сообщения по скважине "${id}"`, 'error')
-      console.log(ex)
-    })
+    MessageService.getMessage(id)
+      .then(handleReceiveMessages)
+      .catch((ex) => {
+        Notification(`Не удалось загрузить сообщения по скважине "${id}"`, 'error')
+        console.log(ex)
+      })
 
     let unSubscribeMessagesHub = Subscribe('ReceiveMessages', `well_${id}`, handleReceiveMessages)
     return () => {
       unSubscribeMessagesHub()
     }
-  }, [id]);
+  }, [id])
 
   return (
     <>
       <h2>Сообщения</h2>
       <hr/>
+      <h3>Фильтр сообщений</h3>
+      <Select
+        mode="multiple"
+        allowClear
+        placeholder="Фильтр сообщений"
+        className="filter-selector"
+        // onChange={messagesFilter}
+      >
+        {children}
+      </Select>
+      <Button
+        type="primary"
+        className="submit-button"
+      >
+        Применть
+      </Button>
+      <Button
+        className="submit-button"
+      >
+        Обновить
+      </Button>
       <Table
         columns={columns}
         dataSource={messages}
         rowClassName={(record) => `event_message_${record.categoryId} event_message`}
         size={'small'}
-        pagination={{pageSize: 28}}
+        pagination={{pageSize: 26}}
         rowKey={(record) => record.id}
       />
       {loader && <Loader/>}
     </>
   )
-}
-
-// TODO Стили для отсортированных страниц
\ No newline at end of file
+}
\ No newline at end of file
diff --git a/src/pages/TelemetryView.jsx b/src/pages/TelemetryView.jsx
index 0ca2da4..b7389ae 100644
--- a/src/pages/TelemetryView.jsx
+++ b/src/pages/TelemetryView.jsx
@@ -8,7 +8,6 @@ import {CustomColumn} from '../components/CustomColumn'
 import {UserOfWells} from '../components/UserOfWells'
 import {ModeDisplay} from '../components/ModeDisplay'
 import {Display} from '../components/Display'
-import notify from '../components/Notification'
 import moment from 'moment'
 import {Subscribe} from '../services/signalr'
 import {DataService, MessageService} from '../services/api'
diff --git a/src/styles/App.less b/src/styles/App.less
index 2e6a83b..cc0c15a 100644
--- a/src/styles/App.less
+++ b/src/styles/App.less
@@ -118,16 +118,16 @@ html {
   flex: auto;
 }
 
-.menu_title,
+.menu-title,
 .chart-footer {
   display: flex;
 }
 
-.submit_button {
-  display: flex;
-  align-items: center;
-  padding: 20px;
+.submit-button {
   border-radius: 5px;
+  font-weight: bold;
+  text-align: center;
+  margin: 0 5px 5px 0;
 }
 
 .well_menu {
@@ -140,3 +140,8 @@ html {
 tr.table_row_size {
   height: 10px;
 }
+
+.filter-selector {
+  width: 50%;
+  margin-right: 5px;
+}