MrShi

MrShi

2023-11-09 19d17f0f0fb02f46342d70b5180e40a0ad1b66d3

 bicycle/pages/index/index.vue

@@ -4,8 +4,12 @@
         :style="{ height: 'calc(' + (statusbarHeight + navHeight) + 'px' + ' + ' + '224rpx' + ')' }">
         <view class="index_nav_a" :style="{ height: statusbarHeight + 'px' }"></view>
         <view :style="{ height: navHeight + 'px' }"></view>
         <view class="index_nav_b" :style="{ height: navHeight + 'px', lineHeight: navHeight + 'px', top: statusbarHeight + 'px' }">
            <text>印象滨湖自行车</text>
         <view class="index_nav_box" :style="{ background: top > 0 ? '#9AE2DF' : 'rgba(0,0,0,0)' }">
            <view class="index_nav_a" :style="{ height: statusbarHeight + 'px' }"></view>
            <view :style="{ height: navHeight + 'px' }"></view>
            <view class="index_nav_b" :style="{ height: navHeight + 'px', lineHeight: navHeight + 'px', top: statusbarHeight + 'px' }">
               <text>印象滨湖自行车</text>
            </view>
         </view>
         <view class="index_box">
            <view class="index_box_map">
@@ -32,9 +36,14 @@
               <image class="imgfull" :src="info.leaseNoticeUrl" mode="widthFix"></image>
            </view>
            <view class="index_box_video" v-if="info.leaseVideoUrl">
               <video class="img100b" :src="info.leaseVideoUrl" enable-danmu danmu-btn controls></video>
               <video class="img100b" :show-play-btn="false" :src="info.leaseVideoUrl" enable-danmu danmu-btn controls></video>
            </view>
            <view class="index_zw"></view>
            <view style="width: 100%; height: calc(env(safe-area-inset-bottom) + 600rpx);" v-if="show5"></view>
            <view style="width: 100%; height: calc(env(safe-area-inset-bottom) + 660rpx);" v-if="show6"></view>
            <view style="width: 100%; height: calc(env(safe-area-inset-bottom) + 660rpx);" v-else-if="show2"></view>
            <view style="width: 100%; height: calc(env(safe-area-inset-bottom) + 580rpx);" v-else-if="show1"></view>
            <view style="width: 100%; height: calc(env(safe-area-inset-bottom) + 500rpx);" v-else-if="show3"></view>
            <view class="index_zw1" v-else></view>
         </view>
      </view>
      <view class="index_scancode">
@@ -50,7 +59,7 @@
         <view class="index_scancode_bottom" @click="carRental" v-else>扫码租车</view>
         <view class="index_scancode_zw"></view>
      </view>
      <!-- 缴纳押金 -->
      <!-- 缴纳押金 --> 
      <u-popup :show="show1" :closeOnClickOverlay="false" mode="bottom" bgColor="#fff" :round="10"
         @close="show1 = false">
         <view class="deposit">
@@ -90,7 +99,7 @@
         </view>
      </u-popup>
      <!-- 骑行中 -->
      <u-popup :show="show2" overlayOpacity="0" :closeOnClickOverlay="false" mode="bottom" bgColor="#fff" :round="10"
      <u-popup :show="show2" :overlay="false" overlayOpacity="0" :closeOnClickOverlay="false" mode="bottom" bgColor="#fff" :round="10"
         @close="show2 = false">
         <view class="ride">
            <view class="ride_head">
@@ -129,7 +138,7 @@
         </view>
      </u-popup>
      <!-- 已还车 -->
      <u-popup :show="show6" overlayOpacity="0" :closeOnClickOverlay="false" mode="bottom" bgColor="#fff" :round="10"
      <u-popup :show="show6" :overlay="false" overlayOpacity="0" :closeOnClickOverlay="false" mode="bottom" bgColor="#fff" :round="10"
         @close="show6 = false">
         <view class="ride">
            <view class="ride_head">
@@ -166,7 +175,7 @@
         </view>
      </u-popup>
      <!-- 确认结算 -->
      <u-popup :show="show3" :closeOnClickOverlay="false" mode="bottom" bgColor="#fff" :round="10" @close="show3 = false">
      <u-popup :show="show3" :overlay="false" :closeOnClickOverlay="false" mode="bottom" bgColor="#fff" :round="10" @close="show3 = false">
         <template>
            <view class="deposit1">
               <view class="deposit_text">
@@ -182,11 +191,11 @@
         </template>
      </u-popup>
      <!-- 提示 -->
      <u-modal :show="show4" :content='content' confirmColor="#01B6AD" @confirm="show4 = false"></u-modal>
      <u-modal :show="show4" :title="title" :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>
      <!-- 广告 -->
      <u-popup :show="show" mode="center" bgColor="transparent" :round="10" @close="show = false">
      <u-popup :show="show" mode="center" :closeOnClickOverlay="false" overlayStyle="z-index: 10075;" bgColor="transparent" :round="10" @close="show = false">
         <view class="popupbox">
            <view class="advertisement">
               <image :src="info.adList[0].imgfullurl" mode="widthFix"></image>
