From ada718b35155c255f5e8c2fcc8fd834dc02ce38c Mon Sep 17 00:00:00 2001
From: lewis <604446095@qq.com>
Date: Wed, 3 Sep 2025 17:46:32 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B0=83=E6=95=B4=E5=9C=B0=E5=9B=BE=E6=90=9C?=
 =?UTF-8?q?=E7=B4=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 manifest.config.ts          |   1 +
 package.json                |   1 +
 pnpm-lock.yaml              |   8 +++
 src/manifest.json           |   3 +
 src/pages/service/find.vue  | 122 ++++++++++++++++++++----------------
 src/pages/service/index.vue | 102 +++++++++++++++++-------------
 6 files changed, 139 insertions(+), 98 deletions(-)

diff --git a/manifest.config.ts b/manifest.config.ts
index c228c3e..be3df88 100644
--- a/manifest.config.ts
+++ b/manifest.config.ts
@@ -126,6 +126,7 @@ export default defineManifestConfig({
       minified: true,
     },
     usingComponents: true,
+    requiredPrivateInfos: ['getLocation'],
     permission: {
       'scope.userLocation': {
         desc: '需要获取位置以展示医院信息',
diff --git a/package.json b/package.json
index 95c5293..ab121c3 100644
--- a/package.json
+++ b/package.json
@@ -100,6 +100,7 @@
     "js-cookie": "^3.0.5",
     "pinia": "2.0.36",
     "pinia-plugin-persistedstate": "3.2.1",
+    "qqmap-wx-jssdk": "^1.0.0",
     "qs": "6.5.3",
     "uview-ui": "2.0.38",
     "vue": "^3.4.21",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index dc3f4e7..e4655f1 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -88,6 +88,9 @@ importers:
       pinia-plugin-persistedstate:
         specifier: 3.2.1
         version: 3.2.1(pinia@2.0.36(typescript@5.7.2)(vue@3.5.15(typescript@5.7.2)))
+      qqmap-wx-jssdk:
+        specifier: ^1.0.0
+        version: 1.0.0
       qs:
         specifier: 6.5.3
         version: 6.5.3
@@ -5409,6 +5412,9 @@ packages:
     resolution: {integrity: sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==}
     engines: {node: '>=6'}
 
+  qqmap-wx-jssdk@1.0.0:
+    resolution: {integrity: sha512-wuaNetsA9/OKEQGgK1CNPsX6pppWpY10cQwQu1OHJplGMyMIMzK2bliMkNXjtry99qXYCsvDAWPqw2DI+/foJg==}
+
   qrcode-reader@1.0.4:
     resolution: {integrity: sha512-rRjALGNh9zVqvweg1j5OKIQKNsw3bLC+7qwlnead5K/9cb1cEIAGkwikt/09U0K+2IDWGD9CC6SP7tHAjUeqvQ==}
 
@@ -13176,6 +13182,8 @@ snapshots:
 
   punycode@2.3.1: {}
 
+  qqmap-wx-jssdk@1.0.0: {}
+
   qrcode-reader@1.0.4: {}
 
   qrcode-terminal@0.12.0: {}
diff --git a/src/manifest.json b/src/manifest.json
index faeed88..5ba25d3 100644
--- a/src/manifest.json
+++ b/src/manifest.json
@@ -90,6 +90,9 @@
       "minified": true
     },
     "usingComponents": true,
+    "requiredPrivateInfos": [
+      "getLocation"
+    ],
     "permission": {
       "scope.userLocation": {
         "desc": "需要获取位置以展示医院信息"
diff --git a/src/pages/service/find.vue b/src/pages/service/find.vue
index b227fff..022a5ec 100644
--- a/src/pages/service/find.vue
+++ b/src/pages/service/find.vue
@@ -1,32 +1,17 @@
-<template>
-  <view>
-    <map
-      id="hospitalMap"
-      style="width: 100%; height: 80vh"
-      :latitude="center.lat"
-      :longitude="center.lng"
-      :markers="markers"
-      @markertap="handleMarkerTap"
-    ></map>
-    <scroll-view class="poi-list">
-      <view v-for="(item, index) in hospitals" :key="index" @click="focusMarker(item)">
-        <text class="hospital-name">{{ item.name }}</text>
-        <text class="hospital-distance">{{ item.distance }}米</text>
-      </view>
-    </scroll-view>
-  </view>
-</template>
-
 <script>
+import QQMapWX from 'qqmap-wx-jssdk'
+
 export default {
   data() {
     return {
-      center: { lat: 39.90469, lng: 116.40717 }, // 默认北京坐标
+      center: { latitude: 28.871396, longitude: 105.442046 },
       markers: [],
-      hospitals: [],
+      searchResult: [],
+      keyword: '',
     }
   },
-  mounted() {
+  onLoad(options) {
+    this.keyword = options.keyword
     this.initMap()
   },
   methods: {
@@ -34,57 +19,88 @@ export default {
       uni.getLocation({
         type: 'gcj02',
         success: (res) => {
-          this.center = { lat: res.latitude, lng: res.longitude }
-          this.searchHospitals()
+          this.center = { latitude: res.latitude, longitude: res.longitude }
+          this.searchLocation()
+        },
+        fail: (fail) => {
+          console.log(fail)
         },
       })
     },
-    searchHospitals() {
-      // 需引入qqmapsdk（H5）或使用uni.requireNativePlugin（App）
-      const qqmapsdk = new qq.maps.SearchService({
-        complete: (result) => {
-          this.hospitals = result.detail.pois.map((poi) => ({
-            id: poi.id,
-            name: poi.title,
-            address: poi.address,
-            distance: poi._distance,
-            lat: poi.latLng.lat,
-            lng: poi.latLng.lng,
-          }))
-          this.updateMarkers()
+    searchLocation() {
+      const that = this
+      const qqmapsdk = new QQMapWX({
+        key: 'D2XBZ-LOMKI-D4MGT-5Q6LH-WV5A2-KPBBW',
+      })
+      qqmapsdk.search({
+        keyword: that.keyword, // 搜索关键词
+        location: that.center, // 设置周边搜索中心点
+        page_size: 20,
+        success(res) {
+          console.log('search res', res)
+          for (let i = 0; i < res.data.length; i++) {
+            that.markers.push({
+              id: i,
+              poi_id: res.data[i].id,
+              title: res.data[i].title,
+              latitude: res.data[i].location.lat,
+              longitude: res.data[i].location.lng,
+              label: {
+                content: res.data[i].title,
+                fontSize: 12,
+                anchorX: -40,
+                anchorY: 5,
+              },
+              width: 20,
+              height: 30,
+            })
+          }
+        },
+        fail(res) {
+          console.log(res)
         },
       })
-      qqmapsdk.searchNearby('医院', new qq.maps.LatLng(this.center.lat, this.center.lng), 2000)
-    },
-    updateMarkers() {
-      this.markers = this.hospitals.map((h) => ({
-        id: h.id,
-        latitude: h.lat,
-        longitude: h.lng,
-        iconPath: '/static/hospital-marker.png',
-        width: 24,
-        height: 24,
-        callout: { content: h.name },
-      }))
     },
     handleMarkerTap(e) {
-      const hospital = this.hospitals.find((h) => h.id === e.markerId)
+      const current = this.markers.find((h) => h.id === e.detail.markerId)
       uni.showActionSheet({
-        itemList: ['导航到' + hospital.name, '查看详情'],
+        itemList: [`导航到${current.title}`, '查看详情'],
         success: (res) => {
           if (res.tapIndex === 0) {
-            this.openNavigation(hospital)
+            this.openNavigation(current)
           }
         },
       })
     },
     focusMarker(item) {
-      this.center = { lat: item.lat, lng: item.lng }
+      this.center = { latitude: item.lat, longitude: item.lng }
     },
   },
 }
 </script>
 
+<template>
+  <view>
+    <map
+      id="map"
+      :scale="16"
+      style="width: 100%; height: 100vh"
+      :latitude="center.latitude"
+      :longitude="center.longitude"
+      :markers="markers"
+      @markertap="handleMarkerTap"
+    />
+    <!-- <scroll-view class="poi-list">
+      <view v-for="(item, index) in hospitals" :key="index" @click="focusMarker(item)">
+        <text class="hospital-name">
+          {{ item.name }}
+        </text>
+        <text class="hospital-distance">{{ item.distance }}米</text>
+      </view>
+    </scroll-view> -->
+  </view>
+</template>
+
 <style>
 .poi-list {
   height: 20vh;
diff --git a/src/pages/service/index.vue b/src/pages/service/index.vue
index 7832775..7efe995 100644
--- a/src/pages/service/index.vue
+++ b/src/pages/service/index.vue
@@ -8,21 +8,47 @@
 }
 </route>
 
+<script lang="ts" setup>
+// import RequestComp from './components/request.vue'
+// import UploadComp from './components/upload.vue'
+
+// 获取屏幕边界到安全区域距离
+const { safeAreaInsets } = uni.getSystemInfoSync()
+
+// 奇怪：同样的代码放在 vue 里面不会校验到错误，放在 .ts 文件里面会校验到错误
+// const testOxlint = (name: string) => {
+//   console.log('oxlint')
+// }
+// testOxlint('oxlint')
+// console.log('about')
+function more(item) {
+  uni.navigateTo({
+    // url: `/pages/web_view/index?target=${item.url}&title=${item.name}`,
+    url: `/pages/service/find?keyword=${item.name}`,
+  })
+
+  // uni.openLocation({
+  //   latitude: Number(2),
+  //   longitude: Number(2),
+  // })
+}
+</script>
+
 <template>
   <view class="">
     <view class="background_home">
       <view class="relative h-50">
         <wd-img
           radius="0px 0px 20rpx  20rpx "
-          :width="'100%'"
-          :height="'100%'"
+          width="100%"
+          height="100%"
           src="https://meizi-chao-pub.8531.cn/1813416312440430594_720px.jpg"
         />
         <view
-          class="absolute bottom-4 left-0 right-0 text-left text-white bg-black bg-opacity-20 ps-4"
+          class="absolute bottom-4 left-0 right-0 bg-black bg-opacity-20 ps-4 text-left text-white"
         >
           <text class="font-size-8 text-shadow">数字乡村</text>
-          <text class="block font-size-4 pt-2 text-shadow">同城一小时新鲜送到家</text>
+          <text class="block pt-2 font-size-4 text-shadow">同城一小时新鲜送到家</text>
         </view>
       </view>
       <view class="p-2">
@@ -32,8 +58,8 @@
               <template #title>
                 <view class="title">
                   <view>
-                    <text class="text-xl text-sm font-size-4">看看附近</text>
-                    <text class="ps-2 text-xl text-sm font-size-3 color-gray-500">
+                    <text class="text-sm text-xl font-size-4">看看附近</text>
+                    <text class="ps-2 text-sm text-xl font-size-3 color-gray-500">
                       好物上新季，特产抢先购
                     </text>
                   </view>
@@ -46,62 +72,70 @@
           </view>
           <wd-grid :gutter="2" :column="4">
             <view
-              @click="more(item)"
               v-for="item in [
                 {
                   name: '找停车',
+                  keyword: '停车场',
                   url: '/pages/activity/lease/index',
                   icon: '/static/icons/fj_1.png',
                   color: 'green',
                 },
                 {
                   name: '农事服务',
+                  keyword: '停车场',
                   url: '/pages/store/home/index?id=13',
                   icon: '/static/icons/fj_2.png',
                   color: 'blue',
                 },
                 {
                   name: '店铺街',
+                  keyword: '停车场',
                   url: '/pages/store/shopStreet/index',
                   icon: '/static/icons/fj_3.png',
                   color: 'orange',
                 },
                 {
                   name: '特产产品',
+                  keyword: '停车场',
                   url: '/pages/activity/lease/index',
                   icon: '/static/icons/fj_4.png',
                   color: 'green',
                 },
                 {
                   name: '特色美食',
+                  keyword: '停车场',
                   url: '/pages/store/home/index?id=13',
                   icon: '/static/icons/fj_5.png',
                   color: 'blue',
                 },
                 {
                   name: '当季产品',
+                  keyword: '停车场',
                   url: '/pages/activity/lease/index',
                   icon: '/static/icons/fj_6.png',
                   color: 'orange',
                 },
                 {
                   name: '美丽乡村',
+                  keyword: '停车场',
                   url: '/pages/activity/lease/index',
                   icon: '/static/icons/fj_7.png',
                   color: 'red',
                 },
                 {
                   name: '景区景色',
+                  keyword: '景区',
                   url: '/pages/activity/lease/index',
                   icon: '/static/icons/fj_8.png',
                   color: 'red',
                 },
               ]"
+              @click="more(item)"
             >
               <wd-grid-item use-slot>
                 <view class="p-2">
-                  <wd-img radius="20rpx" :width="'100rpx'" :height="'100rpx'" :src="item.icon" />
-                  <view class="ps-2 pt-2 pb-2 text-center text-gray-500 font-size-3">
+                  <wd-img radius="20rpx" width="100rpx" height="100rpx" :src="item.icon" />
+                  <view class="pb-2 ps-2 pt-2 text-center font-size-3 text-gray-500">
                     {{ item.name }}
                   </view>
                 </view>
@@ -118,8 +152,8 @@
             <template #title>
               <view class="title">
                 <view>
-                  <text class="text-xl text-sm font-size-4">游玩必备</text>
-                  <text class="ps-2 text-xl text-sm font-size-3 color-gray-500">
+                  <text class="text-sm text-xl font-size-4">游玩必备</text>
+                  <text class="ps-2 text-sm text-xl font-size-3 color-gray-500">
                     好物上新季，特产抢先购
                   </text>
                 </view>
@@ -132,32 +166,35 @@
         </view>
         <wd-grid :gutter="2" :column="4">
           <view
-            @click="more"
             v-for="item in [
               {
                 name: '酒店住宿',
+                keyword: '酒店',
                 url: '/pages/activity/lease/index',
                 icon: '/static/icons/ly_1.png',
                 color: 'green',
               },
               {
                 name: '风景景区',
+                keyword: '景区',
                 url: '/pages/activity/lease/index',
                 icon: '/static/icons/ly_2.png',
                 color: 'blue',
               },
               {
                 name: '天气预报',
+                keyword: '景区',
                 url: '/pages/activity/lease/index',
                 icon: '/static/icons/ly_3.png',
                 color: 'orange',
               },
             ]"
+            @click="more"
           >
             <wd-grid-item use-slot>
               <view class="p-2">
-                <wd-img radius="20rpx" :width="'100rpx'" :height="'100rpx'" :src="item.icon" />
-                <view class="ps-2 pt-2 pb-2 text-center text-gray-500 font-size-3">
+                <wd-img radius="20rpx" width="100rpx" height="100rpx" :src="item.icon" />
+                <view class="pb-2 ps-2 pt-2 text-center font-size-3 text-gray-500">
                   {{ item.name }}
                 </view>
               </view>
@@ -173,8 +210,8 @@
             <template #title>
               <view class="title">
                 <view>
-                  <text class="text-xl text-sm font-size-4">本地必备</text>
-                  <text class="ps-2 text-xl text-sm font-size-3 color-gray-500">
+                  <text class="text-sm text-xl font-size-4">本地必备</text>
+                  <text class="ps-2 text-sm text-xl font-size-3 color-gray-500">
                     <!-- 好物上新季，特产抢先购 -->
                   </text>
                 </view>
@@ -187,7 +224,6 @@
         </view>
         <wd-grid :gutter="2" :column="4">
           <view
-            @click="more"
             v-for="item in [
               {
                 name: '一条龙服务',
@@ -214,11 +250,12 @@
                 color: 'red',
               },
             ]"
+            @click="more"
           >
             <wd-grid-item use-slot>
               <view class="p-2">
-                <wd-img radius="20rpx" :width="'100rpx'" :height="'100rpx'" :src="item.icon" />
-                <view class="ps-2 pt-2 pb-2 text-center text-gray-500 font-size-3">
+                <wd-img radius="20rpx" width="100rpx" height="100rpx" :src="item.icon" />
+                <view class="pb-2 ps-2 pt-2 text-center font-size-3 text-gray-500">
                   {{ item.name }}
                 </view>
               </view>
@@ -227,7 +264,7 @@
         </wd-grid>
       </wd-card>
     </view>
-    <view class="p-2"></view>
+    <view class="p-2" />
 
     <!-- <RequestComp />
     <UploadComp /> -->
@@ -243,28 +280,3 @@
   text-align: center;
 }
 </style>
-<script lang="ts" setup>
-// import RequestComp from './components/request.vue'
-// import UploadComp from './components/upload.vue'
-
-// 获取屏幕边界到安全区域距离
-const { safeAreaInsets } = uni.getSystemInfoSync()
-
-// 奇怪：同样的代码放在 vue 里面不会校验到错误，放在 .ts 文件里面会校验到错误
-// const testOxlint = (name: string) => {
-//   console.log('oxlint')
-// }
-// testOxlint('oxlint')
-// console.log('about')
-function more(item) {
-  uni.navigateTo({
-    // url: `/pages/web_view/index?target=${item.url}&title=${item.name}`,
-    url: `/pages/service/find`,
-  })
-
-  // uni.openLocation({
-  //   latitude: Number(2),
-  //   longitude: Number(2),
-  // })
-}
-</script>