新增地图弹窗 bug修改

src/views/scenic/components/box-2.vue

@@ -139,7 +139,10 @@
     </div>
     <div class="flex mt-8">
       <div class="box-3 mr-8">
-        <Title1 title="交通信息" />
+		  <div class="look-box">
+			  <Title1 title="交通信息" />
+			  <div @click="hanldeLookMap" class="look-btn">查看详情</div>
+		  </div>
         <div class="count-box flex">
           <count-item
             v-for="(item, index) in scenicStore.trafficData.infoList"
@@ -270,7 +273,7 @@
               </div>
             </div>
             <div class="car-box mt-10">
-              <img class="icon" src="@/assets/images/icon-6.png" />
+              <img class="icon" src="@/assets/images/icon-7.png" />
               <div class="car-item pr-20">
                 <div class="label">运营船只</div>
                 <div class="value flex">
@@ -300,6 +303,7 @@
     :carList="scenicStore.carShipData.car.list"
     :shipList="scenicStore.carShipData.ship.list"
   />
+  <traMap :longitude="longitude" :latitude="latitude" v-model="traMapShow"></traMap>
 </template>
 
 <script setup>
@@ -317,6 +321,7 @@
   import age from './age'
   import jam from './jam'
   import BigMap from './big-map'
+  import traMap from './tra-map'
   import TrafficFlow from './traffic-flow'
 
   import { useMap } from '@/hooks/map'
@@ -329,7 +334,13 @@
   let scenicChange = null
   let carOverlays = ref([])
   let shipOverlays = ref([])
-
+  let traMapShow = ref(false)
+  //查看交通信息
+  let latitude = ref('')
+  let longitude = ref('')
+  const hanldeLookMap = ()=>{
+	  traMapShow.value = true
+  }
   const garageList = computed(() => {
     return scenicStore.stopCarData.headList
   })
@@ -437,6 +448,8 @@
 
   onMounted(() => {
     scenicChange = PubSub.subscribe('scenicChange', (msg, data) => {
+		latitude.value = data.lat
+		longitude.value = data.lng
       carOverlays.value = []
       shipOverlays.value = []
       initMap('car-ship', data.lng, data.lat, 15)
@@ -448,6 +461,22 @@
 </script>
 
 <style scoped lang="scss">
+	.look-box{
+		position:relative;
+		.look-btn{
+			position:absolute;
+			right:vw(20);
+			top:50%;
+			transform: translateY(-50%);
+			padding: vw(16);
+			display: flex;
+			align-items: center;
+			background: #0a4190;
+			border-radius: vw(8);
+			font-size:vw(24);
+			color:#fff;
+		}
+	}
   :deep(.BMap_cpyCtrl) {
     display: none;
   }