feat：完善样式

src/layout/components/Header/index.vue

@@ -4,12 +4,12 @@
       <li
         class="nav-left-item"
         :style="{
-          backgroundImage: `url(${current === index && !isSkip ? title2Select : title2})`
+          backgroundImage: `url(${current === item.id && !isSkip ? title2Select : title2})`
         }"
         v-for="(item, index) in navLeft"
         :key="index"
         :title="item.name"
-        @click="handleNav(item, index)"
+        @click="handleNav(item)"
       >
         {{ item.name }}
       </li>
@@ -18,7 +18,7 @@
           ['/scenic', '/hotel'].includes(router.currentRoute.value.path) && otherLeftNav.length > 0
         "
         trigger="click"
-        @command="handleCommand"
+        @command="handleCommand($event, 'hotel')"
       >
         <li
           class="nav-left-item"
@@ -44,13 +44,40 @@
     <ul class="nav-right">
       <li
         class="nav-right-item"
+        :style="{
+          backgroundImage: `url(${current === item.id && !isSkip ? title3Select : title3})`
+        }"
         v-for="(item, index) in navRight"
         :key="index"
         :title="item.name"
-        @click="handleNav(item, index)"
+        @click="handleNav(item)"
       >
         {{ item.name }}
       </li>
+      <el-dropdown
+        v-if="
+          ['/scenic', '/hotel'].includes(router.currentRoute.value.path) && otherRightNav.length > 0
+        "
+        trigger="click"
+        @command="handleCommand($event, 'venue')"
+      >
+        <li
+          class="nav-right-item"
+          :style="{
+            backgroundImage: `url(${title3})`
+          }"
+        >
+          {{ otherRightLabel }}
+          <img class="icon" src="@/assets/images/arrow-down-1.png" />
+        </li>
+        <template #dropdown>
+          <el-dropdown-menu>
+            <el-dropdown-item v-for="(item, index) in otherRightNav" :key="index" :command="item">
+              <span class="label"> {{ item.name }}</span>
+            </el-dropdown-item>
+          </el-dropdown-menu>
+        </template>
+      </el-dropdown>
     </ul>
     <div class="weather">
       <span>{{ weatherData?.temperature }}-{{ weatherData?.skycon }}</span>
@@ -70,7 +97,9 @@
   import { useRouter } from 'vue-router'
 
   import title2 from '@/assets/images/title-2.png'
+  import title3 from '@/assets/images/title-3.png'
   import title2Select from '@/assets/images/title-2-select.png'
+  import title3Select from '@/assets/images/title-3-select.png'
 
   import { getWeatherApi } from '@/api/home'
   import { getSpotListApi } from '@/api/sentiment'
@@ -87,9 +116,11 @@
   let navRight = ref([])
   let isSkip = ref(true)
   let isBack = ref(false)
-  let current = ref(0)
+  let current = ref(1)
   let otherLeftLabel = ref('')
+  let otherRightLabel = ref('')
   let otherLeftNav = ref([])
+  let otherRightNav = ref([])
   let spotList = ref([])
 
   // 补零
@@ -115,9 +146,15 @@
   const handleBack = () => {
     router.push('/home')
   }
