From c288b45dab608196ebaaf2e9c3c4646651458606 Mon Sep 17 00:00:00 2001 From: KharchenkoVV Date: Thu, 2 Sep 2021 09:52:57 +0500 Subject: [PATCH] Removed unnecessary useEffect() from ClusterInfo tables --- src/pages/Cluster/ClusterSections.jsx | 170 +++++++++--------- src/pages/Cluster/ClusterWells.jsx | 152 ++++++++-------- src/pages/Cluster/index.jsx | 2 +- src/services/api/services/FileService.ts | 2 +- .../api/services/WellOperationService.ts | 2 +- 5 files changed, 156 insertions(+), 172 deletions(-) diff --git a/src/pages/Cluster/ClusterSections.jsx b/src/pages/Cluster/ClusterSections.jsx index 17e2ac9..05c58de 100644 --- a/src/pages/Cluster/ClusterSections.jsx +++ b/src/pages/Cluster/ClusterSections.jsx @@ -1,7 +1,7 @@ import { Table, Tag, Button, Badge, Divider, Modal } from "antd"; -import { useParams, Link } from "react-router-dom"; +import { Link } from "react-router-dom"; import { LineChartOutlined, ProfileOutlined } from "@ant-design/icons"; -import { useState, useEffect } from "react"; +import { useState } from "react"; import { makeTextColumn, makeNumericColumnPlanFact @@ -28,11 +28,9 @@ const filtersSectionsType = []; export default function ClusterSections({ clusterData }) { - let { id } = useParams(); - const [wellsStat, setWellsStat] = useState([]); + const [selectedWells, setSelectedWells] = useState([]); const [selectedWellsKeys, setSelectedWellsKeys] = useState([]); - const [selectedWellId, setSelectedWellId] = useState([]); const [isTVDModalVisible, setIsTVDModalVisible] = useState(false) const [isOpsModalVisible, setIsOpsModalVisible] = useState(false) const [tvdDataPlan, setTvdDataPlan] = useState([]); @@ -40,7 +38,81 @@ export default function ClusterSections({ clusterData }) { const [tvdDataForecast, setTvdDataForecast] = useState([]); const [wellOperations, setWellOperations] = useState([]); - calcAndUpdateStatsBySections(wellsStat ?? [], [ + const getOperations = (wellId) => { + invokeWebApiWrapperAsync( + async () => { + const operations = await WellOperationStatService.getTvd(wellId); + + setWellOperations(operations) + + const tvdPlanData = operations.map(el => { + return {key: el.plan?.id, depth: el.plan?.wellDepth, date: el.plan?.startDate} + }).filter(el => el.key) + + setTvdDataPlan(tvdPlanData) + + const tvdFactData = operations.map(el => { + return {key: el.fact?.id, depth: el.fact?.wellDepth, date: el.fact?.startDate} + }).filter(el => el.key) + + setTvdDataFact(tvdFactData) + + const tvdPredictData = operations.map(el => { + return {key: el.predict?.id, depth: el.predict?.wellDepth, date: el.predict?.startDate} + }).filter(el => el.key) + + setTvdDataForecast(tvdPredictData) + }, + null, + `Не удалось загрузить операции по скважине "${wellId}"`, + ); + } + + 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", @@ -59,86 +131,6 @@ export default function ClusterSections({ clusterData }) { "nonProductiveTimeFact", ]); - useEffect(() => { - if (selectedWellId > 0) { - invokeWebApiWrapperAsync( - async () => { - const operations = await WellOperationStatService.getTvd(selectedWellId); - - setWellOperations(operations) - - const tvdPlanData = operations.map(el => { - return {key: el.plan?.id, depth: el.plan?.wellDepth, date: el.plan?.startDate} - }).filter(el => el.key) - - setTvdDataPlan(tvdPlanData) - - const tvdFactData = operations.map(el => { - return {key: el.fact?.id, depth: el.fact?.wellDepth, date: el.fact?.startDate} - }).filter(el => el.key) - - setTvdDataFact(tvdFactData) - - const tvdPredictData = operations.map(el => { - return {key: el.predict?.id, depth: el.predict?.wellDepth, date: el.predict?.startDate} - }).filter(el => el.key) - - setTvdDataForecast(tvdPredictData) - }, - null, - `Не удалось загрузить операции по скважине "${selectedWellId}"`, - ); - } - }, [selectedWellId]); - - useEffect(() => { - 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, - }); - }); - }); - - setWellsStat(rows); - }, [id, clusterData]); - const columns = [ makeTextColumn("скв №", "caption", null, null, (_, item) => {item.caption ?? '-'} @@ -222,7 +214,7 @@ export default function ClusterSections({ clusterData }) { { title: "TVD", render: (value) => , align: 'center' @@ -230,7 +222,7 @@ export default function ClusterSections({ clusterData }) { { title: "Операции", render: (value) => , align: 'center' @@ -255,7 +247,7 @@ export default function ClusterSections({ clusterData }) { <> { + invokeWebApiWrapperAsync( + async () => { + const operations = await WellOperationStatService.getTvd(wellId); + + setWellOperations(operations) + + const tvdPlanData = operations.map(el => { + return {key: el.plan?.id, depth: el.plan?.wellDepth, date: el.plan?.startDate} + }).filter(el => el.key) + + setTvdDataPlan(tvdPlanData) + + const tvdFactData = operations.map(el => { + return {key: el.fact?.id, depth: el.fact?.wellDepth, date: el.fact?.startDate} + }).filter(el => el.key) + + setTvdDataFact(tvdFactData) + + const tvdPredictData = operations.map(el => { + return {key: el.predict?.id, depth: el.predict?.wellDepth, date: el.predict?.startDate} + }).filter(el => el.key) + + setTvdDataForecast(tvdPredictData) + }, + null, + `Не удалось загрузить операции по скважине "${wellId}"`, + ); + } + + let tableData = clusterData.statsWells?.map((well) => { + + if (!filtersWellsType.some((el) => el.text === well.wellType)) + filtersWellsType.push({ + text: well.wellType, + value: well.wellType, + }); + + return { + key: well.id, + 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, + }; + }); + + calcAndUpdateStatsBySections(tableData ?? [], [ "factStart", "factEnd", "periodPlan", @@ -52,75 +112,6 @@ export default function ClusterWells({ clusterData }) { "notProductiveTime", ]); - useEffect(() => { - if (selectedWellId > 0) { - invokeWebApiWrapperAsync( - async () => { - const operations = await WellOperationStatService.getTvd(selectedWellId); - - setWellOperations(operations) - - const tvdPlanData = operations.map(el => { - return {key: el.plan?.id, depth: el.plan?.wellDepth, date: el.plan?.startDate} - }).filter(el => el.key) - - setTvdDataPlan(tvdPlanData) - - const tvdFactData = operations.map(el => { - return {key: el.fact?.id, depth: el.fact?.wellDepth, date: el.fact?.startDate} - }).filter(el => el.key) - - setTvdDataFact(tvdFactData) - - const tvdPredictData = operations.map(el => { - return {key: el.predict?.id, depth: el.predict?.wellDepth, date: el.predict?.startDate} - }).filter(el => el.key) - - setTvdDataForecast(tvdPredictData) - }, - null, - `Не удалось загрузить операции по скважине "${selectedWellId}"`, - ); - } - }, [selectedWellId]); - - useEffect(() => { - let tableData = clusterData.statsWells?.map((well) => { - - if (!filtersWellsType.some((el) => el.text === well.wellType)) - filtersWellsType.push({ - text: well.wellType, - value: well.wellType, - }); - - return { - key: well.id, - 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, - }; - }); - - setWellsStat(tableData); - }, [id, clusterData]); - const columns = [ makeTextColumn("скв №", "caption", null, null, (_, item) => ({item.caption ?? '-'} @@ -181,7 +172,7 @@ export default function ClusterWells({ clusterData }) { { title: "TVD", render: (value) => , align: 'center' @@ -189,7 +180,7 @@ export default function ClusterWells({ clusterData }) { { title: "Операции", render: (value) => , align: 'center' @@ -207,7 +198,7 @@ export default function ClusterWells({ clusterData }) {
+ dataForecast={tvdDataForecast} + /> { const result = await __request({ diff --git a/src/services/api/services/WellOperationService.ts b/src/services/api/services/WellOperationService.ts index 3215e56..0fdbd49 100644 --- a/src/services/api/services/WellOperationService.ts +++ b/src/services/api/services/WellOperationService.ts @@ -48,7 +48,7 @@ begin?: string, end?: string, minDepth: number = -1.7976931348623157e+308, maxDepth: number = 1.7976931348623157e+308, -skip: number = 0, +skip?: number, take: number = 32, ): Promise { const result = await __request({