Add WellStat

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/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>)
+}