forked from ddrilling/asb_cloud_front
Выделены методы генерации датасетов для графика мониторинга
This commit is contained in:
parent
685191484a
commit
17ccecb2dd
@ -14,8 +14,9 @@ import { PeriodPicker, defaultPeriod } from '@components/selectors/PeriodPicker'
|
||||
import { formatDate, range, withPermissions } from '@utils'
|
||||
import { TelemetryDataSaubService } from '@api'
|
||||
|
||||
import { makeChartGroups, normalizeData, yAxis } from '../TelemetryView'
|
||||
import { normalizeData } from '../TelemetryView'
|
||||
import cursorRender from '../TelemetryView/cursorRender'
|
||||
import { makeChartGroups, yAxis } from '../TelemetryView/dataset'
|
||||
|
||||
const DATA_COUNT = 2048 // Колличество точек на подгрузку графика
|
||||
const ADDITIVE_PAGES = 2 // Дополнительные данные для графиков
|
||||
|
||||
77
src/pages/Well/Telemetry/TelemetryView/dataset.js
Normal file
77
src/pages/Well/Telemetry/TelemetryView/dataset.js
Normal file
@ -0,0 +1,77 @@
|
||||
import { formatDate } from "@utils"
|
||||
|
||||
export const yAxis = {
|
||||
type: 'time',
|
||||
accessor: (d) => new Date(d.date),
|
||||
format: (d) => formatDate(d, undefined, 'DD.MM.YYYY HH:mm:ss'),
|
||||
}
|
||||
|
||||
const dash = [7, 3]
|
||||
|
||||
const makeDataset = (label, shortLabel, color, key, unit, other) => ({
|
||||
key,
|
||||
label,
|
||||
shortLabel,
|
||||
color,
|
||||
xAxis: {
|
||||
type: 'linear',
|
||||
accessor: key,
|
||||
unit,
|
||||
},
|
||||
type: 'line',
|
||||
...other,
|
||||
})
|
||||
|
||||
export const makeChartGroups = (flowChart) => {
|
||||
const makeAreaOptions = (accessor) => ({
|
||||
type: 'rect_area',
|
||||
data: flowChart,
|
||||
hideLabel: true,
|
||||
yAxis: {
|
||||
type: 'linear',
|
||||
accessor: 'depth',
|
||||
},
|
||||
minXAccessor: 'depthStart',
|
||||
maxXAccessor: 'depthEnd',
|
||||
minYAccessor: accessor + 'Min',
|
||||
maxYAccessor: accessor + 'Max',
|
||||
linkedTo: accessor,
|
||||
})
|
||||
|
||||
return [
|
||||
[
|
||||
makeDataset('Высота блока', 'Высота ТБ','#303030', 'blockPosition', 'м'),
|
||||
makeDataset('Глубина скважины', 'Глубина скв','#7789A1', 'wellDepth', 'м', { dash }),
|
||||
makeDataset('Расход', 'Расход','#007070', 'flow', 'л/с'),
|
||||
makeDataset('Положение долота', 'Долото','#B39D59', 'bitPosition', 'м'),
|
||||
makeDataset('Расход', 'Расход','#007070', 'flowMM', 'л/с', makeAreaOptions('flow')),
|
||||
], [
|
||||
makeDataset('Скорость блока', 'Скорость ТБ','#59B359', 'blockSpeed', 'м/ч'),
|
||||
makeDataset('Скорость заданная', 'Скор зад-я','#95B359', 'blockSpeedSp', 'м/ч', { dash }),
|
||||
], [
|
||||
makeDataset('Давление', 'Давл','#FF0000', 'pressure', 'атм'),
|
||||
makeDataset('Давление заданное', 'Давл зад-е','#CC0000', 'pressureSp', 'атм'),
|
||||
makeDataset('Давление ХХ', 'Давл ХХ','#CC4429', 'pressureIdle', 'атм', { dash }),
|
||||
makeDataset('Перепад давления МАКС', 'ΔР макс','#B34A36', 'pressureDeltaLimitMax', 'атм', { dash }),
|
||||
makeDataset('Давление', 'Давл','#FF0000', 'pressureMM', 'атм', makeAreaOptions('pressure')),
|
||||
], [
|
||||
makeDataset('Осевая нагрузка', 'Нагр','#0000CC', 'axialLoad', 'т'),
|
||||
makeDataset('Осевая нагрузка заданная', 'Нагр зад-я','#3D6DCC', 'axialLoadSp', 'т', { dash }),
|
||||
makeDataset('Осевая нагрузка МАКС', 'Нагр макс','#3D3DCC', 'axialLoadLimitMax', 'т', { dash }),
|
||||
makeDataset('Осевая нагрузка', 'Нагр','#0000CC', 'axialLoadMM', 'т', makeAreaOptions('axialLoad')),
|
||||
], [
|
||||
makeDataset('Вес на крюке', 'Вес на крюке','#00B3B3', 'hookWeight', 'т'),
|
||||
makeDataset('Вес инструмента ХХ', 'Вес инст ХХ','#29CCB1', 'hookWeightIdle', 'т', { dash }),
|
||||
makeDataset('Вес инструмента МИН', 'Вес инст мин','#47A1B3', 'hookWeightLimitMin', 'т', { dash }),
|
||||
makeDataset('Вес инструмента МАКС', 'Вес инст мах','#2D7280', 'hookWeightLimitMax', 'т', { dash }),
|
||||
makeDataset('Обороты ротора', 'Об ротора','#11B32F', 'rotorSpeed', 'об/мин'),
|
||||
makeDataset('Обороты ротора', 'Об ротора','#11B32F', 'rotorSpeedMM', 'об/мин', makeAreaOptions('rotorSpeed')),
|
||||
], [
|
||||
makeDataset('Момент на роторе', 'Момент','#990099', 'rotorTorque', 'кН·м'),
|
||||
makeDataset('План. Момент на роторе', 'Момент зад-й','#9629CC', 'rotorTorqueSp', 'кН·м', { dash }),
|
||||
makeDataset('Момент на роторе ХХ', 'Момент ХХ','#CC2996', 'rotorTorqueIdle', 'кН·м', { dash }),
|
||||
makeDataset('Момент МАКС.', 'Момент макс','#FF00FF', 'rotorTorqueLimitMax', 'кН·м', { dash }),
|
||||
makeDataset('Момент на роторе', 'Момент','#990099', 'rotorTorqueMM', 'кН·м', makeAreaOptions('rotorTorque')),
|
||||
]
|
||||
]
|
||||
}
|
||||
@ -18,6 +18,7 @@ import {
|
||||
TelemetryDataSpinService
|
||||
} from '@api'
|
||||
|
||||
import { makeChartGroups, yAxis } from './dataset'
|
||||
import ActiveMessagesOnline from './ActiveMessagesOnline'
|
||||
import WirelineRunOut from './WirelineRunOut'
|
||||
import { CustomColumn } from './CustomColumn'
|
||||
@ -36,95 +37,10 @@ import '@styles/message.less'
|
||||
|
||||
const { Option } = Select
|
||||
|
||||
export const yAxis = {
|
||||
type: 'time',
|
||||
accessor: (d) => new Date(d.date),
|
||||
format: (d) => formatDate(d, undefined, 'DD.MM.YYYY HH:mm:ss'),
|
||||
}
|
||||
|
||||
const dash = [7, 3]
|
||||
|
||||
const makeDataset = (label, shortLabel, color, key, unit, other) => ({
|
||||
key,
|
||||
label,
|
||||
shortLabel,
|
||||
color,
|
||||
xAxis: {
|
||||
type: 'linear',
|
||||
accessor: key,
|
||||
unit,
|
||||
},
|
||||
type: 'line',
|
||||
...other,
|
||||
})
|
||||
|
||||
export const makeChartGroups = (flowChart) => {
|
||||
const makeAreaOptions = (accessor) => ({
|
||||
type: 'rect_area',
|
||||
data: flowChart,
|
||||
hideLabel: true,
|
||||
yAxis: {
|
||||
type: 'linear',
|
||||
accessor: 'depth',
|
||||
},
|
||||
minXAccessor: 'depthStart',
|
||||
maxXAccessor: 'depthEnd',
|
||||
minYAccessor: accessor + 'Min',
|
||||
maxYAccessor: accessor + 'Max',
|
||||
linkedTo: accessor,
|
||||
})
|
||||
|
||||
return [
|
||||
[
|
||||
makeDataset('Высота блока', 'Высота ТБ','#303030', 'blockPosition', 'м'),
|
||||
makeDataset('Глубина скважины', 'Глубина скв','#7789A1', 'wellDepth', 'м', { dash }),
|
||||
makeDataset('Расход', 'Расход','#007070', 'flow', 'л/с'),
|
||||
makeDataset('Положение долота', 'Долото','#B39D59', 'bitPosition', 'м'),
|
||||
makeDataset('Расход', 'Расход','#007070', 'flowMM', 'л/с', makeAreaOptions('flow')),
|
||||
], [
|
||||
makeDataset('Скорость блока', 'Скорость ТБ','#59B359', 'blockSpeed', 'м/ч'),
|
||||
makeDataset('Скорость заданная', 'Скор зад-я','#95B359', 'blockSpeedSp', 'м/ч', { dash }),
|
||||
], [
|
||||
makeDataset('Давление', 'Давл','#FF0000', 'pressure', 'атм'),
|
||||
makeDataset('Давление заданное', 'Давл зад-е','#CC0000', 'pressureSp', 'атм'),
|
||||
makeDataset('Давление ХХ', 'Давл ХХ','#CC4429', 'pressureIdle', 'атм', { dash }),
|
||||
makeDataset('Перепад давления МАКС', 'ΔР макс','#B34A36', 'pressureDeltaLimitMax', 'атм', { dash }),
|
||||
makeDataset('Давление', 'Давл','#FF0000', 'pressureMM', 'атм', makeAreaOptions('pressure')),
|
||||
], [
|
||||
makeDataset('Осевая нагрузка', 'Нагр','#0000CC', 'axialLoad', 'т'),
|
||||
makeDataset('Осевая нагрузка заданная', 'Нагр зад-я','#3D6DCC', 'axialLoadSp', 'т', { dash }),
|
||||
makeDataset('Осевая нагрузка МАКС', 'Нагр макс','#3D3DCC', 'axialLoadLimitMax', 'т', { dash }),
|
||||
makeDataset('Осевая нагрузка', 'Нагр','#0000CC', 'axialLoadMM', 'т', makeAreaOptions('axialLoad')),
|
||||
], [
|
||||
makeDataset('Вес на крюке', 'Вес на крюке','#00B3B3', 'hookWeight', 'т'),
|
||||
makeDataset('Вес инструмента ХХ', 'Вес инст ХХ','#29CCB1', 'hookWeightIdle', 'т', { dash }),
|
||||
makeDataset('Вес инструмента МИН', 'Вес инст мин','#47A1B3', 'hookWeightLimitMin', 'т', { dash }),
|
||||
makeDataset('Вес инструмента МАКС', 'Вес инст мах','#2D7280', 'hookWeightLimitMax', 'т', { dash }),
|
||||
makeDataset('Обороты ротора', 'Об ротора','#11B32F', 'rotorSpeed', 'об/мин'),
|
||||
makeDataset('Обороты ротора', 'Об ротора','#11B32F', 'rotorSpeedMM', 'об/мин', makeAreaOptions('rotorSpeed')),
|
||||
], [
|
||||
makeDataset('Момент на роторе', 'Момент','#990099', 'rotorTorque', 'кН·м'),
|
||||
makeDataset('План. Момент на роторе', 'Момент зад-й','#9629CC', 'rotorTorqueSp', 'кН·м', { dash }),
|
||||
makeDataset('Момент на роторе ХХ', 'Момент ХХ','#CC2996', 'rotorTorqueIdle', 'кН·м', { dash }),
|
||||
makeDataset('Момент МАКС.', 'Момент макс','#FF00FF', 'rotorTorqueLimitMax', 'кН·м', { dash }),
|
||||
makeDataset('Момент на роторе', 'Момент','#990099', 'rotorTorqueMM', 'кН·м', makeAreaOptions('rotorTorque')),
|
||||
]
|
||||
]
|
||||
}
|
||||
|
||||
const getLast = (data) =>
|
||||
Array.isArray(data) ? data.at(-1) : data
|
||||
|
||||
const isMseEnabled = (dataSaub) => {
|
||||
const lastData = getLast(dataSaub)
|
||||
return (lastData?.mseState && 2) > 0
|
||||
}
|
||||
|
||||
const isTorqueStabEnabled = (dataSpin) => {
|
||||
const lastData = getLast(dataSpin)
|
||||
return lastData?.state === 7
|
||||
}
|
||||
const getLast = (data) => Array.isArray(data) ? data.at(-1) : data
|
||||
|
||||
const isMseEnabled = (dataSaub) => (getLast(dataSaub)?.mseState && 2) > 0
|
||||
const isTorqueStabEnabled = (dataSpin) => getLast(dataSpin)?.state === 7
|
||||
const isSpinEnabled = (dataSpin) => {
|
||||
const lastData = getLast(dataSpin)
|
||||
return lastData?.state > 0 && lastData?.state !== 6
|
||||
@ -139,6 +55,14 @@ export const normalizeData = (data) => data?.map(item => ({
|
||||
|
||||
const dateSorter = makeDateSorter('date')
|
||||
|
||||
const makeSubjectSubsription = (subject$, handler) => {
|
||||
const subscribtion = subject$.pipe(
|
||||
buffer(subject$.pipe(throttleTime(700)))
|
||||
).subscribe((data) => handler(data.flat().filter(Boolean)))
|
||||
|
||||
return () => subscribtion.unsubscribe()
|
||||
}
|
||||
|
||||
const TelemetryView = memo(() => {
|
||||
const [dataSaub, setDataSaub] = useState([])
|
||||
const [dataSpin, setDataSpin] = useState([])
|
||||
@ -155,33 +79,40 @@ const TelemetryView = memo(() => {
|
||||
const spinSubject$ = useMemo(() => new BehaviorSubject(), [])
|
||||
|
||||
const handleDataSaub = useCallback((data) => {
|
||||
if (data) {
|
||||
if (!data) return
|
||||
|
||||
const dataSaub = normalizeData(data)
|
||||
setDataSaub((prev) => {
|
||||
const out = [...prev, ...dataSaub]
|
||||
out.sort(dateSorter)
|
||||
return out
|
||||
})
|
||||
}
|
||||
}, [])
|
||||
|
||||
const handleDataSpin = useCallback((data) => data && setDataSpin((prev) => [...prev, ...data]), [])
|
||||
|
||||
useEffect(() => {
|
||||
const subscribtion = saubSubject$.pipe(
|
||||
buffer(saubSubject$.pipe(throttleTime(700)))
|
||||
).subscribe((data) => handleDataSaub(data.flat().filter(Boolean)))
|
||||
const onStatusChanged = useCallback((value) => updateWell({ idState: value }), [well])
|
||||
|
||||
return () => subscribtion.unsubscribe()
|
||||
}, [saubSubject$])
|
||||
const filteredData = useMemo(() => {
|
||||
let i, j
|
||||
for (i = 0; i < dataSaub.length; i++) {
|
||||
const date = +new Date(dataSaub[i]?.date)
|
||||
if (date >= +domain.min) break
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
const subscribtion = spinSubject$.pipe(
|
||||
buffer(spinSubject$.pipe(throttleTime(700)))
|
||||
).subscribe((data) => handleDataSpin(data.flat().filter(Boolean)))
|
||||
for (j = dataSaub.length - 1; j >= i; j--) {
|
||||
const date = +new Date(dataSaub[i]?.date)
|
||||
if (date <= +domain.max) break
|
||||
}
|
||||
|
||||
return () => subscribtion.unsubscribe()
|
||||
}, [spinSubject$])
|
||||
if (i >= j) return []
|
||||
return dataSaub.slice(i, j)
|
||||
}, [dataSaub, domain])
|
||||
|
||||
const chartGroups = useMemo(() => makeChartGroups(flowChartData), [flowChartData])
|
||||
|
||||
useEffect(() => makeSubjectSubsription(saubSubject$, handleDataSaub), [saubSubject$, handleDataSaub])
|
||||
useEffect(() => makeSubjectSubsription(spinSubject$, handleDataSpin), [spinSubject$, handleDataSpin])
|
||||
|
||||
useEffect(() => {
|
||||
invokeWebApiWrapperAsync(
|
||||
@ -221,8 +152,6 @@ const TelemetryView = memo(() => {
|
||||
)
|
||||
}, [well])
|
||||
|
||||
const onStatusChanged = useCallback((value) => updateWell({ idState: value }), [well])
|
||||
|
||||
useEffect(() => {
|
||||
if (dataSaub.length <= 0) return
|
||||
const last = new Date(dataSaub.at(-1).date)
|
||||
@ -232,24 +161,6 @@ const TelemetryView = memo(() => {
|
||||
})
|
||||
}, [dataSaub, chartInterval])
|
||||
|
||||
const filteredData = useMemo(() => {
|
||||
let i, j
|
||||
for (i = 0; i < dataSaub.length; i++) {
|
||||
const date = +new Date(dataSaub[i]?.date)
|
||||
if (date >= +domain.min) break
|
||||
}
|
||||
|
||||
for (j = dataSaub.length - 1; j >= i; j--) {
|
||||
const date = +new Date(dataSaub[i]?.date)
|
||||
if (date <= +domain.max) break
|
||||
}
|
||||
|
||||
if (i >= j) return []
|
||||
return dataSaub.slice(i, j)
|
||||
}, [dataSaub, domain])
|
||||
|
||||
const chartGroups = useMemo(() => makeChartGroups(flowChartData), [flowChartData])
|
||||
|
||||
return (
|
||||
<LoaderPortal show={showLoader}>
|
||||
<Grid style={{ gridTemplateColumns: 'auto repeat(6, 1fr)' }}>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user