From d43da24717221d6aaf8cac6211759e7accb02d28 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=BC=A0=E5=85=88=E7=94=9F?=
 <zhangxiansheng@zhangxianshengdeMacBook-Pro.local>
Date: Mon, 17 Mar 2025 22:33:04 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E5=AE=8C=E5=96=84=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/scenic/components/box-1.vue   | 39 +++++++++++++-
 src/views/sentiment/components/area.vue | 68 +++++++++++++------------
 2 files changed, 73 insertions(+), 34 deletions(-)

diff --git a/src/views/scenic/components/box-1.vue b/src/views/scenic/components/box-1.vue
index db2db02..8f16dcb 100644
--- a/src/views/scenic/components/box-1.vue
+++ b/src/views/scenic/components/box-1.vue
@@ -23,6 +23,7 @@
       <img v-if="scenicSpotId == 'root000000'" src="@/assets/images/bdc.png" alt="" />
       <img v-if="scenicSpotId == '三峡之巅'" src="@/assets/images/sxzd.png" alt="" />
       <img v-if="scenicSpotId == '龙桥河'" src="@/assets/images/lqh.jpg" alt="" />
+      <!-- <div class="scenic-box" id="scenic-map"></div> -->
     </div>
     <div class="footer">
       <div class="flex">
@@ -101,11 +102,18 @@
 <script setup>
   import countup from 'vue-countup-v3'
   import { Vue3SeamlessScroll } from 'vue3-seamless-scroll'
-  import { useScenicStore } from '@/stores/scenic'
+
   import { useRouter } from 'vue-router'
 
+  import { useScenicStore } from '@/stores/scenic'
+
+  import { useMap } from '@/hooks/map'
+
+  import sxzd from '@/assets/images/sxzd.png'
+
   const router = useRouter()
   const scenicStore = useScenicStore()
+  const { initMap, addMarker, map, marker } = useMap()
 
   let props = defineProps({
     scenicSpotId: {
@@ -114,9 +122,34 @@
     }
   })
 
+  let scenicChange = null
   const handleMore = () => {
     router.push('/workOrder')
   }
+
+  // onMounted(() => {
+  //   scenicChange = PubSub.subscribe('scenicChange', (msg, data) => {
+  //     initMap('scenic-map', data.lng, data.lat, 15)
+  //     map.value.setDisplayOptions({
+  //       poiText: false, // 隐藏poi标注
+  //       poiIcon: false, // 隐藏poi图标
+  //       building: false // 隐藏楼块
+  //     })
+  //     var bounds = new BMapGL.Bounds(
+  //       new BMapGL.Point(109.604998,31.030391),
+  //       new BMapGL.Point(109.624833,31.044965)
+  //     )
+  //     var imgOverlay = new BMapGL.GroundOverlay(bounds, {
+  //       type: 'image',
+  //       url: sxzd,
+  //       opacity: 1
+  //     })
+  //     map.value.addOverlay(imgOverlay)
+  //   })
+  // })
+  // onUnmounted(() => {
+  //   PubSub.unsubscribe(scenicChange)
+  // })
 </script>
 
 <style scoped lang="scss">
@@ -189,6 +222,10 @@
       height: vh(600);
       overflow-x: auto;
       overflow-y: hidden;
+      .scenic-box {
+        width: 100%;
+        height: 100%;
+      }
       /* 滚动条整体样式 */
       &::-webkit-scrollbar {
         height: vh(10); /* 滚动条的宽度 */
diff --git a/src/views/sentiment/components/area.vue b/src/views/sentiment/components/area.vue
index 6b34f81..89d4154 100644
--- a/src/views/sentiment/components/area.vue
+++ b/src/views/sentiment/components/area.vue
@@ -17,41 +17,43 @@
   let options = ref([])
   const initChart = async () => {
     let res = await getAreaApi(params)
-    if (option) {
-      option.series[0].data = res.data
-    } else {
-      option = {
-        legend: {
-          top: '10%',
-          itemWidth: fitChartSize(20),
-          itemHeight: fitChartSize(20),
-          textStyle: {
-            color: '#fff',
-            fontSize: fitChartSize(20)
-          }
-        },
-        series: [
-          {
-            name: '',
-            type: 'pie',
-            radius: ['30%', '60%'],
-            center: ['50%', '56%'],
-            roseType: 'area',
-            labelLine: {
-              normal: {
-                show: true,
-                length: 1
-              }
-            },
-            itemStyle: {
-              borderRadius: fitChartSize(10)
-            },
-            data: res.data
-          }
-        ]
+    if (res.data.length > 0) {
+      if (option) {
+        option.series[0].data = res.data
+      } else {
+        option = {
+          legend: {
+            top: '10%',
+            itemWidth: fitChartSize(20),
+            itemHeight: fitChartSize(20),
+            textStyle: {
+              color: '#fff',
+              fontSize: fitChartSize(20)
+            }
+          },
+          series: [
+            {
+              name: '',
+              type: 'pie',
+              radius: ['30%', '60%'],
+              center: ['50%', '56%'],
+              roseType: 'area',
+              labelLine: {
+                normal: {
+                  show: true,
+                  length: 1
+                }
+              },
+              itemStyle: {
+                borderRadius: fitChartSize(10)
+              },
+              data: res.data
+            }
+          ]
+        }
       }
+      setOption(option)
     }
-    setOption(option)
   }
   const getStop = async () => {
     let res = await getSpotApi()