diff --git a/src/pages/Telemetry/TelemetryView/index.jsx b/src/pages/Telemetry/TelemetryView/index.jsx index 67967f5..5f28e42 100755 --- a/src/pages/Telemetry/TelemetryView/index.jsx +++ b/src/pages/Telemetry/TelemetryView/index.jsx @@ -1,4 +1,5 @@ import { Select } from 'antd' +import { BehaviorSubject, buffer, throttleTime } from 'rxjs' import { useState, useEffect, useCallback, memo, useMemo } from 'react' import { useIdWell } from '@asb/context' @@ -73,7 +74,7 @@ export const makeChartGroups = (flowChart) => { maxYAccessor: accessor + 'Max', bindDomainFrom: accessor, }) - console.log(flowChart) + return [ [ makeDataset('Высота блока', 'Высота ТБ','#303030', 'blockPosition', 'м'), @@ -151,6 +152,9 @@ const TelemetryView = memo(() => { const idWell = useIdWell() + const saubSubject$ = useMemo(() => new BehaviorSubject(), []) + const spinSubject$ = useMemo(() => new BehaviorSubject(), []) + const handleDataSaub = useCallback((data) => { if (data) { const dataSaub = normalizeData(data) @@ -165,11 +169,22 @@ const TelemetryView = memo(() => { const handleDataSpin = useCallback((data) => data && setDataSpin((prev) => [...prev, ...data]), []) useEffect(() => { - const unsubscribe = Subscribe( - 'hubs/telemetry', `well_${idWell}`, - { methodName: 'ReceiveDataSaub', handler: handleDataSaub }, - { methodName: 'ReceiveDataSpin', handler: handleDataSpin } - ) + const subscribtion = saubSubject$.pipe( + buffer(saubSubject$.pipe(throttleTime(700))) + ).subscribe((data) => handleDataSaub(data.flat())) + + return () => subscribtion.unsubscribe() + }, [saubSubject$]) + + useEffect(() => { + const subscribtion = spinSubject$.pipe( + buffer(spinSubject$.pipe(throttleTime(700))) + ).subscribe((data) => handleDataSpin(data.flat())) + + return () => subscribtion.unsubscribe() + }, [spinSubject$]) + + useEffect(() => { invokeWebApiWrapperAsync( async () => { const flowChart = await DrillFlowChartService.getByIdWell(idWell) @@ -183,9 +198,18 @@ const TelemetryView = memo(() => { `Не удалось получить данные по скважине "${idWell}"`, 'Получение данных по скважине' ) - return unsubscribe }, [idWell, chartInterval, handleDataSpin, handleDataSaub]) + useEffect(() => { + const unsubscribe = Subscribe( + 'hubs/telemetry', `well_${idWell}`, + { methodName: 'ReceiveDataSaub', handler: (data) => saubSubject$.next(data) }, + { methodName: 'ReceiveDataSpin', handler: (data) => spinSubject$.next(data) } + ) + + return () => unsubscribe() + }, [idWell, saubSubject$, spinSubject$]) + useEffect(() => { invokeWebApiWrapperAsync( async () => {