diff --git a/package.json b/package.json index 576e207..08ccc73 100644 --- a/package.json +++ b/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", diff --git a/src/components/AnalysisDepthToDay.jsx b/src/components/AnalysisDepthToDay.jsx index 9577cb0..6bae9c5 100644 --- a/src/components/AnalysisDepthToDay.jsx +++ b/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() { - let { id } = useParams() +export function AnalysisDepthToDay({idWell}) { 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 ( diff --git a/src/components/modalWindows/ModalChartDepthToday.jsx b/src/components/modalWindows/ModalChartDepthToday.jsx new file mode 100644 index 0000000..2117ff3 --- /dev/null +++ b/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 (<> + + setChartVisible(false)} + onCancel={() => setChartVisible(false)} + width={1800} + okText='Ок' + cancelText='Отмена' + > + + + ) +} \ No newline at end of file diff --git a/src/pages/Analysis.jsx b/src/pages/Analysis.jsx index dacb12c..4033654 100644 --- a/src/pages/Analysis.jsx +++ b/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() {

График Глубина-день

- +

График Глубина за интервал

- +
 

График Операция за время

- +
diff --git a/src/pages/Cluster.jsx b/src/pages/Cluster.jsx index 74855b2..9361b5d 100644 --- a/src/pages/Cluster.jsx +++ b/src/pages/Cluster.jsx @@ -1,143 +1,146 @@ -import {useParams} from "react-router-dom"; -import {Link} from "react-router-dom"; +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 { 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) => {item.caption} - }, - { - 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) => (таблица по секциям) - }, - { - title: 'График глубина-день', - render: _ => () - }, - { - title: 'Таблица по операциям', - render: _ => () - }, - { - title: 'Подрядчики', - key: 'companies', - dataIndex: 'companies', - render: (item) => item.map(company => {company.caption}) - }, -]; -export default function Cluster() { +export default function Cluster() { let { id } = useParams() const [clusterTitle, setClusterTitle] = useState("") const [wellsStat, setWellsStat] = useState(null) const [showLoader, setShowLoader] = useState(false) - useEffect(()=>{ - const updateWellsStat = async() => { + useEffect(() => { + const updateWellsStat = async () => { setShowLoader(true) - try{ - const msInDay = 1000*60*60*24 + 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, + 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) { + catch (ex) { notify(`Не удалось загрузить статистику по скважинам куста "${id}"`, 'error') console.log(ex) } setShowLoader(false) } updateWellsStat() - },[id]) + }, [id]) - return( + const columns = [ + { + title: 'скв №', + key: 'caption', + dataIndex: 'caption', + render: (_, item) => {item.caption} + }, + { + 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) => (таблица по секциям) + }, + { + title: 'График глубина-день', + render: (_, item) => () + }, + { + title: 'Таблица по операциям', + render: _ => () + }, + { + title: 'Подрядчики', + key: 'companies', + dataIndex: 'companies', + render: (item) => item.map(company => {company.caption}) + }, + ]; + + return (

{clusterTitle}

record.id} - /> + columns={columns} + dataSource={wellsStat} + size={'small'} + bordered + pagination={false} + rowKey={(record) => record.id} + /> ) } \ No newline at end of file diff --git a/src/pages/ClusterStat.jsx b/src/pages/ClusterStat.jsx new file mode 100644 index 0000000..5c3b055 --- /dev/null +++ b/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) => {item.caption} + }, + { + 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) => (таблица по секциям) + }, + { + title: 'График глубина-день', + render: _ => () + }, + { + title: 'Таблица по операциям', + render: _ => () + }, + { + title: 'Подрядчики', + key: 'companies', + dataIndex: 'companies', + render: (item) => item.map(company => {company.caption}) + }, +]; + +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( + +

{clusterTitle}

+
record.id} + /> + ) +} \ No newline at end of file diff --git a/src/pages/Files.jsx b/src/pages/Files.jsx deleted file mode 100644 index 9ec760b..0000000 --- a/src/pages/Files.jsx +++ /dev/null @@ -1,7 +0,0 @@ -export default function Files(props) { - return ( -
-

Файлы

-
- ) -} \ No newline at end of file diff --git a/src/pages/Well.jsx b/src/pages/Well.jsx index cc3018d..60184b6 100644 --- a/src/pages/Well.jsx +++ b/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() { Операции по скважине}> - Файлы + Статистика }> Архив @@ -82,8 +81,8 @@ export default function Well() { - - + + @@ -95,7 +94,7 @@ export default function Well() { - + diff --git a/src/pages/WellStat.jsx b/src/pages/WellStat.jsx new file mode 100644 index 0000000..5372b1a --- /dev/null +++ b/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( + +
record.sectionType} + /> + ) +} \ No newline at end of file diff --git a/src/services/api/models/WellOperationDto.ts b/src/services/api/models/WellOperationDto.ts index 2e9fb3c..3e90db8 100644 --- a/src/services/api/models/WellOperationDto.ts +++ b/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; } \ No newline at end of file