doum
10 小时以前 0a206f3acb9af0ec9db650861d34a256cda1c960
mini-program/pages/confirm-order/confirm-order.vue
@@ -33,30 +33,36 @@
         </view>
         <!-- 门店自提 -->
         <template v-if="receiveType === 1">
            <view class="box-addr-val">
            <view class="box-addr-val" @click="openShop">
               <image class="icon1" src="/static/icon/ic_address@2x1.png" mode="widthFix"></image>
               <view class="info">
                  <view class="info-top">
                     <text>XXX经销商</text>
               <template v-if="shopId">
                  <view class="info">
                     <view class="info-top">
                        <text>{{shopId.name}}</text>
                     </view>
                     <view class="info-bottom">
                        {{shopId.addr}}
                     </view>
                  </view>
                  <view class="info-bottom">
                     安徽省合肥市经开区松谷路凤凰国际B座808室
                  </view>
                  <image class="icon2" src="/static/icon/ic_ar2@2x.png" mode="widthFix"></image>
               </template>
               <view class="info-wu" v-else>
                  <text>选择门店</text>
                  <image class="icon2" src="/static/icon/ic_ar2@2x.png" mode="widthFix"></image>
               </view>
               <image class="icon2" src="/static/icon/ic_ar2@2x.png" mode="widthFix"></image>
            </view>
            <view class="box-addr-time">
            <view class="box-addr-time" v-if="shopId">
               <text>营业时间:</text>
               <text>周一至周五 09:00-19:00</text>
               <text>{{shopId.startTime}}</text>
            </view>
            <view class="box-addr-dz">
               <view class="box-addr-dz-left">
            <view class="box-addr-dz" v-if="shopId">
               <view class="box-addr-dz-left" @click="show3 = true">
                  <text>联系电话:</text>
                  <text>0551-87899903</text>
                  <text>{{shopId.phone}}</text>
               </view>
               <view class="box-addr-dz-r">
                  <image src="/static/icon/ic_address@2x.png" mode="widthFix"></image>
                  <text>1.3km</text>
                  <text>{{shopId.distance}}km</text>
               </view>
            </view>
         </template>
@@ -175,56 +181,67 @@
         </view>
      </u-popup>
      <!-- 门店 -->
      <u-popup :show="show2" round="15" :closeable="true" mode="bottom">
      <u-popup :show="show2" round="15" @close="show2 = false" :closeable="true" mode="bottom">
         <view class="coupon">
            <view class="coupon-title">选择门店</view>
            <view class="coupon-search">
               <view class="coupon-search-city">
                  <text>合肥市</text>
            <view class="coupon-search" v-if="isPosition">
               <view class="coupon-search-city" @click="jumpCity">
                  <text>{{cityName}}</text>
                  <u-icon name="arrow-down" color="#999999" size="13"></u-icon>
               </view>
               <view class="coupon-search-input">
                  <u-search placeholder="输入门店名称" height="35" searchIconColor="#999999" borderColor="#eeeeee"
                     bgColor="#F9F9FB" :showAction="false" v-model="keyword" />
                     bgColor="#F9F9FB" :showAction="false" v-model="shopName" @search="getShopLists" />
               </view>
            </view>
            <scroll-view scroll-y>
               <view class="dian active" v-for="(item, index) in 10" :key="index">
                  <view class="dian-top">
                     <view class="dian-top-image">
                        <image src="/static/logo.png" mode="widthFix"></image>
                     </view>
                     <view class="dian-top-info">
                        <view class="dian-top-info-title">
                           <text>XXX经销商</text>
                           <text>距离1.2km</text>
               <template v-if="isPosition">
                  <view :class="item.active ? 'dian active' : 'dian'" @click="seleShop(index)" v-for="(item, index) in shopList" :key="index">
                     <view class="dian-top">
                        <view class="dian-top-image">
                           <image :src="item.imgFullUrl" mode="widthFix"></image>
                        </view>
                        <view class="dian-top-info-val">陵泉路358号红星美凯龙A馆3楼中央电梯旁P2301-P2308</view>
                        <view class="dian-top-info">
                           <view class="dian-top-info-title">
                              <text>{{item.name}}</text>
                              <text>距离{{item.distance}}km</text>
                           </view>
                           <view class="dian-top-info-val">{{item.addr}}</view>
                        </view>
                     </view>
                     <view class="dian-bottom">
                        <text>营业时间:{{item.startTime}}</text>
                        <view class="dian-bottom-icon">
                           <image src="/static/icon/ic_phonecall@2x.png" mode="widthFix" @click="dianhua(item.phone)"></image>
                           <image src="/static/icon/ic_distance@2x.png" mode="widthFix" @click="openLoation(item)"></image>
                        </view>
                     </view>
                  </view>
                  <view class="dian-bottom">
                     <text>营业时间:周一至周五 09:30-17:00</text>
                     <view class="dian-bottom-icon">
                        <image src="/static/icon/ic_phonecall@2x.png" mode="widthFix"></image>
                        <image src="/static/icon/ic_distance@2x.png" mode="widthFix"></image>
                     </view>
               </template>
               <template v-else>
                  <view class="wushuju">
                     <image src="/static/images/img_dingwei@2x.png" mode="widthFix"></image>
                     <view class="wushuju-a">定位失败</view>
                     <view class="wushuju-b">请开启定位获取位置信息</view>
                     <view class="wushuju-c" @click="goToAppSetting">开启定位</view>
                  </view>
               </view>
               </template>
            </scroll-view>
            <view class="coupon-btn">确定选择</view>
            <view class="coupon-btn" v-if="isPosition" @click="confirmMD">确定选择</view>
         </view>
      </u-popup>
      <!-- 联系电话 -->
      <u-popup :show="show3" round="15" :closeable="true" mode="bottom">
      <u-popup :show="show3" round="15" @close="show3 = false" :closeable="true" mode="bottom">
         <view class="coupon">
            <view class="coupon-title">联系电话</view>
            <view class="coupon-phone">0551-87899903</view>
            <view class="coupon-phone" @click="dianhua(shopId.phone)">{{shopId.phone}}</view>
         </view>
      </u-popup>
   </view>
