修改样式

ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/RoadAndEvents/index.vue

@@ -6,8 +6,8 @@
         {{ layer.title }}
       </div>
     </div>
-    <!-- <div class="tabs-content"> -->
+
-    <!-- <TransitionGroup name="fade-group" tag="div" class="absoluteBody"> -->
+    <!-- group -->
     <TransitionGroup name="fade-group" tag="div" class="tabs-content">
       <div class="device-item" v-for="(item, index) in tabContentData" :key="item.id" @click="handleDevice(item)"
         :style="getStart(index)">
@@ -20,10 +20,12 @@
         <span>{{ item.title }}</span>
       </div>
     </TransitionGroup>
-    <!-- </div> -->
+
-    <div class="cleared-btn" @click="handleCleared">
+    <div class="bottom">
-      <img src="@screen/images/icon/icon_006.png" />
+      <div class="cleared-btn" @click="handleCleared">
-      <span>清空图层</span>
+        <img src="@screen/images/icon/icon_006.png" />
+        <span>清空图层</span>
+      </div>
     </div>
 
     <!-- 摄像机设备 控制 弹窗  球机 可打开-->
@@ -88,8 +90,8 @@ export default {
 
       if (!mapIns) return;
 
-      mapIns.clearMap();
+      // mapIns.clearMap();
-      mapIns.getLayers().forEach((layer, index) => index && mapIns.remove(layer))
+      mapIns.getLayers().forEach((layer, index) => index > 1 && mapIns.remove(layer))
     },
 
     // 摄像机 可控 不可控 弹窗 回调
@@ -220,25 +222,30 @@ export default {
     }
   }
 
-  .cleared-btn {
+  .bottom {
-    // position: absolute;
-    cursor: pointer;
-    width: 98px;
-    height: 31px;
-    border-radius: 20px;
-    border: 1px solid #25d8ff;
-    font-size: 12px;
-    font-family: PingFang SC, PingFang SC;
-    font-weight: 500;
-    color: #ffffff;
     display: flex;
-    align-items: center;
+    justify-content: end;
 
-    img {
+    .cleared-btn {
-      width: 16px;
+      // position: absolute;
-      height: 16px;
+      cursor: pointer;
-      display: inline-block;
+      width: 98px;
-      margin: 0 10px;
+      height: 31px;
+      border-radius: 20px;
+      border: 1px solid #25d8ff;
+      font-size: 12px;
+      font-family: PingFang SC, PingFang SC;
+      font-weight: 500;
+      color: #ffffff;
+      display: flex;
+      align-items: center;
+
+      img {
+        width: 16px;
+        height: 16px;
+        display: inline-block;
+        margin: 0 10px;
+      }
     }
   }
 }