From 42b221c2fb99ad9a6c25e9993fa7fe40652e1b64 Mon Sep 17 00:00:00 2001
From: lb <liubin@znjszx.com>
Date: Tue, 7 Nov 2023 15:19:37 +0800
Subject: [PATCH] update kiln inner

---
 .../模块组件/窑炉内部/Center/index.jsx           |  2 +-
 .../模块组件/窑炉内部/Center/index.module.css    | 10 +++++-----
 .../Center/videoComponents/EnterToFloor1.jsx     | 15 +++++++++++++++
 .../窑炉内部/Center/videoComponents/Floor1To2.jsx | 16 ++++++++++++++++
 .../窑炉内部/Center/videoComponents/Floor2To1.jsx | 16 ++++++++++++++++
 5 files changed, 53 insertions(+), 6 deletions(-)

diff --git a/src/components/模块组件/窑炉内部/Center/index.jsx b/src/components/模块组件/窑炉内部/Center/index.jsx
index cf4ff19..bcaeccc 100644
--- a/src/components/模块组件/窑炉内部/Center/index.jsx
+++ b/src/components/模块组件/窑炉内部/Center/index.jsx
@@ -59,7 +59,7 @@ function KilnCenter() {
 			{/* video  */}
 			<VideoContainer onFloorUpdate={onFloorUpdate} floor={floor} />
 
-			<div className={cls.videoLayer2}></div>
+			{/* <div className={cls.videoLayer2}></div> */}
 
 			{/* left side  */}
 			{/* <div
diff --git a/src/components/模块组件/窑炉内部/Center/index.module.css b/src/components/模块组件/窑炉内部/Center/index.module.css
index d2b8ff7..14076c9 100644
--- a/src/components/模块组件/窑炉内部/Center/index.module.css
+++ b/src/components/模块组件/窑炉内部/Center/index.module.css
@@ -25,12 +25,12 @@
 }
 
 .videoLayer2 {
-	width: 2416px;
-	height: 689px;
+	width: 2440px;
+	height: 720px;
 	background: url(../../../../assets/video-layer-2.png) no-repeat;
 	background-size: 100% 100%;
 	background-position: 0 0;
-	position: absolute;
-	top: 152px;
-	left: 32px;
+	position: fixed;
+	top: 0;
+	left: 0;
 }
\ No newline at end of file
diff --git a/src/components/模块组件/窑炉内部/Center/videoComponents/EnterToFloor1.jsx b/src/components/模块组件/窑炉内部/Center/videoComponents/EnterToFloor1.jsx
index 9e54078..550532b 100644
--- a/src/components/模块组件/窑炉内部/Center/videoComponents/EnterToFloor1.jsx
+++ b/src/components/模块组件/窑炉内部/Center/videoComponents/EnterToFloor1.jsx
@@ -1,5 +1,6 @@
 import { motion, AnimatePresence } from 'framer-motion';
 import { useRef, useEffect, useMemo } from 'react';
+import cls from '../index.module.css';
 
 function EnterToFloorOne(props) {
 	const vd = useRef(null);
@@ -47,6 +48,20 @@ function EnterToFloorOne(props) {
 					<video ref={vd} muted width={'100%'}>
 						<source src="/video/floor1.webm" type="video/mp4" />
 					</video>
+
+					<motion.div
+						className={cls.videoLayer2}
+						key="eto1div"
+						style={{
+							top: '340px',
+							left: '690px',
+							height: '760px',
+						}}
+						animate={{
+							opacity: [0, 0, 0, 0.6, 1],
+							transition: { duration: 0.3, delay: 2 },
+						}}
+					></motion.div>
 				</motion.div>
 			)}
 		</AnimatePresence>
diff --git a/src/components/模块组件/窑炉内部/Center/videoComponents/Floor1To2.jsx b/src/components/模块组件/窑炉内部/Center/videoComponents/Floor1To2.jsx
index 30e51eb..007464c 100644
--- a/src/components/模块组件/窑炉内部/Center/videoComponents/Floor1To2.jsx
+++ b/src/components/模块组件/窑炉内部/Center/videoComponents/Floor1To2.jsx
@@ -1,5 +1,6 @@
 import { motion, AnimatePresence } from 'framer-motion';
 import { useRef, useEffect, useMemo } from 'react';
+import cls from '../index.module.css';
 
 function FloorOneToTwo(props) {
 	const vd = useRef(null);
@@ -29,6 +30,21 @@ function FloorOneToTwo(props) {
 					<video ref={vd} muted width={'100%'}>
 						<source src="/video/1to2.webm" type="video/mp4" />
 					</video>
+
+					<motion.div
+						className={cls.videoLayer2}
+						key="1to2div"
+						style={{
+							top: '360px',
+							left: '740px',
+							width: '2415px',
+							height: '690px',
+						}}
+						animate={{
+							opacity: [0, 0, 0, 0.6, 1],
+							transition: { duration: 0.3, delay: 2 },
+						}}
+					></motion.div>
 				</motion.div>
 			)}
 		</AnimatePresence>
diff --git a/src/components/模块组件/窑炉内部/Center/videoComponents/Floor2To1.jsx b/src/components/模块组件/窑炉内部/Center/videoComponents/Floor2To1.jsx
index c4996ba..17a54de 100644
--- a/src/components/模块组件/窑炉内部/Center/videoComponents/Floor2To1.jsx
+++ b/src/components/模块组件/窑炉内部/Center/videoComponents/Floor2To1.jsx
@@ -1,5 +1,6 @@
 import { motion, AnimatePresence } from 'framer-motion';
 import { useRef, useEffect, useMemo } from 'react';
+import cls from '../index.module.css';
 
 function FloorTwoToOne(props) {
 	const vd = useRef(null);
@@ -29,6 +30,21 @@ function FloorTwoToOne(props) {
 					<video ref={vd} muted width={'100%'}>
 						<source src="/video/2to1.webm" type="video/mp4" />
 					</video>
+
+					<motion.div
+						className={cls.videoLayer2}
+						key="eto1div"
+						style={{
+							top: '340px',
+							left: '690px',
+							height: '760px',
+							width: '2460px',
+						}}
+						animate={{
+							opacity: [0, 0, 0, 0.6, 1],
+							transition: { duration: 0.3, delay: 2 },
+						}}
+					></motion.div>
 				</motion.div>
 			)}
 		</AnimatePresence>