</template>
<script>
   var QQMapWX = require('@/utils/qqmap-wx-jssdk.js')
   import { mapState } from 'vuex'
   export default {
      computed: {
@@ -236,15 +253,21 @@
            show1: false,
            show2: false,
            show3: false,
            keyword: '',
            shopName: '',
            orderInfo: null,
            addr: null,
            remark: '',
            cityName: '',
            useIntegralCopy: 0,
            useIntegral: 0,
            receiveType: 0,
            couponId: null,
            payDetailRequestList: []
            shopId: null,
            payDetailRequestList: [],
            shopList: [],
            isPosition: true,
            lat: '',
            lgt: '',
         };
      },
      onLoad(option) {
@@ -257,38 +280,146 @@
            this.addr = data
            this.getOrderInfo()
         })
         uni.$on('city', (data) => {
            this.cityName = data
            this.getShopLists()
         })
         this.getDefaultAddr()
      },
      methods: {
         goToAppSetting() {
            var that = this;
             uni.openSetting({
                 success: (res) => {
                  if (res.authSetting['scope.userLocation']) {
                     this.isPosition = true
                     that.positioning()
                  }
                 }
             });
         },
         // 定位
         positioning() {
            var that = this;
            uni.getLocation({
               type: 'gcj02',
               highAccuracyExpireTime: 3000,
               isHighAccuracy: true,
               success: function (addr) {
                  const locParam = { latitude: addr.latitude, longitude: addr.longitude };
                  const qqmapsdk = new QQMapWX({
                     key: 'HEIBZ-QJLLM-SZ36X-6ZBHI-S6Y2J-S6FND'
                  });
                  qqmapsdk.reverseGeocoder({
                     locParam,
                     success: function(res) {
                        that.cityName = res.result.ad_info.city
                        that.lat = res.result.location.lat
                        that.lgt = res.result.location.lng
                        that.getShopLists(1)
                     },
                     fail: (err) => {
                        console.error('获取位置失败===========', err);
                     }
                  });
               }
            });
         },
         jumpCity() {
            uni.navigateTo({
               url: '/pages/select-city/select-city'
            })
         },
         openShop() {
            // 检查用户是否已经授权位置权限
            uni.getSetting({
               success: (res) => {
                  if (res.authSetting['scope.userLocation']) {
                     // 用户已授权位置权限
                     this.isPosition = true
                     this.positioning()
                  } else {
                     // 用户未授权位置权限
                     this.isPosition = false
                     this.show2 = true
                     // this.getShopLists(1)
                  }
               }
            });
         },
         // 打电话
         dianhua(phoneNumber) {
            uni.makePhoneCall({
               phoneNumber
            })
         },
         // 打开位置
         openLoation(item) {
            uni.openLocation({
               latitude: item.latitude,
               longitude: item.longitude,
               name: item.name,
               address: item.addr
            })
         },
         seleShop(index) {
            this.shopList.forEach((item, i) => {
               item.active = index === i
            })
         },
         confirmMD() {
            if (this.shopList.filter(item => item.active).length === 0) return uni.showToast({
               title: '请选择门店',
               icon: 'none'
            })
            this.shopId = this.shopList.filter(item => item.active)[0]
            this.show2 = false
         },
         // 获取附近门店
         getShopLists() {
         getShopLists(type) {
            this.$u.api.getShopList({
               cityName: this.position.ad_info.city,
               lat: this.position.location.lat,
               lgt: this.position.location.lng
               cityName: this.cityName,
               lat: this.lat,
               lgt: this.lng,
               shopName: this.shopName
            }).then(res => {
               if (res.code === 200) {
                  console.log(res)
                  res.data.forEach(item => {
                     item.active = false
                  })
                  this.shopList = res.data
                  if (type === 1) {
                     this.show2 = true
                  }
               }
            })
         },
         // 支付
         payment() {
            var that = this;
            this.$u.api.orderPay({
               addressId: this.addr.id,
               addressId: this.addr ? this.addr.id : null,
               couponId: this.couponId,
               payDetailRequestList: this.payDetailRequestList,
               receiveType: this.receiveType,
               useIntegral: this.useIntegral,
               remark: this.remark,
               titlePrice: this.orderInfo.payAmount
               titlePrice: this.orderInfo.payAmount,
               shopId: this.shopId ? this.shopId.id : null
            }).then(res => {
               if (res.code === 200) {
                  // 积分抵扣
                  if (res.data.payType === 1) {
                     uni.reLaunch({
                        url: `/pagesA/pages/order-details/order-details?id=${res.data.orderId}&userType=0`
                     })
                     // if (this.receiveType === 0) {
                        uni.redirectTo({
                           url: `/pagesA/pages/order-details/order-details?id=${res.data.orderId}&userType=0`
                        })
                     // } else {
                     //    uni.reLaunch({
                     //       url: `/pages/payment-successful/payment-successful?id=${res.data.orderId}&userType=0`
                     //    })
                     // }
                  } else {
                     wx.requestPayment({
                        timeStamp: res.data.response.timeStamp,
@@ -298,9 +429,15 @@
                        paySign: res.data.response.paySign,
                        success (pay) {
                           if (pay.errMsg === "requestPayment:ok") {
                              uni.reLaunch({
                                 url: `/pagesA/pages/order-details/order-details?id=${res.data.orderId}&userType=0`
                              })
                              // if (that.receiveType === 0) {
                                 uni.redirectTo({
                                    url: `/pagesA/pages/order-details/order-details?id=${res.data.orderId}&userType=0`
                                 })
                              // } else {
                              //    uni.reLaunch({
                              //       url: `/pages/payment-successful/payment-successful?id=${res.data.orderId}&userType=0`
                              //    })
                              // }
                           } else {
                              uni.showToast({ title: '订单取消支付', icon: 'none' })
                           }
@@ -354,9 +491,6 @@
         },
         changeOrderType(type) {
            this.receiveType = type
            if (this.receiveType === 1) {
               this.getShopLists()
            }
            this.getOrderInfo()
         },
         jumpAddr() {
@@ -390,7 +524,43 @@
         box-sizing: border-box;
         scroll-view {
            width: 100%;
            max-height: 65vh;
            height: 65vh;
            .wushuju {
               width: 100%;
               height: 100%;
               display: flex;
               flex-direction: column;
               align-items: center;
               justify-content: center;
               image {
                  width: 140rpx;
                  height: 140rpx;
               }
               .wushuju-a {
                  font-weight: 600;
                  font-size: 30rpx;
                  color: #111111;
                  margin-top: 20rpx;
               }
               .wushuju-b {
                  font-weight: 400;
                  font-size: 26rpx;
                  color: #999999;
                  margin-top: 20rpx;
               }
               .wushuju-c {
                  width: 168rpx;
                  height: 72rpx;
                  line-height: 72rpx;
                  font-weight: 500;
                  font-size: 26rpx;
                  color: #FFFFFF;
                  text-align: center;
                  background: #004096;
                  border-radius: 44rpx;
                  margin-top: 40rpx;
               }
            }
            .active {
               border: 2rpx solid #004096 !important;
               background: #E8F2FF !important;
@@ -1070,12 +1240,11 @@
                  justify-content: space-between;
                  text {
                     font-weight: 400;
                     font-size: 26rpx;
                     font-size: 30rpx;
                     color: #333333;
                  }
                  image {
                     width: 12rpx;
                     height: 24rpx;
                     width: 16rpx;
                     margin: 0 !important;
                  }
               }
@@ -1087,6 +1256,22 @@
               margin-left: 40rpx;
               margin-top: 55rpx;
            }
            .info-wu {
               flex: 1;
               height: 48rpx;
               display: flex;
               align-items: center;
               justify-content: space-between;
               text {
                  font-weight: 400;
                  font-size: 30rpx;
                  color: #333333;
               }
               image {
                  width: 16rpx;
                  margin: 0 !important;
               }
            }
         }
      }
   }