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 2022-09-24 11:37:42 +05:00
parent d49a6e1df3
commit f038e5e36e
No known key found for this signature in database
GPG Key ID: 63EA771203189CF1
2 changed files with 29 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
src/pages/Telemetry/TelemetryView/index.jsx
View File

@ -6,7 +6,7 @@ import { useWell } from '@asb/context'
import { makeDateSorter } from '@components/Table' import { makeDateSorter } from '@components/Table'
import { D3MonitoringCharts } from '@components/d3/monitoring' import { D3MonitoringCharts } from '@components/d3/monitoring'
import LoaderPortal from '@components/LoaderPortal' import LoaderPortal from '@components/LoaderPortal'
import { Grid, GridItem, Flex } from '@components/Grid' import { Grid, GridItem } from '@components/Grid'
import { invokeWebApiWrapperAsync } from '@components/factory' import { invokeWebApiWrapperAsync } from '@components/factory'
import { PeriodPicker, defaultPeriod } from '@components/selectors/PeriodPicker' import { PeriodPicker, defaultPeriod } from '@components/selectors/PeriodPicker'
import { formatDate, hasPermission, wrapPrivateComponent } from '@utils' import { formatDate, hasPermission, wrapPrivateComponent } from '@utils'
@ -31,6 +31,7 @@ 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/monitoring.less'
import '@styles/message.css' import '@styles/message.css'
const { Option } = Select const { Option } = Select
@ -253,14 +254,14 @@ const TelemetryView = memo(() => {
<LoaderPortal show={showLoader}> <LoaderPortal show={showLoader}>
<Grid style={{ gridTemplateColumns: 'auto repeat(6, 1fr)' }}> <Grid style={{ gridTemplateColumns: 'auto repeat(6, 1fr)' }}>
<GridItem col={'1'} row={'1'} colSpan={'8'} style={{ marginBottom: '0.5rem' }}> <GridItem col={'1'} row={'1'} colSpan={'8'} style={{ marginBottom: '0.5rem' }}>
<Flex> <div className={'page-top'}>
<ModeDisplay data={dataSaub} /> <ModeDisplay data={dataSaub} />
<div style={{ marginLeft: '1rem' }}> <div>
Интервал:&nbsp; Интервал:&nbsp;
<PeriodPicker onChange={setChartInterval} /> <PeriodPicker onChange={setChartInterval} />
</div> </div>
<Button onClick={() => chartMethods?.setSettingsVisible(true)}>Настроить графики</Button> <Button onClick={() => chartMethods?.setSettingsVisible(true)}>Настроить графики</Button>
<div style={{ marginLeft: '1rem' }}> <div>
Статус:&nbsp; Статус:&nbsp;
<Select value={well.idState ?? 0} onChange={onStatusChanged} disabled={!hasPermission('Well.edit')}> <Select value={well.idState ?? 0} onChange={onStatusChanged} disabled={!hasPermission('Well.edit')}>
<Option value={0} disabled hidden>Неизвестно</Option> <Option value={0} disabled hidden>Неизвестно</Option>
@ -268,14 +269,16 @@ const TelemetryView = memo(() => {
<Option value={2}>Завершено</Option> <Option value={2}>Завершено</Option>
</Select> </Select>
</div> </div>
<Setpoints style={{ marginLeft: '1rem' }} /> <Setpoints />
<span style={{ flexGrow: 20 }}>&nbsp;</span> <span style={{ flexGrow: 20 }}>&nbsp;</span>
<WirelineRunOut /> <WirelineRunOut />
<img src={isTorqueStabEnabled(dataSpin) ? MomentStabPicEnabled : MomentStabPicDisabled} style={{ marginRight: '15px' }} alt={'TorqueMaster'} /> <div className={'icons'}>
<img src={isSpinEnabled(dataSpin) ? SpinPicEnabled : SpinPicDisabled} style={{ marginRight: '15px' }} alt={'SpinMaster'} /> <img src={isTorqueStabEnabled(dataSpin) ? MomentStabPicEnabled : MomentStabPicDisabled} alt={'TorqueMaster'} />
<h2 style={{ marginBottom: 0, marginRight: '15px', fontWeight: 'bold', color: isMseEnabled(dataSaub) ? 'green' : 'lightgrey' }}>MSE</h2> <img src={isSpinEnabled(dataSpin) ? SpinPicEnabled : SpinPicDisabled} alt={'SpinMaster'} />
<h2 style={{ marginBottom: 0, fontWeight: 'bold', color: isMseEnabled(dataSaub) ? 'green' : 'lightgrey' }}>MSE</h2>
</div>
<UserOfWell data={dataSaub} /> <UserOfWell data={dataSaub} />
</Flex> </div>
</GridItem> </GridItem>
<GridItem col={'1'} row={'2'} rowSpan={'3'} style={{ minWidth: '260px', width: '0.142fr' }}> <GridItem col={'1'} row={'2'} rowSpan={'3'} style={{ minWidth: '260px', width: '0.142fr' }}>
<CustomColumn data={dataSaub} /> <CustomColumn data={dataSaub} />

17
src/styles/monitoring.less Normal file
View File

@ -0,0 +1,17 @@
.page-top {
display: flex;
flex-wrap: wrap;
margin: -5px;
& > * {
margin: 5px;
}
& > .icons {
display: flex;
& > * {
margin-left: 15px;
}
}
}