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:
Alexey 2021-08-05 16:37:33 +05:00
parent a0f73345f2
commit 796745d0f1
8 changed files with 21819 additions and 112 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21226
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

2
package.json
View File

@ -14,9 +14,11 @@
"chartjs-plugin-datalabels": "^2.0.0-rc.1",
"chartjs-plugin-zoom": "^1.1.1",
"craco-less": "^1.17.1",
"immutability-helper": "^3.1.1",
"moment": "^2.29.1",
"pigeon-maps": "^0.19.7",
"react": "^17.0.2",
"react-dnd-html5-backend": "^14.0.0",
"react-dom": "^17.0.2",
"react-router-dom": "^5.2.0",
"react-scripts": "4.0.3",

26
src/components/SmboPlate.jsx
View File

@ -3,7 +3,7 @@ import '../styles/smbo.css'
import {useState} from "react";
export const SqueareIndicator = ({state}) =>{
export const SquareIndicator = ({state}) =>{
let bgColor = "#AAA"
switch (state){
case 1:
@ -23,7 +23,11 @@ export const SqueareIndicator = ({state}) =>{
</svg>)
}
export default function SmboPlate({title, state, operatingTime, units, children}){
const platesData = [
{id: '1', title: 'equipToolName', placeHolderId: '', state: '', units: 'ч', value: SquareIndicator, captionValue: 'Подпись', custom: 'Я не понял про это'}
]
export default function SmboPlate({title, state, operatingTime, units, children, captionValue}){
const [isModalVisible, setIsModalVisible] = useState(false)
@ -35,15 +39,19 @@ export default function SmboPlate({title, state, operatingTime, units, children}
setIsModalVisible(false)
}
return(<><div className="plate_container" onClick={openModal}>
<div className="plate_title">{title}</div>
<div className="plate_state"><SqueareIndicator state={state}/></div>
const plates_smbo_equip = platesData.map((items) => (
<div className="plate_container" onClick={openModal}>
<div className="plate_title">{title}</div>
<div className="plate_state"><SquareIndicator state={state}/></div>
<div className="plate_param_title">наработка:</div>
<div className="plate_param_value">{operatingTime}</div>
<div className="plate_param_units">{units??'ч'}</div>
<div className="plate_param_title">наработка: {captionValue}</div>
<div className="plate_param_value">{operatingTime}</div>
<div className="plate_param_units">{units??'ч'}</div>
</div>
))
</div>
return(<>
{plates_smbo_equip}
<Modal
title={title}

34
src/components/modalWindows/EquipmentDetails.jsx
View File

@ -1,41 +1,17 @@
import {Row, Col} from 'antd'
import {InboxOutlined} from '@ant-design/icons'
import {useState} from "react"
import {useParams} from 'react-router-dom'
import '../../styles/equipment_details.css'
import Documents from '../Documents'
const collectionOfLinesForStates = [
{label: 'Состояние', unit: ''},
{label: 'Полная наработка', unit: 'ч'},
{label: 'Наработка после ТО1', unit: 'ч'},
{label: 'Наработка после ТО1', unit: 'ч'},
{label: 'Наработка вне р/р', unit: 'ч'},
{label: 'Периодичность ТО1', unit: 'ч'},
{label: 'Периодичность ТО2', unit: 'ч'},
]
const collectionOfLinesForIndicators = [
{label: 'Скорость вращения', unit: 'Об/мин'},
{label: 'Крутящий момент', unit: 'кН*м'},
{label: 'Общий уровень вибрации', unit: 'мм/с'},
{label: 'Уровень масла в баке', unit: 'м'},
{label: 'Т верхнего подшипника', unit: '°C'},
{label: 'Т нижнего подшипника', unit: '°C'},
{label: 'Состояние ПЧ1', unit: ''},
{label: 'Состояние ПЧ2', unit: ''},
]
export default function EquipmentDetails() {
let stateOfEquipmentDetails = collectionOfLinesForStates.map(item => {
export default function EquipmentDetails({equipmentTimers, equipmentSensors}) {
let stateOfEquipmentDetails = equipmentTimers.map(timer => {
return(
<p key={item.label}>{item.label}: <span className="right-text"><b>{item.unit}</b></span></p>
<p key={timer.label}>{timer.label}: <span className="right-text"><b>{timer.value} {timer.unit}</b></span></p>
)
})
let indicatorsOfEquipmentDetail = collectionOfLinesForIndicators.map(item => {
let indicatorsOfEquipmentDetail = equipmentSensors.map(sensor => {
return(
<p key={item.label}>{item.label}: <span className="right-text"><b>{item.unit}</b></span></p>
<p key={sensor.label}>{sensor.label}: <span className="right-text"><b>{sensor.value} {sensor.unit}</b></span></p>
)
})

18
src/concept/dragNDrop/Draggable.jsx Normal file
View File

@ -0,0 +1,18 @@
import React from 'react'
import {useDraggable} from '@dnd-kit/core'
import {CSS} from '@dnd-kit/utilities'
export function Draggable(props) {
const {attributes, listeners, setNodeRef, transform} = useDraggable({
id: 'draggable',
})
const style = {
transform: CSS.Translate.toString(transform),
}
return (
<button ref={setNodeRef} style={style} {...listeners} {...attributes}>
{props.children}
</button>
);
}

19
src/concept/dragNDrop/Droppable.jsx Normal file
View File

@ -0,0 +1,19 @@
import React from 'react';
import {useDroppable} from '@dnd-kit/core';
export function Droppable(props) {
const {isOver, setNodeRef} = useDroppable({
id: 'droppable',
});
const style = {
color: isOver ? 'green' : undefined,
width: "100px",
height: "100px",
};
return (
<div ref={setNodeRef} style={style}>
{props.children}
</div>
);
}

592
src/pages/Smbo.jsx
View File

@ -1,56 +1,556 @@
import SmboPlate from '../components/SmboPlate'
import SmboPlate, {SquareIndicator} from '../components/SmboPlate'
import '../styles/smbo.css'
import RigPlan from '../images/smbo/RigPlan2.png'
import HoistDummy from '../images/smbo/hoist_LBU_1200.png'
import EquipmentDetails from '../components/modalWindows/EquipmentDetails'
import ActiveMessagesOnline from "../components/ActiveMessagesOnline";
import ActiveMessagesOnline from "../components/ActiveMessagesOnline"
const platesData = [
{
id: '1',
title: 'Теплогенератор',
placeHolderId: '1',
state: 1,
equipmentTimers: [
{label: 'Полная наработка', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка вне р/р', value: 1, unit: 'ч'},
{label: 'Периодичность ТО1', value: 1, unit: 'ч'},
{label: 'Периодичность ТО2', value: 1, unit: 'ч'},
],
equipmentSensors: [
{label: 'Скорость вращения', value: 1, unit: 'Об/мин'},
{label: 'Крутящий момент', value: 1, unit: 'кН*м'},
{label: 'Общий уровень вибрации', value: 1, unit: 'мм/с'},
{label: 'Уровень масла в баке', value: 1, unit: 'м'},
{label: 'Т верхнего подшипника', value: 1, unit: '°C'},
{label: 'Т нижнего подшипника', value: 1, unit: '°C'},
{label: 'Состояние ПЧ1', value: 1, unit: ''},
{label: 'Состояние ПЧ2', value: 1, unit: ''},
],
captionValue: 'У-У-У-у-у-у',
custom: 'Я не понял про это'
},
{
id: '2',
title: 'Емкости бурового раствора',
placeHolderId: '2',
state: 1,
// dc
equipmentTimers: [
{label: 'Полная наработка', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка вне р/р', value: 1, unit: 'ч'},
{label: 'Периодичность ТО1', value: 1, unit: 'ч'},
{label: 'Периодичность ТО2', value: 1, unit: 'ч'},
],
equipmentSensors: [
{label: 'Скорость вращения', value: 1, unit: 'Об/мин'},
{label: 'Крутящий момент', value: 1, unit: 'кН*м'},
{label: 'Общий уровень вибрации', value: 1, unit: 'мм/с'},
{label: 'Уровень масла в баке', value: 1, unit: 'м'},
{label: 'Т верхнего подшипника', value: 1, unit: '°C'},
{label: 'Т нижнего подшипника', value: 1, unit: '°C'},
{label: 'Состояние ПЧ1', value: 1, unit: ''},
{label: 'Состояние ПЧ2', value: 1, unit: ''},
],
captionValue: 'У-У-У-у-у-у',
custom: 'Я не понял про это'
},
{
id: '3',
title: 'Подпорные насосы',
placeHolderId: '3',
state: 2,
equipmentTimers: [
{label: 'Полная наработка', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка вне р/р', value: 1, unit: 'ч'},
{label: 'Периодичность ТО1', value: 1, unit: 'ч'},
{label: 'Периодичность ТО2', value: 1, unit: 'ч'},
],
equipmentSensors: [
{label: 'Скорость вращения', value: 1, unit: 'Об/мин'},
{label: 'Крутящий момент', value: 1, unit: 'кН*м'},
{label: 'Общий уровень вибрации', value: 1, unit: 'мм/с'},
{label: 'Уровень масла в баке', value: 1, unit: 'м'},
{label: 'Т верхнего подшипника', value: 1, unit: '°C'},
{label: 'Т нижнего подшипника', value: 1, unit: '°C'},
{label: 'Состояние ПЧ1', value: 1, unit: ''},
{label: 'Состояние ПЧ2', value: 1, unit: ''},
],
captionValue: 'У-У-У-у-у-у',
custom: 'Я не понял про это'
},
{
id: '4',
title: 'Буровой насос №1',
placeHolderId: '4',
state: 1,
equipmentTimers: [
{label: 'Полная наработка', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка вне р/р', value: 1, unit: 'ч'},
{label: 'Периодичность ТО1', value: 1, unit: 'ч'},
{label: 'Периодичность ТО2', value: 1, unit: 'ч'},
],
equipmentSensors: [
{label: 'Скорость вращения', value: 1, unit: 'Об/мин'},
{label: 'Крутящий момент', value: 1, unit: 'кН*м'},
{label: 'Общий уровень вибрации', value: 1, unit: 'мм/с'},
{label: 'Уровень масла в баке', value: 1, unit: 'м'},
{label: 'Т верхнего подшипника', value: 1, unit: '°C'},
{label: 'Т нижнего подшипника', value: 1, unit: '°C'},
{label: 'Состояние ПЧ1', value: 1, unit: ''},
{label: 'Состояние ПЧ2', value: 1, unit: ''},
],
captionValue: 'У-У-У-у-у-у',
custom: 'Я не понял про это'
},
{
id: '5',
title: 'Буровой насос №2',
placeHolderId: '5',
state: 0,
equipmentTimers: [
{label: 'Полная наработка', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка вне р/р', value: 1, unit: 'ч'},
{label: 'Периодичность ТО1', value: 1, unit: 'ч'},
{label: 'Периодичность ТО2', value: 1, unit: 'ч'},
],
equipmentSensors: [
{label: 'Скорость вращения', value: 1, unit: 'Об/мин'},
{label: 'Крутящий момент', value: 1, unit: 'кН*м'},
{label: 'Общий уровень вибрации', value: 1, unit: 'мм/с'},
{label: 'Уровень масла в баке', value: 1, unit: 'м'},
{label: 'Т верхнего подшипника', value: 1, unit: '°C'},
{label: 'Т нижнего подшипника', value: 1, unit: '°C'},
{label: 'Состояние ПЧ1', value: 1, unit: ''},
{label: 'Состояние ПЧ2', value: 1, unit: ''},
],
captionValue: 'У-У-У-у-у-у',
custom: 'Я не понял про это'
},
{
id: '6',
title: 'Талевый канат',
placeHolderId: '6',
state: 2,
equipmentTimers: [
{label: 'Полная наработка', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка вне р/р', value: 1, unit: 'ч'},
{label: 'Периодичность ТО1', value: 1, unit: 'ч'},
{label: 'Периодичность ТО2', value: 1, unit: 'ч'},
],
equipmentSensors: [
{label: 'Скорость вращения', value: 1, unit: 'Об/мин'},
{label: 'Крутящий момент', value: 1, unit: 'кН*м'},
{label: 'Общий уровень вибрации', value: 1, unit: 'мм/с'},
{label: 'Уровень масла в баке', value: 1, unit: 'м'},
{label: 'Т верхнего подшипника', value: 1, unit: '°C'},
{label: 'Т нижнего подшипника', value: 1, unit: '°C'},
{label: 'Состояние ПЧ1', value: 1, unit: ''},
{label: 'Состояние ПЧ2', value: 1, unit: ''},
],
captionValue: 'У-У-У-у-у-у',
custom: 'Я не понял про это'
},
{
id: '7',
title: 'Станция управления ВСП',
placeHolderId: '7',
state: 3,
equipmentTimers: [
{label: 'Полная наработка', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка вне р/р', value: 1, unit: 'ч'},
{label: 'Периодичность ТО1', value: 1, unit: 'ч'},
{label: 'Периодичность ТО2', value: 1, unit: 'ч'},
],
equipmentSensors: [
{label: 'Скорость вращения', value: 1, unit: 'Об/мин'},
{label: 'Крутящий момент', value: 1, unit: 'кН*м'},
{label: 'Общий уровень вибрации', value: 1, unit: 'мм/с'},
{label: 'Уровень масла в баке', value: 1, unit: 'м'},
{label: 'Т верхнего подшипника', value: 1, unit: '°C'},
{label: 'Т нижнего подшипника', value: 1, unit: '°C'},
{label: 'Состояние ПЧ1', value: 1, unit: ''},
{label: 'Состояние ПЧ2', value: 1, unit: ''},
],
captionValue: 'У-У-У-у-у-у',
custom: 'Я не понял про это'
},
{
id: '8',
title: 'Компрессорный блок',
placeHolderId: '8',
state: 3,
equipmentTimers: [
{label: 'Полная наработка', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка вне р/р', value: 1, unit: 'ч'},
{label: 'Периодичность ТО1', value: 1, unit: 'ч'},
{label: 'Периодичность ТО2', value: 1, unit: 'ч'},
],
equipmentSensors: [
{label: 'Скорость вращения', value: 1, unit: 'Об/мин'},
{label: 'Крутящий момент', value: 1, unit: 'кН*м'},
{label: 'Общий уровень вибрации', value: 1, unit: 'мм/с'},
{label: 'Уровень масла в баке', value: 1, unit: 'м'},
{label: 'Т верхнего подшипника', value: 1, unit: '°C'},
{label: 'Т нижнего подшипника', value: 1, unit: '°C'},
{label: 'Состояние ПЧ1', value: 1, unit: ''},
{label: 'Состояние ПЧ2', value: 1, unit: ''},
],
captionValue: 'У-У-У-у-у-у',
custom: 'Я не понял про это'
},
{
id: '9',
title: 'Лебедка буровая',
placeHolderId: '9',
state: 1,
equipmentTimers: [
{label: 'Полная наработка', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка вне р/р', value: 1, unit: 'ч'},
{label: 'Периодичность ТО1', value: 1, unit: 'ч'},
{label: 'Периодичность ТО2', value: 1, unit: 'ч'},
],
equipmentSensors: [
{label: 'Скорость вращения', value: 1, unit: 'Об/мин'},
{label: 'Крутящий момент', value: 1, unit: 'кН*м'},
{label: 'Общий уровень вибрации', value: 1, unit: 'мм/с'},
{label: 'Уровень масла в баке', value: 1, unit: 'м'},
{label: 'Т верхнего подшипника', value: 1, unit: '°C'},
{label: 'Т нижнего подшипника', value: 1, unit: '°C'},
{label: 'Состояние ПЧ1', value: 1, unit: ''},
{label: 'Состояние ПЧ2', value: 1, unit: ''},
],
captionValue: 'У-У-У-у-у-у',
custom: 'Я не понял про это'
},
{
id: '10',
title: 'Блок сопротивлений и КТУ',
placeHolderId: '10',
state: 1,
equipmentTimers: [
{label: 'Полная наработка', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка вне р/р', value: 1, unit: 'ч'},
{label: 'Периодичность ТО1', value: 1, unit: 'ч'},
{label: 'Периодичность ТО2', value: 1, unit: 'ч'},
],
equipmentSensors: [
{label: 'Скорость вращения', value: 1, unit: 'Об/мин'},
{label: 'Крутящий момент', value: 1, unit: 'кН*м'},
{label: 'Общий уровень вибрации', value: 1, unit: 'мм/с'},
{label: 'Уровень масла в баке', value: 1, unit: 'м'},
{label: 'Т верхнего подшипника', value: 1, unit: '°C'},
{label: 'Т нижнего подшипника', value: 1, unit: '°C'},
{label: 'Состояние ПЧ1', value: 1, unit: ''},
{label: 'Состояние ПЧ2', value: 1, unit: ''},
],
captionValue: 'У-У-У-у-у-у',
custom: 'Я не понял про это'
},
{
id: '11',
title: 'Вспомогательная лебедка',
placeHolderId: '11',
state: 0,
equipmentTimers: [
{label: 'Полная наработка', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка вне р/р', value: 1, unit: 'ч'},
{label: 'Периодичность ТО1', value: 1, unit: 'ч'},
{label: 'Периодичность ТО2', value: 1, unit: 'ч'},
],
equipmentSensors: [
{label: 'Скорость вращения', value: 1, unit: 'Об/мин'},
{label: 'Крутящий момент', value: 1, unit: 'кН*м'},
{label: 'Общий уровень вибрации', value: 1, unit: 'мм/с'},
{label: 'Уровень масла в баке', value: 1, unit: 'м'},
{label: 'Т верхнего подшипника', value: 1, unit: '°C'},
{label: 'Т нижнего подшипника', value: 1, unit: '°C'},
{label: 'Состояние ПЧ1', value: 1, unit: ''},
{label: 'Состояние ПЧ2', value: 1, unit: ''},
],
captionValue: 'У-У-У-у-у-у',
custom: 'Я не понял про это'
},
{
id: '12',
title: 'Блок НКУ',
placeHolderId: '12',
state: 1,
equipmentTimers: [
{label: 'Полная наработка', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка вне р/р', value: 1, unit: 'ч'},
{label: 'Периодичность ТО1', value: 1, unit: 'ч'},
{label: 'Периодичность ТО2', value: 1, unit: 'ч'},
],
equipmentSensors: [
{label: 'Скорость вращения', value: 1, unit: 'Об/мин'},
{label: 'Крутящий момент', value: 1, unit: 'кН*м'},
{label: 'Общий уровень вибрации', value: 1, unit: 'мм/с'},
{label: 'Уровень масла в баке', value: 1, unit: 'м'},
{label: 'Т верхнего подшипника', value: 1, unit: '°C'},
{label: 'Т нижнего подшипника', value: 1, unit: '°C'},
{label: 'Состояние ПЧ1', value: 1, unit: ''},
{label: 'Состояние ПЧ2', value: 1, unit: ''},
],
captionValue: 'У-У-У-у-у-у',
custom: 'Я не понял про это'
},
{
id: '13',
title: 'Гидрорасцепитель',
placeHolderId: '13',
state: 1,
equipmentTimers: [
{label: 'Полная наработка', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка вне р/р', value: 1, unit: 'ч'},
{label: 'Периодичность ТО1', value: 1, unit: 'ч'},
{label: 'Периодичность ТО2', value: 1, unit: 'ч'},
],
equipmentSensors: [
{label: 'Скорость вращения', value: 1, unit: 'Об/мин'},
{label: 'Крутящий момент', value: 1, unit: 'кН*м'},
{label: 'Общий уровень вибрации', value: 1, unit: 'мм/с'},
{label: 'Уровень масла в баке', value: 1, unit: 'м'},
{label: 'Т верхнего подшипника', value: 1, unit: '°C'},
{label: 'Т нижнего подшипника', value: 1, unit: '°C'},
{label: 'Состояние ПЧ1', value: 1, unit: ''},
{label: 'Состояние ПЧ2', value: 1, unit: ''},
],
captionValue: 'У-У-У-у-у-у',
custom: 'Я не понял про это'
},
{
id: '14',
title: 'Блок КРУ',
placeHolderId: '14',
state: 1,
equipmentTimers: [
{label: 'Полная наработка', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка вне р/р', value: 1, unit: 'ч'},
{label: 'Периодичность ТО1', value: 1, unit: 'ч'},
{label: 'Периодичность ТО2', value: 1, unit: 'ч'},
],
equipmentSensors: [
{label: 'Скорость вращения', value: 1, unit: 'Об/мин'},
{label: 'Крутящий момент', value: 1, unit: 'кН*м'},
{label: 'Общий уровень вибрации', value: 1, unit: 'мм/с'},
{label: 'Уровень масла в баке', value: 1, unit: 'м'},
{label: 'Т верхнего подшипника', value: 1, unit: '°C'},
{label: 'Т нижнего подшипника', value: 1, unit: '°C'},
{label: 'Состояние ПЧ1', value: 1, unit: ''},
{label: 'Состояние ПЧ2', value: 1, unit: ''},
],
captionValue: 'У-У-У-у-у-у',
custom: 'Я не понял про это'
},
{
id: '15',
title: 'Привод ВСП',
placeHolderId: '15',
state: 2,
equipmentTimers: [
{label: 'Полная наработка', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка вне р/р', value: 1, unit: 'ч'},
{label: 'Периодичность ТО1', value: 1, unit: 'ч'},
{label: 'Периодичность ТО2', value: 1, unit: 'ч'},
],
equipmentSensors: [
{label: 'Скорость вращения', value: 1, unit: 'Об/мин'},
{label: 'Крутящий момент', value: 1, unit: 'кН*м'},
{label: 'Общий уровень вибрации', value: 1, unit: 'мм/с'},
{label: 'Уровень масла в баке', value: 1, unit: 'м'},
{label: 'Т верхнего подшипника', value: 1, unit: '°C'},
{label: 'Т нижнего подшипника', value: 1, unit: '°C'},
{label: 'Состояние ПЧ1', value: 1, unit: ''},
{label: 'Состояние ПЧ2', value: 1, unit: ''},
],
captionValue: 'У-У-У-у-у-у',
custom: 'Я не понял про это'
},
{
id: '16',
title: 'Теплогенератор',
placeHolderId: '16',
state: 3,
equipmentTimers: [
{label: 'Полная наработка', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка вне р/р', value: 1, unit: 'ч'},
{label: 'Периодичность ТО1', value: 1, unit: 'ч'},
{label: 'Периодичность ТО2', value: 1, unit: 'ч'},
],
equipmentSensors: [
{label: 'Скорость вращения', value: 1, unit: 'Об/мин'},
{label: 'Крутящий момент', value: 1, unit: 'кН*м'},
{label: 'Общий уровень вибрации', value: 1, unit: 'мм/с'},
{label: 'Уровень масла в баке', value: 1, unit: 'м'},
{label: 'Т верхнего подшипника', value: 1, unit: '°C'},
{label: 'Т нижнего подшипника', value: 1, unit: '°C'},
{label: 'Состояние ПЧ1', value: 1, unit: ''},
{label: 'Состояние ПЧ2', value: 1, unit: ''},
],
captionValue: 'У-У-У-у-у-у',
custom: 'Я не понял про это'
},
{
id: '17',
title: 'Теплогенератор',
placeHolderId: '17',
state: 1,
equipmentTimers: [
{label: 'Полная наработка', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка вне р/р', value: 1, unit: 'ч'},
{label: 'Периодичность ТО1', value: 1, unit: 'ч'},
{label: 'Периодичность ТО2', value: 1, unit: 'ч'},
],
equipmentSensors: [
{label: 'Скорость вращения', value: 1, unit: 'Об/мин'},
{label: 'Крутящий момент', value: 1, unit: 'кН*м'},
{label: 'Общий уровень вибрации', value: 1, unit: 'мм/с'},
{label: 'Уровень масла в баке', value: 1, unit: 'м'},
{label: 'Т верхнего подшипника', value: 1, unit: '°C'},
{label: 'Т нижнего подшипника', value: 1, unit: '°C'},
{label: 'Состояние ПЧ1', value: 1, unit: ''},
{label: 'Состояние ПЧ2', value: 1, unit: ''},
],
captionValue: 'У-У-У-у-у-у',
custom: 'Я не понял про это'
},
{
id: '18',
title: 'Теплогенератор',
placeHolderId: '18',
state: 0,
equipmentTimers: [
{label: 'Полная наработка', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка вне р/р', value: 1, unit: 'ч'},
{label: 'Периодичность ТО1', value: 1, unit: 'ч'},
{label: 'Периодичность ТО2', value: 1, unit: 'ч'},
],
equipmentSensors: [
{label: 'Скорость вращения', value: 1, unit: 'Об/мин'},
{label: 'Крутящий момент', value: 1, unit: 'кН*м'},
{label: 'Общий уровень вибрации', value: 1, unit: 'мм/с'},
{label: 'Уровень масла в баке', value: 1, unit: 'м'},
{label: 'Т верхнего подшипника', value: 1, unit: '°C'},
{label: 'Т нижнего подшипника', value: 1, unit: '°C'},
{label: 'Состояние ПЧ1', value: 1, unit: ''},
{label: 'Состояние ПЧ2', value: 1, unit: ''},
],
captionValue: 'наработка',
custom: 'Я не понял про это'
},
{
id: '19',
title: 'Теплогенератор',
placeHolderId: '19',
state: 0,
equipmentTimers: [
{label: 'Полная наработка', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка вне р/р', value: 1, unit: 'ч'},
{label: 'Периодичность ТО1', value: 1, unit: 'ч'},
{label: 'Периодичность ТО2', value: 1, unit: 'ч'},
],
equipmentSensors: [
{label: 'Скорость вращения', value: 1, unit: 'Об/мин'},
{label: 'Крутящий момент', value: 1, unit: 'кН*м'},
{label: 'Общий уровень вибрации', value: 1, unit: 'мм/с'},
{label: 'Уровень масла в баке', value: 1, unit: 'м'},
{label: 'Т верхнего подшипника', value: 1, unit: '°C'},
{label: 'Т нижнего подшипника', value: 1, unit: '°C'},
{label: 'Состояние ПЧ1', value: 1, unit: ''},
{label: 'Состояние ПЧ2', value: 1, unit: ''},
],
captionValue: 'У-У-У-у-у-у',
custom: 'Я не понял про это'
},
{
id: '20',
title: 'Теплогенератор',
placeHolderId: '20',
state: 1,
equipmentTimers: [
{label: 'Полная наработка', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка после ТО1', value: 1, unit: 'ч'},
{label: 'Наработка вне р/р', value: 1, unit: 'ч'},
{label: 'Периодичность ТО1', value: 1, unit: 'ч'},
{label: 'Периодичность ТО2', value: 1, unit: 'ч'},
],
equipmentSensors: [
{label: 'Скорость вращения', value: 1, unit: 'Об/мин'},
{label: 'Крутящий момент', value: 1, unit: 'кН*м'},
{label: 'Общий уровень вибрации', value: 1, unit: 'мм/с'},
{label: 'Уровень масла в баке', value: 1, unit: 'м'},
{label: 'Т верхнего подшипника', value: 1, unit: '°C'},
{label: 'Т нижнего подшипника', value: 1, unit: '°C'},
{label: 'Состояние ПЧ1', value: 1, unit: ''},
{label: 'Состояние ПЧ2', value: 1, unit: ''},
],
captionValue: 'У-У-У-у-у-у',
custom: 'Я не понял про это'
},
]
const SmboPlates = platesData.map((items) => (
<SmboPlate title={items.title} state={items.state} operatingTime={items.placeHolderId}>
<EquipmentDetails
id={items.id}
title={items.title}
placeHolderId={items.placeHolderId}
equipmentTimers={items.equipmentTimers}
equipmentSensors={items.equipmentSensors}
state={items.state}
captionValue={items.captionValue}/>
</SmboPlate>
)
)
export default function Smbo() {
return (
return (<>
<div className="smbo_container">
<div className="c1 r1 pointer"><SmboPlate title="Теплогенератор" state={1} operatingTime={2301}/></div>
<div className="c2 r1 pointer"><SmboPlate title="Емкости бурового раствора" state={1} operatingTime={2564}/></div>
<div className="c3 r1 pointer"><SmboPlate title="Подпорные насосы" state={1} operatingTime={1054}/></div>
<div className="c4 r1 pointer"><SmboPlate title="Буровой насос №1" state={1} operatingTime={1589}/></div>
<div className="c5 r1 pointer"><SmboPlate title="Буровой насос №2" state={0} operatingTime={1203}/></div>
<div className="c6 r1 pointer"><SmboPlate title="Талевый канат" state={1} operatingTime={1900} units='т·км'/>
</div>
<div className="c1 r2 pointer">
<SmboPlate title="Станция управления ВСП" state={1} operatingTime={75}>
<EquipmentDetails/>
</SmboPlate>
</div>
<div className="c2 r2 c rspan-7 cspan-4 center"><img src={RigPlan} width="1200" alt={RigPlan}/></div>
<div className="c6 r2 pointer"><SmboPlate title="Компрессорный блок" state={1} operatingTime={1161}/></div>
<div className="c1 r3 pointer"><SmboPlate title="Лебедка буровая" state={1} operatingTime={301}><img
src={HoistDummy}
width="700"/></SmboPlate>
</div>
<div className="c6 r3 pointer"><SmboPlate title="Блок сопротивлений и КТУ" state={1} operatingTime={23}/></div>
<div className="c1 r4 pointer"><SmboPlate title="Вспомогательная лебедка" state={0} operatingTime={41}/></div>
<div className="c6 r4 pointer"><SmboPlate title="Блок НКУ" state={3} operatingTime={1596}/></div>
<div className="c1 r5 pointer"><SmboPlate title="Гидрорасцепитель" state={1} operatingTime={6}/></div>
<div className="c6 r5 pointer"><SmboPlate title="Блок КРУ" state={0} operatingTime={1955}/></div>
<div className="c1 r6 pointer"><SmboPlate title="Привод ВСП" state={2} operatingTime={75}/></div>
<div className="c6 r6 pointer"><SmboPlate title="ДЭС / ДВС" state={1} operatingTime={7481}/></div>
<div className="c1 r7 pointer"><SmboPlate title="Буровой ключ" state={1} operatingTime={17}/></div>
<div className="c6 r7 pointer"><SmboPlate title="РВД" state={1} operatingTime={3005}/></div>
<div className="c1 r8 pointer"><SmboPlate title="Сито-гидро- циклонная установка" state={0} operatingTime={1589}/>
</div>
<div className="c6 r8 pointer"><SmboPlate title="Дефектоскоп" state={1} operatingTime={603}/></div>
<div className="c2 r8 ce6 center">
{SmboPlates}
<div className="c2 r5 ce6 center">
<ActiveMessagesOnline/>
</div>
</div>
)
</>)
}

12
src/styles/smbo.css
View File

@ -3,7 +3,7 @@
column-gap: 4px;
row-gap: 4px;
grid-template-columns: repeat(6, 1fr);
grid-template-rows: repeat(8, 1fr);
grid-template-rows: repeat(9, 1fr);
justify-items: stretch;
align-items: stretch;
}
@ -62,6 +62,7 @@
.c6{ grid-column-start: 6; }
.c7{ grid-column-start: 7; }
.c8{ grid-column-start: 8; }
.c8{ grid-column-start: 8; }
.r1{ grid-row-start: 1; }
.r2{ grid-row-start: 2; }
@ -103,3 +104,12 @@
.pointer {
cursor: pointer;
}
.container__example {
display: flex;
}
.block__example {
width: 250px;
height: 120px;
}