From 4a8f81592c56046f5fb7be02784d9cc401a3d1eb Mon Sep 17 00:00:00 2001
From: Melete <ugog@qq.com>
Date: Sat, 4 Nov 2023 16:51:22 +0800
Subject: [PATCH] =?UTF-8?q?update=20=E7=AA=91=E7=82=89=E5=86=85=E9=83=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/公共组件/时间火向数据/1        |  1 -
 .../LeftBoxes => 公共组件/时间火向数据}/index.jsx |  2 +-
 .../时间火向数据}/leftbox.module.less         |  2 +-
 .../模块组件/总览/CenterTop/index.jsx         |  2 +-
 .../模块组件/窑炉内部/Center/index.jsx        | 82 +++++++++++++++++++
 5 files changed, 85 insertions(+), 4 deletions(-)
 delete mode 100644 src/components/公共组件/时间火向数据/1
 rename src/components/{模块组件/总览/CenterTop/LeftBoxes => 公共组件/时间火向数据}/index.jsx (97%)
 rename src/components/{模块组件/总览/CenterTop/LeftBoxes => 公共组件/时间火向数据}/leftbox.module.less (88%)

diff --git a/src/components/公共组件/时间火向数据/1 b/src/components/公共组件/时间火向数据/1
deleted file mode 100644
index 56a6051..0000000
--- a/src/components/公共组件/时间火向数据/1
+++ /dev/null
@@ -1 +0,0 @@
-1
\ No newline at end of file
diff --git a/src/components/模块组件/总览/CenterTop/LeftBoxes/index.jsx b/src/components/公共组件/时间火向数据/index.jsx
similarity index 97%
rename from src/components/模块组件/总览/CenterTop/LeftBoxes/index.jsx
rename to src/components/公共组件/时间火向数据/index.jsx
index be59860..6416531 100644
--- a/src/components/模块组件/总览/CenterTop/LeftBoxes/index.jsx
+++ b/src/components/公共组件/时间火向数据/index.jsx
@@ -1,5 +1,5 @@
 import React, { useState, useContext, useEffect } from 'react';
-import SocketContext from '../../../../../store/socket-data-provider';
+import SocketContext from '../../../store/socket-data-provider';
 import icon1 from '@/assets/CenterChart2icon1.svg';
 import icon2 from '@/assets/CenterChart2icon2.svg';
 import icon3 from '@/assets/CenterChart2icon3.svg';
diff --git a/src/components/模块组件/总览/CenterTop/LeftBoxes/leftbox.module.less b/src/components/公共组件/时间火向数据/leftbox.module.less
similarity index 88%
rename from src/components/模块组件/总览/CenterTop/LeftBoxes/leftbox.module.less
rename to src/components/公共组件/时间火向数据/leftbox.module.less
index 2109735..6e8cfcc 100644
--- a/src/components/模块组件/总览/CenterTop/LeftBoxes/leftbox.module.less
+++ b/src/components/公共组件/时间火向数据/leftbox.module.less
@@ -6,7 +6,7 @@
 		margin-right: 16px;
 		width: 200px;
 		padding: 8px;
-		background: url(../../../../../assets/CenterChart2ItemBg.png);
+		background: url(../../../assets/CenterChart2ItemBg.png);
 		background-repeat: no-repeat;
 		background-size: 100% 100%;
 		display: flex;
diff --git a/src/components/模块组件/总览/CenterTop/index.jsx b/src/components/模块组件/总览/CenterTop/index.jsx
index 6803f2a..ddc652e 100644
--- a/src/components/模块组件/总览/CenterTop/index.jsx
+++ b/src/components/模块组件/总览/CenterTop/index.jsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import Item2 from './RightTable';
-import Item1 from './LeftBoxes';
+import Item1 from '../../../公共组件/时间火向数据';
 
 import cls from './index.module.less';
 
diff --git a/src/components/模块组件/窑炉内部/Center/index.jsx b/src/components/模块组件/窑炉内部/Center/index.jsx
index b063a3b..14255ab 100644
--- a/src/components/模块组件/窑炉内部/Center/index.jsx
+++ b/src/components/模块组件/窑炉内部/Center/index.jsx
@@ -1,5 +1,6 @@
 import { useRef, useState } from 'react';
 import cls from './index.module.css';
+import Chart2 from '../../../公共组件/时间火向数据';
 
 function KilnCenter() {
 	const videoRef = useRef(null);
@@ -20,6 +21,19 @@ function KilnCenter() {
 		}
 	}
 
+	const data = [
+		{ name: 'TE271', value: 163.3 },
+		{ name: 'TE271', value: 163.3 },
+		{ name: 'TE271', value: 163.3 },
+		{ name: 'TE271', value: 163.3 },
+		{ name: 'TE271', value: 163.3 },
+		{ name: 'TE271', value: 163.3 },
+		{ name: 'TE271', value: 163.3 },
+		{ name: 'TE271', value: 163.3 },
+		{ name: 'TE271', value: 163.3 },
+		{ name: 'TE271', value: 163.3 },
+	];
+
 	return (
 		<div
 			className="bgKilnInner"
@@ -31,6 +45,15 @@ function KilnCenter() {
 				flexDirection: 'column',
 			}}
 		>
+			{/* 时间火向数据 */}
+			<div
+				className="fireAndTime"
+				style={{ position: 'absolute', top: '-112px', height: '212px' }}
+			>
+				<Chart2 />
+			</div>
+
+			{/* menu  */}
 			<div
 				className="subMenu"
 				style={{
@@ -63,6 +86,7 @@ function KilnCenter() {
 				</div>
 			</div>
 
+			{/* video  */}
 			<div
 				className="video-wrapper"
 				style={{
@@ -80,6 +104,64 @@ function KilnCenter() {
 					ref={videoRef}
 				></video>
 			</div>
+
+			{/* left side  */}
+			<div
+				className="leftSide"
+				style={{
+					position: 'absolute',
+					left: '88px',
+					top: '24%',
+					display: 'grid',
+					gridTemplateColumns: '100px 100px',
+					gap: '20px 18px',
+					gridAutoRows: '64px',
+				}}
+			>
+				{data.map((item) => (
+					<div
+						className="leftSideItem"
+						style={{
+							background: '#fff3',
+							display: 'flex',
+							flexDirection: 'column',
+							alignItems: 'center',
+							justifyContent: 'center',
+							background: '#32535d',
+						}}
+					>
+						<span style={{ fontSize: '18px', lineHeight: 1, color: '#2EE4E6' }}>
+							{item.name}
+						</span>
+						<span
+							style={{ fontSize: '24px', lineHeight: '32px', color: '#fff' }}
+						>
+							{item.value} ℃
+						</span>
+					</div>
+				))}
+			</div>
+
+			<div
+				className="toolbox"
+				style={{
+					position: 'absolute',
+					bottom: '32px',
+					left: '64px',
+					display: 'flex',
+					alignItems: 'center',
+					gap: '24px',
+				}}
+			>
+				<div
+					className="tlj tlj1"
+					style={{ background: '#ccc', width: '200px', height: '100px' }}
+				></div>
+				<div
+					className="tlj tlj2"
+					style={{ background: '#ccc', width: '200px', height: '100px' }}
+				></div>
+			</div>
 		</div>
 	);
 }