ia.novokshanov/asb_cloud_front
1
0
Fork 0
forked from ddrilling/asb_cloud_front
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Семантические исправления

Browse Source
This commit is contained in:
goodmice 2021-10-19 14:49:53 +05:00
parent fa0fc2d0d6
commit f79c96f3c0
2 changed files with 110 additions and 109 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/pages/TelemetryView/Column.jsx
View File

@ -9,7 +9,7 @@ export const Column = ({lineGroup, data, interval, showBorder, style, headerHeig
let pv = null let pv = null
if (data?.length > 0) { if (data?.length > 0) {
dataLast = data[data.length - 1]; dataLast = data[data.length - 1];
pv = lineGroup.filter(line => line.showValue).map(line => ({ pv = lineGroup.filter(line => line.showGraph).map(line => ({
color: line.color, color: line.color,
label: line.label, label: line.label,
unit: line.units, unit: line.units,

217
src/pages/TelemetryView/index.jsx
View File

@ -4,7 +4,7 @@ import { Select } from 'antd'
import { Column } from './Column' import { Column } from './Column'
import { CustomColumn } from './CustomColumn' import { CustomColumn } from './CustomColumn'
import ActiveMessagesOnline from './ActiveMessagesOnline' import ActiveMessagesOnline from './ActiveMessagesOnline'
import { ModeDisplay } from "./ModeDisplay" import { ModeDisplay } from './ModeDisplay'
import { UserOfWell } from './UserOfWells' import { UserOfWell } from './UserOfWells'
import LoaderPortal from '../../components/LoaderPortal' import LoaderPortal from '../../components/LoaderPortal'
@ -13,10 +13,10 @@ import { Subscribe } from '../../services/signalr'
import { TelemetryDataSaubService, TelemetryDataSpinService } from '../../services/api' import { TelemetryDataSaubService, TelemetryDataSpinService } from '../../services/api'
import { invokeWebApiWrapperAsync } from '../../components/factory' import { invokeWebApiWrapperAsync } from '../../components/factory'
import MomentStabPicEnabled from "../../images/DempherOn.png" import MomentStabPicEnabled from '../../images/DempherOn.png'
import MomentStabPicDisabled from "../../images/DempherOff.png" import MomentStabPicDisabled from '../../images/DempherOff.png'
import SpinPicEnabled from "../../images/SpinEnabled.png" import SpinPicEnabled from '../../images/SpinEnabled.png'
import SpinPicDisabled from "../../images/SpinDisabled.png" import SpinPicDisabled from '../../images/SpinDisabled.png'
import '../../styles/message.css' import '../../styles/message.css'
@ -26,17 +26,17 @@ const dash = [7, 3]
const blockHeightGroup = [ const blockHeightGroup = [
{ {
label: "Высота блока", label: 'Высота блока',
units: 'м', units: 'м',
xAccessorName: "blockPosition", xAccessorName: 'blockPosition',
yAccessorName: "date", yAccessorName: 'date',
color: '#333', color: '#333',
showValue: true showGraph: true
}, { }, {
label: "wellDepth", label: 'wellDepth',
units: 'м', units: 'м',
xAccessorName: "wellDepth", xAccessorName: 'wellDepth',
yAccessorName: "date", yAccessorName: 'date',
color: '#333', color: '#333',
showLine: false, showLine: false,
xConstValue: 30, xConstValue: 30,
@ -47,23 +47,23 @@ const blockHeightGroup = [
xAccessorName: 'flow', xAccessorName: 'flow',
yAccessorName: 'date', yAccessorName: 'date',
color: '#077', color: '#077',
showValue: true showGraph: true
} }
] ]
const blockSpeedGroup = [ const blockSpeedGroup = [
{ {
label: "Скорость блока", label: 'Скорость блока',
units: 'м/ч', units: 'м/ч',
xAccessorName: "blockSpeed", xAccessorName: 'blockSpeed',
yAccessorName: "date", yAccessorName: 'date',
color: '#0a0', color: '#0a0',
showValue: true showGraph: true
}, { }, {
label: "blockSpeedSp", label: 'blockSpeedSp',
units: 'м/ч', units: 'м/ч',
xAccessorName: "blockSpeedSp", xAccessorName: 'blockSpeedSp',
yAccessorName: "date", yAccessorName: 'date',
color: '#0a0', color: '#0a0',
footer: 'SP', footer: 'SP',
dash dash
@ -72,33 +72,33 @@ const blockSpeedGroup = [
const pressureGroup = [ const pressureGroup = [
{ {
label: "Давление", label: 'Давление',
units: 'атм', units: 'атм',
xAccessorName: "pressure", xAccessorName: 'pressure',
yAccessorName: "date", yAccessorName: 'date',
color: '#c00', color: '#c00',
showValue: true showGraph: true
}, { }, {
label: "pressureSp", label: 'pressureSp',
units: 'атм', units: 'атм',
xAccessorName: "pressureSp", xAccessorName: 'pressureSp',
yAccessorName: "date", yAccessorName: 'date',
color: '#c00', color: '#c00',
footer: 'SP', footer: 'SP',
dash dash
}, { }, {
label: "pressureIdle", label: 'pressureIdle',
units: 'атм', units: 'атм',
xAccessorName: "pressureIdle", xAccessorName: 'pressureIdle',
yAccessorName: "date", yAccessorName: 'date',
color: '#c00', color: '#c00',
footer: 'IDLE', footer: 'IDLE',
dash dash
}, { }, {
label: "pressureDeltaLimitMax", label: 'pressureDeltaLimitMax',
units: 'атм', units: 'атм',
xAccessorName: "pressureDeltaLimitMax", xAccessorName: 'pressureDeltaLimitMax',
yAccessorName: "date", yAccessorName: 'date',
color: '#c00', color: '#c00',
footer: true, footer: true,
dash dash
@ -107,25 +107,25 @@ const pressureGroup = [
const axialLoadGroup = [ const axialLoadGroup = [
{ {
label: "Осевая нагрузка", label: 'Осевая нагрузка',
units: 'т', units: 'т',
xAccessorName: "axialLoad", xAccessorName: 'axialLoad',
yAccessorName: "date", yAccessorName: 'date',
color: '#00a', color: '#00a',
showValue: true showGraph: true
}, { }, {
label: "axialLoadSp", label: 'axialLoadSp',
units: 'т', units: 'т',
xAccessorName: "axialLoadSp", xAccessorName: 'axialLoadSp',
yAccessorName: "date", yAccessorName: 'date',
color: '#00a', color: '#00a',
footer: 'SP', footer: 'SP',
dash dash
}, { }, {
label: "axialLoadLimitMax", label: 'axialLoadLimitMax',
units: 'т', units: 'т',
xAccessorName: "axialLoadLimitMax", xAccessorName: 'axialLoadLimitMax',
yAccessorName: "date", yAccessorName: 'date',
color: '#00a', color: '#00a',
footer: true, footer: true,
dash dash
@ -134,33 +134,33 @@ const axialLoadGroup = [
const hookWeightGroup = [ const hookWeightGroup = [
{ {
label: "Вес на крюке", label: 'Вес на крюке',
units: 'т', units: 'т',
xAccessorName: "hookWeight", xAccessorName: 'hookWeight',
yAccessorName: "date", yAccessorName: 'date',
color: '#0aa', color: '#0aa',
showValue: true showGraph: true
}, { }, {
label: "hookWeightIdle", label: 'hookWeightIdle',
units: 'т', units: 'т',
xAccessorName: "hookWeightIdle", xAccessorName: 'hookWeightIdle',
yAccessorName: "date", yAccessorName: 'date',
color: '#0aa', color: '#0aa',
footer: 'IDLE', footer: 'IDLE',
dash dash
}, { }, {
label: "hookWeightLimitMin", label: 'hookWeightLimitMin',
units: 'т', units: 'т',
xAccessorName: "hookWeightLimitMin", xAccessorName: 'hookWeightLimitMin',
yAccessorName: "date", yAccessorName: 'date',
color: '#0aa', color: '#0aa',
footer: true, footer: true,
dash dash
}, { }, {
label: "hookWeightLimitMax", label: 'hookWeightLimitMax',
units: 'т', units: 'т',
xAccessorName: "hookWeightLimitMax", xAccessorName: 'hookWeightLimitMax',
yAccessorName: "date", yAccessorName: 'date',
color: '#0aa', color: '#0aa',
footer: true, footer: true,
dash dash
@ -171,39 +171,39 @@ const hookWeightGroup = [
xAccessorName: 'rotorSpeed', xAccessorName: 'rotorSpeed',
yAccessorName: 'date', yAccessorName: 'date',
color: '#aa0', color: '#aa0',
showValue: true showGraph: true
} }
] ]
const rotorTorqueGroup = [ const rotorTorqueGroup = [
{ {
label: "Момент на роторе", label: 'Момент на роторе',
units: 'кН·м', units: 'кН·м',
xAccessorName: "rotorTorque", xAccessorName: 'rotorTorque',
yAccessorName: "date", yAccessorName: 'date',
color: '#a0a', color: '#a0a',
showValue: true showGraph: true
}, { }, {
label: "План. Момент на роторе", label: 'План. Момент на роторе',
units: 'кН·м', units: 'кН·м',
xAccessorName: "rotorTorqueSp", xAccessorName: 'rotorTorqueSp',
yAccessorName: "date", yAccessorName: 'date',
color: '#a0a', color: '#a0a',
footer: 'SP', footer: 'SP',
dash dash
}, { }, {
label: "Момент на роторе х.х.", label: 'Момент на роторе х.х.',
units: 'кН·м', units: 'кН·м',
xAccessorName: "rotorTorqueIdle", xAccessorName: 'rotorTorqueIdle',
yAccessorName: "date", yAccessorName: 'date',
color: '#a0a', color: '#a0a',
footer: 'IDLE', footer: 'IDLE',
dash dash
}, { }, {
label: "rotorTorqueLimitMax", label: 'rotorTorqueLimitMax',
units: 'кН·м', units: 'кН·м',
xAccessorName: "rotorTorqueLimitMax", xAccessorName: 'rotorTorqueLimitMax',
yAccessorName: "date", yAccessorName: 'date',
color: '#a0a', color: '#a0a',
footer: true, footer: true,
dash dash
@ -301,42 +301,43 @@ export default function TelemetryView({ idWell }) {
} }
}, [idWell, chartInterval]) }, [idWell, chartInterval])
return (<LoaderPortal show={showLoader}> return (
<Grid style={{ gridTemplateColumns: 'auto repeat(6, 1fr)' }}> <LoaderPortal show={showLoader}>
<GridItem col='1' row='1' colSpan='8' style={{ marginBottom: '0.5rem' }}> <Grid style={{ gridTemplateColumns: 'auto repeat(6, 1fr)' }}>
<Flex> <GridItem col={'1'} row={'1'} colSpan={'8'} style={{ marginBottom: '0.5rem' }}>
<ModeDisplay data={dataSaub} /> <Flex>
<div style={{ marginLeft: '1rem' }}> <ModeDisplay data={dataSaub} />
Интервал:&nbsp; <div style={{ marginLeft: '1rem' }}>
<Select defaultValue={defaultChartInterval} onChange={setChartInterval}> Интервал:&nbsp;
{options} <Select defaultValue={defaultChartInterval} onChange={setChartInterval}>
</Select> {options}
</div> </Select>
<span style={{ flexGrow: 20 }}>&nbsp;</span> </div>
<img src={isTorqueStabEnabled(dataSpin) ? MomentStabPicEnabled : MomentStabPicDisabled} style={{ marginRight: "15px" }} alt="TorqueMaster" /> <span style={{ flexGrow: 20 }}>&nbsp;</span>
<img src={isSpinEnabled(dataSpin) ? SpinPicEnabled : SpinPicDisabled} style={{ marginRight: "15px" }} alt="SpinMaster" /> <img src={isTorqueStabEnabled(dataSpin) ? MomentStabPicEnabled : MomentStabPicDisabled} style={{ marginRight: '15px' }} alt={'TorqueMaster'} />
<h2 style={{ marginBottom: 0, marginRight: "15px", fontWeight: "bold", color: isMseEnabled(dataSaub) ? "green" : "lightgrey" }}>MSE</h2> <img src={isSpinEnabled(dataSpin) ? SpinPicEnabled : SpinPicDisabled} style={{ marginRight: '15px' }} alt={'SpinMaster'} />
<UserOfWell data={dataSaub} /> <h2 style={{ marginBottom: 0, marginRight: '15px', fontWeight: 'bold', color: isMseEnabled(dataSaub) ? 'green' : 'lightgrey' }}>MSE</h2>
</Flex> <UserOfWell data={dataSaub} />
</GridItem> </Flex>
<GridItem col='1' row='2' rowSpan='3' style={{ minWidth: '260px', width: '0.142fr' }}>
<CustomColumn data={dataSaub} />
</GridItem>
{paramsGroups.map((group, index) =>
<GridItem col={2 + index} row='2' className='border_small' key={`${group.label}${index}`}>
<Column
style={{ width: '13vw' }}
data={dataSaub}
lineGroup={group}
interval={chartInterval}
headerHeight={'60px'}
showBorder={getIndexOfDrillingBy(dataSaub) === index} />
</GridItem> </GridItem>
)} <GridItem col={'1'} row={'2'} rowSpan={'3'} style={{ minWidth: '260px', width: '0.142fr' }}>
<CustomColumn data={dataSaub} />
<GridItem col='2' row='3' colSpan='7'> </GridItem>
<ActiveMessagesOnline idWell={idWell} /> {paramsGroups.map((group, index) =>
</GridItem> <GridItem col={2 + index} row={'2'} className={'border_small'} key={`${group.label}${index}`}>
</Grid> <Column
</LoaderPortal>) style={{ width: '13vw' }}
} data={dataSaub}
lineGroup={group}
interval={chartInterval}
headerHeight={'60px'}
showBorder={getIndexOfDrillingBy(dataSaub) === index} />
</GridItem>
)}
<GridItem col={'2'} row={'3'} colSpan={'7'}>
<ActiveMessagesOnline idWell={idWell} />
</GridItem>
</Grid>
</LoaderPortal>
)
}