新增地图弹窗 bug修改

src/views/scenic/components/big-map.vue

@@ -366,6 +366,7 @@
 
   onMounted(() => {
     scenicChange = PubSub.subscribe('scenicChange', (msg, data) => {
+		console.log(data,'99999999999999999999999999999999999999')
       scenicSpotId.value = data.scenicSpotId
       lat.value = data.lat
       lng.value = data.lng

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;
   }

src/views/scenic/components/tra-map.vue

@@ -0,0 +1,63 @@
+<template>
+	<div class="dialog">
+	  <el-dialog v-model="modelValue" align-center :modal="false" :show-close="false">
+		  <img @click="modelValue = false" class="close" src="@/assets/images/close.png"  />
+		  <div id="big-car-ship" class="big-car-ship" />
+	  </el-dialog>
+    </div>
+</template>
+
+<script setup>
+	import { useMap } from '@/hooks/map'
+	const { map, marker, initMap, addMarker } = useMap()
+	let modelValue = defineModel()
+	let props = defineProps({
+	  longitude: {
+	    type: String,
+	    default: ''
+	  },
+	  latitude: {
+	    type: String,
+	    default: ''
+	  }
+	})
+	watch(
+	  () => modelValue.value,
+	  (val) => {
+	    if (val) {
+	      setTimeout(() => {
+			  console.log(props.longitude,props.latitude)
+	        initMap('big-car-ship', props.longitude, props.latitude, 17)
+			map.value.setTrafficOn()
+	      }, 1000)
+	    }
+	  },
+	  { immediate: true }
+	)
+</script>
+
+<style scoped lang="scss">
+	.big-car-ship {
+	  flex: 1;
+	  height: vh(820);
+	}
+	.dialog {
+	  :deep(.el-dialog) {
+	    width: vw(2540);
+	    padding: vw(8);
+	    background-image: url('@/assets/images/dialog-bg.png') !important;
+	    background-size: 100% 100%;
+	  }
+	  :deep(.el-dialog__header) {
+	    padding-bottom: 0 !important;
+	  }
+	}
+	.close {
+	  cursor: pointer;
+	  position: absolute;
+	  right: vw(20);
+	  top: vw(20);
+	  width: vw(60);
+	  z-index: 9999;
+	}
+</style>