update 退火监测

This commit is contained in:
lb 2023-11-03 17:08:15 +08:00
parent b7c2722aac
commit 9470880de4
4 changed files with 33 additions and 48 deletions

View File

@ -43,7 +43,15 @@ function GraphBase(props) {
const [showChart, setShowChart] = useState(true);
let dto = null;
const switchStyle = {};
if (props.switchPosition) {
props.switchPosition.forEach((item, index) => {
if (item != null) {
switchStyle[index == 0 ? 'top' : 'left'] = item + 'px';
}
});
}
if (dateOptions) {
dto = dateOptions.map((item) => (
<Radio.Button value={item} key={item} className="radio-group__item">
@ -75,7 +83,7 @@ function GraphBase(props) {
<div className={cls.graphBaseContent}>
{desc && <div className={cls.graphBaseDesc}>{desc}</div>}
{switchOptions && (
<div className={cls.graphBaseSwitch}>
<div className={cls.graphBaseSwitch} style={switchStyle}>
<Switch size="small" defaultChecked onChange={handleSwitchChange} />
{showChart && <span className={cls.switchLabel}>历史详情</span>}
{!showChart && <span className={cls.switchLabel}>实时流量</span>}
@ -96,7 +104,7 @@ function GraphBase(props) {
)}
{dateOptions && (
<Radio.Group
defaultValue="日"
defaultValue={dateOptions[0]}
buttonStyle="solid"
className={cls.graphBaseDate + ' ' + cls.radioGroup}
onChange={({ target }) => onDateChange(target.value)}

View File

@ -1,4 +1,5 @@
import BottomBarItem from '../BottomItemBackground';
import GraphBase from '../GraphBase';
import { Radio } from 'antd';
import cls from './index.module.css';
import { useState } from 'react';
@ -40,47 +41,20 @@ const SmallBox = (props) => {
};
function WindFrequence(props) {
const [dataSource, setDataSource] = useState('fan');
const [dataSource, setDataSource] = useState('风机');
function handleSourceChange(e) {
console.log('val', e.target.value);
if (e.target.value == 'fan') {
setDataSource('fan');
} else if (e.target.value == 'switcher') {
setDataSource('switcher');
} else if (e.target.value == 'heating') {
setDataSource('heating');
}
function handleSourceChange(v) {
console.log('val', v);
}
return (
<BottomBarItem
<GraphBase
icon="pause"
title="当前温度"
className={props.className}
style={props.style}
dateOptions={['风机', '风阀', '电加热']}
onDateChange={handleSourceChange}
size={['middle', 'long']}
>
<div className={cls.floatHead}>
<div className={cls.alignRight}>
<Radio.Group
defaultValue="fan"
buttonStyle="solid"
className={cls.radioGroup}
onChange={handleSourceChange}
>
<Radio.Button value="fan" className="radio-group__item">
风机
</Radio.Button>
<Radio.Button value="switcher" className="radio-group__item">
风阀
</Radio.Button>
<Radio.Button value="heating" className="radio-group__item">
电加热
</Radio.Button>
</Radio.Group>
</div>
</div>
<div className={cls.mainContent + ' ' + cls.grid}>
<SmallBox>
<h1 className={cls.areaName}>A1区板上</h1>
@ -157,7 +131,7 @@ function WindFrequence(props) {
</div>
</SmallBox>
</div>
</BottomBarItem>
</GraphBase>
);
}

View File

@ -162,15 +162,14 @@ function WindFrequence(props) {
}
}
return (
<GraphBase icon="kiln" title="风机运行频率" size={['middle', 'long']}>
<div className={cls.headWidget}>
<div className="flex items-center">
<Switch size="small" defaultChecked onChange={handleSwitchChange} />
{showChart && <span className={cls.switchLabel}>历史详情</span>}
{!showChart && <span className={cls.switchLabel}>实时流量</span>}
</div>
</div>
<GraphBase
icon="kiln"
title="风机运行频率"
size={['middle', 'long']}
switchOptions={true}
switchPosition={[null, 200]} // [top, left]
onSwitch={handleSwitchChange}
>
<div className={cls.chart}>
{showChart && (
<ReactECharts option={options} style={{ height: '100%' }} />

View File

@ -15,8 +15,12 @@ export default function index() {
exit={{ opacity: 0, position: 'relative' }}
transition={{ type: 'tween' }}
>
<CurrentTemp style={{ width: '100%' }} />
<WindFrequence style={{ flex: 1, marginTop: '24px', width: '100%' }} />
<div style={{ flex: 1 }}>
<CurrentTemp style={{ width: '100%' }} />
</div>
<div style={{ flex: 1, marginTop: '24px', width: '100%' }}>
<WindFrequence />
</div>
</motion.div>
);
}