-  const handleCommand = (item) => {
+  const handleCommand = (item, type) => {
     current.value = ''
-    otherLeftLabel.value = item.name
+    if (type === 'hotel') {
+      otherRightLabel.value = '其他场馆'
+      otherLeftLabel.value = item.name
+    } else {
+      otherLeftLabel.value = '其他酒店'
+      otherRightLabel.value = item.name
+    }
     switch (router.currentRoute.value.path) {
       case '/scenic':
         pubSub.publish('scenicChange', item)
@@ -131,19 +168,21 @@
     }
   }
   // 点击导航
-  const handleNav = (item, index) => {
+  const handleNav = (item) => {
     if (isSkip.value) {
       router.push(item.path)
     } else {
-      if (current.value === index) return
+      if (current.value === item.id) return
       otherLeftLabel.value = '其他酒店'
-      current.value = index
+      otherRightLabel.value = '其他场馆'
-      title.value = item.name
+      current.value = item.id
       switch (router.currentRoute.value.path) {
         case '/scenic':
+          title.value = item.name
           pubSub.publish('scenicChange', item)
           break
         case '/monitor':
+          title.value = item.name
           pubSub.publish('monitorChange', item)
           break
         case '/hotel':
@@ -167,6 +206,8 @@
   const setNav = async () => {
     navLeft.value = []
     navRight.value = []
+    otherLeftNav.value = []
+    otherRightNav.value = []
     switch (router.currentRoute.value.path) {
       case '/home':
         title.value = '奉节县旅游指挥调度中心'
@@ -273,13 +314,17 @@
       case '/hotel':
         title.value = '酒店场馆'
         otherLeftLabel.value = '其他酒店'
+        otherRightLabel.value = '其他场馆'
         isSkip.value = false
         current.vlaue = ''
         isBack.value = true
         let hotelRes = await getHotelListApi({ hotelStadiumType: 1 })
         navLeft.value = hotelRes.data.slice(0, 3)
-        pubSub.publish('hotelChange', hotelRes.data[0])
         otherLeftNav.value = hotelRes.data.slice(3, hotelRes.data.length - 1)
+        let venueRes = await getHotelListApi({ hotelStadiumType: 2 })
+        navRight.value = venueRes.data.slice(0, 3)
+        otherRightNav.value = venueRes.data.slice(3, venueRes.data.length - 1)
+        pubSub.publish('hotelChange', hotelRes.data[0])
         break
     }
   }
@@ -411,6 +456,10 @@
         color: rgba(208, 236, 255, 0.9);
         background-image: url('@/assets/images/title-3.png');
         background-size: 100% 100%;
+        .icon {
+          width: vw(18);
+          height: vw(18);
+        }
       }
     }
   }

src/views/hotel/components/info-box.vue

@@ -88,7 +88,6 @@
 
 <script setup>
   import countup from 'vue-countup-v3'
-  import map from '@/assets/images/map-img-1.jpg'
 
   import pubSub from 'pubsub-js'
   import { cloneDeep } from 'lodash'
@@ -97,15 +96,14 @@
   let info = ref(null)
 
   onMounted(() => {
-    hotelChange = PubSub.subscribe('hotelChange', (msg, data) => {
+    hotelChange = pubSub.subscribe('hotelChange', (msg, data) => {
       let newData = cloneDeep(data)
       newData.banner = newData.banner ? newData.banner.split(',') : []
       info.value = newData
-      console.log(info.value, 'info.value')
     })
   })
   onUnmounted(() => {
-    if (hotelChange) PubSub.unsubscribe(hotelChange)
+    if (hotelChange) pubSub.unsubscribe(hotelChange)
   })
 </script>
 

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

@@ -147,7 +147,6 @@
       if (map.value && modelValue.value) {
         // 109.645729,31.041203
         if (carOverlays.value.length > 0) {
-          console.log(11111)
           // 更新车辆marker位置
           let flag = false
           for (let i = 0; i < carOverlays.value.length; i++) {
@@ -159,7 +158,7 @@
                   lat: props.carList[j].lat
                 })
                 flag = true
-                break
+                continue
               }
             }
           }
@@ -175,11 +174,14 @@
                 lng: props.carList[i].lng,
                 lat: props.carList[i].lat
               })
+              currentMarker.value.setPosition({
+                lng: props.carList[i].lng,
+                lat: props.carList[i].lat
+              })
               break
             }
           }
         } else {
-          console.log(2222)
           props.carList.map((item, i) => {
             if (item.lng && item.lat) {
               addMarker(carIcon, [item.lng, item.lat], [36, 50])

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

@@ -12,7 +12,7 @@
       </li>
     </ul>
 
-    <div id="traffic-map" :class="[routers.length == 0 ? 'traffic-map-big' : 'traffic-map']" />
+    <div id="traffic-map" class="traffic-map-big" :class="{ 'traffic-map': routers.length > 0 }" />
 
     <div v-if="routers.length > 0" class="list">
       <div class="item" v-for="(item, index) in routers" :key="index" @click="handleRouter(item)">
@@ -183,16 +183,7 @@
       background-size: 100% 100%;
     }
   }
-  .traffic-map {
+
-    position: relative;
-    z-index: 9;
-    width: vw(1500);
-    height: vh(955);
-    margin-left: vw(8);
-    box-sizing: border-box;
-    background-image: url('/src/assets/images/map-bg-2.png');
-    background-size: 100% 100%;
-  }
   .traffic-map-big {
     position: relative;
     z-index: 9;
@@ -203,6 +194,9 @@
     background-image: url('/src/assets/images/map-bg-2.png');
     background-size: 100% 100%;
   }
+  .traffic-map {
+    width: vw(1500) !important;
+  }
   .video-list {
     width: vw(320);
     height: vh(120);