Нормальные стили для Мнемосхемы

package.json

@@ -33,7 +33,7 @@
     "react_test": "react-scripts test",
     "eject": "react-scripts eject"
   },
-  "proxy": "http://127.0.0.1:5000",
+  "proxy": "http://192.168.1.70:5000",
   "eslintConfig": {
     "extends": [
       "react-app",

src/pages/TelemetryView.jsx

@@ -8,11 +8,15 @@ import {CustomColumn} from '../components/CustomColumn'
 import {UserOfWells} from '../components/UserOfWells'
 import {ModeDisplay} from '../components/ModeDisplay'
 import {Display} from '../components/Display'
+import SpinPicEnabled from "../images/SpinEnabled.png"
+import SpinPicDisabled from "../images/SpinDisabled.png"
+import MomentStabPicEnabled from "../images/DempherOn.png"
+import MomentStabPicDisabled from "../images/DempherOff.png"
 import moment from 'moment'
 import {Subscribe} from '../services/signalr'
 import {DataService, MessageService} from '../services/api'
 import '../styles/message.css'
-import notify from "../components/notify";
+import notify from "../components/notify"
 
 const {Option} = Select
 
@@ -30,6 +34,8 @@ const blockSpeedGroup = {
   yDisplay: false,
   linePv: {label: "blockSpeed", units: 'м/ч', xAccessorName: "blockSpeed", yAccessorName: "date", color: '#0a0'},
   lineSp: {label: "blockSpeedSp", units: 'м/ч', xAccessorName: "blockSpeedSp", yAccessorName: "date", color: '#0a0'},
+  lineAvg: {label: "blockSpeedAvg", units: 'м/ч', xAccessorName: "blockSpeed", yAccessorName: "date", color: '#38C3FF', calc:(v) => 14, dash},
+  lineMax: {label: "blockSpeedMax", units: 'м/ч', xAccessorName: "blockSpeed", yAccessorName: "date", color: '#38C3FF', calc:(v) => 23, dash},
 }
 
 const pressureGroup = {
@@ -60,7 +66,7 @@ const axialLoadGroup = {
 }
 
 const hookWeightGroup = {
-  label: "Ввес на крюке",
+  label: "Вес на крюке",
   yDisplay: false,
   linePv: {label: "hookWeight", units: 'т', xAccessorName: "hookWeight", yAccessorName: "date", color: '#0aa'},
   lineIdle: {
@@ -114,7 +120,7 @@ const rotorTorqueGroup = {
 
 const paramsGroups = [blockHeightGroup, blockSpeedGroup, pressureGroup, axialLoadGroup, hookWeightGroup, rotorTorqueGroup]
 
-export const Column = ({lineGroup, data, interval}) => {
+export const Column = ({lineGroup, data, interval, showBorder}) => {
   let lines = [lineGroup.linePv]
 
   if (lineGroup.lineSp)
@@ -123,6 +129,12 @@ export const Column = ({lineGroup, data, interval}) => {
   if (lineGroup.lineOther)
     lines.push(lineGroup.lineOther)
 
+  if (lineGroup.lineAvg)
+    lines.push(lineGroup.lineAvg)
+
+  if (lineGroup.lineMax)
+    lines.push(lineGroup.lineMax)
+
   let dataLast = null
   let pv = null
   if (data?.length > 0) {
@@ -133,10 +145,12 @@ export const Column = ({lineGroup, data, interval}) => {
 
   return (
     <>
-      <Display
-        label={lineGroup.label}
-        value={pv}
-        suffix={lineGroup.linePv?.units} isArrowVisible={true}/>
+      <div style={{boxShadow: showBorder ? "inset 0px 0px 0px 3px black" : ""}}>
+        <Display
+          label={lineGroup.label}
+          value={pv}
+          suffix={lineGroup.linePv?.units} isArrowVisible={false}/>
+      </div>
       <ChartTimeOnline
         data={data}
         yDisplay={lineGroup.yDisplay}
@@ -150,7 +164,7 @@ export const Column = ({lineGroup, data, interval}) => {
 
 // Словарь категорий для строк таблицы
 const categoryDictionary = {
-  1: {title: 'Авария'},
+  1: {title: 'Важное'},
   2: {title: 'Предупреждение'},
   3: {title: 'Информация'},
 }
@@ -183,13 +197,26 @@ const columns = [
   },
 ];
 
+const intervalSteps = [
+  {label: '10 минут', value: 600},
+  {label: '30 минут', value: 1800},
+  {label: '1 час', value: 3600},
+  {label: '6 часов', value: 21600},
+  {label: '12 часов', value: 43200},
+  {label: '1 день', value: 86400},
+]
+
+const defaultInterval = intervalSteps[0]["value"]  // поменять тут TODO
+
 export default function TelemetryView(props) {
   let {id} = useParams()
   const [saubData, setSaubData] = useState([])
-  const [chartInterval, setChartInterval] = useState(600)
+  const [chartInterval, setChartInterval] = useState(defaultInterval)
   const [messages, setMessages] = useState([])
 
-  const [loader, setLoader] = useState(false)  // , setLoader
+  const [loader, setLoader] = useState(false)
+
+  const periods = intervalSteps.map((line) => <Option key={line.value} value={line.value}>{line.label}</Option>)
 
   const handleReceiveDataSaub = (data) => {
     if (data) {
@@ -247,28 +274,27 @@ export default function TelemetryView(props) {
       <span style={{flexGrow: 0.1}}>&nbsp;</span>
       <Col>
         Интервал:&nbsp;
-        <Select defaultValue="600" onChange={setChartInterval}>
-          <Option value='600'>10 минут</Option>
-          <Option value='1800'>30 минут</Option>
-          <Option value='3600'>1 час</Option>
-          <Option value='21600'>6 час</Option>
-          <Option value='86400'>1 день</Option>
+        <Select defaultValue={chartInterval} onChange={setChartInterval}>
+          {periods}
         </Select>
       </Col>
       <span style={{flexGrow: 1}}>&nbsp;</span>
+      <img src={saubData[saubData.length - 1]?.isMomentStabEnabled ? MomentStabPicEnabled : MomentStabPicDisabled} style={{marginRight: "15px"}}/>
+      <img src={saubData[saubData.length - 1]?.isSpinEnabled ? SpinPicEnabled : SpinPicDisabled} style={{marginRight: "15px"}}/>
+      <h2 style={{marginBottom: 0, marginRight: "15px",fontWeight: "bold", color: saubData[saubData.length - 1]?.mseEnabled == 24968 ? "green" : "lightgrey"}}>MSE</h2>
       <Col>
         <UserOfWells data={saubData}/>
       </Col>
     </Row>
     <Row>
-      <Col span={2}>
+      <Col span={3}>
         <CustomColumn data={saubData}/>
       </Col>
-      <Col span={24 - 2}>
+      <Col span={24 - 3}>
         <Row>
-          {paramsGroups.map(group =>
+          {paramsGroups.map((group, index) =>
             <Col span={colSpan} className='border_small' key={group.label}>
-              <Column data={saubData} lineGroup={group} interval={chartInterval}/>
+              <Column data={saubData} lineGroup={group} interval={chartInterval} showBorder = {saubData[saubData.length - 1]?.drillingBy === index}/>
             </Col>)}
         </Row>
       </Col>

src/services/api/index.ts

@@ -12,6 +12,7 @@ export type { DataSaubBaseDto } from './models/DataSaubBaseDto';
 export type { DatesRangeDto } from './models/DatesRangeDto';
 export type { DepositDto } from './models/DepositDto';
 export type { EventDto } from './models/EventDto';
+export type { FilePropertiesDto } from './models/FilePropertiesDto';
 export type { MessageDto } from './models/MessageDto';
 export type { MessageDtoPaginationContainer } from './models/MessageDtoPaginationContainer';
 export type { OperationDto } from './models/OperationDto';
@@ -32,6 +33,7 @@ export { AuthService } from './services/AuthService';
 export { ClusterService } from './services/ClusterService';
 export { DataService } from './services/DataService';
 export { DepositService } from './services/DepositService';
+export { FileService } from './services/FileService';
 export { MessageService } from './services/MessageService';
 export { ReportService } from './services/ReportService';
 export { TelemetryService } from './services/TelemetryService';

src/services/api/models/ClusterDto.ts

@@ -2,10 +2,13 @@
 /* tslint:disable */
 /* eslint-disable */
 
+import type { WellDto } from './WellDto';
+
 export type ClusterDto = {
     id?: number;
     caption?: string | null;
     description?: string | null;
     latitude?: number | null;
     longitude?: number | null;
+    wells?: Array<WellDto> | null;
 }

src/services/api/models/ClusterStatDto.ts

@@ -2,6 +2,7 @@
 /* tslint:disable */
 /* eslint-disable */
 
+import type { WellDto } from './WellDto';
 import type { WellStatDto } from './WellStatDto';
 
 export type ClusterStatDto = {
@@ -10,5 +11,6 @@ export type ClusterStatDto = {
     description?: string | null;
     latitude?: number | null;
     longitude?: number | null;
+    wells?: Array<WellDto> | null;
     wellsStat?: Array<WellStatDto> | null;
 }

src/services/api/models/DepositDto.ts

@@ -2,10 +2,13 @@
 /* tslint:disable */
 /* eslint-disable */
 
+import type { ClusterDto } from './ClusterDto';
+
 export type DepositDto = {
     id?: number;
-    name?: string | null;
+    caption?: string | null;
     description?: string | null;
     latitude?: number | null;
     longitude?: number | null;
+    clusters?: Array<ClusterDto> | null;
 }

src/services/api/models/FilePropertiesDto.ts

@@ -0,0 +1,11 @@
+/* istanbul ignore file */
+/* tslint:disable */
+/* eslint-disable */
+
+export type FilePropertiesDto = {
+    id?: number;
+    name?: string | null;
+    idCategory?: number;
+    uploadDate?: string;
+    userName?: string | null;
+}

src/services/api/models/WellDto.ts

@@ -7,7 +7,6 @@ export type WellDto = {
     cluster?: string | null;
     deposit?: string | null;
     id?: number;
-    lastData?: any;
     latitude?: number | null;
     longitude?: number | null;
     wellType?: string | null;

src/services/api/models/WellStatDto.ts

@@ -10,7 +10,6 @@ export type WellStatDto = {
     cluster?: string | null;
     deposit?: string | null;
     id?: number;
-    lastData?: any;
     latitude?: number | null;
     longitude?: number | null;
     wellType?: string | null;

src/services/api/services/AnalyticsService.ts

@@ -14,9 +14,9 @@ export class AnalyticsService {
      * @param wellId id скважины
      * @param skip для пагинации кол-во записей пропустить
      * @param take для пагинации кол-во записей
-     * @param categoryids 
-     * @param begin 
-     * @param end 
+     * @param categoryIds список категорий
+     * @param begin дата начала
+     * @param end окончание
      * @returns OperationDtoPaginationContainer Success
      * @throws ApiError
      */
@@ -24,7 +24,7 @@ export class AnalyticsService {
 wellId: number,
 skip: number,
 take: number = 32,
-categoryids?: Array<number>,
+categoryIds?: Array<number>,
 begin?: string,
 end?: string,
 ): Promise<OperationDtoPaginationContainer> {
@@ -34,7 +34,7 @@ end?: string,
             query: {
                 'skip': skip,
                 'take': take,
-                'categoryids': categoryids,
+                'categoryIds': categoryIds,
                 'begin': begin,
                 'end': end,
             },

src/services/api/services/FileService.ts

@@ -0,0 +1,80 @@
+/* istanbul ignore file */
+/* tslint:disable */
+/* eslint-disable */
+import type { FilePropertiesDto } from '../models/FilePropertiesDto';
+import { request as __request } from '../core/request';
+
+export class FileService {
+
+    /**
+     * Сохраняет переданные файлы и информацию о них
+     * @param wellId id скважины
+     * @param idCategory id категории файла
+     * @param idUser id отправившего файл пользователя
+     * @param requestBody 
+     * @returns number Success
+     * @throws ApiError
+     */
+    public static async saveFiles(
+wellId: number,
+idCategory?: number,
+idUser?: number,
+requestBody?: any,
+): Promise<number> {
+        const result = await __request({
+            method: 'POST',
+            path: `/api/files/${wellId}/files`,
+            query: {
+                'idCategory': idCategory,
+                'idUser': idUser,
+            },
+            body: requestBody,
+        });
+        return result.body;
+    }
+
+    /**
+     * Возвращает информацию о файлах для скважины в выбраной категории
+     * @param wellId id скважины
+     * @param idCategory id категории файла
+     * @returns FilePropertiesDto Success
+     * @throws ApiError
+     */
+    public static async getFilesInfo(
+wellId: number,
+idCategory?: number,
+): Promise<Array<FilePropertiesDto>> {
+        const result = await __request({
+            method: 'GET',
+            path: `/api/files/${wellId}/filesInfo`,
+            query: {
+                'idCategory': idCategory,
+            },
+        });
+        return result.body;
+    }
+
+    /**
+     * Возвращает файл с диска на сервере
+     * @param wellId id скважины
+     * @param fileName 
+     * @param fileId id запрашиваемого файла
+     * @returns string Success
+     * @throws ApiError
+     */
+    public static async getFile(
+wellId: number,
+fileName: string,
+fileId?: number,
+): Promise<string> {
+        const result = await __request({
+            method: 'GET',
+            path: `/api/files/${wellId}/${fileName}`,
+            query: {
+                'fileId': fileId,
+            },
+        });
+        return result.body;
+    }
+
+}