From 77536fca2be6bcb697d45c6159dbb0fe81963761 Mon Sep 17 00:00:00 2001
From: yyy <2605810609@qq.com>
Date: Tue, 1 Apr 2025 14:36:49 +0800
Subject: [PATCH] =?UTF-8?q?bug=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../realTimeMap/components/indexPage.vue      | 173 +++++++++---------
 src/views/mapPage/realTimeMap/index.vue       |  14 +-
 2 files changed, 96 insertions(+), 91 deletions(-)

diff --git a/src/views/mapPage/realTimeMap/components/indexPage.vue b/src/views/mapPage/realTimeMap/components/indexPage.vue
index 79d9b234..e816a339 100644
--- a/src/views/mapPage/realTimeMap/components/indexPage.vue
+++ b/src/views/mapPage/realTimeMap/components/indexPage.vue
@@ -247,6 +247,7 @@
       </div>
     </div>
   </div>
+
   <!-- 左下角图层 -->
   <div class="affix-container-left" :style="{ left: 25 + 'px' }" v-if="!isAllBoard">
     <div class="affix-container-left-box">
@@ -309,11 +310,11 @@
   <!-- 右下角的功能 -->
   <div class="affix-container-right" v-if="!isAllBoard">
     <!-- 拖拽 -->
-    <div class="affix-container-right-item" @click="changeIsDrag">
+    <div class="item" @click="changeIsDrag">
       <img src="@/assets/imgs/indexPage/编组 12.png" style="width: 100%; height: 100%" />
     </div>
     <!-- 放大 -->
-    <div class="affix-container-right-item">
+    <div class="item">
       <img
         src="@/assets/imgs/indexPage/编组 14.png"
         style="width: 100%; height: 100%"
@@ -321,7 +322,7 @@
       />
     </div>
     <!-- 缩小 -->
-    <div class="affix-container-right-item">
+    <div class="item">
       <img
         src="@/assets/imgs/indexPage/编组 15.png"
         style="width: 100%; height: 100%"
@@ -329,7 +330,7 @@
       />
     </div>
     <!-- 全屏 -->
-    <div class="affix-container-right-item">
+    <div class="item">
       <img
         src="@/assets/imgs/indexPage/编组 22.png"
         style="width: 100%; height: 100%"
