Browse Source

修复事件搜索、地图不加载问题

Hwf 6 months ago
parent
commit
b1fcc1e9a0
3 changed files with 32 additions and 34 deletions
  1. 1 0
      src/hooks/AMap/useAMap.ts
  2. 27 30
      src/views/event/detail.vue
  3. 4 4
      src/views/event/index.vue

+ 1 - 0
src/hooks/AMap/useAMap.ts

@@ -452,6 +452,7 @@ export function useAMap(options) {
     initMap(options);
   });
   return {
+    initMap,
     getAMap,
     getMap,
     switchMap,

+ 27 - 30
src/views/event/detail.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="container">
-    <div v-if="!hideMap" id="aMap" class="event_map" />
+    <div id="aMap" class="event_map" />
     <div class="box">
       <div class="event_title">
         {{ eventInfo.event_title || "暂无事件标题" }}
@@ -490,7 +490,6 @@ onMounted(() => {
   noControl.value = route.query.nocontrol as string || "";
   refreshData();
 });
-let hideMap = ref(false);
 let map;
 const refreshData = () => {
   eventId.value = route.query.event_id as string;
@@ -500,36 +499,34 @@ const refreshData = () => {
     if (!!eventInfo.value.plan_id) {
       getPlan(eventInfo.value.plan_id);
     }
-    if (!eventInfo.value.longitude || !eventInfo.value.latitude) {
-      hideMap.value = true;
-    } else {
-      // 初始化地图
-      const lnglat = [eventInfo.value.longitude, eventInfo.value.latitude];
-      const { getMap } = useAMap({
-        key: "30d3d8448efd68cb0b284549fd41adcf",
-        version: "2.0",
-        zoom: 16,
-        center: lnglat,
-        dragEnable: true,
-        scrollWheel: true,
-        // 加载完成事件
-        onLoadCompleted: AMap => {
-          map = getMap();
-          let marker = new AMap.Marker({
-            position: lnglat,
-            icon: new AMap.Icon({
-              size: new AMap.Size(22, 28), //图标所处区域大小
-              imageSize: new AMap.Size(22, 28), //图标大小
-              image:
+    // 初始化地图
+    const lnglat = [eventInfo.value.longitude, eventInfo.value.latitude];
+    const options = {
+      key: "30d3d8448efd68cb0b284549fd41adcf",
+      version: "2.0",
+      zoom: 16,
+      center: lnglat,
+      dragEnable: true,
+      scrollWheel: true,
+      // 加载完成事件
+      onLoadCompleted: (AMap) => {
+        map = getMap();
+        let marker = new AMap.Marker({
+          position: lnglat,
+          icon: new AMap.Icon({
+            size: new AMap.Size(22, 28), //图标所处区域大小
+            imageSize: new AMap.Size(22, 28), //图标大小
+            image:
                 "//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png"
-            }),
-            anchor: "bottom-center",
-            offset: new AMap.Pixel(0, 0)
-          });
-          marker.setMap(map);
-        }
-      });
+          }),
+          anchor: "bottom-center",
+          offset: new AMap.Pixel(0, 0)
+        });
+        marker.setMap(map);
+      }
     }
+    const { getMap, initMap } = useAMap(options);
+    initMap(options);
   });
 };
 </script>

+ 4 - 4
src/views/event/index.vue

@@ -2,7 +2,7 @@
   <div class="container">
 <!--搜索框-->
     <van-search
-      v-model="queryParams.search_keyword"
+      v-model="queryParams.keyword"
       class="common-search"
       :left-icon="searchImg"
       :right-icon="closeImg"
@@ -181,17 +181,17 @@ const queryParams = ref({
   event_type: "",
   event_level: "",
   event_status: "",
-  search_keyword: ""
+  keyword: ""
 });
 
 const on_search_keyword = val => {
-  queryParams.value.search_keyword = val;
+  queryParams.value.keyword = val;
   queryParams.value.page = 0;
   getList();
 };
 
 const on_search_cancel = () => {
-  queryParams.value.search_keyword = "";
+  queryParams.value.keyword = "";
   queryParams.value.page = 0;
   getList();
 };