diff --git a/src/pages/Cluster/ClusterSections.jsx b/src/pages/Cluster/ClusterSections.jsx
index 2a367db..43952a3 100644
--- a/src/pages/Cluster/ClusterSections.jsx
+++ b/src/pages/Cluster/ClusterSections.jsx
@@ -1,16 +1,19 @@
import { Table, Tag, Button, Badge, Divider, Modal } from "antd";
import { Link } from "react-router-dom";
import { LineChartOutlined, ProfileOutlined } from "@ant-design/icons";
-import { useState } from "react";
+import { useState, useEffect } from "react";
import {
makeTextColumn,
makeNumericColumnPlanFact
} from "../../components/Table";
import { invokeWebApiWrapperAsync } from '../../components/factory';
-import { WellOperationStatService } from '../../services/api';
import ChartDepthToDay from '../../components/charts/ChartDepthToDay';
import WellOperationsTable from './WellOperationsTable'
-import { calcAndUpdateStatsBySections, makeFilterMinMaxFunction } from "./functions";
+import {
+ calcAndUpdateStatsBySections,
+ makeFilterMinMaxFunction,
+ getOperations
+} from "./functions";
const filtersMinMax = [
@@ -29,6 +32,7 @@ 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)
@@ -38,35 +42,25 @@ export default function ClusterSections({ clusterData }) {
const [tvdDataForecast, setTvdDataForecast] = useState([]);
const [wellOperations, setWellOperations] = useState([]);
- const getOperations = (wellId) => {
- invokeWebApiWrapperAsync(
- async () => {
- const operations = await WellOperationStatService.getTvd(wellId);
-
- setWellOperations(operations)
-
- const tvdPlanData = operations.map(el => {
- return {key: el.caption, depth: el.plan?.wellDepth, date: el.plan?.startDate}
- }).filter(el => el.key)
-
- setTvdDataPlan(tvdPlanData)
-
- const tvdFactData = operations.map(el => {
- return {key: el.caption, depth: el.fact?.wellDepth, date: el.fact?.startDate}
- }).filter(el => el.key)
-
- setTvdDataFact(tvdFactData)
-
- const tvdPredictData = operations.map(el => {
- return {key: el.caption, depth: el.predict?.wellDepth, date: el.predict?.startDate}
- }).filter(el => el.key)
-
- setTvdDataForecast(tvdPredictData)
- },
- null,
- `Не удалось загрузить операции по скважине "${wellId}"`,
- );
- }
+ 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 = [];
@@ -214,7 +208,7 @@ export default function ClusterSections({ clusterData }) {
{
title: "TVD",
render: (value) => ,
align: 'center'
@@ -222,7 +216,7 @@ export default function ClusterSections({ clusterData }) {
{
title: "Операции",
render: (value) => ,
align: 'center'
diff --git a/src/pages/Cluster/ClusterWells.jsx b/src/pages/Cluster/ClusterWells.jsx
index 0bb4adc..88bb2ed 100644
--- a/src/pages/Cluster/ClusterWells.jsx
+++ b/src/pages/Cluster/ClusterWells.jsx
@@ -1,5 +1,5 @@
import { Link } from "react-router-dom";
-import { useState } from "react";
+import { useState, useEffect } from "react";
import { Table, Tag, Button, Modal } from "antd";
import { LineChartOutlined, ProfileOutlined } from "@ant-design/icons";
import {
@@ -11,9 +11,9 @@ import {
} from "../../components/Table";
import { calcAndUpdateStatsBySections, makeFilterMinMaxFunction } from "./functions";
import { invokeWebApiWrapperAsync } from '../../components/factory';
-import { WellOperationStatService } from '../../services/api';
import ChartDepthToDay from '../../components/charts/ChartDepthToDay';
import WellOperationsTable from './WellOperationsTable'
+import { getOperations } from "./functions";
const filtersMinMax = [
{
@@ -30,6 +30,7 @@ const filtersWellsType = [];
export default function ClusterWells({clusterData}) {
+ const [selectedWellId, setSelectedWellId] = useState(0)
const [isTVDModalVisible, setIsTVDModalVisible] = useState(false)
const [isOpsModalVisible, setIsOpsModalVisible] = useState(false)
const [tvdDataPlan, setTvdDataPlan] = useState([]);
@@ -37,35 +38,25 @@ export default function ClusterWells({clusterData}) {
const [tvdDataForecast, setTvdDataForecast] = useState([]);
const [wellOperations, setWellOperations] = useState([]);
- const getOperations = (wellId) => {
+useEffect(() => {
+ if (selectedWellId > 0) {
invokeWebApiWrapperAsync(
async () => {
- const operations = await WellOperationStatService.getTvd(wellId);
+ const operations = await getOperations(selectedWellId);
- setWellOperations(operations)
-
- const tvdPlanData = operations.map(el => {
- return {key: el.caption, depth: el.plan?.wellDepth, date: el.plan?.startDate}
- }).filter(el => el.key)
+ setWellOperations(operations.operations)
- setTvdDataPlan(tvdPlanData)
+ setTvdDataPlan(operations.plan)
- const tvdFactData = operations.map(el => {
- return {key: el.caption, depth: el.fact?.wellDepth, date: el.fact?.startDate}
- }).filter(el => el.key)
+ setTvdDataFact(operations.fact)
- setTvdDataFact(tvdFactData)
-
- const tvdPredictData = operations.map(el => {
- return {key: el.caption, depth: el.predict?.wellDepth, date: el.predict?.startDate}
- }).filter(el => el.key)
-
- setTvdDataForecast(tvdPredictData)
+ setTvdDataForecast(operations.predict)
},
null,
- `Не удалось загрузить операции по скважине "${wellId}"`,
+ `Не удалось загрузить операции по скважине "${selectedWellId}"`,
);
}
+}, [selectedWellId]);
let tableData = clusterData.statsWells?.map((well) => {
@@ -173,7 +164,7 @@ export default function ClusterWells({clusterData}) {
title: "TVD",
key: "tvd",
render: (value) => ,
align: 'center'
@@ -182,7 +173,7 @@ export default function ClusterWells({clusterData}) {
title: "Операции",
key: "operations",
render: (value) => ,
align: 'center'
diff --git a/src/pages/Cluster/functions.jsx b/src/pages/Cluster/functions.jsx
index d95d0fd..557e867 100644
--- a/src/pages/Cluster/functions.jsx
+++ b/src/pages/Cluster/functions.jsx
@@ -1,6 +1,26 @@
+import { WellOperationStatService } from '../../services/api';
+
const maxPrefix = "isMax"
const minPrefix = "isMin"
+export const getOperations = async (idWell) => {
+ const ops = await WellOperationStatService.getTvd(idWell);
+
+ const planData = ops.map(el => {
+ return {key: el.plan?.id, depth: el.plan?.wellDepth, date: el.plan?.startDate}
+ }).filter(el => el.key)
+
+ const factData = ops.map(el => {
+ return {key: el.fact?.id, depth: el.fact?.wellDepth, date: el.fact?.startDate}
+ }).filter(el => el.key)
+
+ const predictData = ops.map(el => {
+ return {key: el.predict?.id, depth: el.predict?.wellDepth, date: el.predict?.startDate}
+ }).filter(el => el.key)
+
+ return { operations: ops, plan: planData, fact: factData, predict: predictData }
+}
+
export const makeFilterMinMaxFunction = (key) => (filterValue,
dataItem) =>
filterValue === "max"
diff --git a/src/pages/WellOperations/Tvd.jsx b/src/pages/WellOperations/Tvd.jsx
index c286ed1..14b574d 100644
--- a/src/pages/WellOperations/Tvd.jsx
+++ b/src/pages/WellOperations/Tvd.jsx
@@ -1,7 +1,7 @@
import ChartDepthToDay from '../../components/charts/ChartDepthToDay';
import { useState, useEffect } from 'react';
import { invokeWebApiWrapperAsync } from '../../components/factory';
-import { WellOperationStatService } from '../../services/api';
+import { getOperations } from '../Cluster/functions';
export const Tvd = ({ idWell }) => {
@@ -12,23 +12,13 @@ export const Tvd = ({ idWell }) => {
useEffect(() => {
invokeWebApiWrapperAsync(
async () => {
- const operations = await WellOperationStatService.getTvd(idWell);
+ const operations = await getOperations(idWell);
- const planData = operations.map(el => {
- return {key: el.plan?.id, depth: el.plan?.wellDepth, date: el.plan?.startDate}
- }).filter(el => el.key)
+ setDataPlan(operations.plan)
- setDataPlan(planData)
- const factData = operations.map(el => {
- return {key: el.fact?.id, depth: el.fact?.wellDepth, date: el.fact?.startDate}
- }).filter(el => el.key)
+ setDataFact(operations.fact)
- setDataFact(factData)
- const predictData = operations.map(el => {
- return {key: el.predict?.id, depth: el.predict?.wellDepth, date: el.predict?.startDate}
- }).filter(el => el.key)
-
- setDataForecast(predictData)
+ setDataForecast(operations.predict)
},
null,
`Не удалось загрузить операции по скважине "${idWell}"`,