Merge branch 'master' of https://bitbucket.org/frolovng/asb_cloud_front_react

package.json

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

src/components/AnalysisDepthToDay.jsx

@@ -1,5 +1,4 @@
 import { ChartDepthToDay } from './charts/ChartDepthToDay'
-import { useParams } from "react-router-dom"
 import notify from "../components/notify"
 import { useState, useEffect } from 'react'
 import { AnalyticsService } from "../services/api"
@@ -10,8 +9,7 @@ const lines = [
   { label: "Положение инструмента", yAccessorName: "bitDepth", color: '#ff0' }
 ]
 
-export function AnalysisDepthToDay() {
+export function AnalysisDepthToDay({idWell}) {
-  let { id } = useParams()
   const [depthToDayData, setDepthToDayData] = useState([])
   const [loader, setLoader] = useState(false)
 
@@ -21,15 +19,15 @@ export function AnalysisDepthToDay() {
 
   useEffect(() => {
     setLoader(true)
-    AnalyticsService.getWellDepthToDay(id)
+    AnalyticsService.getWellDepthToDay(idWell)
       .then(handleReceiveDepthToDayData)
       .catch(error => {
-        notify(`Не удалось получить данные для Анализа Глубина-День по скважине "${id}"`,
+        notify(`Не удалось получить данные для Анализа Глубина-День по скважине "${idWell}"`,
           'warning')
         console.log(error)
       })
       .finally(setLoader(false))
-  }, [id])
+  }, [idWell])
 
   return (
     <LoaderPortal show={loader}>

src/components/modalWindows/ModalChartDepthToday.jsx

@@ -0,0 +1,25 @@
+import { useState } from 'react'
+import { AnalysisDepthToDay } from '../AnalysisDepthToDay'
+import { Button, Modal } from 'antd'
+
+export default function ModalChartDepthToDay({idWell}) {
+  const [chartVisible, setChartVisible] = useState(false)
+
+  return (<>
+    <Button type="secondary" onClick={() => setChartVisible(true)} style={{ marginLeft: "5px" }}>
+      Открыть
+    </Button>
+    <Modal
+      title='Последние показатели бурового раствора'
+      centered
+      visible={chartVisible}
+      onOk={() => setChartVisible(false)}
+      onCancel={() => setChartVisible(false)}
+      width={1800}
+      okText='Ок'
+      cancelText='Отмена'
+    >
+      <AnalysisDepthToDay idWell={idWell}/>
+    </Modal>
+  </>)
+}

src/pages/Analysis.jsx

@@ -3,7 +3,7 @@ import { AnalysisDepthToInterval } from '../components/AnalysisDepthToInterval'
 import { AnalysisOperationTime } from '../components/AnalysisOperationTime'
 import { Row, Col } from 'antd'
 
-export default function Analysis() {
+export default function Analysis({idWell}) {
 
   return (
     <>
@@ -11,18 +11,18 @@ export default function Analysis() {
       <Row justify="space-around" align="middle">
         <Col span={10}>
           <h2>График Глубина-день</h2>
-          <AnalysisDepthToDay />
+          <AnalysisDepthToDay idWell={idWell}/>
         </Col>
         <Col span={10}>
           <h2>График Глубина за интервал</h2>
-          <AnalysisDepthToInterval />
+          <AnalysisDepthToInterval  idWell={idWell}/>
         </Col>
       </Row >
       <Row><div style={{height: "150px"}}>&nbsp;</div></Row>
       <Row justify="space-around" align="middle">
         <Col span={10}>
           <h2>График Операция за время</h2>
-          <AnalysisOperationTime />
+          <AnalysisOperationTime  idWell={idWell}/>
         </Col>
       </Row>
     </>

src/pages/Cluster.jsx

@@ -1,104 +1,12 @@
-import {useParams} from "react-router-dom";
+import { useParams } from "react-router-dom";
-import {Link} from "react-router-dom";
+import { Link } from "react-router-dom";
 import LoaderPortal from '../components/LoaderPortal'
 import { useState, useEffect } from "react";
-import {ClusterService} from '../services/api'
+import { ClusterService } from '../services/api'
 import notify from '../components/notify'
-import {Table, Tag, Button} from 'antd';
+import { Table, Tag, Button } from 'antd';
+import ModalChartDepthToDay from '../components/modalWindows/ModalChartDepthToday'
 
-const columns = [
-  {
-    title: 'скв №',
-    key: 'caption',
-    dataIndex: 'caption',
-    render: (_, item) => <Link to={`/well/${item.id}`}>{item.caption}</Link>
-  },
-  {
-    title: 'Тип скв.',
-    key: 'wellType',
-    dataIndex: 'wellType',
-  },
-  {
-    title: 'Фактические сроки бурения',
-    children: [
-      {
-        title: 'начало',
-        key: 'factStart',
-        dataIndex: 'factStart',
-      },
-      {
-        title: 'окончание',
-        key: 'factEnd',
-        dataIndex: 'factEnd',
-      },
-    ]
-  },
-  {
-    title: 'Продолжительность бурения',
-    children: [      
-      {
-        title: 'план',
-        key: 'periodPlan',
-        dataIndex: 'periodPlan',
-      },
-      {
-        title: 'факт',
-        key: 'periodFact',
-        dataIndex: 'periodFact',
-      },
-    ]
-  },
-  {
-    title: 'МСП за скв',
-    children: [
-      {
-        title: 'план',
-        key: 'rateOfPenetrationPlan',
-        dataIndex: 'rateOfPenetrationPlan',
-      },
-      {
-        title: 'факт',
-        key: 'rateOfPenetrationFact',
-        dataIndex: 'rateOfPenetrationFact',
-      },
-    ],
-  },
-  {
-    title: 'Рейсовая скорость за скв',
-    children: [
-      {
-        title: 'план',
-        key: 'routeSpeedPlan',
-        dataIndex: 'routeSpeedPlan',
-      },
-      {
-        title: 'факт',
-        key: 'routeSpeedFact',
-        dataIndex: 'routeSpeedFact',
-      },
-    ],
-  },
-  {
-    title: 'Секции',
-    key: 'sections',
-    dataIndex: 'sections',
-    render: (item) => (<span>таблица по секциям</span>)
-  },
-  {
-    title: 'График глубина-день',
-    render: _ => (<Button>Открыть</Button>)
-  },
-  {
-    title: 'Таблица по операциям',
-    render: _ => (<Button>Открыть</Button>)
-  },
-  {
-    title: 'Подрядчики',
-    key: 'companies',
-    dataIndex: 'companies',
-    render: (item) => item.map(company => <Tag color="blue">{company.caption}</Tag>)
-  },
-];
 
 export default function Cluster() {
   let { id } = useParams()
@@ -106,38 +14,133 @@ export default function Cluster() {
   const [wellsStat, setWellsStat] = useState(null)
   const [showLoader, setShowLoader] = useState(false)
 
-  useEffect(()=>{
+  useEffect(() => {
-    const updateWellsStat = async() => {
+    const updateWellsStat = async () => {
       setShowLoader(true)
-      try{
+      try {
-        const msInDay = 1000*60*60*24
+        const msInDay = 1000 * 60 * 60 * 24
         const data = await ClusterService.getStat(id)
-        const wellsStat = data.wellsStat.map(w=>({...w,
+        const wellsStat = data.wellsStat.map(w => ({
-          periodPlan: (new Date(w.planEnd) - new Date(w.planStart))/msInDay,
+          ...w,
-          periodFact: (new Date(w.factEnd) - new Date(w.factStart))/msInDay,
+          periodPlan: (new Date(w.planEnd) - new Date(w.planStart)) / msInDay,
+          periodFact: (new Date(w.factEnd) - new Date(w.factStart)) / msInDay,
         }))
         setWellsStat(wellsStat)
         setClusterTitle(data.caption)
       }
-      catch(ex) {
+      catch (ex) {
         notify(`Не удалось загрузить статистику по скважинам куста "${id}"`, 'error')
         console.log(ex)
       }
       setShowLoader(false)
     }
     updateWellsStat()
-  },[id])
+  }, [id])
 
-  return(
+  const columns = [
+    {
+      title: 'скв №',
+      key: 'caption',
+      dataIndex: 'caption',
+      render: (_, item) => <Link to={`/well/${item.id}`}>{item.caption}</Link>
+    },
+    {
+      title: 'Тип скв.',
+      key: 'wellType',
+      dataIndex: 'wellType',
+    },
+    {
+      title: 'Фактические сроки бурения',
+      children: [
+        {
+          title: 'начало',
+          key: 'factStart',
+          dataIndex: 'factStart',
+        },
+        {
+          title: 'окончание',
+          key: 'factEnd',
+          dataIndex: 'factEnd',
+        },
+      ]
+    },
+    {
+      title: 'Продолжительность бурения',
+      children: [
+        {
+          title: 'план',
+          key: 'periodPlan',
+          dataIndex: 'periodPlan',
+        },
+        {
+          title: 'факт',
+          key: 'periodFact',
+          dataIndex: 'periodFact',
+        },
+      ]
+    },
+    {
+      title: 'МСП за скв',
+      children: [
+        {
+          title: 'план',
+          key: 'rateOfPenetrationPlan',
+          dataIndex: 'rateOfPenetrationPlan',
+        },
+        {
+          title: 'факт',
+          key: 'rateOfPenetrationFact',
+          dataIndex: 'rateOfPenetrationFact',
+        },
+      ],
+    },
+    {
+      title: 'Рейсовая скорость за скв',
+      children: [
+        {
+          title: 'план',
+          key: 'routeSpeedPlan',
+          dataIndex: 'routeSpeedPlan',
+        },
+        {
+          title: 'факт',
+          key: 'routeSpeedFact',
+          dataIndex: 'routeSpeedFact',
+        },
+      ],
+    },
+    {
+      title: 'Секции',
+      key: 'sections',
+      dataIndex: 'sections',
+      render: (item) => (<span>таблица по секциям</span>)
+    },
+    {
+      title: 'График глубина-день',
+      render: (_, item) => (<ModalChartDepthToDay  idWell={item.id}/>)
+    },
+    {
+      title: 'Таблица по операциям',
+      render: _ => (<Button>Открыть</Button>)
+    },
+    {
+      title: 'Подрядчики',
+      key: 'companies',
+      dataIndex: 'companies',
+      render: (item) => item.map(company => <Tag color="blue">{company.caption}</Tag>)
+    },
+  ];
+
+  return (
     <LoaderPortal show={showLoader}>
       <h3>{clusterTitle}</h3>
       <Table
-          columns={columns}
+        columns={columns}
-          dataSource={wellsStat}
+        dataSource={wellsStat}
-          size={'small'}
+        size={'small'}
-          bordered
+        bordered
-          pagination={false}
+        pagination={false}
-          rowKey={(record) => record.id}
+        rowKey={(record) => record.id}
-        />
+      />
     </LoaderPortal>)
 }

src/pages/ClusterStat.jsx

@@ -0,0 +1,143 @@
+import {useParams} from "react-router-dom";
+import {Link} from "react-router-dom";
+import LoaderPortal from '../components/LoaderPortal'
+import { useState, useEffect } from "react";
+import {ClusterService} from '../services/api'
+import notify from '../components/notify'
+import {Table, Tag, Button} from 'antd';
+
+const columns = [
+  {
+    title: 'скв №',
+    key: 'caption',
+    dataIndex: 'caption',
+    render: (_, item) => <Link to={`/well/${item.id}`}>{item.caption}</Link>
+  },
+  {
+    title: 'Тип скв.',
+    key: 'wellType',
+    dataIndex: 'wellType',
+  },
+  {
+    title: 'Фактические сроки бурения',
+    children: [
+      {
+        title: 'начало',
+        key: 'factStart',
+        dataIndex: 'factStart',
+      },
+      {
+        title: 'окончание',
+        key: 'factEnd',
+        dataIndex: 'factEnd',
+      },
+    ]
+  },
+  {
+    title: 'Продолжительность бурения',
+    children: [      
+      {
+        title: 'план',
+        key: 'periodPlan',
+        dataIndex: 'periodPlan',
+      },
+      {
+        title: 'факт',
+        key: 'periodFact',
+        dataIndex: 'periodFact',
+      },
+    ]
+  },
+  {
+    title: 'МСП за скв',
+    children: [
+      {
+        title: 'план',
+        key: 'rateOfPenetrationPlan',
+        dataIndex: 'rateOfPenetrationPlan',
+      },
+      {
+        title: 'факт',
+        key: 'rateOfPenetrationFact',
+        dataIndex: 'rateOfPenetrationFact',
+      },
+    ],
+  },
+  {
+    title: 'Рейсовая скорость за скв',
+    children: [
+      {
+        title: 'план',
+        key: 'routeSpeedPlan',
+        dataIndex: 'routeSpeedPlan',
+      },
+      {
+        title: 'факт',
+        key: 'routeSpeedFact',
+        dataIndex: 'routeSpeedFact',
+      },
+    ],
+  },
+  {
+    title: 'Секции',
+    key: 'sections',
+    dataIndex: 'sections',
+    render: (item) => (<span>таблица по секциям</span>)
+  },
+  {
+    title: 'График глубина-день',
+    render: _ => (<Button>Открыть</Button>)
+  },
+  {
+    title: 'Таблица по операциям',
+    render: _ => (<Button>Открыть</Button>)
+  },
+  {
+    title: 'Подрядчики',
+    key: 'companies',
+    dataIndex: 'companies',
+    render: (item) => item.map(company => <Tag color="blue">{company.caption}</Tag>)
+  },
+];
+
+export default function ClusterStat() {  
+  let { id } = useParams()
+  const [clusterTitle, setClusterTitle] = useState("")
+  const [wellsStat, setWellsStat] = useState(null)
+  const [showLoader, setShowLoader] = useState(false)
+
+  useEffect(()=>{
+    const updateWellsStat = async() => {
+      setShowLoader(true)
+      try{
+        const msInDay = 1000*60*60*24
+        const data = await ClusterService.getStat(id)
+        const wellsStat = data.wellsStat.map(w=>({...w,
+          periodPlan: (new Date(w.planEnd) - new Date(w.planStart))/msInDay,
+          periodFact: (new Date(w.factEnd) - new Date(w.factStart))/msInDay,
+        }))
+        setWellsStat(wellsStat)
+        setClusterTitle(data.caption)
+      }
+      catch(ex) {
+        notify(`Не удалось загрузить статистику по скважинам куста "${id}"`, 'error')
+        console.log(ex)
+      }
+      setShowLoader(false)
+    }
+    updateWellsStat()
+  },[id])
+
+  return(
+    <LoaderPortal show={showLoader}>
+      <h3>{clusterTitle}</h3>
+      <Table
+          columns={columns}
+          dataSource={wellsStat}
+          size={'small'}
+          bordered
+          pagination={false}
+          rowKey={(record) => record.id}
+        />
+    </LoaderPortal>)
+}

src/pages/Files.jsx

@@ -1,7 +0,0 @@
-export default function Files(props) {
-  return (
-    <div className="menu-title">
-      <h2>Файлы</h2>
-    </div>
-  )
-}

src/pages/Well.jsx

@@ -1,14 +1,13 @@
 import {Layout, Menu} from "antd";
 import {FolderOutlined, FundViewOutlined} from "@ant-design/icons";
 import {Link, Redirect, Route, Switch, useParams} from "react-router-dom";
-import Files from "../pages/Files";
 import Archive from "../pages/Archive";
 import Messages from "../pages/Messages";
 import Report from "../pages/Report";
 import Analysis from "../pages/Analysis";
 import WellAnalysis from "../pages/WellAnalysis";
 import TelemetryView from "../pages/TelemetryView";
-import MenuDocuments from "../components/MenuDocuments";
+import WellStat from "./WellStat";
 
 const { Content } = Layout
 
@@ -41,7 +40,7 @@ export default function Well() {
           <Link to={{pathname: `${rootPath}/wellAnalysis`}}>Операции по скважине</Link>
         </Menu.Item>
         <Menu.Item key="6" icon={<FolderOutlined/>}>
-          <Link to={{pathname: `${rootPath}/file`}}>Файлы</Link>
+          <Link to='stat'>Статистика</Link>
         </Menu.Item>
         <Menu.Item key="7" icon={<FolderOutlined/>}>
           <Link to={{pathname: `${rootPath}/archive`}}>Архив</Link>
@@ -82,8 +81,8 @@ export default function Well() {
       <Layout>
         <Content className="site-layout-background">
           <Switch>
-            <Route path="/well/:id/file">
+            <Route path="/well/:id/stat">
-              <Files/>
+              <WellStat/>
             </Route>
             <Route path="/well/:id/archive">
               <Archive/>
@@ -95,7 +94,7 @@ export default function Well() {
               <Report/>
             </Route>
             <Route path="/well/:id/analysis">
-              <Analysis/>
+              <Analysis idWell={id}/>
             </Route>
             <Route path="/well/:id/wellAnalysis">
               <WellAnalysis/>

src/pages/WellStat.jsx

@@ -0,0 +1,72 @@
+//import {useParams} from "react-router-dom";
+//import {Link} from "react-router-dom";
+import LoaderPortal from '../components/LoaderPortal'
+import { useState, useEffect } from "react";
+// import {ClusterService} from '../services/api'
+// import notify from '../components/notify'
+import {Table, Tag, Button} from 'antd';
+
+const makeColumn = (title, key) => ({title: title,  key: key,  dataIndex: key,})
+
+const makePlanFactColumns = (title, keyPlan, keyFact) =>
+{
+  let keyPlanLocal = keyPlan
+  let keyFactLocal = keyFact
+  
+  if(!keyFact){
+    keyPlanLocal = keyPlan + 'Plan'
+    keyFactLocal =  keyPlan + 'Fact'
+  }
+
+  return {  
+    title: title,
+    children: [ 
+      makeColumn('план', keyPlanLocal),
+      makeColumn('факт', keyFactLocal),
+    ]
+  }
+}
+
+const columns = [
+  makeColumn('Конструкция секции', 'sectionType'),
+  makePlanFactColumns('Глубина, м', 'wellDepth'),
+  makePlanFactColumns('Период, д',  'buildDays'),
+  makePlanFactColumns('Механическая скорость проходки, м/час', 'rateOfPenetration'),
+  makePlanFactColumns('Рейсовая скорость, м/час', 'routeSpeed'),
+  makePlanFactColumns('Скорость подъема КНБК', 'bhaUpSpeed'),
+  makePlanFactColumns('Скорость спуска КНБК', 'bhaDownSpeed'),
+  makePlanFactColumns('Скорость спуска обсадной колонны', 'casingDownSpeed'),
+]
+
+// const data = [{
+//   sectionType: 'загагулина',
+//   wellDepthPlan: 1,
+//   wellDepthFact: 1,
+//   buildDaysPlan: 1,
+//   buildDaysFact: 1,
+//   rateOfPenetrationPlan: 4,
+//   rateOfPenetrationFact: 3,
+//   routeSpeedPlan: 2,
+//   routeSpeedFact: 1,
+//   bhaUpSpeedPlan: 1,
+//   bhaUpSpeedFact: 1,
+//   bhaDownSpeedPlan: 1,
+//   bhaDownSpeedFact: 1,
+//   casingDownSpeedPlan: 1,
+//   casingDownSpeedFact: 1,
+//   }]
+
+export default function WellStat({data}){
+  const [showLoader, setShowLoader] = useState(false)
+  return(
+    <LoaderPortal show={showLoader}>
+      <Table
+          columns={columns}
+          dataSource={data}
+          size={'small'}
+          bordered
+          pagination={false}
+          rowKey={(record) => record.sectionType}
+        />
+    </LoaderPortal>)
+}

src/services/api/models/WellOperationDto.ts

@@ -3,4 +3,10 @@
 /* eslint-disable */
 
 export type WellOperationDto = {
+    id?: number;
+    idWell?: number;
+    caption?: string | null;
+    description?: string | null;
+    casingSection?: number;
+    wellDepth?: number;
 }