From 6f12d5780548b168af221a70286d2018baefc8b1 Mon Sep 17 00:00:00 2001 From: Alexey Date: Thu, 27 May 2021 12:53:42 +0500 Subject: [PATCH] =?UTF-8?q?=D0=94=D0=BE=D0=B1=D0=B0=D0=B2=D0=BB=D0=B5?= =?UTF-8?q?=D0=BD=D1=8B=20=D0=BE=D0=BF=D0=BE=D0=B2=D0=B5=D1=89=D0=B5=D0=BD?= =?UTF-8?q?=D0=B8=D1=8F=20=D1=81=D0=BF=D0=BB=D1=8B=D0=B2=D0=B0=D1=8E=D1=89?= =?UTF-8?q?=D0=B8=D0=BC=D0=B8=20=D0=BE=D0=BA=D0=BD=D0=B0=D0=BC=D0=B8.=20?= =?UTF-8?q?=D0=98=D0=B7=D0=BC=D0=B5=D0=BD=D0=B5=D0=BD=D1=8B=20=D0=BD=D0=B5?= =?UTF-8?q?=D0=BA=D0=BE=D1=82=D0=BE=D1=80=D1=8B=D0=B5=20=D1=81=D1=82=D0=B8?= =?UTF-8?q?=D0=BB=D0=B8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/ChartTimeOnlineFooter.jsx | 2 +- src/components/ModeDisplay.jsx | 4 +- src/components/Notification.jsx | 24 ++++ src/components/Well.jsx | 2 +- src/components/WellTreeSelector.jsx | 1 - src/pages/Analysis.jsx | 10 +- src/pages/Archive.jsx | 167 +++++++++++------------ src/pages/Files.jsx | 6 +- src/pages/Header.jsx | 7 +- src/pages/Main.jsx | 19 ++- src/pages/Messages.jsx | 57 ++++---- src/pages/Report.jsx | 13 +- src/pages/TelemetryView.jsx | 45 +++--- src/services/signalr/index.ts | 38 +----- src/styles/App.less | 57 ++++++-- src/styles/archive_style.css | 3 + src/styles/index.css | 4 + src/styles/message.css | 16 ++- 18 files changed, 263 insertions(+), 212 deletions(-) create mode 100644 src/components/Notification.jsx create mode 100644 src/styles/archive_style.css diff --git a/src/components/ChartTimeOnlineFooter.jsx b/src/components/ChartTimeOnlineFooter.jsx index 4864e67..481e09c 100644 --- a/src/components/ChartTimeOnlineFooter.jsx +++ b/src/components/ChartTimeOnlineFooter.jsx @@ -32,7 +32,7 @@ export const ChartTimeOnlineFooter = (props) =>{ if(popContent) spField = -
+
{spField}
diff --git a/src/components/ModeDisplay.jsx b/src/components/ModeDisplay.jsx index f887aca..bc63063 100644 --- a/src/components/ModeDisplay.jsx +++ b/src/components/ModeDisplay.jsx @@ -20,8 +20,8 @@ export const ModeDisplay = (props)=>{ value = modeNames[index] ?? index } - return(<> + return(
Режим: {value} - ) +
) } \ No newline at end of file diff --git a/src/components/Notification.jsx b/src/components/Notification.jsx new file mode 100644 index 0000000..1608951 --- /dev/null +++ b/src/components/Notification.jsx @@ -0,0 +1,24 @@ +import { notification } from 'antd'; + +const typeDictionary = { + 'error': 'Ошибка', + 'warning': 'Предупрежение', + 'info': 'Информация' + +} +/** + * Вызов оповещений всплывающим окошком. + * @param body string или ReactNode + * @param type для параметра типа. Допустимые значение 'error', 'warning', 'info' + */ +export default function Notification(body, type='info'){ + + notification.info({ + description: body, + message: typeDictionary[type], + type, + placement: "bottomRight", + duration: 10, + }) + +} \ No newline at end of file diff --git a/src/components/Well.jsx b/src/components/Well.jsx index 918465d..9ee08b2 100644 --- a/src/components/Well.jsx +++ b/src/components/Well.jsx @@ -18,7 +18,7 @@ export default function Well() { }> Мониторинг diff --git a/src/components/WellTreeSelector.jsx b/src/components/WellTreeSelector.jsx index f8cf7f0..2737030 100644 --- a/src/components/WellTreeSelector.jsx +++ b/src/components/WellTreeSelector.jsx @@ -44,7 +44,6 @@ export default function WellTreeSelector(props) { try { let newWells = (await WellService.getWells()).map(w => { return { key: w.id, ...w } }) let wellsTree = groupBy(newWells, 'deposit', 'cluster', 'caption') - // setWells( newWells ) setWellsTree(wellsTree) } catch (e) { diff --git a/src/pages/Analysis.jsx b/src/pages/Analysis.jsx index 57ba47b..1e97cf2 100644 --- a/src/pages/Analysis.jsx +++ b/src/pages/Analysis.jsx @@ -1,3 +1,7 @@ -export default function Analysis(props){ - return(

Анализ

) - } \ No newline at end of file +export default function Analysis(props) { + return ( +
+

Анализ

+
+ ) +} \ No newline at end of file diff --git a/src/pages/Archive.jsx b/src/pages/Archive.jsx index 0671f1e..1e0e841 100644 --- a/src/pages/Archive.jsx +++ b/src/pages/Archive.jsx @@ -1,4 +1,4 @@ -import { useState, useEffect } from 'react' +import {useState, useEffect} from 'react' import { Button, DatePicker, @@ -7,19 +7,19 @@ import { Row, Col, } from 'antd' -import { useParams } from 'react-router-dom' -import { Subscribe } from '../services/signalr' -import { DataService } from '../services/api' +import {useParams} from 'react-router-dom' +import {Subscribe} from '../services/signalr' +import {DataService} from '../services/api' import 'moment/locale/ru' import locale from 'antd/lib/locale/ru_RU' -import { ChartTimeArchive } from '../components/charts/ChartTimeArchive' -import { Display } from '../components/Display' -import { ChartTimeOnlineFooter } from '../components/ChartTimeOnlineFooter' -import { UserOfWells } from '../components/UserOfWells' +import {ChartTimeArchive} from '../components/charts/ChartTimeArchive' +import {Display} from '../components/Display' +import {ChartTimeOnlineFooter} from '../components/ChartTimeOnlineFooter' +import {UserOfWells} from '../components/UserOfWells' -const { RangePicker } = DatePicker; -const { Option } = Select; +const {RangePicker} = DatePicker; +const {Option} = Select; // Выбор периода времени const PeriodOfTime = () => { @@ -29,7 +29,7 @@ const PeriodOfTime = () => { ) @@ -38,40 +38,41 @@ const PeriodOfTime = () => { // Выбор "перьев" для графиков - перенести в шапку графика const SelectDataCharts = () => { const linesCollection = [ - { label: "Глубина забоя", xAccessorName: "wellDepth", color: '#a0a' }, - { label: "Положение инструмента", xAccessorName: "bitDepth", color: '#a0a' }, - { label: "Высота талевого блока", xAccessorName: "blockPosition", color: '#a0a' }, - { label: "Талевый блок. Мин положение", xAccessorName: "blockPositionMin", color: '#a0a' }, - { label: "Талевый блок. Макс положение", xAccessorName: "blockPositionMax", color: '#a0a' }, - { label: "Скорость талевого блока", xAccessorName: "blockSpeed", color: '#a0a' }, - { label: "Скорости талевого блока. Задание", xAccessorName: "blockSpeedSp", color: '#a0a' }, - { label: "Талевый блок. Задание скорости для роторного бурения", xAccessorName: "blockSpeedSpRotor", color: '#a0a' }, - { label: "Талевый блок. Задание скорости для режима слайда", xAccessorName: "blockSpeedSpSlide", color: '#a0a' }, - { label: "Талевый блок. Задание скорости для проработки", xAccessorName: "blockSpeedSpDevelop", color: '#a0a' }, - { label: "Давление", xAccessorName: "pressure", color: '#a0a' }, - { label: "Давление. Холостой ход", xAccessorName: "pressureIdle", color: '#a0a' }, - { label: "Давление. Задание", xAccessorName: "pressureSp", color: '#a0a' }, - { label: "Давление. Задание для роторного бурения", xAccessorName: "pressureSpRotor", color: '#a0a' }, - { label: "Давление. Задание для режима слайда", xAccessorName: "pressureSpSlide", color: '#a0a' }, - { label: "Давление. Задание для проработки", xAccessorName: "pressureSpDevelop", color: '#a0a' }, - { label: "Давление дифф. Аварийное макс.", xAccessorName: "pressureDeltaLimitMax", color: '#a0a' }, - { label: "Осевая нагрузка", xAccessorName: "axialLoad", color: '#a0a' }, - { label: "Осевая нагрузка. Задание", xAccessorName: "axialLoadSp", color: '#a0a' }, - { label: "Осевая нагрузка. Аварийная макс.", xAccessorName: "axialLoadLimitMax", color: '#a0a' }, - { label: "Вес на крюке", xAccessorName: "hookWeight", color: '#a0a' }, - { label: "Вес на крюке. Холостой ход", xAccessorName: "hookWeightIdle", color: '#a0a' }, - { label: "Вес на крюке. Посадка", xAccessorName: "hookWeightLimitMin", color: '#a0a' }, - { label: "Вес на крюке. Затяжка", xAccessorName: "hookWeightLimitMax", color: '#a0a' }, - { label: "Момент на роторе", xAccessorName: "rotorTorque", color: '#a0a' }, - { label: "Момент на роторе. Холостой ход", xAccessorName: "rotorTorqueIdle", color: '#a0a' }, - { label: "Момент на роторе. Задание", xAccessorName: "rotorTorqueSp", color: '#a0a' }, - { label: "Момент на роторе. Аварийный макс.", xAccessorName: "rotorTorqueLimitMax", color: '#a0a' }, - { label: "Обороты ротора", xAccessorName: "rotorSpeed", color: '#a0a' }, - { label: "Расход", xAccessorName: "flow", color: '#a0a' }, - { label: "Расход. Холостой ход", xAccessorName: "flowIdle", color: '#a0a' }, - { label: "Расход. Аварийный макс.", xAccessorName: "flowDeltaLimitMax", color: '#a0a' }, + {label: "Глубина забоя", xAccessorName: "wellDepth", color: '#a0a'}, + {label: "Положение инструмента", xAccessorName: "bitDepth", color: '#a0a'}, + {label: "Высота талевого блока", xAccessorName: "blockPosition", color: '#a0a'}, + {label: "Талевый блок. Мин положение", xAccessorName: "blockPositionMin", color: '#a0a'}, + {label: "Талевый блок. Макс положение", xAccessorName: "blockPositionMax", color: '#a0a'}, + {label: "Скорость талевого блока", xAccessorName: "blockSpeed", color: '#a0a'}, + {label: "Скорости талевого блока. Задание", xAccessorName: "blockSpeedSp", color: '#a0a'}, + {label: "Талевый блок. Задание скорости для роторного бурения", xAccessorName: "blockSpeedSpRotor", color: '#a0a'}, + {label: "Талевый блок. Задание скорости для режима слайда", xAccessorName: "blockSpeedSpSlide", color: '#a0a'}, + {label: "Талевый блок. Задание скорости для проработки", xAccessorName: "blockSpeedSpDevelop", color: '#a0a'}, + {label: "Давление", xAccessorName: "pressure", color: '#a0a'}, + {label: "Давление. Холостой ход", xAccessorName: "pressureIdle", color: '#a0a'}, + {label: "Давление. Задание", xAccessorName: "pressureSp", color: '#a0a'}, + {label: "Давление. Задание для роторного бурения", xAccessorName: "pressureSpRotor", color: '#a0a'}, + {label: "Давление. Задание для режима слайда", xAccessorName: "pressureSpSlide", color: '#a0a'}, + {label: "Давление. Задание для проработки", xAccessorName: "pressureSpDevelop", color: '#a0a'}, + {label: "Давление дифф. Аварийное макс.", xAccessorName: "pressureDeltaLimitMax", color: '#a0a'}, + {label: "Осевая нагрузка", xAccessorName: "axialLoad", color: '#a0a'}, + {label: "Осевая нагрузка. Задание", xAccessorName: "axialLoadSp", color: '#a0a'}, + {label: "Осевая нагрузка. Аварийная макс.", xAccessorName: "axialLoadLimitMax", color: '#a0a'}, + {label: "Вес на крюке", xAccessorName: "hookWeight", color: '#a0a'}, + {label: "Вес на крюке. Холостой ход", xAccessorName: "hookWeightIdle", color: '#a0a'}, + {label: "Вес на крюке. Посадка", xAccessorName: "hookWeightLimitMin", color: '#a0a'}, + {label: "Вес на крюке. Затяжка", xAccessorName: "hookWeightLimitMax", color: '#a0a'}, + {label: "Момент на роторе", xAccessorName: "rotorTorque", color: '#a0a'}, + {label: "Момент на роторе. Холостой ход", xAccessorName: "rotorTorqueIdle", color: '#a0a'}, + {label: "Момент на роторе. Задание", xAccessorName: "rotorTorqueSp", color: '#a0a'}, + {label: "Момент на роторе. Аварийный макс.", xAccessorName: "rotorTorqueLimitMax", color: '#a0a'}, + {label: "Обороты ротора", xAccessorName: "rotorSpeed", color: '#a0a'}, + {label: "Расход", xAccessorName: "flow", color: '#a0a'}, + {label: "Расход. Холостой ход", xAccessorName: "flowIdle", color: '#a0a'}, + {label: "Расход. Аварийный макс.", xAccessorName: "flowDeltaLimitMax", color: '#a0a'}, ] const children = linesCollection.map((line) => ()) + function handleChange(value) { console.log(`selected ${value}`); } @@ -80,7 +81,7 @@ const SelectDataCharts = () => { - - - - - - - - - - - - {paramsGroups.map(group => - - - )} - - - - ) +
+
+ + Интервал:  + + + + + + + {paramsGroups.map(group => + + + )} + + + +
+
) } \ No newline at end of file diff --git a/src/pages/Files.jsx b/src/pages/Files.jsx index 05d39e7..360b9eb 100644 --- a/src/pages/Files.jsx +++ b/src/pages/Files.jsx @@ -1,3 +1,7 @@ export default function Files(props) { - return (

Файлы

) + return ( +
+

Файлы

+
+ ) } \ No newline at end of file diff --git a/src/pages/Header.jsx b/src/pages/Header.jsx index 3170b0d..34b04e0 100644 --- a/src/pages/Header.jsx +++ b/src/pages/Header.jsx @@ -1,6 +1,5 @@ -import { useState } from 'react'; import { Layout, Button } from 'antd' -import { UserOutlined, MenuOutlined } from '@ant-design/icons' +import { UserOutlined } from '@ant-design/icons' import logo from '../images/logo_32.png' import { Link } from "react-router-dom" import WellTreeSelector from '../components/WellTreeSelector' @@ -8,7 +7,6 @@ import WellTreeSelector from '../components/WellTreeSelector' const { Header } = Layout export default function PageHeader(props){ - const [sidebarVisible, setSidebarVisible] = useState(true) const login = localStorage['login'] let handleLogout = () => { @@ -18,8 +16,7 @@ export default function PageHeader(props){ return( -
-