add 退火监测左边栏

src/components/Container.jsx

@@ -38,7 +38,7 @@ const Container = (props) => {
 	}
 
 	return (
-		<div className={`${cls.container} ${props.className}`}>
+		<div className={`${cls.container} ${props.className}`} style={props.style}>
 			<div className={cls.container__head}>
 				<img
 					src={icon.current}

src/components/公共组件/BottomItemBackground/index.jsx

@@ -7,6 +7,7 @@ function BottomBarItem(props) {
 			icon={props.icon}
 			title={props.title}
 			className={`${cls.bottomBarItem} ${props.className}`}
+			style={props.style}
 		>
 			{props.children}
 		</Container>

src/components/公共组件/助燃风流量/index.jsx

@@ -149,7 +149,12 @@ function GasI(props) {
 		}
 	}
 	return (
-		<BottomBarItem icon="pause" title="助燃风流量" className={cls.gas}>
+		<BottomBarItem
+			icon="pause"
+			title="助燃风流量"
+			className={cls.gas}
+			style={props.style}
+		>
 			<div className={cls.headWidget}>
 				<div className="flex items-center">
 					<Switch size="small" defaultChecked onChange={handleSwitchChange} />

src/components/公共组件/天然气流量/index.jsx

@@ -31,7 +31,12 @@ function GasII(props) {
 	}
 
 	return (
-		<BottomBarItem icon="pause" title="天然气流量" className={cls.gas}>
+		<BottomBarItem
+			icon="pause"
+			title="天然气流量"
+			className={`${cls.gas} ${props.className}`}
+			style={props.style}
+		>
 			{/* legend */}
 			<div className={cls.headWidget}>
 				<div className="flex items-center">

src/components/模块组件/窑炉内部/LeftSide/index.jsx

@@ -1,6 +1,8 @@
 import React from 'react';
 import Kiln from '../../../公共组件/窑炉信息/Kiln';
-import GoodProduction from '../../../公共组件/本日生产良品率/GoodProduction';
+import GasFlow from '../../../公共组件/天然气流量';
+import WindFlow from '../../../公共组件/助燃风流量';
+
 import { motion } from 'framer-motion';
 
 import cls from './index.module.less';
@@ -15,7 +17,8 @@ export default function index() {
 			transition={{ type: 'tween' }}
 		>
 			<Kiln />
-			<GoodProduction />
+			<GasFlow style={{ flex: 1, width: '100%', marginTop: '24px' }} />
+			<WindFlow style={{ flex: 1, width: '100%', marginTop: '24px' }} />
 		</motion.div>
 	);
 }

src/components/模块组件/退火监测/1

@@ -1 +0,0 @@
-1

src/components/模块组件/退火监测/LeftSide/index.jsx

@@ -0,0 +1,24 @@
+import React from 'react';
+import Kiln from '../../../公共组件/窑炉信息/Kiln';
+import GasFlow from '../../../公共组件/天然气流量';
+import WindFlow from '../../../公共组件/助燃风流量';
+
+import { motion } from 'framer-motion';
+
+import cls from './index.module.less';
+
+export default function index() {
+	return (
+		<motion.div
+			className={cls.leftBar}
+			initial={{ opacity: 0, position: 'absolute' }}
+			animate={{ opacity: 1, position: 'relative' }}
+			exit={{ opacity: 0, position: 'relative' }}
+			transition={{ type: 'tween' }}
+		>
+			<Kiln />
+			<GasFlow style={{ flex: 1, width: '100%', marginTop: '24px' }} />
+			<WindFlow style={{ flex: 1, width: '100%', marginTop: '24px' }} />
+		</motion.div>
+	);
+}

src/components/模块组件/退火监测/LeftSide/index.module.less

@@ -0,0 +1,9 @@
+.leftBar {
+	width: 625px;
+	height: 966px;
+	// margin-left: 40px;
+
+	display: flex;
+	flex-direction: column;
+	justify-content: space-between;
+}

src/pages/总览/index.jsx

@@ -3,6 +3,10 @@ import BottomBar from '../../components/模块组件/总览/Bottom';
 import RightBar from '../../components/模块组件/总览/RightSide';
 import CenterTopData from '../../components/模块组件/总览/CenterTop';
 import { AnimatePresence, motion } from 'framer-motion';
+
+import KilnInnerLeft from '../../components/模块组件/窑炉内部/LeftSide';
+import FireCheckLeft from '../../components/模块组件/退火监测/LeftSide';
+
 import V3DBG from '../../assets/V3DBG.png';
 
 const KilnTotalLeft = (props) => {
@@ -18,30 +22,6 @@ const KilnTotalLeft = (props) => {
 	);
 };
 
-const KilnInnerLeft = (props) => {
-	return (
-		<motion.div
-			initial={{ opacity: 0, position: 'absolute' }}
-			animate={{ opacity: 1, position: 'relative' }}
-			exit={{ opacity: 0, position: 'relative' }}
-			transition={{ type: 'tween' }}
-		>
-			窑炉内部侧边
-		</motion.div>
-	);
-};
-const FireCheckLeft = (props) => {
-	return (
-		<motion.div
-			initial={{ opacity: 0, position: 'absolute' }}
-			animate={{ opacity: 1, position: 'relative' }}
-			exit={{ opacity: 0, position: 'relative' }}
-			transition={{ type: 'tween' }}
-		>
-			退火监测
-		</motion.div>
-	);
-};
 const QualityCheckLeft = (props) => {
 	return (
 		<motion.div