小程序

MrShi

2023-10-17 3452e25c5312f986cdfe2431c67ca5358c4ffc61

 bicycle/pages/index/index.vue

@@ -3,13 +3,16 @@
      <view class="index_nav"
         :style="{ height: 'calc(' + (statusbarHeight + navHeight) + 'px' + ' + ' + '224rpx' + ')' }">
         <view class="index_nav_a" :style="{ height: statusbarHeight + 'px' }"></view>
         <view class="index_nav_b" :style="{ height: navHeight + 'px', lineHeight: navHeight + 'px' }">
         <view class="index_nav_b" :style="{ height: navHeight + 'px', lineHeight: navHeight + 'px', top: navHeight + 'px' }">
            <text>印象滨湖自行车</text>
         </view>
         <view class="index_box">
            <view class="index_box_map">
               <map class="map" :markers="markers" :latitude="latitude" :longitude="longitude" />
               <image src="@/static/icon/ic_fullscreen@2x.png" mode="widthFix"></image>
               <map class="map" :show-location="true" :markers="markers" :latitude="latitude" :longitude="longitude" />
               <cover-view class="index_box_icon" @click="jumpMap">
                  <image src="@/static/icon/ic_fullscreen@2x.png" mode="widthFix"></image>
               </cover-view>
					
            </view>
            <view class="index_box_title" :style="{ backgroundImage: 'url(' + bgImg + ')' }">
               <view class="index_box_title_left">
@@ -81,7 +84,7 @@
      </u-popup>
      <!-- 开锁 -->
      <u-popup :show="show5" :closeOnClickOverlay="false" mode="bottom" bgColor="#fff" :round="10"
         @close="show1 = false">
         @close="show5 = false">
         <view class="loading">
            <view class="loading_box">
               <view class="loading_box_top">
@@ -116,12 +119,12 @@
            </view>
            <view class="ride_content" v-if="info.memberRidesResponse">
               <view class="ride_content_a">
                  <text>开始时间：{{info.memberRidesResponse.rideStartTime.substring(10, 16)}}</text>
                  <text>本次已骑行：{{(info.memberRidesResponse.rideTime / 60).toFixed(1)}}分钟</text>
                  <text>开始时间：{{info.memberRidesResponse.rideStartTimeStr}}</text>
                  <text>本次已骑行：{{info.memberRidesResponse.rideTime}}分钟</text>
               </view>
               <view class="ride_content_b">
                  <text>车型：{{info.memberRidesResponse.bikeType}}（编号：{{info.memberRidesResponse.bikeCode}}）</text>
                  <text>计费规则：起租{{(info.memberRidesResponse.baseTime / 60 ).toFixed(1)}}小时{{(info.memberRidesResponse.basePrice / 100).toFixed(2)}}元，超过后{{(info.memberRidesResponse.unitPrice / 100).toFixed(2)}}元/{{info.memberRidesResponse.unitTime}}分钟</text>
                  <text>{{info.memberRidesResponse.priceRole}}</text>
               </view>
               <view class="ride_content_info">
                  <image src="@/static/icon/ic_tip@2x.png" mode="widthFix"></image>
@@ -155,11 +158,11 @@
            </view>
            <view class="ride_content" v-if="info.memberRidesResponse">
               <view class="ride_content_a">
                  <text>最后骑行：{{info.memberRidesResponse.rideStartTime.substring(5, 16)}}~{{info.memberRidesResponse.rideEndTime.substring(11, 16)}}（{{info.memberRidesResponse.rideTime}}分钟)</text>
                  <text>最后骑行：{{info.memberRidesResponse.rideStartTimeStr}}~{{info.memberRidesResponse.rideEndTimeStr}}（{{info.memberRidesResponse.rideTime}}分钟)</text>
               </view>
               <view class="ride_content_b">
                  <text>车型：{{info.memberRidesResponse.bikeType}}（编号：{{info.memberRidesResponse.bikeCode}}）</text>
                  <text>计费规则：起租{{(info.memberRidesResponse.baseTime / 60).toFixed(1)}}小时{{(info.memberRidesResponse.basePrice / 100).toFixed(2)}}元，超过后{{(info.memberRidesResponse.unitPrice / 100).toFixed(2)}}元/{{info.memberRidesResponse.unitTime}}分钟</text>
                  <text>{{info.memberRidesResponse.priceRole}}</text>
               </view>
               <view class="ride_content_info">
                  <image src="@/static/icon/ic_tip@2x.png" mode="widthFix"></image>