@@ -1120,30 +1121,25 @@ onUnmounted(() => {
 .affix-container {
   width: 100%;
   position: relative;
-
-  .indexpage-container {
-    width: 100%;
-    position: relative;
-
-    .affix-container-top {
-      width: 100%;
-      height: 5rem;
-      background-color: #fff;
-      border-bottom: 0.0625rem solid #f5f5f5;
-    }
-  }
-
-  .indexpage-container-active {
-    width: 100%;
-    position: relative;
-    cursor: grab;
-  }
 }
-
+.indexpage-container {
+  width: 100%;
+  position: relative;
+}
+.indexpage-container-active {
+  width: 100%;
+  position: relative;
+  cursor: grab;
+}
 .indexpage-container-active:active {
   cursor: grabbing;
 }
-
+.indexpage-container .affix-container-top {
+  width: 100%;
+  height: 5rem;
+  background-color: #fff;
+  border-bottom: 0.0625rem solid #f5f5f5;
+}
 .indexpage-container-box-point {
   width: 100%;
   position: absolute;
@@ -1214,63 +1210,65 @@ onUnmounted(() => {
   position: absolute;
   bottom: 1.625rem;
   z-index: 999;
+
+  .affix-container-left-box {
+    width: 9rem;
+  }
+  .affix-container-left-box-item-box {
+    width: 100%;
+    border-bottom: 0.0625rem solid #eeeeee;
+    background: #ffffff;
+  }
+  .affix-container-left-box-item {
+    width: 100%;
+    padding: 0 1.125rem;
+    height: 2.625rem;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+  }
+  .affix-container-left-box-item-left {
+    font-family:
+      PingFangSC,
+      PingFang SC;
+    font-weight: 400;
+    font-size: 0.875rem;
+    color: rgba(0, 0, 0, 0.88);
+  }
+  .affix-container-left-box-item-img {
+    cursor: pointer;
+    flex-shrink: 0;
+    width: 1.25rem;
+    height: 0.75rem;
+  }
+  .affix-container-left-box-item-bottom {
+    width: 100%;
+    height: 2.25rem;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    cursor: pointer;
+    background: #ffffff;
+  }
+  .affix-container-left-box-item-bottom-img {
+    cursor: pointer;
+    flex-shrink: 0;
+    width: 0.75rem;
+    height: 0.4375rem;
+  }
+  .affix-container-left-box-item-bottom-left {
+    cursor: pointer;
+    flex-shrink: 0;
+    font-family:
+      PingFangSC,
+      PingFang SC;
+    font-weight: 400;
+    font-size: 1rem;
+    color: #98a4bf;
+    margin-right: 0.125rem;
+  }
 }
-.affix-container-left-box {
-  width: 9rem;
-}
-.affix-container-left-box-item-box {
-  width: 100%;
-  border-bottom: 0.0625rem solid #eeeeee;
-  background: #ffffff;
-}
-.affix-container-left-box-item {
-  width: 100%;
-  padding: 0 1.125rem;
-  height: 2.625rem;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-}
-.affix-container-left-box-item-left {
-  font-family:
-    PingFangSC,
-    PingFang SC;
-  font-weight: 400;
-  font-size: 0.875rem;
-  color: rgba(0, 0, 0, 0.88);
-}
-.affix-container-left-box-item-img {
-  cursor: pointer;
-  flex-shrink: 0;
-  width: 1.25rem;
-  height: 0.75rem;
-}
-.affix-container-left-box-item-bottom {
-  width: 100%;
-  height: 2.25rem;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  cursor: pointer;
-  background: #ffffff;
-}
-.affix-container-left-box-item-bottom-img {
-  cursor: pointer;
-  flex-shrink: 0;
-  width: 0.75rem;
-  height: 0.4375rem;
-}
-.affix-container-left-box-item-bottom-left {
-  cursor: pointer;
-  flex-shrink: 0;
-  font-family:
-    PingFangSC,
-    PingFang SC;
-  font-weight: 400;
-  font-size: 1rem;
-  color: #98a4bf;
-  margin-right: 0.125rem;
-}
+
 .affix-container-right {
   position: fixed;
   z-index: 999;
@@ -1279,12 +1277,13 @@ onUnmounted(() => {
   display: flex;
   align-items: center;
   justify-content: flex-end;
-}
-.affix-container-right-item {
-  width: 1.75rem;
-  height: 1.75rem;
-  cursor: pointer;
-  flex-shrink: 0;
-  margin-left: 0.5rem;
+
+  .item {
+    width: 1.75rem;
+    height: 1.75rem;
+    cursor: pointer;
+    flex-shrink: 0;
+    margin-left: 0.5rem;
+  }
 }
 </style>
diff --git a/src/views/mapPage/realTimeMap/index.vue b/src/views/mapPage/realTimeMap/index.vue
index 3128d978..1d50ff07 100644
--- a/src/views/mapPage/realTimeMap/index.vue
+++ b/src/views/mapPage/realTimeMap/index.vue
@@ -194,7 +194,10 @@ onMounted(() => {
 
 <style lang="scss" scoped>
 .page {
-  position: relative;
+  position: absolute;
+  width: 100%;
+  height: 100%;
+
   .top-div {
     display: flex;
     align-items: center;
@@ -202,6 +205,11 @@ onMounted(() => {
     height: 60px;
     box-shadow: rgba(0, 0, 0, 0.06) 0px 2px 3px;
     background-color: #fff;
+    position: absolute;
+    z-index: 999;
+    top: 0;
+    left: 0;
+    right: 0;
 
     .line {
       width: 1px;
@@ -215,9 +223,7 @@ onMounted(() => {
     width: 100%;
     overflow: auto;
     position: relative;
-    // width: 100%;
-    // overflow: auto;
-    // height: calc(100vh - 140px);
+    margin-top: 62px;
   }
 }
 </style>