From 9e1dcbf5b0f665ed6f1e8c316e33d35ed31dbe6e Mon Sep 17 00:00:00 2001 From: goodmice Date: Wed, 13 Oct 2021 16:32:01 +0500 Subject: [PATCH] =?UTF-8?q?=D0=9E=D0=B1=D0=BD=D0=BE=D0=B2=D0=BB=D0=B5?= =?UTF-8?q?=D0=BD=D0=B0=20=D1=81=D1=82=D1=80=D0=B0=D0=BD=D0=B8=D1=86=D0=B0?= =?UTF-8?q?=20=D0=BA=D1=83=D1=81=D1=82=D0=B0=20(=D1=83=D0=B1=D1=80=D0=B0?= =?UTF-8?q?=D0=BD=D0=B0=20=D0=B2=D0=BA=D0=BB=D0=B0=D0=B4=D0=BA=D0=B0=20?= =?UTF-8?q?=D1=81=D0=B5=D0=BA=D1=86=D0=B8=D0=B9)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/Cluster/ClusterSections.jsx | 272 ---------------------- src/pages/Cluster/ClusterWells.jsx | 194 ++++++--------- src/pages/Cluster/WellOperationsTable.jsx | 41 +--- src/pages/Cluster/functions.jsx | 6 +- src/pages/Cluster/index.jsx | 70 ++---- 5 files changed, 105 insertions(+), 478 deletions(-) delete mode 100644 src/pages/Cluster/ClusterSections.jsx diff --git a/src/pages/Cluster/ClusterSections.jsx b/src/pages/Cluster/ClusterSections.jsx deleted file mode 100644 index f3b862b..0000000 --- a/src/pages/Cluster/ClusterSections.jsx +++ /dev/null @@ -1,272 +0,0 @@ -import { Table, Tag, Button, Badge, Divider, Modal } from "antd"; -import { Link } from "react-router-dom"; -import { LineChartOutlined, ProfileOutlined } from "@ant-design/icons"; -import { useState, useEffect } from "react"; -import { - makeTextColumn, - makeNumericColumnPlanFact -} from "../../components/Table"; -import { invokeWebApiWrapperAsync } from '../../components/factory'; -import ChartTvD from '../WellOperations/ChartTvD'; -import WellOperationsTable from './WellOperationsTable' -import { - calcAndUpdateStatsBySections, - makeFilterMinMaxFunction, - getOperations -} from "./functions"; - - -const filtersMinMax = [ - { - text: "min", - value: "min", - }, - { - text: "max", - value: "max", - }, -]; - -const filtersSectionsType = []; - - -export default function ClusterSections({ clusterData }) { - - const [selectedWellId, setSelectedWellId] = useState(0) - const [selectedWells, setSelectedWells] = useState([]); - const [selectedWellsKeys, setSelectedWellsKeys] = useState([]); - const [isTVDModalVisible, setIsTVDModalVisible] = useState(false) - const [isOpsModalVisible, setIsOpsModalVisible] = useState(false) - const [tvdDataPlan, setTvdDataPlan] = useState([]); - const [tvdDataFact, setTvdDataFact] = useState([]); - const [tvdDataForecast, setTvdDataForecast] = useState([]); - const [wellOperations, setWellOperations] = useState([]); - - useEffect(() => { - if (selectedWellId > 0) { - invokeWebApiWrapperAsync( - async () => { - const operations = await getOperations(selectedWellId); - - setWellOperations(operations.operations) - - setTvdDataPlan(operations.plan) - - setTvdDataFact(operations.fact) - - setTvdDataForecast(operations.predict) - }, - null, - `Не удалось загрузить операции по скважине "${selectedWellId}"`, - ); - } - }, [selectedWellId]); - - let rows = []; - - clusterData.statsWells?.forEach((well) => { - well.sections?.forEach((section) => { - let row = { - key: well.caption + section.id, - id: well.id, - caption: well.caption, - sectionType: section.caption, - sectionWellDepthPlan: section.plan?.wellDepthEnd, - sectionWellDepthFact: section.fact?.wellDepthEnd, - sectionBuildDaysPlan: ( - (new Date(section.plan?.end) - new Date(section.plan?.start)) / - (1000 * 60 * 60 * 24) - ), - sectionBuildDaysFact: ( - (new Date(section.fact?.end) - new Date(section.fact?.start)) / - (1000 * 60 * 60 * 24) - ), - sectionRateOfPenetrationPlan: section.plan?.rop, - sectionRateOfPenetrationFact: section.fact?.rop, - sectionRouteSpeedPlan: section.plan?.routeSpeed, - sectionRouteSpeedFact: section.fact?.routeSpeed, - sectionBhaDownSpeedPlan: section.plan?.bhaDownSpeed, - sectionBhaDownSpeedFact: section.fact?.bhaDownSpeed, - sectionBhaUpSpeedPlan: section.plan?.bhaUpSpeed, - sectionBhaUpSpeedFact: section.fact?.bhaUpSpeed, - sectionCasingDownSpeedPlan: section.plan?.casingDownSpeed, - sectionCasingDownSpeedFact: section.fact?.casingDownSpeed, - nonProductiveTimePlan: section.plan?.nonProductiveHours, - nonProductiveTimeFact: section.fact?.nonProductiveHours, - companies: well.companies, - }; - - rows.push(row); - - if (!filtersSectionsType.some((el) => el.text === section.caption)) - filtersSectionsType.push({ - text: section.caption, - value: section.caption, - }); - }); - }); - - calcAndUpdateStatsBySections(rows ?? [], [ - "sectionWellDepthPlan", - "sectionWellDepthFact", - "sectionBuildDaysPlan", - "sectionBuildDaysFact", - "sectionRateOfPenetrationPlan", - "sectionRateOfPenetrationFact", - "sectionRouteSpeedPlan", - "sectionRouteSpeedFact", - "sectionBhaDownSpeedPlan", - "sectionBhaDownSpeedFact", - "sectionBhaUpSpeedPlan", - "sectionBhaUpSpeedFact", - "sectionCasingDownSpeedPlan", - "sectionCasingDownSpeedFact", - "nonProductiveTimePlan", - "nonProductiveTimeFact", - ]); - - const columns = [ - makeTextColumn("скв №", "caption", null, null, - (text, item) => {text ?? '-'} - ), - makeTextColumn("Секция", "sectionType", filtersSectionsType, null, - (text, item) => text ?? '-' - ), - makeNumericColumnPlanFact( - "Глубина", - "sectionWellDepth", - filtersMinMax, - makeFilterMinMaxFunction - ), - makeNumericColumnPlanFact( - "Продолжительность", - "sectionBuildDays", - filtersMinMax, - makeFilterMinMaxFunction - ), - makeNumericColumnPlanFact( - "МСП", - "sectionRateOfPenetration", - filtersMinMax, - makeFilterMinMaxFunction - ), - makeNumericColumnPlanFact( - "Рейсовая скорость", - "sectionRouteSpeed", - filtersMinMax, - makeFilterMinMaxFunction - ), - makeNumericColumnPlanFact( - "Спуск КНБК", - "sectionBhaDownSpeed", - filtersMinMax, - makeFilterMinMaxFunction - ), - makeNumericColumnPlanFact( - "Подъем КНБК", - "sectionBhaUpSpeed", - filtersMinMax, - makeFilterMinMaxFunction - ), - makeNumericColumnPlanFact( - "Скорость спуска ОК", - "sectionCasingDownSpeed", - filtersMinMax, - makeFilterMinMaxFunction - ), - makeNumericColumnPlanFact( - "НПВ, сут", - "nonProductiveTime", - filtersMinMax, - makeFilterMinMaxFunction, - null, - "70px" - ), - { - title: "TVD", - render: (value) => , - align: 'center' - }, - { - title: "Операции", - render: (value) => , - align: 'center' - }, - { - title: "Подрядчики", - dataIndex: "companies", - render: (item) => - item?.map((company) => {company.caption}), - }, - ]; - - const rowSelection = { - selectedRowKeys: selectedWellsKeys, - onChange: (keys, items) => { - setSelectedWells(items); - setSelectedWellsKeys(keys); - }, - }; - - return ( - <> - - - -

- Выбранные секции<> -

- -
- - setIsTVDModalVisible(false)} - width={1500} - footer={null} - > - - - - setIsOpsModalVisible(false)} - width={1500} - footer={null} - > - - - - ); -} diff --git a/src/pages/Cluster/ClusterWells.jsx b/src/pages/Cluster/ClusterWells.jsx index 1ef2665..dcc5b3c 100644 --- a/src/pages/Cluster/ClusterWells.jsx +++ b/src/pages/Cluster/ClusterWells.jsx @@ -8,11 +8,12 @@ import { makeColumn, makeDateSorter, makeNumericColumnPlanFact} from "../../components/Table"; -import { calcAndUpdateStatsBySections, makeFilterMinMaxFunction } from "./functions"; +import { calcAndUpdateStatsBySections, makeFilterMinMaxFunction, getPrecision } from "./functions"; import { invokeWebApiWrapperAsync } from '../../components/factory'; import ChartTvD from '../WellOperations/ChartTvD'; import WellOperationsTable from './WellOperationsTable' import { getOperations } from "./functions"; +import LoaderPortal from "../../components/LoaderPortal"; const filtersMinMax = [ { @@ -26,8 +27,9 @@ const filtersMinMax = [ ]; const filtersWellsType = []; +const DAY_IN_MS = 1000 * 60 * 60 * 24; -export default function ClusterWells({clusterData}) { +export default function ClusterWells({statsWells}) { const [selectedWellId, setSelectedWellId] = useState(0) const [isTVDModalVisible, setIsTVDModalVisible] = useState(false) @@ -36,129 +38,82 @@ export default function ClusterWells({clusterData}) { const [tvdDataFact, setTvdDataFact] = useState([]); const [tvdDataForecast, setTvdDataForecast] = useState([]); const [wellOperations, setWellOperations] = useState([]); + const [tableData, setTableData] = useState([]) + const [showLoader, setShowLoader] = useState(false) -useEffect(() => { - if (selectedWellId > 0) { - invokeWebApiWrapperAsync( - async () => { - const operations = await getOperations(selectedWellId); - - setWellOperations(operations.operations) - - setTvdDataPlan(operations.plan) + useEffect(() => { + if (selectedWellId > 0) { + invokeWebApiWrapperAsync( + async () => { + const operations = await getOperations(selectedWellId); + + setWellOperations(operations.operations) + setTvdDataPlan(operations.plan) + setTvdDataFact(operations.fact) + setTvdDataForecast(operations.predict) + }, + setShowLoader, + `Не удалось загрузить операции по скважине "${selectedWellId}"`, + ); + } else { + setWellOperations([]) + } + }, [selectedWellId]); - setTvdDataFact(operations.fact) - - setTvdDataForecast(operations.predict) - }, - null, - `Не удалось загрузить операции по скважине "${selectedWellId}"`, - ); - } -}, [selectedWellId]); - - let tableData = clusterData.statsWells?.map((well) => { - - if (!filtersWellsType.some((el) => el.text === well.wellType)) - filtersWellsType.push({ - text: well.wellType, - value: well.wellType, + useEffect(() => { + let data = statsWells?.map((well) => { + if (!filtersWellsType.some((el) => el.text === well.wellType)) + filtersWellsType.push({ text: well.wellType, value: well.wellType,}); + + return { + key: well.caption, + id: well.id, + caption: well.caption, + wellType: well.wellType, + factStart: well.total?.fact?.start, + factEnd: well.total?.fact?.end, + periodPlan: (new Date(well.total?.plan?.end) - new Date(well.total?.plan?.start)) / DAY_IN_MS, + periodFact: (new Date(well.total?.fact?.end) - new Date(well.total?.fact?.start)) / DAY_IN_MS, + rateOfPenetrationPlan: well.total?.plan?.rop, + rateOfPenetrationFact: well.total?.fact?.rop, + routeSpeedPlan: well.total?.plan?.routeSpeed, + routeSpeedFact: well.total?.fact?.routeSpeed, + notProductiveTimePlan: well.total?.plan?.nonProductiveHours, + notProductiveTimeFact: well.total?.fact?.nonProductiveHours, + companies: well.companies + }; }); + + calcAndUpdateStatsBySections(data ?? [], [ + "factStart", + "factEnd", + "periodPlan", + "periodFact", + "rateOfPenetrationPlan", + "rateOfPenetrationFact", + "routeSpeedPlan", + "routeSpeedFact", + "notProductiveTime", + ]); - return { - key: well.caption, - id: well.id, - caption: well.caption, - wellType: well.wellType, - factStart: well.total?.fact?.start, - factEnd: well.total?.fact?.end, - periodPlan: ( - (new Date(well.total?.plan?.end) - new Date(well.total?.plan?.start)) / - (1000 * 60 * 60 * 24) - ), - periodFact: ( - (new Date(well.total?.fact?.end) - new Date(well.total?.fact?.start)) / - (1000 * 60 * 60 * 24) - ), - rateOfPenetrationPlan: well.total?.plan?.rop, - rateOfPenetrationFact: well.total?.fact?.rop, - routeSpeedPlan: well.total?.plan?.routeSpeed, - routeSpeedFact: well.total?.fact?.routeSpeed, - notProductiveTimePlan: well.total?.plan?.nonProductiveHours, - notProductiveTimeFact: well.total?.fact?.nonProductiveHours, - companies: well.companies - }; - }); + setTableData(data) + }, [statsWells]) - calcAndUpdateStatsBySections(tableData ?? [], [ - "factStart", - "factEnd", - "periodPlan", - "periodFact", - "rateOfPenetrationPlan", - "rateOfPenetrationFact", - "routeSpeedPlan", - "routeSpeedFact", - "notProductiveTime", - ]); + const getDate = (str) => Number.isNaN(new Date(str).getTime()) ? '-' : new Date(str).toLocaleString() const columns = [ makeTextColumn("скв №", "caption", null, null, (_, item) => ({item.caption ?? '-'} )), - makeTextColumn("Тип скв.", "wellType", filtersWellsType, null, - (text) => text ?? '-' - ), + makeTextColumn("Тип скв.", "wellType", filtersWellsType, null, (text) => text ?? '-'), makeGroupColumn("Фактические сроки", [ - makeColumn("начало", "factStart", - { - sorter: makeDateSorter('factStart'), - render: (dateString) => !Number.isNaN(new Date(dateString).getTime()) - ? new Date(dateString).toLocaleString() - : '-' - } - ), - makeColumn("окончание", "factEnd", - { - sorter: makeDateSorter('factEnd'), - render: (dateString) => !Number.isNaN(new Date(dateString).getTime()) - ? new Date(dateString).toLocaleString() - : '-' - } - ), + makeColumn("начало", "factStart", { sorter: makeDateSorter('factStart'), render: getDate }), + makeColumn("окончание", "factEnd", { sorter: makeDateSorter('factEnd'), render: getDate }) ]), - makeNumericColumnPlanFact( - "Продолжительность", - "period", - filtersMinMax, - makeFilterMinMaxFunction, - (number) => (!Number.isNaN(number) && number !== undefined) - ? number.toFixed(2) - : '-'), - makeNumericColumnPlanFact( - "МСП", - "rateOfPenetration", - filtersMinMax, - makeFilterMinMaxFunction, - (number) => (!Number.isNaN(number) && number !== undefined) - ? number.toFixed(2) - : '-'), - makeNumericColumnPlanFact( - "Рейсовая скорость", - "routeSpeed", - filtersMinMax, - makeFilterMinMaxFunction, - (number) => (!Number.isNaN(number) && number !== undefined) - ? number.toFixed(2) - : '-'), - makeNumericColumnPlanFact( - "НПВ, сут", - "notProductiveTime", - filtersMinMax, - makeFilterMinMaxFunction, - (number) => (!Number.isNaN(number) && number !== undefined) - ? number.toFixed(2) - : '-'), + makeNumericColumnPlanFact("Продолжительность", "period", filtersMinMax, makeFilterMinMaxFunction, getPrecision), + makeNumericColumnPlanFact("МСП", "rateOfPenetration", filtersMinMax, makeFilterMinMaxFunction, getPrecision), + makeNumericColumnPlanFact("Рейсовая скорость", "routeSpeed", filtersMinMax, makeFilterMinMaxFunction, getPrecision), + makeNumericColumnPlanFact("НПВ, сут", "notProductiveTime", filtersMinMax, makeFilterMinMaxFunction, getPrecision), { title: "TVD", key: "tvd", @@ -181,13 +136,12 @@ useEffect(() => { title: "Подрядчики", key: "companies", dataIndex: "companies", - render: (item) => - item?.map((company) => {company.caption}) ?? '-', + render: (item) => item?.map((company) => {company.caption}) ?? '-', }, ]; return ( -
+ <>
{ width={1500} footer={null} > - + + + - + ); } diff --git a/src/pages/Cluster/WellOperationsTable.jsx b/src/pages/Cluster/WellOperationsTable.jsx index c82dd80..daf4391 100644 --- a/src/pages/Cluster/WellOperationsTable.jsx +++ b/src/pages/Cluster/WellOperationsTable.jsx @@ -1,40 +1,19 @@ -import { Table } from "antd"; +import { Table } from 'antd'; import { makeTextColumn, makeNumericColumnPlanFact - } from "../../components/Table" + } from '../../components/Table' +import { getPrecision } from './functions' export default function WellOperationsTable({wellOperations}) { const columns = [ - makeTextColumn("Конструкция секции","sectionType"), - makeTextColumn("Операция","operationName"), - makeNumericColumnPlanFact( - "Глубина забоя", - "depth", - null, - null, - (number) => (!Number.isNaN(number) && number !== undefined) - ? number.toFixed(2) - : '-' - ), - makeNumericColumnPlanFact( - "Часы", - "durationHours", - null, - null, - (number) => (!Number.isNaN(number) && number !== undefined) - ? number.toFixed(2) - : '-' - ), - makeNumericColumnPlanFact( - "Комментарий", - "comment", - null, - null, - (text) => text ?? '-' - ) + makeTextColumn('Конструкция секции','sectionType'), + makeTextColumn('Операция','operationName'), + makeNumericColumnPlanFact('Глубина забоя', 'depth', null, null, getPrecision), + makeNumericColumnPlanFact('Часы', 'durationHours', null, null, getPrecision), + makeNumericColumnPlanFact('Комментарий', 'comment', null, null, (text) => text ?? '-') ]; const operations = wellOperations?.map(el => { @@ -56,10 +35,10 @@ export default function WellOperationsTable({wellOperations}) {
record.key} /> ) -} \ No newline at end of file +} diff --git a/src/pages/Cluster/functions.jsx b/src/pages/Cluster/functions.jsx index a50358b..49aa6da 100644 --- a/src/pages/Cluster/functions.jsx +++ b/src/pages/Cluster/functions.jsx @@ -3,9 +3,13 @@ import { WellOperationStatService } from '../../services/api'; const maxPrefix = "isMax" const minPrefix = "isMin" +export const getPrecision = (number) => Number.isNaN(number ?? NaN) ? '-' : number.toFixed(2) + export const getOperations = async (idWell) => { const ops = await WellOperationStatService.getTvd(idWell); + if (!ops) return []; + const convert = wellOperationDto => ({ key: wellOperationDto?.id, @@ -68,4 +72,4 @@ export const calcAndUpdateStatsBySections = (data, keys) => { const filteredBySectionData = data.filter((item) => item.sectionType === sectionType) calcAndUpdateStats(filteredBySectionData, keys) }) -} \ No newline at end of file +} diff --git a/src/pages/Cluster/index.jsx b/src/pages/Cluster/index.jsx index ca8650f..1a2e0bb 100644 --- a/src/pages/Cluster/index.jsx +++ b/src/pages/Cluster/index.jsx @@ -1,68 +1,30 @@ -import { Layout, Menu } from "antd"; -import { Link, Switch, Route, Redirect, useParams } from "react-router-dom"; +import { useParams } from "react-router-dom"; import { useState, useEffect } from "react"; import ClusterWells from "./ClusterWells"; -import ClusterSections from "./ClusterSections"; import LoaderPortal from "../../components/LoaderPortal"; import { invokeWebApiWrapperAsync } from "../../components/factory"; import { WellOperationStatService } from "../../services/api"; -const { Content } = Layout; - export default function Cluster() { - let { idClaster, tab } = useParams(); + let { idClaster } = useParams(); const [data, setData] = useState([]); const [showLoader, setShowLoader] = useState(false); - useEffect(() => { - invokeWebApiWrapperAsync( - async () => { - const clusterData = await WellOperationStatService.getStatCluster( - idClaster - ); - setData(clusterData ?? []); - }, - setShowLoader, - `Не удалось загрузить данные по кусту "${idClaster}"` - ); - }, [idClaster]); + useEffect(() => invokeWebApiWrapperAsync( + async () => { + const clusterData = await WellOperationStatService.getStatCluster(idClaster); + setData(clusterData?.statsWells ?? []); + }, + setShowLoader, + `Не удалось загрузить данные по кусту "${idClaster}"` + ), [idClaster]); + + useEffect(() => console.log(data), [data]) return ( - <> - - - - Скважины - - - Секции - - - - - - - - - - - - - - - - - - - - - - - ); + + + + ) }