From 8107a4a3a5b202a77006a7c7a1cc42dbc240a3d7 Mon Sep 17 00:00:00 2001 From: goodm2ice Date: Tue, 29 Mar 2022 17:04:14 +0500 Subject: [PATCH] =?UTF-8?q?=D0=A3=D0=B4=D0=B0=D0=BB=D1=91=D0=BD=20=D0=BB?= =?UTF-8?q?=D0=B8=D1=88=D0=B8=D0=B9=20=D1=8D=D0=BA=D0=B7=D0=B5=D0=BC=D0=BF?= =?UTF-8?q?=D0=BB=D1=8F=D1=80=20=D0=B0=D1=80=D1=85=D0=B8=D0=B2=D0=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/Archive/ArchiveColumn.jsx | 31 ----- src/pages/Archive/ArchiveDisplay.jsx | 66 ---------- src/pages/Archive/index.jsx | 185 --------------------------- 3 files changed, 282 deletions(-) delete mode 100755 src/pages/Archive/ArchiveColumn.jsx delete mode 100755 src/pages/Archive/ArchiveDisplay.jsx delete mode 100755 src/pages/Archive/index.jsx diff --git a/src/pages/Archive/ArchiveColumn.jsx b/src/pages/Archive/ArchiveColumn.jsx deleted file mode 100755 index 6f7ebfb..0000000 --- a/src/pages/Archive/ArchiveColumn.jsx +++ /dev/null @@ -1,31 +0,0 @@ -import { memo, useMemo } from 'react' - -import { Grid, GridItem } from '@components/Grid' -import { Column } from '@components/charts/Column' - -export const ArchiveColumn = memo(({ lineGroup, data, interval, style, headerHeight, yStart }) => { - const lgws = useMemo(() => lineGroup.filter(cfg => !cfg.isShape), [lineGroup]) - const pv = useMemo(() => lgws.filter(line => line.showLabels).map(line => ({ - color: line.color, - label: line.label - })), [lgws]) - - return ( -
- - {pv?.map((v, idx) => ( - {v.label} - ))} - - -
- ) -}) - -export default ArchiveColumn diff --git a/src/pages/Archive/ArchiveDisplay.jsx b/src/pages/Archive/ArchiveDisplay.jsx deleted file mode 100755 index c4bae7e..0000000 --- a/src/pages/Archive/ArchiveDisplay.jsx +++ /dev/null @@ -1,66 +0,0 @@ -import { memo, useMemo } from 'react' - -import { Grid, GridItem } from '@components/Grid' - -import { paramsGroups } from '@pages/TelemetryView' -import { ArchiveColumn } from './ArchiveColumn' - -const interpolationSearch = (data, begin, end, accessor) => { - const fy = (i) => new Date(data[i]?.[accessor] ?? 0) - const fx = (y, b, e) => Math.round(b + (y - fy(b)) * (e - b) / (fy(e) - fy(b))) - const findIdx = (val, startIdx, c) => { - let x = startIdx - let endIdx = data.length - 1 - if(val < fy(startIdx)) - return startIdx - if(val > fy(endIdx)) - return endIdx - for(let i = 0; i < c; i++){ - x = fx(val, startIdx, endIdx) - if(fy(x) < val) - startIdx = x - else - endIdx = x - if ((startIdx === endIdx)||(fy(startIdx) === fy(endIdx))) - return x - } - return x - } - let x0 = findIdx(begin, 0, 5) - let x1 = findIdx(end, x0, 3) - return { start: x0, end: x1, count: x1 - x0 } -} - -export const cutData = (data, beginDate, endDate) => { - if (data?.length > 0) { - let { start, end } = interpolationSearch(data, beginDate, endDate, 'date') - if (start > 0) start-- - if (end + 1 < end.length) end++ - return data.slice(start, end) - } - return data -} - -export const ArchiveDisplay = memo(({data, startDate, interval, onWheel}) => { - const endDate = useMemo(() => new Date(+startDate + interval), [startDate, interval]) - const chartData = useMemo(() => cutData(data, startDate, endDate), [data, startDate, endDate]) - - return ( - - {paramsGroups.map((group, index) => ( - - - - ))} - - ) -}) - -export default ArchiveDisplay diff --git a/src/pages/Archive/index.jsx b/src/pages/Archive/index.jsx deleted file mode 100755 index f969709..0000000 --- a/src/pages/Archive/index.jsx +++ /dev/null @@ -1,185 +0,0 @@ -/* eslint-disable react-hooks/exhaustive-deps */ -import { useState, useEffect, memo, useCallback } from 'react' - -import { Flex } from '@components/Grid' -import LoaderPortal from '@components/LoaderPortal' -import { invokeWebApiWrapperAsync } from '@components/factory' -import { DatePickerWrapper, makeDateSorter } from '@components/Table' -import { PeriodPicker, defaultPeriod } from '@components/selectors/PeriodPicker' -import { TelemetryDataSaubService } from '@api' - -import { normalizeData } from '@pages/TelemetryView' -import { ArchiveDisplay, cutData } from './ArchiveDisplay' - -const DATA_COUNT = 2048 // Колличество точек на подгрузку графика -const ADDITIVE_PAGES = 2 // Дополнительные данные для графиков -const LOADING_TRIGGER = 0.5 -const WHEEL_SENSITIVITY = 1 / 530 - -const getLoadingInterval = (loaded, startDate, interval) => { - // Если данные загружены и дата не заходит за тригер дозагрузка не требуется - if ( - loaded && - +startDate - interval * LOADING_TRIGGER > loaded.start && - +startDate + interval * (LOADING_TRIGGER + 1) < loaded.end - ) - return { loadingStartDate: startDate, newLoaded: loaded, loadingInterval: 0 } - - let loadingStartDate = +startDate - interval * ADDITIVE_PAGES - let loadingEndDate = +startDate + interval * (ADDITIVE_PAGES + 1) - - const newLoaded = { - start: loadingStartDate, - end: loadingEndDate - } - - if (loaded) { - if (loadingStartDate >= loaded.start) - loadingStartDate = loaded.end - if (loadingEndDate <= loaded.end) - loadingEndDate = loaded.start - newLoaded.start = Math.min(loaded.start, loadingStartDate) - newLoaded.end = Math.max(loaded.end, loadingEndDate) - } - - const loadingInterval = Math.trunc((loadingEndDate - loadingStartDate) / 1000) - - return { - loadingStartDate: new Date(loadingStartDate), - newLoaded: { - start: new Date(newLoaded.start), - end: new Date(newLoaded.end) - }, - loadingInterval - } -} - -const range = (start, end) => { - const result = [] - for (let i = start; i < end; i++) - result.push(i) - return result -} - -export const Archive = memo(({ idWell }) => { - const [dataSaub, setDataSaub] = useState([]) - const [dateLimit, setDateLimit] = useState({ from: 0, to: new Date() }) - const [chartInterval, setChartInterval] = useState(parseInt(defaultPeriod) * 1000) - const [startDate, setStartDate] = useState(new Date(Date.now() - chartInterval)) - const [showLoader, setShowLoader] = useState(false) - const [loaded, setLoaded] = useState(null) - - const onGraphWheel = useCallback((e) => { - if (loaded && dateLimit.from && dateLimit.to) { - setStartDate((prevStartDate) => { - const offset = e.deltaY * chartInterval * WHEEL_SENSITIVITY - const nextStartDate = +prevStartDate + offset - const firstPossibleDate = Math.max(loaded.start, dateLimit.from) - const lastPossibleDate = Math.min(dateLimit.to, (loaded.end ?? Date.now())) - chartInterval - return new Date(Math.max(firstPossibleDate, Math.min(nextStartDate, lastPossibleDate))) - }) - } - }, [loaded, dateLimit, chartInterval]) - - const isDateDisabled = useCallback((date) => { - if (!date) return false - const dt = new Date(date).setHours(0, 0, 0, 0) - return dt < dateLimit.from || dt > +dateLimit.to - chartInterval - }, [dateLimit]) - - const isDateTimeDisabled = useCallback((date) => ({ - disabledHours: () => range(0, 24).filter(h => { - if (!date) return false - const dt = +new Date(date).setHours(h) - return dt < dateLimit.from || dt > +dateLimit.to - chartInterval - }), - disabledMinutes: () => range(0, 60).filter(m => { - if (!date) return false - const dt = +new Date(date).setMinutes(m) - return dt < dateLimit.from || dt > +dateLimit.to - chartInterval - }), - disabledSeconds: () => range(0, 60).filter(s => { - if (!date) return false - const dt = +new Date(date).setSeconds(s) - return dt < dateLimit.from || dt > +dateLimit.to - chartInterval - }) - }), [dateLimit]) - - useEffect(() => invokeWebApiWrapperAsync( - async () => { - let dates = await TelemetryDataSaubService.getDataDatesRange(idWell) - dates = { - from: new Date(dates?.from ?? 0), - to: new Date(dates?.to ?? 0) - } - setDateLimit(dates) - setStartDate(new Date(Math.max(dates.from, +dates.to - chartInterval))) - }, - setShowLoader, - `Не удалось загрузить диапозон телеметрии для скважины "${idWell}"`, - 'Загрузка диапозона телеметрии' - ), []) - - useEffect(() => { - setStartDate((startDate) => new Date(Math.min(Date.now() - chartInterval, startDate))) - setDataSaub([]) - }, [chartInterval]) - - useEffect(() => { - if (showLoader) return - const { loadingStartDate, loadingInterval, newLoaded } = getLoadingInterval(loaded, startDate, chartInterval) - if (loadingInterval <= 0) return - invokeWebApiWrapperAsync( - async () => { - const data = await TelemetryDataSaubService.getData(idWell, loadingStartDate.toISOString(), loadingInterval, DATA_COUNT) - - const loadedStartDate = new Date(Math.max(+newLoaded.start, +startDate - chartInterval * ADDITIVE_PAGES)) - const loadedEndDate = new Date(Math.min(+newLoaded.end, +startDate + chartInterval * (ADDITIVE_PAGES + 1))) - setLoaded({ start: loadedStartDate, end: loadedEndDate }) - - if (data) { - data.forEach(elm => elm.date = new Date(elm.date)) - setDataSaub((prevDataSaub) => { - const newData = [...prevDataSaub, ...normalizeData(data)] - newData.sort(makeDateSorter('date')) - return cutData(newData, loadedStartDate, loadedEndDate) - }) - } - - }, - setShowLoader, - `Не удалось загрузить данные по скважине "${idWell}" c ${startDate.toISOString()} по ${new Date(+startDate + chartInterval).toISOString()}`, - 'Загрузка телеметрий в диапозоне' - ) - }, [idWell, chartInterval, loaded, startDate]) - - return ( - <> - -
- Начальная дата:  - setStartDate(new Date(startDate))} - /> -
-
- Период:  - setChartInterval(val * 1000)} /> -
- - - - - - ) -}) - -export default Archive