网格

src/project/xicheng/AppMerchantManage/detail.vue

@@ -18,7 +18,7 @@
       </div>
       <div class="info">
         <span>电话</span>
-        <span class="color-3D94FB">{{ info.telephone }}</span>
+        <span class="color-3D94FB" @click="call(info.telephone)">{{ info.telephone }}</span>
       </div>
       <div class="info">
         <span>身份证</span>
@@ -28,18 +28,18 @@
         <div class="info">
           <span>门店照片</span>
         </div>
-        <image v-if="info.storePicUrl" :src="info.storePicUrl" mode="widthFix" />
+        <image v-if="info.storePicUrl" :src="info.storePicUrl" mode="aspectFill" @click="preview(info.storePicUrl)" />
       </div>
       <div class="info">
         <span>地图</span>
-        <span class="color-3D94FB">定位</span>
+        <span class="color-3D94FB" @click="openLocation">定位</span>
       </div>
     </div>
     <div class="content" v-if="info.detailList.length">
       <div class="title">店员信息</div>
       <div class="info" v-for="(item, index) in info.detailList" :key="index">
         <span>{{ item.userName }}</span>
-        <span class="color-3D94FB">{{ item.userPhone }}</span>
+        <span class="color-3D94FB" @click="call(item.userPhone)">{{ item.userPhone }}</span>
       </div>
     </div>
     <AiGap h="112"/>
@@ -90,6 +90,33 @@
         uni.navigateTo({
           url
         })
+      },
+
+      call (phone) {
+        uni.makePhoneCall({
+          phoneNumber: '114'
+        })
+      },
+
+      openLocation () {
+        if (!this.info.lat) {
+          return this.$u.toast('未设置定位')
+        }
+
+        uni.openLocation({
+          latitude: this.info.lat,
+          longitude: this.info.lon,
+          success: function () {
+            console.log('success');
+          }
+        })
+      },
+
+      preview (url) {
+        uni.previewImage({
+          urls: [url],
+          current: url
+        })
       }
     }
   }
@@ -163,11 +190,16 @@
       }
       .color-3D94FB{
         color: #3D94FB;
+
+        &:active {
+          opacity: 0.6;
+        }
       }
     }
     .img-list{
       image {
         width: 100%;
+        height: 320px;
       }
     }
   }