diff --git a/package.json b/package.json index 576e207..0cbd60b 100644 --- a/package.json +++ b/package.json @@ -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", diff --git a/src/components/CementFluid.jsx b/src/components/CementFluid.jsx new file mode 100644 index 0000000..e69de29 diff --git a/src/components/Documents.jsx b/src/components/Documents.jsx index a29a7dc..f6f10b8 100644 --- a/src/components/Documents.jsx +++ b/src/components/Documents.jsx @@ -13,8 +13,8 @@ const pageSize = 12 const {RangePicker} = DatePicker; -export default function Documents({selectedFileCategory}) { - let {id} = useParams() +export default function Documents({idWell, selectedFileCategory}) { + // let {id} = useParams() const [page, setPage] = useState(1) const [range, setRange] = useState([]) @@ -32,7 +32,7 @@ export default function Documents({selectedFileCategory}) { try { setLoader(true) - await fetch(`/api/files/${id}/${row.id}`, { + await fetch(`/api/files/${idWell}/${row.id}`, { headers: { Authorization: 'Bearer ' + localStorage['token'] } @@ -101,7 +101,7 @@ export default function Documents({selectedFileCategory}) { } await FileService.getFilesInfo( - `${id}`, + `${idWell}`, (page - 1) * pageSize, pageSize, selectedFileCategory, @@ -126,12 +126,12 @@ export default function Documents({selectedFileCategory}) { } ) } catch (ex) { - notify(`Не удалось загрузить файлы по скважине "${id}"`, 'error') + notify(`Не удалось загрузить файлы по скважине "${idWell}"`, 'error') console.log(ex) } } GetDocuments() - }, [id, range, page, selectedFileCategory, isTableUpdating]) + }, [idWell, range, page, selectedFileCategory, isTableUpdating]) return (
diff --git a/src/components/MessageFilter.jsx b/src/components/MessageFilter.jsx new file mode 100644 index 0000000..7b326d8 --- /dev/null +++ b/src/components/MessageFilter.jsx @@ -0,0 +1,35 @@ +import React, { useMemo, useState } from "react"; + +export default function MessageFilter() { + return ( +
+ +
+ ) +} + +function List({ words }) { + const [searchString, setSearchString] = useState("") + + function handleChange(e) { + setSearchString(e.target.value) + } + + const filteredWords = useMemo(() => { + if (!searchString) { + return words + } + return words.filter((w) => w.includes(searchString)) + }, [searchString, words]) + + return ( + <> + + + + ) +} \ No newline at end of file diff --git a/src/components/Nnb.jsx b/src/components/Nnb.jsx new file mode 100644 index 0000000..e69de29 diff --git a/src/components/SludgeDiagram.jsx b/src/components/SludgeDiagram.jsx new file mode 100644 index 0000000..f423d83 --- /dev/null +++ b/src/components/SludgeDiagram.jsx @@ -0,0 +1,350 @@ +import { useState } from 'react'; +import {Table, Input, Form, Popconfirm, Typography } from 'antd' + +const originData = [ + { + key: '1', probeNumber: '', probeExtractionDepth: '', sandstone: '', siltstone: '', argillit: '', brokenArgillit: '', coal: '', sand: '', clay: '', + camstone: '', cement: '', summary: '', drillingMud: '', sludge: '', maxSum: '', methan: '', ethan: '', propan: '', butan: '', pentan: '' + } +] + +const EditableCell = ({ + editing, + dataIndex, + title, + inputType, + record, + index, + children, + ...restProps +}) => { + return ( + +
+ {editing ? ( + + + + ) : ( + children + )} +
+ + ); +}; + +export function SludgeDiagram() { + const [form] = Form.useForm(); + const [data, setData] = useState(originData); + const [editingKey, setEditingKey] = useState(''); + + const isEditing = (row) => row.key === editingKey; + + const columns = [ + { + title: 'N пробы', + key: 'probeNumber', + dataIndex: 'probeNumber', + align: 'center', + className: 'yellow-background', + editable: true + }, + { + title: 'Глубина отбора пробы', + key: 'probeExtractionDepth', + dataIndex: 'probeExtractionDepth', + align: 'center', + className: 'yellow-background', + editable: true + }, + { + title: 'Литология', + key: 'lithology', + dataIndex: 'lithology', + align: 'center', + className: 'yellow-background', + editable: true, + children: [ + { + title: 'Песчаник (%)', + key: 'sandstone', + dataIndex: 'sandstone', + align: 'center', + className: 'lightpurple-background', + editable: true + }, + { + title: 'Алевролит (%)', + key: 'siltstone', + dataIndex: 'siltstone', + align: 'center', + className: 'lightpurple-background', + editable: true + }, + { + title: 'Аргиллит (%)', + key: 'argillit', + dataIndex: 'argillit', + align: 'center', + className: 'lightpurple-background', + editable: true + }, + { + title: 'Аргиллит бит. (%)', + key: 'brokenArgillit', + dataIndex: 'verticalDepth', + align: 'center', + className: 'lightpurple-background', + editable: true + }, + { + title: 'Уголь (%)', + key: 'coal', + dataIndex: 'coal', + align: 'center', + className: 'lightpurple-background', + editable: true + }, + { + title: 'Песок (%)', + key: 'sand', + dataIndex: 'sand', + align: 'center', + className: 'lightpurple-background', + editable: true + }, + { + title: 'Глина (%)', + key: 'clay', + dataIndex: 'clay', + align: 'center', + className: 'lightpurple-background', + editable: true + }, + { + title: 'Известняк (%)', + key: 'camstone', + dataIndex: 'camstone', + align: 'center', + className: 'lightpurple-background', + editable: true + }, + { + title: 'Цемент (%)', + key: 'cement', + dataIndex: 'cement', + align: 'center', + className: 'lightpurple-background', + editable: true + } + ] + }, + + { + title: 'Краткое описание', + key: 'summary', + dataIndex: 'summary', + align: 'center', + className: 'yellow-background', + editable: true + }, + { + title: 'ЛБА бурового раствора', + key: 'drillingMud', + dataIndex: 'drillingMud', + align: 'center', + className: 'lightgray-background', + editable: true + }, + { + title: 'ЛБА (шлама)', + key: 'sludge', + dataIndex: 'sludge', + align: 'center', + className: 'lightorange-background', + editable: true + }, + { + title: 'Газопоказания', + key: 'gasIndications', + dataIndex: 'gasIndications', + align: 'center', + className: 'yellow-background', + children: [ + { + title: 'Сумма УВ мах. (абс%)', + key: 'maxSum', + dataIndex: 'maxSum', + align: 'center', + className: 'lightpurple-background', + editable: true + }, + { + title: 'С1 метан (отн%)', + key: 'methane', + dataIndex: 'depthPlanFactDifference', + align: 'center', + className: 'lightpurple-background', + editable: true + }, + { + title: 'С2 этан (отн%)', + key: 'ethan', + dataIndex: 'ethan', + align: 'center', + className: 'lightpurple-background', + editable: true + }, + { + title: 'С3 пропан (отн%)', + key: 'propane', + dataIndex: 'propane', + align: 'center', + className: 'lightpurple-background', + editable: true + }, + { + title: 'С4 бутан (отн%)', + key: 'butane', + dataIndex: 'butane', + align: 'center', + className: 'lightpurple-background', + editable: true + }, + { + title: 'С5 пентан (отн%)', + key: 'pentane', + dataIndex: 'pentane', + align: 'center', + className: 'lightpurple-background', + editable: true + } + ] + }, + { + title: 'Мех. скорость', + key: 'mechanicalSpeed', + dataIndex: 'mechanicalSpeed', + align: 'center', + className: 'yellow-background', + editable: true + }, + { + title: 'Предварительное заключение о насыщении по ГК', + key: 'preliminaryConclusion', + dataIndex: 'preliminaryConclusion', + align: 'center', + className: 'lightorange-background', + editable: true + }, + { + title: 'Действие', + dataIndex: 'action', + align: 'center', + width: 150, + className: 'small-font', + render: (_, row) => { + const editable = isEditing(row); + return editable ? ( + + save(row.key)} + style={{ marginRight: 8 }} + > + Сохранить + + Отменить
редактирование?} onConfirm={cancel}> + Отменить + + + ) : ( + edit(row)}> + Редактировать + + ); + }, + } + ]; + + const mapColumns = (col) => { + if(col.children) + col.children = col.children.map(mapColumns) + + if (!col.editable) { + return col; + } + + return { + ...col, + onCell: (row) => ({ + row, + dataIndex: col.dataIndex, + title: col.title, + editing: isEditing(row) + }), + }; + } + + const mergedColumns = columns.map(mapColumns); + + const edit = (row) => { + form.setFieldsValue({ + ...row + }); + setEditingKey(row.key); + }; + + const cancel = () => { + setEditingKey(''); + }; + + const save = async (key) => { + try { + const row = await form.validateFields(); + const newData = [...data]; + const index = newData.findIndex((item) => key === item.key); + + if (index > -1) { + const item = newData[index]; + newData.splice(index, 1, { ...item, ...row }); + setData(newData); + setEditingKey(''); + } else { + newData.push(row); + setData(newData); + setEditingKey(''); + } + } catch (errInfo) { + console.log('Validate Failed:', errInfo); + } + }; + + return (<> +
+ + + + ) +} \ No newline at end of file diff --git a/src/components/SmboPlate.jsx b/src/components/SmboPlate.jsx new file mode 100644 index 0000000..89643ae --- /dev/null +++ b/src/components/SmboPlate.jsx @@ -0,0 +1,65 @@ +import {Modal} from 'antd' +import '../styles/smbo.css' + +import {useState} from "react"; + +export const SquareIndicator = ({state}) =>{ + let bgColor = "#AAA" + switch (state){ + case 1: + bgColor = "#1B1" + break; + case 2: + bgColor = "#DD1" + break; + case 3: + bgColor = "#D11" + break; + } + return ( + + ) +} + +export default function SmboPlate({title, state, operatingTime, units, children, captionValue}){ + const [isModalVisible, setIsModalVisible] = useState(false) + + + const openModal = () => { + setIsModalVisible(!!children) + } + + const closeModal = () => { + setIsModalVisible(false) + } + + const plates_smbo_equip = ( +
+
{title}
+
+ +
наработка: {captionValue}
+
{operatingTime}
+
{units??'ч'}
+
+ ) + + return(<> + {plates_smbo_equip} + + +
+ {children} +
+ + ) +} \ No newline at end of file diff --git a/src/components/modalWindows/EquipmentDetails.jsx b/src/components/modalWindows/EquipmentDetails.jsx new file mode 100644 index 0000000..c0e7946 --- /dev/null +++ b/src/components/modalWindows/EquipmentDetails.jsx @@ -0,0 +1,37 @@ +import {Row, Col} from 'antd' +import '../../styles/equipment_details.css' +import Documents from '../Documents' + +export default function EquipmentDetails({id, equipmentTimers, equipmentSensors}) { + let stateOfEquipmentDetails = equipmentTimers.map(timer => { + return( +

{timer.label}: {timer.value} {timer.unit}

+ ) + }) + + let indicatorsOfEquipmentDetail = equipmentSensors.map(sensor => { + return( +

{sensor.label}: {sensor.value} {sensor.unit}

+ ) + }) + + return (<> + + + Тест 1 + + + {stateOfEquipmentDetails} + + +
+ + + + + + {indicatorsOfEquipmentDetail} + + + ) +} diff --git a/src/concept/dragNDrop/Draggable.jsx b/src/concept/dragNDrop/Draggable.jsx new file mode 100644 index 0000000..76eaa5b --- /dev/null +++ b/src/concept/dragNDrop/Draggable.jsx @@ -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 ( + + ); +} \ No newline at end of file diff --git a/src/concept/dragNDrop/Droppable.jsx b/src/concept/dragNDrop/Droppable.jsx new file mode 100644 index 0000000..7a2ad46 --- /dev/null +++ b/src/concept/dragNDrop/Droppable.jsx @@ -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 ( +
+ {props.children} +
+ ); +} \ No newline at end of file diff --git a/src/images/smbo/RigPlan2.png b/src/images/smbo/RigPlan2.png new file mode 100644 index 0000000..03069a1 Binary files /dev/null and b/src/images/smbo/RigPlan2.png differ diff --git a/src/images/smbo/TopDrive_Dummy.png b/src/images/smbo/TopDrive_Dummy.png new file mode 100644 index 0000000..3d4d611 Binary files /dev/null and b/src/images/smbo/TopDrive_Dummy.png differ diff --git a/src/pages/Messages.jsx b/src/pages/Messages.jsx index 804ffd4..bec750f 100644 --- a/src/pages/Messages.jsx +++ b/src/pages/Messages.jsx @@ -1,6 +1,6 @@ import {Table, Select, DatePicker, ConfigProvider, Input} from 'antd'; import {MessageService} from '../services/api' -import React, {useState, useEffect, useMemo} from 'react' +import {useState, useEffect} from 'react' import {useParams} from 'react-router-dom' import LoaderPortal from '../components/LoaderPortal' import '../styles/message.css' @@ -53,7 +53,6 @@ const filterOptions = [ {label: 'Информация', value: 3}, ] - // Данные для таблицы export default function Messages() { let {id} = useParams() @@ -79,7 +78,7 @@ export default function Messages() { } setSearchString(message) } - + useEffect(() => { const GetMessages = async () => { setLoader(true) diff --git a/src/pages/Smbo.jsx b/src/pages/Smbo.jsx new file mode 100644 index 0000000..e6c91f3 --- /dev/null +++ b/src/pages/Smbo.jsx @@ -0,0 +1,616 @@ +import SmboPlate from '../components/SmboPlate' +import '../styles/smbo.css' +import EquipmentDetails from '../components/modalWindows/EquipmentDetails' +import ActiveMessagesOnline from "../components/ActiveMessagesOnline" +// import RigPlan from "../images/smbo/RigPlan2.png" + +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: 'Я не понял про это', + className: 'c1 r1' + }, + // { + // id: 2, + // title: 'Емкости бурового раствора', + // placeHolderId: 2, + // 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: 'Я не понял про это', + // className: 'c2 r1' + // }, + { + 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: 'Я не понял про это', + className: 'c3 r1' + }, + { + 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: 'Я не понял про это', + className: 'c4 r1' + }, + { + 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: 'Я не понял про это', + className: 'c5 r1' + }, + { + 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: 'Я не понял про это', + className: 'c6 r1' + }, + { + 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: 'Я не понял про это', + className: 'c1 r2' + }, + { + 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: 'Я не понял про это', + className: 'c6 r2' + }, + { + 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: 'Я не понял про это', + className: 'c1 r3' + }, + { + 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: 'Я не понял про это', + className: 'c6 r3' + }, + { + 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: 'Я не понял про это', + className: 'c1 r4' + }, + { + 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: 'Я не понял про это', + className: 'c6 r4' + }, + { + 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: 'Я не понял про это', + className: 'c1 r5' + }, + { + 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: 'Я не понял про это', + className: 'c6 r5' + }, + { + 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: 'Я не понял про это', + className: 'c1 r6' + }, + { + 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: 'Я не понял про это', + className: 'c6 r6' + }, + { + 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: 'Я не понял про это', + className: 'c1 r7' + }, + { + 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: 'Я не понял про это', + className: 'c6 r7' + }, + { + 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: 'Я не понял про это', + className: 'c1 r8' + }, + { + 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: 'Я не понял про это', + className: 'c6 r8' + }, +] + +const placeholderIdDictionary = { + 1: {gridRowStart: 8, gridColumnStart: 1}, + 2: {gridRowStart: 7, gridColumnStart: 1}, + 3: {gridRowStart: 6, gridColumnStart: 1}, + 4: {gridRowStart: 5, gridColumnStart: 1}, + 5: {gridRowStart: 4, gridColumnStart: 1}, + 6: {gridRowStart: 3, gridColumnStart: 1}, + 7: {gridRowStart: 2, gridColumnStart: 1}, + 8: {gridRowStart: 1, gridColumnStart: 1}, + 9: {gridRowStart: 1, gridColumnStart: 2}, + 10: {gridRowStart: 1, gridColumnStart: 3}, + 11: {gridRowStart: 1, gridColumnStart: 4}, + 12: {gridRowStart: 1, gridColumnStart: 5}, + 13: {gridRowStart: 1, gridColumnStart: 6}, + 14: {gridRowStart: 2, gridColumnStart: 6}, + 15: {gridRowStart: 3, gridColumnStart: 6}, + 16: {gridRowStart: 4, gridColumnStart: 6}, + 17: {gridRowStart: 5, gridColumnStart: 6}, + 18: {gridRowStart: 6, gridColumnStart: 6}, + 19: {gridRowStart: 7, gridColumnStart: 6}, + 20: {gridRowStart: 8, gridColumnStart: 6}, +} + +const plates = [] + +for (let i = 1; i < 21; i++) { + const item = platesData.filter(item => item.placeHolderId === i)[0] + const plate = item ? ( +
+ + + +
+ ) : ( +
{i}
+ ) + plates.push(plate) +} + +export default function Smbo() { + + return (<> +
+ {plates} + {/*
*/} + {/* План*/} + {/*
*/} +
+ +
+ +
+ ) +} \ No newline at end of file diff --git a/src/pages/Well.jsx b/src/pages/Well.jsx index ead68d1..588fb09 100644 --- a/src/pages/Well.jsx +++ b/src/pages/Well.jsx @@ -9,6 +9,7 @@ import WellAnalysis from "../pages/WellAnalysis"; import TelemetryView from "../pages/TelemetryView"; import MenuDocuments from "../components/MenuDocuments"; import WellStat from "./WellStat" +import Smbo from "./Smbo" const { Content } = Layout @@ -77,6 +78,9 @@ export default function Well() { Последние данные + }> + СМБО + @@ -106,6 +110,9 @@ export default function Well() { + + + diff --git a/src/styles/equipment_details.css b/src/styles/equipment_details.css new file mode 100644 index 0000000..8ad648f --- /dev/null +++ b/src/styles/equipment_details.css @@ -0,0 +1,3 @@ +span.right-text { + float: right; +} \ No newline at end of file diff --git a/src/styles/smbo.css b/src/styles/smbo.css new file mode 100644 index 0000000..5f6e5aa --- /dev/null +++ b/src/styles/smbo.css @@ -0,0 +1,123 @@ +.smbo_container{ + display: grid; + column-gap: 4px; + row-gap: 4px; + grid-template-columns: repeat(6, 1fr); + grid-template-rows: repeat(9, 1fr); + justify-items: stretch; + align-items: stretch; +} + +.smbo_rig_plan{ + grid-column-start: 2; + grid-row-start: 2; +} + +.plate_container{ + background-color: #00000010; + display: grid; + grid-template-columns: 3fr 1fr; + grid-template-rows: auto; + padding: 6px; + margin: 4px; + height: 100%; + width: 100%; +} + +.plate_title{ + grid-column: 1 / span 2; + grid-row: 1 / 1; + font-weight: bold; +} + +.plate_state{ + grid-column: 3 / span 1; + grid-row: 1 / span 1; +} + +.plate_param{ + grid-row: 2 / span 1; +} + +.plate_param_title{ + grid-column: 1 / span 1; +} + +.plate_param_value{ + grid-column: 2 / span 1; + font-weight: bold; + place-self: start end; + margin-right: 4px; +} + +.plate_param_units{ + grid-column: 3 / span 1; +} + +.c1{ grid-column-start: 1; } +.c2{ grid-column-start: 2; } +.c3{ grid-column-start: 3; } +.c4{ grid-column-start: 4; } +.c5{ grid-column-start: 5; } +.c6{ grid-column-start: 6; } +.c7{ grid-column-start: 7; } +.c8{ grid-column-start: 8; } + +.r1{ grid-row-start: 1; } +.r2{ grid-row-start: 2; } +.r3{ grid-row-start: 3; } +.r4{ grid-row-start: 4; } +.r5{ grid-row-start: 5; } +.r6{ grid-row-start: 6; } +.r7{ grid-row-start: 7; } +.r8{ grid-row-start: 8; } + +.ce1{ grid-column-end: 1; } +.ce2{ grid-column-end: 2; } +.ce3{ grid-column-end: 3; } +.ce4{ grid-column-end: 4; } +.ce5{ grid-column-end: 5; } +.ce6{ grid-column-end: 6; } +.ce7{ grid-column-end: 7; } +.ce8{ grid-column-end: 8; } + +.re1{ grid-row-end: 1; } +.re2{ grid-row-end: 2; } +.re3{ grid-row-end: 3; } +.re4{ grid-row-end: 4; } +.re5{ grid-row-end: 5; } +.re6{ grid-row-end: 6; } +.re7{ grid-row-end: 7; } +.re8{ grid-row-end: 8; } + +.cspan-4{ grid-column-end: 4 start;} + +.rspan-6{ grid-row-end: 6 start;} + +.rspan-7{ grid-row-end: 7 start;} + +.center{ + place-self: center stretch; +} + +.pointer { + cursor: pointer; +} + +.container__example { + display: flex; +} + +.block__example { + width: 250px; + height: 120px; +} + +.empty_place { + background-color: #505050; + text-align: center; + color: silver; + font-size: 75px; + margin-top: 5px; + align-items: center; +} \ No newline at end of file