ROSS 机构导航

pages/_template/ross/approve/club/detail.vue

@@ -26,7 +26,7 @@
             </div>
             <div class="logo"><img :src="clubInfo.logo" /></div>
           </div>
-          <div class="section flex justify-between items-center mt-6" style="display: none;">
+          <div class="section flex justify-between items-center mt-6">
             <div class="navigation" @click="onMapNav">导航</div>
             <div
               class="distance"

pages/_template/ross/index.vue

@@ -77,12 +77,12 @@
         <!-- 列表 -->
         <div class="list">
           <template v-for="item in list">
-            <div class="section flex justify-between mb-4" :key="item.authId" @click="toDetail(item)">
+            <div class="section flex justify-between mb-4" :key="item.authId" @click.stop="toDetail(item)">
               <img class="cover" :src="item.logo || drawLogo(item.authParty)" />
               <div class="info">
                 <div class="name" v-text="item.authParty"></div>
                 <div class="mobile">{{ maskPhoneNumber(item.mobile) }}</div>
-                <div class="address">
+                <div class="address" @click.stop="handleMap(item)">
                   {{ formatAddress(item.area, item.address) }}
                 </div>
                 <div
@@ -98,12 +98,14 @@
         <SimpleEmpty v-if="!total && !isRequest" name="icon-empty-club.png" description="敬请期待~"></SimpleEmpty>
       </div>
     </van-list>
+    <SimpleMapNav ref="mapNav" @click="navigation" color="#f3920d" />
   </div>
 </template>
 
 <script>
 import { mapGetters } from 'vuex'
 import clubListMixin from '@/mixins/clubList'
+import { mapNavigate } from '@/utils/map-utils'
 import { objectCover } from '@/utils'
 export default {
   layout: 'app-ross',
@@ -112,7 +114,8 @@ export default {
     return {
       scrollTop: 0,
       banner: {},
-      screenWidth: ''
+      screenWidth: '',
+      clubInfo: {}
     }
   },
   computed: {
@@ -199,7 +202,24 @@ export default {
         this.banner.headAppBanner && (changeBanner.style.backgroundImage = 'url('+ this.banner.headAppBanner+ ')')
       }
     },
-
+    // 调用地图
+    handleMap(club) {
+      this.clubInfo = club
+      this.$refs.mapNav.open()
+    },
+    // 导航
+    navigation(type) {
+      const point = this.clubInfo.lngAndLat.split(',')
+      const resultAddress = this.clubInfo.area ? this.clubInfo.area + this.clubInfo.address : this.clubInfo.address
+      let lng = point[0]
+      let lat = point[1]
+
+      mapNavigate(
+        { lat, lng, title: this.clubInfo.authParty, address: resultAddress },
+        type
+      )
+      this.$refs.mapNav.close()
+    },
     // 城市变化
     onCityChange(valueMap) {
       const { provinceId, cityId, townId } = valueMap