@@ -190,6 +193,8 @@
      </u-popup>
      <!-- 提示 -->
      <u-modal :show="show4" :content='content' confirmColor="#01B6AD" @confirm="show4 = false"></u-modal>
      <!-- 确认结算弹框 -->
      <u-modal :show="show7" title="提示" content='确认结算吗？' :showCancelButton="true" cancelText="取消" @confirm="settlement1" @cancel="show7 = false"></u-modal>
   </view>
</template>

@@ -205,13 +210,14 @@
            longitude: null,
            bgImg: require('@/static/images/bg_service@2x.png'),

            show: false,
            show1: false,
            show2: false,
            show3: false,
            show4: false,
            show5: false,
            show6: false,
            show: false,   // 广告
            show1: false,   // 缴纳押金
            show2: false,   // 骑行中
            show3: false,   // 确认结算
            show4: false,   // 提示
            show5: false,   // 开锁
            show6: false,   // 已还车
            show7: false,   // 确认结算弹框

            active: false,
            
@@ -255,6 +261,11 @@
         this.getSite()
      },
      methods: {
         jumpMap() {
            uni.navigateTo({
               url: '/pages/maps/maps'
            });
         },
         // 计价规则
         jumpgz() {
            uni.navigateTo({
@@ -289,16 +300,20 @@
               orderId: this.info.goodsOrderId
            }).then(res => {
               if (res.code === 200) {
                  this.refresh()
                  uni.showToast({ title: '结算成功！', icon: 'success', duration: 2000 });
                  this.info.rideStatus = -1
                  this.info.depositStatus = 0
                  // this.info.rideStatus = -1
                  // this.info.depositStatus = 0
                  this.show3 = false
                  this.show7 = false
               }
            })
         },
         minute() {
            this.show3 = false
            this.show6 = true
            if (this.info.rideStatus !== -1) {
               this.show6 = true
            }
         },
         settlement() {
            this.show6 = false
@@ -322,15 +337,17 @@
               });
            } else if (item.id === 2) {
               if (this.info.depositStatus === 1) {
                  this.settlement1()
                  // this.settlement1()
                  // this.show7 = true
                  this.show3 = true
               } else {
                  uni.showToast({
                     title: '您暂无押金，无需结算！',
                     icon: 'none',
                     duration: 2000
                  });
                  uni.showToast({ title: '您暂无押金，无需结算！', icon: 'none', duration: 2000 });
               }
            } else if (item.id === 1) {
               if (this.info.depositStatus === 1) {
                  uni.showToast({ title: '押金已充值', icon: 'none', duration: 2000 });
                  return
               }
               this.show1 = true
            }
         },
@@ -359,15 +376,14 @@
                           package: res.data.packageValue,
                           signType: 'MD5',
                           paySign: res.data.paySign,
                           success(res) {
                           success (res) {
                              if (res.errMsg = 'requestPayment:ok') {
                                 that.show1 = false
                                 uni.showToast({
                                    title: '充值成功',
                                    icon: 'success',
                                    duration: 2000
                                 });
                                 that.info.depositStatus = 1
                                 that.carRental()
                                 that.refresh()
                                 uni.showToast({ title: '充值成功', icon: 'success', duration: 2000 });
											
                              }
                           },
                           fail(err) {
@@ -395,20 +411,20 @@
                        code
                     } = loginRes;
                     that.$u.api.wxLogin({
                           code
                        code
                     })
                     .then(res => {
                        that.$u.api.wxPhone({
                           encryptedData: e.detail.encryptedData,
                           iv: e.detail.iv,
                           sessionKey: res.data.sessionKey
                        }).then(result => {
                           if (result.code === 200) {
                              that.$store.commit('setUserInfo', result.data
                                 .userResponse)
                           }
                        })
                        .then(res => {
                           that.$u.api.wxPhone({
                              encryptedData: e.detail.encryptedData,
                              iv: e.detail.iv,
                              sessionKey: res.data.sessionKey
                           }).then(result => {
                              if (result.code === 200) {
                                 that.$store.commit('setUserInfo', result.data
                                    .userResponse)
                              }
                           })
                        })
                     })
                  }
               });
            }
