From fed41b2fd390ae729c05f63fcbc9f5e93cfd8f71 Mon Sep 17 00:00:00 2001
From: fuliqi <fuliqi@qq.com>
Date: 星期五, 19 四月 2024 15:56:03 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/master'

---
 src/views/screen/components/screen-wrapper/index.vue |   32 +++++++++++++++++++++++++-------
 1 files changed, 25 insertions(+), 7 deletions(-)

diff --git a/src/views/screen/components/screen-wrapper/index.vue b/src/views/screen/components/screen-wrapper/index.vue
index b2dac5e..b80e0e0 100644
--- a/src/views/screen/components/screen-wrapper/index.vue
+++ b/src/views/screen/components/screen-wrapper/index.vue
@@ -5,13 +5,14 @@
       杩斿洖
     </div>
     <div class="wrapper-content">
+      <screen-map-three :loadEnd="isEnd"></screen-map-three>
       <div class="left-container wrapper">
         <screen-face class="enter-left" :class="{ 'animate-enter-x': isEnd }"></screen-face>
         <screen-car class="enter-left animate-delay-1" :class="{ 'animate-enter-x': isEnd }"></screen-car>
         <screen-video class="enter-left animate-delay-2" :class="{ 'animate-enter-x': isEnd }"></screen-video>
       </div>
       <div class="center-container center-wrapper">
-        <screen-map></screen-map>
+        <screen-map-cover></screen-map-cover>
         <screen-table class="enter-top" :class="{ 'animate-enter-y': isEnd }"></screen-table>
         <!-- <screen-detection></screen-detection> -->
 
@@ -30,16 +31,19 @@
 import ScreenFace from '../screen-face/index';
 import ScreenVideo from '../screen-video/index';
 import ScreenCar from '../screen-car/index';
-import ScreenMap from '../screen-map/index';
+import ScreenMapCover from '../screen-map-cover/index';
 import ScreenTable from '../screen-table/index';
+import ScreenMapThree from '../screen-map-three/index';
 import ScreenData from '../screen-data/index';
+
 export default {
   name: 'ScreenWrapper',
   components: {
     SelectItem,
     ScreenExamine,
-    ScreenMap,
     ScreenTable,
+    ScreenMapCover,
+    ScreenMapThree,
     ScreenFace,
     ScreenVideo,
     ScreenCar,
@@ -47,7 +51,7 @@
   },
   data() {
     return {
-      isEnd: false
+      isEnd: false,
     }
   },
   methods: {
@@ -65,7 +69,7 @@
     const container = document.querySelector('.screen-wrapper');
     container.addEventListener('transitionend', this.checkAnimationEnd);
   },
-  destroyed() {
+  beforDestroy() {
     const container = document.querySelector('.screen-wrapper');
     container.removeEventListener('transitionend', this.checkAnimationEnd);
   }
@@ -133,24 +137,30 @@
   flex-direction: column;
   justify-content: space-between;
 }
+
 .animate-enter-x {
   animation: enter-x 0.4s ease forwards;
 }
+
 .animate-enter-y {
   animation: enter-y 0.4s ease forwards;
 }
+
 .enter-left {
   transform: translateX(-100px);
   opacity: 0;
 }
+
 .enter-right {
   transform: translateX(100px);
   opacity: 0;
 }
+
 .enter-top {
   transform: translateY(100px);
   opacity: 0;
 }
+
 .animate-delay-1 {
   animation-delay: 0.1s;
 }
@@ -164,14 +174,22 @@
 }
 
 @keyframes enter-x {
-  100% {
+  from {
+    opacity: 0;
+  }
+
+  to {
     opacity: 1;
     transform: translateX(0);
   }
 }
 
 @keyframes enter-y {
-  100% {
+  from {
+    opacity: 0;
+  }
+
+  to {
     opacity: 1;
     transform: translateY(0);
   }

--
Gitblit v1.8.0