@@ -206,6 +215,11 @@
   export default {
      data() {
         return {
            disable: false,
				
            top: 0,
				
            title: '',
            latitude: null,
            longitude: null,
            bgImg: require('@/static/images/bg_service@2x.png'),
@@ -255,13 +269,17 @@
      computed: {
         ...mapState(['navHeight', 'statusbarHeight', 'userInfo'])
      },
      async onLoad() {
      async onLoad(options) {
         if (JSON.stringify(this.userInfo) == '{}') {
            await this.$onLaunched;
         }
         console.log(decodeURIComponent(options.scene))
         this.getAddress()
         this.getHomeInfo()
         this.getSite()
      },
      onPageScroll(e) {
         this.top = e.scrollTop
      },
      methods: {
         jumpX() {
@@ -288,7 +306,7 @@
                     res.data.forEach((item, index) => {
                        this.markers.push({
                           id: index,
                           width: 30,
                           width: 40,
                           height: 40,
                           latitude: item.latitude,
                           longitude: item.longitude,
@@ -306,18 +324,21 @@
               this.isDisabled = false
               this.$u.api.goodsOrderSettlement({}).then(res => {
                  if (res.code === 200) {
                     this.refresh()
                     uni.showToast({ title: '结算成功！', icon: 'success', duration: 2000 });
                     this.show3 = false
                     this.show6 = false
                     this.show7 = false
                     this.isDisabled = true
                     uni.showToast({ title: '结算成功！', icon: 'success', duration: 2000 });
                     this.refresh()
                  }
               }).finally(() => {
                  this.isDisabled = true
               })
            }
         },
         minute() {
            this.show3 = false
            if (this.info.rideStatus !== -1) {
            console.log(this.info.rideStatus)
            if (this.info.rideStatus != -1) {
               this.show6 = true
            }
         },
@@ -342,6 +363,10 @@
                  url: '/pages/consumptionDetails/consumptionDetails'
               });
            } else if (item.id === 2) {
               if (this.info.rideStatus === 1) {
                  uni.showToast({ title: '骑行中不能结算押金', icon: 'none', duration: 2000 })
                  return
               } 
               if (this.info.depositStatus === 1) {
                  this.show3 = true
               } else {
@@ -358,7 +383,7 @@
         // 骑行明细
         toRidingDetails() {
            uni.navigateTo({
               url: `/pages/ridingDetails/ridingDetails?id=${this.info.goodsOrderId}`
               url: `/pages/ridingDetails/ridingDetails?id=${this.info.goodsOrderId}&price=${this.info.deposit / 100}`
            });
         },
         // 跳转故障上报
@@ -369,33 +394,40 @@
         },
         // 押金支付
         depositPayment() {
            var that = this;
            if (this.active) {
               var that = this;
               this.$u.api.createGoodsOrderPay()
                  .then(res => {
                     if (res.code === 200) {
                        wx.requestPayment({
                           timeStamp: res.data.timeStamp,
                           nonceStr: res.data.nonceStr,
                           package: res.data.packageValue,
                           signType: 'MD5',
                           paySign: res.data.paySign,
                           success (res) {
                              if (res.errMsg = 'requestPayment:ok') {
                                 that.show1 = false
                                 that.info.depositStatus = 1
                                 that.carRental()
                                 that.refresh()
                                 uni.showToast({ title: '充值成功', icon: 'success', duration: 2000 });
											
               if (!this.disable) {
                  that.disable = true
                  that.$u.api.createGoodsOrderPay()
                     .then(res => {
                        if (res.code === 200) {
                           wx.requestPayment({
                              timeStamp: res.data.timeStamp,
                              nonceStr: res.data.nonceStr,
                              package: res.data.packageValue,
                              signType: 'MD5',
                              paySign: res.data.paySign,
                              success (res) {
                                 that.disable = false
                                 if (res.errMsg = 'requestPayment:ok') {
                                    that.show1 = false
                                    that.info.depositStatus = 1
                                    that.carRental()
                                    that.refresh()
                                    uni.showToast({ title: '充值成功', icon: 'success', duration: 2000 });
                                 }
                              },
                              fail(err) {
                                 that.disable = false
                                 console.log(err)
                              }
                           },
                           fail(err) {
                              console.log(err)
                           }
                        })
                     }
                  })
                           })
                        }
                     }).catch((err) => {
                        that.disable = false
                        console.log(err)
                     })
               }
            } else {
               uni.showToast({
                  title: '请先勾选协议',
@@ -441,55 +473,63 @@
               return;
            }
            var that = this;
            // 扫码解锁骑行
            uni.scanCode({
               success: async function(result) {
                  // 打开开锁弹框
                  that.show5 = true
                  // 调用开锁接口
                  let res = await that.$u.api.openLock({
                     code: result.result
                  })
                  if (res.code === 200) {
                     that.show6 = false
            if (!that.disable) {
               that.disable = true
               // 扫码解锁骑行
               uni.scanCode({
                  success: async function(result) {
                     // 打开开锁弹框
                     that.show5 = true
                     // 循环次数
                     var num = 1
                     // 循环查看解锁结果
                     let timer = setInterval(async () => {
                        num += 1
                        let res1 = await that.$u.api.refreshLock({
                           id: res.data.id
                        })
                        // 开锁成功
                        if (res1.data.status === 1) {
                           that.refresh()
                           clearInterval(timer)
                           that.show5 = false
                           setTimeout(() => {
                              that.show2 = true
                           }, 500)
                        }
                        // 开锁失败
                        if (res1.data.status === 3) {
                           that.refresh()
                           clearInterval(timer)
                           that.show5 = false
                           uni.showToast({ title: '开锁失败', icon: 'error', duration: 2000 });
                        }
                        // 开锁超时
                        if (num === 180) {
                           that.refresh()
                           clearInterval(timer)
                           that.show5 = false
                           uni.showToast({ title: '开锁超时', icon: 'error', duration: 2000 });
                        }
                     }, 1000)
                  } else {
                     that.show5 = false
                     // 调用开锁接口
                     let res = await that.$u.api.openLock({
                        code: result.result
                     })
                     if (res.code === 200) {
                        that.disable = false
                        that.show6 = false
                        that.show5 = true
                        // 循环次数
                        var num = 1
                        // 循环查看解锁结果
                        let timer = setInterval(async () => {
                           num += 1
                           let res1 = await that.$u.api.refreshLock({
                              id: res.data.id
                           })
                           // 开锁成功
                           if (res1.data.status === 1) {
                              that.refresh()
                              clearInterval(timer)
                              that.show5 = false
                              setTimeout(() => {
                                 that.show2 = true
                              }, 500)
                           }
                           // 开锁失败
                           if (res1.data.status === 3) {
                              that.refresh()
                              clearInterval(timer)
                              that.show5 = false
                              uni.showToast({ title: '开锁失败', icon: 'error', duration: 2000 });
                           }
                           // 开锁超时
                           if (num === 180) {
                              that.refresh()
                              clearInterval(timer)
                              that.show5 = false
                              uni.showToast({ title: '开锁超时', icon: 'error', duration: 2000 });
                           }
                        }, 1000)
                     } else {
                        that.show5 = false
                        that.disable = false
                     }
                  },
                  fail() {
                     that.disable = false
                  }
               }
            });
               });
            }
         },
         // 获取经纬度
         getAddress() {
@@ -608,6 +648,10 @@
                  // 已换车
                  if (res.data.rideStatus === 2) {
                     this.show6 = true
                     return
                  }
                  if (res.data.rideStatus === -1) {
                     this.show6 = false
                  }
                  clearInterval(this.timer)
               }
@@ -666,15 +710,18 @@
                     }
                     if (res.data.rideStatus === 2) {
                        this.show6 = true
                        this.refreshStatus()
                     }
                     // 是否营业
                     if (res.data.isBusiness === 0) {
                        this.title = '暂停营业提醒'
                        this.content = res.data.unBusinessTips
                        this.show4 = true
                        return
                     }
                     // 是否停止服务
                     if (res.data.isStopServe === 1) {
                        this.title = '暂停服务提醒'
                        this.content = res.data.stopServeTips
                        this.show4 = true
                     }
@@ -753,24 +800,36 @@
<style lang="scss" scoped>
   .index {
      width: 100%;
      height: auto;

      .index_nav {
         width: 100%;
         height: auto;
         background: repeating-linear-gradient(to bottom, #9AE2DF, #ffffff);

         .index_nav_b {
			
         .index_nav_box {
            width: 100%;
            padding: 0 30rpx;
            box-sizing: border-box;
            height: auto;
            position: fixed;
            z-index: 9;

            text {
               font-size: 38rpx;
               font-family: PingFangSC-Semibold, PingFang SC;
               font-weight: 600;
               color: #222222;
            top: 0;
            left: 0;
            z-index: 999;
				
            .index_nav_b {
               width: 100%;
               padding: 0 30rpx;
               box-sizing: border-box;
               position: fixed;
               z-index: 9;
				
               text {
                  font-size: 38rpx;
                  font-family: PingFangSC-Semibold, PingFang SC;
                  font-weight: 600;
                  color: #222222;
               }
            }
				
         }

         .index_box {
@@ -884,10 +943,16 @@
               overflow: hidden;
               margin-top: 20rpx;
            }
				
            .index_zw1 {
               width: 100%;
               height: calc(env(safe-area-inset-bottom) + 310rpx);
            }

            .index_zw {
               width: 100%;
               height: 336rpx;
               // height: 336rpx;
               height: 680rpx;
            }
         }
      }
@@ -1000,6 +1065,7 @@

            .red {
               color: #FC2525 !important;
               font-size: 30rpx !important;
            }

            text {