发布页开发

src/components/MapDisplay/mapService.ts

@@ -0,0 +1,190 @@
+// 腾讯地图SDK服务
+import QQMapWX from "qqmap-wx-jssdk";
+import Taro from '@tarojs/taro';
+
+// 扩展Window接口，添加qqmapsdk属性
+declare global {
+  interface Window {
+    qqmapsdk?: any;
+  }
+}
+
+export interface LocationInfo {
+  lat: number
+  lng: number
+  address?: string
+}
+
+export interface SearchResult {
+  id: string
+  title: string
+  address: string
+  location: {
+    lat: number
+    lng: number
+  }
+}
+
+export interface SearchOptions {
+  keyword: string
+  location?: string
+  page_size?: number
+  page_index?: number
+}
+
+class MapService {
+  private qqmapsdk: any = null
+  private isInitialized = false
+
+  // 初始化腾讯地图SDK
+  async initSDK(): Promise<boolean> {
+    if (this.isInitialized) {
+      return true
+    }
+
+    try {
+      // 直接使用QQMapWX，不需要通过window对象
+      this.qqmapsdk = new QQMapWX({
+        key: 'AZNBZ-VCSC4-MLVUF-KBASD-6GZ6H-KBFTX'
+      });
+      
+      this.isInitialized = true
+      console.log('腾讯地图SDK初始化成功')
+      return true
+    } catch (error) {
+      console.error('初始化腾讯地图SDK失败:', error)
+      return false
+    }
+  }
+
+  // 搜索地点
+  async search(options: SearchOptions): Promise<SearchResult[]> {
+    if (!this.isInitialized) {
+      await this.initSDK()
+    }
+
+    try {
+        console.log(this.qqmapsdk,11)
+      if (this.qqmapsdk && this.qqmapsdk.search) {
+        return new Promise((resolve, reject) => {
+          this.qqmapsdk.getSuggestion({
+            keyword: options.keyword,
+            location: options.location || '39.908802,116.397502', // 默认北京
+            page_size: options.page_size || 20,
+            page_index: options.page_index || 1,
+            success: (res: any) => {
+              console.log('搜索成功:', res)
+              if (res.data && res.data.length > 0) {
+                const results: SearchResult[] = res.data.map((item: any, index: number) => ({
+                  id: `search_${index}`,
+                  title: item.title || item.name || '未知地点',
+                  address: item.address || item.location || '地址未知',
+                  location: {
+                    lat: item.location?.lat || 0,
+                    lng: item.location?.lng || 0
+                  }
+                }))
+                resolve(results)
+              } else {
+                resolve([])
+              }
+            },
+            fail: (err: any) => {
+              console.error('搜索失败:', err)
+              reject(err)
+            }
+          })
+        })
+      } else {
+        // 使用模拟数据
+        console.log('使用模拟搜索数据')
+        return this.getMockSearchResults(options.keyword)
+      }
+    } catch (error) {
+      console.error('搜索异常:', error)
+      return this.getMockSearchResults(options.keyword)
+    }
+  }
+
+  // 获取模拟搜索结果
+  private getMockSearchResults(keyword: string): SearchResult[] {
+    const mockResults: SearchResult[] = [
+      {
+        id: 'mock_1',
+        title: `${keyword}相关地点1`,
+        address: '模拟地址1 - 这是一个示例地址',
+        location: { lat: 39.908802, lng: 116.397502 }
+      },
+      {
+        id: 'mock_2',
+        title: `${keyword}相关地点2`,
+        address: '模拟地址2 - 这是另一个示例地址',
+        location: { lat: 39.918802, lng: 116.407502 }
+      },
+      {
+        id: 'mock_3',
+        title: `${keyword}相关地点3`,
+        address: '模拟地址3 - 第三个示例地址',
+        location: { lat: 39.898802, lng: 116.387502 }
+      }
+    ]
+    return mockResults
+  }
+
+  // 获取当前位置
+  async getCurrentLocation(): Promise<{ lat: number; lng: number } | null> {
+    try {
+      // 这里可以集成实际的定位服务
+      // 暂时返回模拟位置
+      const res = await Taro.getLocation({
+        type: 'gcj02',
+        isHighAccuracy: true
+      })
+      return {
+        lat: res.latitude,
+        lng: res.longitude
+      }
+    } catch (error) {
+      console.error('获取位置失败:', error)
+      return null
+    }
+  }
+  async getAddress(lat: number, lng: number): Promise<string | null | undefined> {
+    try {
+        const addressRes: any = await new Promise((resolve, reject) => {
+            this.qqmapsdk.reverseGeocoder({
+                location: {
+                latitude: lat,
+                longitude: lng
+                },
+                success: resolve,
+                fail: reject
+            })
+        })
+        return addressRes?.results?.address
+    } catch (error) {
+        console.error('获取地址失败:', error)
+    }
+  }
+  async getLocation(): Promise<{ lat: number; lng: number; address: string } | null | undefined> {
+    try {
+        const currentInfo: any = {};
+        const location = await this.getCurrentLocation();
+        const { lat, lng } =  location || {};
+
+        if (lat && lng) {
+            currentInfo.lat = lat;
+            currentInfo.lng = lng;
+            const addressRes = await this.getAddress(lat, lng)
+            if (addressRes) {
+                currentInfo.address = addressRes;
+            }
+        }
+        return currentInfo;
+    } catch (error) {
+        console.error('获取位置失败:', error)
+    }
+  }
+}
+
+export const mapService = new MapService()