@@ -443,6 +459,7 @@
                        })
                        // 开锁成功
                        if (res1.data.status === 1) {
                           that.refresh()
                           clearInterval(timer)
                           that.show5 = false
                           setTimeout(() => {
@@ -451,12 +468,14 @@
                        }
                        // 开锁失败
                        if (res1.data.status === 3) {
                           that.refresh()
                           clearInterval(timer)
                           that.show5 = false
                           uni.showToast({ title: '开锁失败', icon: 'error', duration: 2000 });
                        }
                        // 开锁超时
                        if (num === 10) {
                        if (num === 120) {
                           that.refresh()
                           clearInterval(timer)
                           that.show5 = false
                           uni.showToast({ title: '开锁超时', icon: 'error', duration: 2000 });
@@ -607,7 +626,7 @@
                              uni.showToast({ title: '开锁失败', icon: 'error', duration: 2000 });
                           }
                           // 开锁超时
                           if (num === 10) {
                           if (num === 120) {
                              clearInterval(timer)
                              this.show5 = false
                              uni.showToast({ title: '开锁超时', icon: 'error', duration: 2000 });
@@ -633,6 +652,57 @@
                     if (res.data.isStopServe === 1) {
                        this.content = res.data.stopServeTips
                        this.show4 = true
                     }
                  }
               })
         },
         // 刷新首页信息
         refresh() {
            this.$u.api.home()
               .then(res => {
                  if (res.code === 200) {
                     this.info = res.data
                     // 解锁中
                     if (res.data.rideStatus === 0) {
                        this.show5 = true
                        // 循环次数
                        var num = 1
                        // 循环查看解锁结果
                        let timer = setInterval(async () => {
                           num += 1
                           let res1 = await this.$u.api.refreshLock({
                              id: res.data.memberRidesResponse.rideId
                           })
                           // 开锁成功
                           if (res1.data.status === 1) {
                              clearInterval(timer)
                              this.show5 = false
                              setTimeout(() => {
                                 this.show2 = true
                              }, 500)
                           }
                           // 开锁失败
                           if (res1.data.status === 3) {
                              clearInterval(timer)
                              this.show5 = false
                              uni.showToast({ title: '开锁失败', icon: 'error', duration: 2000 });
                           }
                           // 开锁超时
                           if (num === 120) {
                              clearInterval(timer)
                              this.show5 = false
                              uni.showToast({ title: '开锁超时', icon: 'error', duration: 2000 });
                           }
                        }, 1000)
                     }
                     if (res.data.rideStatus === 1) {
                        this.show2 = true
                     }
                     if (res.data.rideStatus === 5) {
                        this.show5 = true
                     }
                     if (res.data.rideStatus === 2) {
                        this.show6 = true
                     }
                  }
               })
@@ -663,6 +733,8 @@
            width: 100%;
            padding: 0 30rpx;
            box-sizing: border-box;
            position: sticky;
            z-index: 9;

            text {
               font-size: 38rpx;
@@ -692,15 +764,19 @@
                  height: 100%;
                  border-radius: 20rpx;
               }

               image {
					
               .index_box_icon {
                  position: absolute;
                  width: 80rpx;
                  height: 80rpx;
                  right: 10rpx;
                  bottom: 20rpx;
                  z-index: 999;
                  image {
                     width: 100%;
                     height: 100%;
                  }
               }
					
            }

            .index_box_title {