xuchang-screen/src/components/LeftBar/Kiln.jsx
2023-09-10 20:35:29 +08:00

36 lines
1.2 KiB
JavaScript

import React from 'react';
import { useState, useEffect, useContext } from 'react';
import Container from '../Container';
import SocketContext from '../../store/socket-data-provider';
import cls from './kiln.module.less';
export default function Kiln() {
const ctx = useContext(SocketContext);
const infos = [
{ label: '窑炉压力', value: ctx.kilnInfo?.kilnPressure || '0Pa' },
{ label: '循环水温度', value: ctx.kilnInfo?.waterLoopTemperature || '0℃' },
{ label: '循环水流量', value: ctx.kilnInfo?.waterLoopFlow || '0㎡/h' },
{ label: '循环水压力', value: ctx.kilnInfo?.waterLoopPressure || '0Pa' },
{ label: '助燃风压力', value: ctx.kilnInfo?.windPressure || '0℃' },
{ label: '碹顶加权温度', value: ctx.kilnInfo?.topTemperature || '0℃' },
{
label: '压缩气压力',
value: ctx.kilnInfo?.gasPressure || '0Pa',
},
{ label: '融化加权温度', value: ctx.kilnInfo?.meltTemperature || '0℃' },
];
return (
<Container title="窑炉信息" icon="kiln" className={cls.leftBar__top}>
<div className={cls.leftBar__top__content}>
{infos.map((item) => (
<div key={item.label} className={cls.info__item}>
{item.label}: {item.value}
</div>
))}
</div>
</Container>
);
}