CF2-40: Добавлено сохранение 'Последних данных' в БД

package.json

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

src/components/DrillingFluid.jsx

@@ -1,15 +1,20 @@
 import { useState } from 'react';
+import { useParams } from "react-router-dom";
 import {Table, Input, Form, Popconfirm, Typography } from 'antd'
 import { makeColumn } from './factory'
+import { FluidService } from '../services/api/services/FluidService';
 
-const originData = [
+const originDataPlan = [
   {
-    key: '1', name: 'План', temperature: '', density: '', conditionalViscosity: '', r300: '', r600: '', r3r6: '', dnsDpa: '', plasticViscocity: '',
+    key: '8', name: 'План', temperature: '', density: '', conditionalViscosity: '', r300: '', r600: '', r3r6: '', dnsDpa: '', plasticViscocity: '',
     snsDpa: '', r3r649С: '', dns49Cdpa: '', plasticViscocity49c: '', sns49Cdpa: '', mbt: '', sand: '', filter: '', crust: '', ktk: '', ph: '',
     hardness: '', chlorides: '', pf: '', mf: '', pm: '', fluidSolidPhase: '', grease: '', calciumCarbonate: ''
-  },
+  }
+]
+
+const originDataFact = [
   {
-    key: '2', name: 'Факт', temperature: '', density: '', conditionalViscosity: '', r300: '', r600: '', r3r6: '', dnsDpa: '', plasticViscocity: '',
+    key: '9', name: 'Факт', temperature: '', density: '', conditionalViscosity: '', r300: '', r600: '', r3r6: '', dnsDpa: '', plasticViscocity: '',
     snsDpa: '', r3r649С: '', dns49Cdpa: '', plasticViscocity49c: '', sns49Cdpa: '', mbt: '', sand: '', filter: '', crust: '', ktk: '', ph: '',
     hardness: '', chlorides: '', pf: '', mf: '', pm: '', fluidSolidPhase: '', grease: '', calciumCarbonate: ''
   }
@@ -53,9 +58,15 @@ const EditableCell = ({
 
 
 export function DrillingFluid() {
+  let {id} = useParams()
+
   const [form] = Form.useForm();
-  const [data, setData] = useState(originData);
   const [editingKey, setEditingKey] = useState('');
+  const [idCategory, setIdCategory] = useState(8);
+  const [dataPlan, setDataPlan] = useState(originDataPlan)
+  const [dataFact, setDataFact] = useState(originDataFact)
+
+  const [loader, setLoader] = useState(false)
 
   const isEditing = (row) => row.key === editingKey;
 
@@ -100,7 +111,7 @@ export function DrillingFluid() {
           <span>
             <a
               href="javascript:;"
-              onClick={() => save(row)}
+              onClick={() => form.submit()}
               style={{ marginRight: 8 }}
             >
               Сохранить
@@ -135,6 +146,7 @@ export function DrillingFluid() {
   });
 
   const edit = (row) => {
+    setIdCategory(row.key)
     form.setFieldsValue({
       ...row,
     });
@@ -145,30 +157,21 @@ export function DrillingFluid() {
     setEditingKey('');
   };
 
-  const save = async (row) => {
+  const save = async (formData) => {
-    console.log(row)
     try {
-      // const row = await form.validateFields();
+      setLoader(true)
-      // const newData = [...data];
+      await FluidService.put(`${id}`, idCategory, formData)
-      // const index = newData.findIndex((item) => key === item.key);
+
-  
+      setLoader(false)
-      // if (index > -1) {
+
-      //   const item = newData[index];
+      setEditingKey('')
-      //   newData.splice(index, 1, { ...item, ...row });
-      //   setData(newData);
-      //   setEditingKey('');
-      // } else {
-      //   newData.push(row);
-      //   setData(newData);
-      //   setEditingKey('');
-      // }
     } catch (errInfo) {
-      //console.log('Validate Failed:', errInfo);
+      console.log('Validate Failed:', errInfo);
     }
   };
 
   return (<>
-    <Form form={form} component={false}>
+    <Form form={form} component={false} onFinish={save}>
       <Table
         components={{
           body: {
@@ -176,7 +179,7 @@ export function DrillingFluid() {
           },
         }}
         columns={mergedColumns}
-        dataSource={data}
+        dataSource={[dataPlan[0], dataFact[0]]}
         size={'small'}
         bordered={true}
         pagination={false}

src/components/MudDiagram.jsx

@@ -1,11 +1,14 @@
 import { useState } from 'react';
-import {Table, Input, Form, Popconfirm, Typography } from 'antd'
+import { useParams } from "react-router-dom";
+import { Table, Input, Form, Popconfirm, Typography } from 'antd'
 import { makeColumn } from './factory'
+import { MudDiagramService } from '../services/api/services/MudDiagramService';
 
 const originData = [
   {
-    key: '1', probeNumber: '', probeExtractionDepth: '', sandstone: '', siltstone: '', argillit: '', brokenArgillit: '', coal: '', sand: '', clay: '',
+    key: '10', probeNumber: '1', probeExtractionDepth: '1', sandstone: '1', siltstone: '1', argillit: '1', brokenArgillit: '1', coal: '1', sand: '1', clay: '1',
-    camstone: '', cement: '', summary: '', drillingMud: '', sludge: '', sludge: '', maxSum: '', methan: '', ethan: '', propan: '', butan: '', pentan: ''
+    camstone: '1', cement: '1', summary: '1', drillingMud: '1', sludge: '1', maxSum: '1', methane: '1', ethane: '1', propane: '1', butane: '1', pentane: '1',
+    mechanicalSpeed: '1', preliminaryConclusion: '1'
   }
 ]
 
@@ -30,7 +33,8 @@ const EditableCell = ({
               {
                 required: true,
                 message: '',
-                pattern: '(-?[1-9]+\d*([.,]\d+)?)$|^(-?0[.,]\d*[1-9]+)$|^0$|^0.0$'
+                pattern: '(-?[0-9]+\d*([.,]\d+)?)$|^(-?0[.,]\d*[0-9]+)$|^0$|^0.0$'
+                //pattern: '^-?\d+(\.\d{1,2})?$'
               },
             ]}
           >
@@ -45,9 +49,13 @@ const EditableCell = ({
 };
 
 export function SludgeDiagram() {
+  let {id} = useParams()
+
   const [form] = Form.useForm();
-  const [data, setData] = useState(originData);
   const [editingKey, setEditingKey] = useState('');
+  const [data, setData] = useState(originData)
+
+  const [loader, setLoader] = useState(false)
 
   const isEditing = (row) => row.key === editingKey;
 
@@ -85,7 +93,7 @@ export function SludgeDiagram() {
       children: [
         makeColumn('Сумма УВ мах. (абс%)', 'maxSum', { dataIndex: 'maxSum', align: 'center', className: 'lightpurple-background', editable: true}),
         makeColumn('С1 метан (отн%)', 'methane', { dataIndex: 'methane', align: 'center', className: 'lightpurple-background', editable: true}),
-        makeColumn('С2 этан (отн%)', 'ethan', { dataIndex: 'ethan', align: 'center', className: 'lightpurple-background', editable: true}),
+        makeColumn('С2 этан (отн%)', 'ethane', { dataIndex: 'ethane', align: 'center', className: 'lightpurple-background', editable: true}),
         makeColumn('С3 пропан (отн%)', 'propane', { dataIndex: 'propane', align: 'center', className: 'lightpurple-background', editable: true}),
         makeColumn('С4 бутан (отн%)', 'butane', { dataIndex: 'butane', align: 'center', className: 'lightpurple-background', editable: true}),
         makeColumn('С5 пентан (отн%)', 'pentane', { dataIndex: 'pentane', align: 'center', className: 'lightpurple-background', editable: true})
@@ -155,29 +163,49 @@ export function SludgeDiagram() {
     setEditingKey('');
   };
   
-  const save = async (key) => {
+  const save = async (formData) => {
+    // TODO: Почему-то в formData из всей формы попадает только поле key. Остальное пришлось записывать в params ниже
+    // В аналогичной модалке DrillingFluid все ок, все поля формы попадают в formData.
+    const params = {
+      key: form.getFieldValue('key'), 
+      probeNumber: form.getFieldValue('probeNumber'), 
+      probeExtractionDepth: form.getFieldValue('probeExtractionDepth'), 
+      sandstone: form.getFieldValue('sandstone'), 
+      siltstone: form.getFieldValue('siltstone'),  
+      argillit: form.getFieldValue('argillit'), 
+      brokenArgillit: form.getFieldValue('brokenArgillit'),  
+      coal: form.getFieldValue('coal'), 
+      sand: form.getFieldValue('sand'), 
+      clay: form.getFieldValue('clay'), 
+      camstone: form.getFieldValue('camstone'),  
+      cement: form.getFieldValue('cement'),  
+      summary: form.getFieldValue('summary'),  
+      drillingMud: form.getFieldValue('drillingMud'),  
+      sludge: form.getFieldValue('sludge'),  
+      maxSum: form.getFieldValue('maxSum'),  
+      methane: form.getFieldValue('methane'),  
+      ethane: form.getFieldValue('ethane'), 
+      propane: form.getFieldValue('propane'),  
+      butane: form.getFieldValue('butane'), 
+      pentane: form.getFieldValue('pentane'), 
+      mechanicalSpeed: form.getFieldValue('mechanicalSpeed'),  
+      preliminaryConclusion: form.getFieldValue('preliminaryConclusion'), 
+    }
+
     try {
-      const row = await form.validateFields();
+      setLoader(true)
-      const newData = [...data];
+      await MudDiagramService.put(`${id}`, 10, params)
-      const index = newData.findIndex((item) => key === item.key);
+
-  
+      setLoader(false)
-      if (index > -1) {
+
-        const item = newData[index];
+      setEditingKey('')
-        newData.splice(index, 1, { ...item, ...row });
-        setData(newData);
-        setEditingKey('');
-      } else {
-        newData.push(row);
-        setData(newData);
-        setEditingKey('');
-      }
     } catch (errInfo) {
       console.log('Validate Failed:', errInfo);
     }
   };
 
   return (<>
-    <Form form={form} component={false}>
+    <Form form={form} component={false} onFinish={save}>
       <Table
         components={{
           body: {

src/components/Nnb.jsx

@@ -1,10 +1,12 @@
 import { useState } from 'react'
+import { useParams } from "react-router-dom";
 import {Table, Input, Form, Popconfirm, Typography } from 'antd'
 import { makeColumn } from './factory'
+import { NnbDataService } from '../services/api/services/NnbDataService';
 
 const originData = [
   {
-    key: '1', depth: '', zenithAngle: '', magneticAzimuth: '', trueAzimuth: '', directAzimuth: '', verticalDepth: '', absoluteMark: '', localNorthOffset: '', 
+    key: '11', depth: '', zenithAngle: '', magneticAzimuth: '', trueAzimuth: '', directAzimuth: '', verticalDepth: '', absoluteMark: '', localNorthOffset: '', 
     localEastOffset: '', outFallOffset: '', offsetAzimuth: '', areaIntensity: '', offsetStopAngle: '', zenithIntensity: '', comment: '', depthPlanFactDifference: '', 
     distancePlanFactDifference: ''
   }
@@ -46,17 +48,21 @@ const EditableCell = ({
 };
 
 export function Nnb() {
+  let {id} = useParams()
+
   const [form] = Form.useForm();
-  const [data, setData] = useState(originData);
   const [editingKey, setEditingKey] = useState('');
+  const [data, setData] = useState(originData)
+
+  const [loader, setLoader] = useState(false)
 
   const isEditing = (row) => row.key === editingKey;
 
   const columns = [
     makeColumn('Глубина по стволу, м', 'depth', { dataIndex: 'depth', align: 'center', editable: true}),
     makeColumn('Зенитный угол, град', 'zenithAngle', { dataIndex: 'zenithAngle', align: 'center', editable: true}),
-    makeColumn('Азимут магнитный, град', 'trueAzimuth', { dataIndex: 'trueAzimuth', align: 'center', editable: true}),
+    makeColumn('Азимут магнитный, град', 'magneticAzimuth', { dataIndex: 'magneticAzimuth', align: 'center', editable: true}),
-    makeColumn('Азимут истинный, град', 'conditionalViscosity', { dataIndex: 'conditionalViscosity', align: 'center', editable: true}),
+    makeColumn('Азимут истинный, град', 'trueAzimuth', { dataIndex: 'trueAzimuth', align: 'center', editable: true}),
     makeColumn('Азимут дирекц., град', 'directAzimuth', { dataIndex: 'directAzimuth', align: 'center', editable: true}),
     makeColumn('Глубина по вертикали, м', 'verticalDepth', { dataIndex: 'verticalDepth', align: 'center', editable: true}),
     makeColumn('Абсолютная отметка, м', 'absoluteMark', { dataIndex: 'absoluteMark', align: 'center', editable: true}),
@@ -127,29 +133,45 @@ export function Nnb() {
     setEditingKey('');
   };
 
-  const save = async (key) => {
+  const save = async (formData) => {
+    // TODO: Почему-то в formData из всей формы попадает только поле key. Остальное пришлось записывать в params ниже
+    // В аналогичной модалке DrillingFluid все ок, все поля формы попадают в formData. 
+    const params = {
+      key: form.getFieldValue('key'), 
+      depth: form.getFieldValue('depth'), 
+      zenithAngle: form.getFieldValue('zenithAngle'), 
+      magneticAzimuth: form.getFieldValue('magneticAzimuth'), 
+      trueAzimuth: form.getFieldValue('trueAzimuth'),  
+      directAzimuth: form.getFieldValue('directAzimuth'), 
+      verticalDepth: form.getFieldValue('verticalDepth'),  
+      absoluteMark: form.getFieldValue('absoluteMark'), 
+      localNorthOffset: form.getFieldValue('localNorthOffset'), 
+      localEastOffset: form.getFieldValue('localEastOffset'), 
+      outFallOffset: form.getFieldValue('outFallOffset'),  
+      offsetAzimuth: form.getFieldValue('offsetAzimuth'),  
+      areaIntensity: form.getFieldValue('areaIntensity'),  
+      offsetStopAngle: form.getFieldValue('offsetStopAngle'),  
+      zenithIntensity: form.getFieldValue('zenithIntensity'),  
+      comment: form.getFieldValue('comment'),  
+      depthPlanFactDifference: form.getFieldValue('depthPlanFactDifference'),  
+      distancePlanFactDifference: form.getFieldValue('distancePlanFactDifference')
+    }
+
     try {
-      const row = await form.validateFields();
+      setLoader(true)
-      const newData = [...data];
+      await NnbDataService.put(`${id}`, 11, params)
-      const index = newData.findIndex((item) => key === item.key);
+
-  
+      setLoader(false)
-      if (index > -1) {
+
-        const item = newData[index];
+      setEditingKey('')
-        newData.splice(index, 1, { ...item, ...row });
-        setData(newData);
-        setEditingKey('');
-      } else {
-        newData.push(row);
-        setData(newData);
-        setEditingKey('');
-      }
     } catch (errInfo) {
       console.log('Validate Failed:', errInfo);
     }
   };
 
+
   return (<>
-    <Form form={form} component={false}>
+    <Form form={form} component={false} onFinish={save}>
       <Table
         components={{
           body: {

src/pages/LastData.jsx

@@ -1,16 +1,20 @@
 import {Button, Modal, Checkbox } from "antd";
 import {DrillingFluid} from "../components/DrillingFluid";
-import {useState} from "react";
+import {useState, useEffect} from "react";
-import {SludgeDiagram} from "../components/SludgeDiagram";
+import {useParams} from "react-router-dom"
+import {SludgeDiagram} from "../components/MudDiagram";
 import {Nnb} from "../components/Nnb"
 import Disposition from "../components/Disposition";
+import notify from "../components/notify"
 
 
 export default function LastData() {
+
   const [tableVisible, setCementTableVisible] = useState(false)
   const [tableSludgeVisible, setTableSludgeVisible] = useState(false)
   const [tableNNBVisible, setTableNNBVisible] = useState(false)
   const [dispositionVisible, setDispositionVisible] = useState(false)
+  const [loader, setLoader] = useState(false)
 
   return (
     <>

src/services/api/index.ts

@@ -14,8 +14,11 @@ export type { DepositDto } from './models/DepositDto';
 export type { EventDto } from './models/EventDto';
 export type { FilePropertiesDto } from './models/FilePropertiesDto';
 export type { FilePropertiesDtoPaginationContainer } from './models/FilePropertiesDtoPaginationContainer';
+export type { FluidDataDto } from './models/FluidDataDto';
 export type { MessageDto } from './models/MessageDto';
 export type { MessageDtoPaginationContainer } from './models/MessageDtoPaginationContainer';
+export type { MudDiagramDataDto } from './models/MudDiagramDataDto';
+export type { NnbDataDto } from './models/NnbDataDto';
 export type { TelemetryInfoDto } from './models/TelemetryInfoDto';
 export type { TelemetryMessageDto } from './models/TelemetryMessageDto';
 export type { TelemetryOperationDto } from './models/TelemetryOperationDto';
@@ -36,7 +39,10 @@ export { ClusterService } from './services/ClusterService';
 export { DataService } from './services/DataService';
 export { DepositService } from './services/DepositService';
 export { FileService } from './services/FileService';
+export { FluidService } from './services/FluidService';
 export { MessageService } from './services/MessageService';
+export { MudDiagramService } from './services/MudDiagramService';
+export { NnbDataService } from './services/NnbDataService';
 export { ReportService } from './services/ReportService';
 export { TelemetryService } from './services/TelemetryService';
 export { WellService } from './services/WellService';

src/services/api/models/FluidDataDto.ts

@@ -0,0 +1,33 @@
+/* istanbul ignore file */
+/* tslint:disable */
+/* eslint-disable */
+
+export type FluidDataDto = {
+    temperature?: string | null;
+    density?: string | null;
+    conditionalViscosity?: string | null;
+    r300?: string | null;
+    r600?: string | null;
+    r3r6?: string | null;
+    dnsDpa?: string | null;
+    plasticViscocity?: string | null;
+    snsDpa?: string | null;
+    'r3r649С'?: string | null;
+    dns49Cdpa?: string | null;
+    plasticViscocity49c?: string | null;
+    sns49Cdpa?: string | null;
+    mbt?: string | null;
+    sand?: string | null;
+    filtering?: string | null;
+    crust?: string | null;
+    ktk?: string | null;
+    ph?: string | null;
+    hardness?: string | null;
+    chlorides?: string | null;
+    pf?: string | null;
+    mf?: string | null;
+    pm?: string | null;
+    fluidSolidPhase?: string | null;
+    grease?: string | null;
+    calciumCarbonate?: string | null;
+}

src/services/api/models/MudDiagramDataDto.ts

@@ -0,0 +1,28 @@
+/* istanbul ignore file */
+/* tslint:disable */
+/* eslint-disable */
+
+export type MudDiagramDataDto = {
+    probeNumber?: number;
+    probeExtractionDepth?: number;
+    sandstone?: number;
+    siltstone?: number;
+    argillit?: number;
+    brokenArgillit?: number;
+    coal?: number;
+    sand?: number;
+    clay?: number;
+    camstone?: number;
+    cement?: number;
+    summary?: string | null;
+    drillingMud?: number;
+    sludge?: number;
+    maxSum?: number;
+    methane?: number;
+    ethan?: number;
+    propane?: number;
+    butane?: number;
+    pentane?: number;
+    mechanicalSpeed?: number;
+    preliminaryConclusion?: string | null;
+}

src/services/api/models/NnbDataDto.ts

@@ -0,0 +1,23 @@
+/* istanbul ignore file */
+/* tslint:disable */
+/* eslint-disable */
+
+export type NnbDataDto = {
+    depth?: number;
+    zenithAngle?: number;
+    trueAzimuth?: number;
+    conditionalViscosity?: number;
+    directAzimuth?: number;
+    verticalDepth?: number;
+    absoluteMark?: number;
+    localNorthOffset?: number;
+    localEastOffset?: number;
+    outFallOffset?: number;
+    offsetAzimuth?: number;
+    areaIntensity?: number;
+    offsetStopAngle?: number;
+    zenithIntensity?: number;
+    comment?: number;
+    depthPlanFactDifference?: number;
+    distancePlanFactDifference?: number;
+}

src/services/api/models/WellSectionDto.ts

@@ -3,6 +3,7 @@
 /* eslint-disable */
 
 export type WellSectionDto = {
+    id?: number;
     sectionType?: string | null;
     wellDepthPlan?: number;
     wellDepthFact?: number;

src/services/api/services/FluidService.ts

@@ -0,0 +1,52 @@
+/* istanbul ignore file */
+/* tslint:disable */
+/* eslint-disable */
+import type { FluidDataDto } from '../models/FluidDataDto';
+import { request as __request } from '../core/request';
+
+export class FluidService {
+
+    /**
+     * @param idWell 
+     * @param idCategory 
+     * @returns any Success
+     * @throws ApiError
+     */
+    public static async get(
+idWell: number,
+idCategory?: number,
+): Promise<any> {
+        const result = await __request({
+            method: 'GET',
+            path: `/api/fluidLastData/${idWell}`,
+            query: {
+                'idCategory': idCategory,
+            },
+        });
+        return result.body;
+    }
+
+    /**
+     * @param idWell 
+     * @param idCategory 
+     * @param requestBody 
+     * @returns any Success
+     * @throws ApiError
+     */
+    public static async put(
+idWell: number,
+idCategory?: number,
+requestBody?: FluidDataDto,
+): Promise<any> {
+        const result = await __request({
+            method: 'POST',
+            path: `/api/fluidLastData/${idWell}`,
+            query: {
+                'idCategory': idCategory,
+            },
+            body: requestBody,
+        });
+        return result.body;
+    }
+
+}

src/services/api/services/MudDiagramService.ts

@@ -0,0 +1,52 @@
+/* istanbul ignore file */
+/* tslint:disable */
+/* eslint-disable */
+import type { MudDiagramDataDto } from '../models/MudDiagramDataDto';
+import { request as __request } from '../core/request';
+
+export class MudDiagramService {
+
+    /**
+     * @param idWell 
+     * @param idCategory 
+     * @returns any Success
+     * @throws ApiError
+     */
+    public static async get(
+idWell: number,
+idCategory?: number,
+): Promise<any> {
+        const result = await __request({
+            method: 'GET',
+            path: `/api/mudLastData/${idWell}`,
+            query: {
+                'idCategory': idCategory,
+            },
+        });
+        return result.body;
+    }
+
+    /**
+     * @param idWell 
+     * @param idCategory 
+     * @param requestBody 
+     * @returns any Success
+     * @throws ApiError
+     */
+    public static async put(
+idWell: number,
+idCategory?: number,
+requestBody?: MudDiagramDataDto,
+): Promise<any> {
+        const result = await __request({
+            method: 'POST',
+            path: `/api/mudLastData/${idWell}`,
+            query: {
+                'idCategory': idCategory,
+            },
+            body: requestBody,
+        });
+        return result.body;
+    }
+
+}

src/services/api/services/NnbDataService.ts

@@ -0,0 +1,52 @@
+/* istanbul ignore file */
+/* tslint:disable */
+/* eslint-disable */
+import type { NnbDataDto } from '../models/NnbDataDto';
+import { request as __request } from '../core/request';
+
+export class NnbDataService {
+
+    /**
+     * @param idWell 
+     * @param idCategory 
+     * @returns any Success
+     * @throws ApiError
+     */
+    public static async get(
+idWell: number,
+idCategory?: number,
+): Promise<any> {
+        const result = await __request({
+            method: 'GET',
+            path: `/api/nnbLastData/${idWell}`,
+            query: {
+                'idCategory': idCategory,
+            },
+        });
+        return result.body;
+    }
+
+    /**
+     * @param idWell 
+     * @param idCategory 
+     * @param requestBody 
+     * @returns any Success
+     * @throws ApiError
+     */
+    public static async put(
+idWell: number,
+idCategory?: number,
+requestBody?: NnbDataDto,
+): Promise<any> {
+        const result = await __request({
+            method: 'POST',
+            path: `/api/nnbLastData/${idWell}`,
+            query: {
+                'idCategory': idCategory,
+            },
+            body: requestBody,
+        });
+        return result.body;
+    }
+
+}