| | |
| | | <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', top: navHeight + 'px' }"> |
| | | <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 class="index_box"> |
| | | <view class="index_box_map"> |
| | | <map class="map" :show-location="true" :markers="markers" :latitude="latitude" :longitude="longitude" /> |
| | | <cover-view class="index_box_icon" @click="jumpMap"> |
| | | <view class="index_box_icon" @click="jumpMap"> |
| | | <image src="@/static/icon/ic_fullscreen@2x.png" mode="widthFix"></image> |
| | | </cover-view> |
| | | |
| | | </view> |
| | | </view> |
| | | <view class="index_box_title" :style="{ backgroundImage: 'url(' + bgImg + ')' }"> |
| | | <view class="index_box_title_left"> |
| | |
| | | </image> |
| | | </view> |
| | | <view class="index_box_function"> |
| | | <view class="fx1 cXYC" v-for="(item, index) in functionList" :key="index" @click="jump(item)"> |
| | | <view class="cXYC" v-for="(item, index) in functionList" :key="index" @click="jump(item)"> |
| | | <image class="img80" :src="item.icon" mode="widthFix"></image> |
| | | <text class="f26 b c3 mt10">{{item.name}}</text> |
| | | <text class="f26 c3 mt10">{{item.name}}</text> |
| | | </view> |
| | | </view> |
| | | <view class="index_box_poster"> |
| | | <view class="index_box_poster" @click="jumpX"> |
| | | <image class="imgfull" :src="info.leaseNoticeUrl" mode="widthFix"></image> |
| | | </view> |
| | | <view class="index_box_video" v-if="info.leaseVideoUrl"> |
| | |
| | | <view class="index_scancode_bottom" @click="carRental" v-else>扫码租车</view> |
| | | <view class="index_scancode_zw"></view> |
| | | </view> |
| | | <!-- 广告 --> |
| | | <u-popup :show="show" mode="center" bgColor="transparent" :round="10" @close="show = false"> |
| | | <view class="popupbox"> |
| | | <view class="advertisement"> |
| | | <image :src="info.adList[0].imgurl" mode="widthFix"></image> |
| | | </view> |
| | | <image class="close" @click="show = false" src="@/static/images/ic_close@2x.png" mode="widthFix"> |
| | | </image> |
| | | </view> |
| | | </u-popup> |
| | | <!-- 缴纳押金 --> |
| | | <u-popup :show="show1" :closeOnClickOverlay="false" mode="bottom" bgColor="#fff" :round="10" |
| | | @close="show1 = false"> |
| | |
| | | <image src="@/static/icon/ic_select@2x.png" mode="widthFix" v-if="!active"></image> |
| | | <image src="@/static/icon/ic_selected@2x.png" mode="widthFix" v-else></image> |
| | | <view class="deposit_read_z"> |
| | | 我已阅读<text>《租赁须知》</text>和<text @click.stop="jumpgz">《计价规则》</text> |
| | | 我已阅读<text @click.stop="jumpX">《租赁须知》</text>和<text @click.stop="jumpgz">《计价规则》</text> |
| | | </view> |
| | | </view> |
| | | <view class="deposit_footer"> |
| | |
| | | </view> |
| | | </u-popup> |
| | | <!-- 骑行中 --> |
| | | <u-popup :show="show2" :closeOnClickOverlay="false" mode="bottom" bgColor="#fff" :round="10" |
| | | <u-popup :show="show2" overlayOpacity="0" :closeOnClickOverlay="false" mode="bottom" bgColor="#fff" :round="10" |
| | | @close="show2 = false"> |
| | | <view class="ride"> |
| | | <view class="ride_head"> |
| | |
| | | </view> |
| | | <view class="ride_content_info"> |
| | | <image src="@/static/icon/ic_tip@2x.png" mode="widthFix"></image> |
| | | <text>支持中途还车,骑行时间自动累计,如更换车型,按所取车辆中最高车型计费</text> |
| | | <text v-if="info.tips">{{info.tips}}</text> |
| | | </view> |
| | | </view> |
| | | <view class="ride_btn" @click="navigationReturn">导航至园区站还车点</view> |
| | |
| | | </view> |
| | | </u-popup> |
| | | <!-- 已还车 --> |
| | | <u-popup :show="show6" :closeOnClickOverlay="false" mode="bottom" bgColor="#fff" :round="10" |
| | | <u-popup :show="show6" overlayOpacity="0" :closeOnClickOverlay="false" mode="bottom" bgColor="#fff" :round="10" |
| | | @close="show6 = false"> |
| | | <view class="ride"> |
| | | <view class="ride_head"> |
| | |
| | | <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> |
| | | <!-- 广告 --> |
| | | <u-popup :show="show" mode="center" bgColor="transparent" :round="10" @close="show = false"> |
| | | <view class="popupbox"> |
| | | <view class="advertisement"> |
| | | <image :src="info.adList[0].imgfullurl" mode="widthFix"></image> |
| | | </view> |
| | | <image class="close" @click="show = false" src="@/static/images/ic_close@2x.png" mode="widthFix"> |
| | | </image> |
| | | </view> |
| | | </u-popup> |
| | | </view> |
| | | </template> |
| | | |
| | |
| | | ], |
| | | |
| | | info: {}, |
| | | content: '' |
| | | content: '', |
| | | |
| | | timer: null, |
| | | isDisabled: true |
| | | } |
| | | }, |
| | | computed: { |
| | |
| | | this.getSite() |
| | | }, |
| | | methods: { |
| | | jumpX() { |
| | | uni.navigateTo({ |
| | | url: '/pages/leaseNotice/leaseNotice' |
| | | }); |
| | | }, |
| | | jumpMap() { |
| | | uni.navigateTo({ |
| | | url: '/pages/maps/maps' |
| | |
| | | longitude: item.longitude, |
| | | title: item.name, |
| | | iconPath: '/static/icon/ic_bike@2x.png', |
| | | addr: item.addr, |
| | | clusterId: 1, |
| | | joinCluster: true |
| | | addr: item.addr |
| | | }) |
| | | }) |
| | | } |
| | |
| | | }, |
| | | // 结算 |
| | | settlement1() { |
| | | this.$u.api.goodsOrderSettlement({ |
| | | 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.show3 = false |
| | | this.show7 = false |
| | | } |
| | | }) |
| | | if (this.isDisabled) { |
| | | 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.show7 = false |
| | | this.isDisabled = true |
| | | } |
| | | }) |
| | | } |
| | | }, |
| | | minute() { |
| | | this.show3 = false |
| | |
| | | }); |
| | | } else if (item.id === 2) { |
| | | if (this.info.depositStatus === 1) { |
| | | // this.settlement1() |
| | | // this.show7 = true |
| | | this.show3 = true |
| | | } else { |
| | | uni.showToast({ title: '您暂无押金,无需结算!', icon: 'none', duration: 2000 }); |
| | |
| | | }, |
| | | }); |
| | | }, |
| | | // 刷新骑行状态 |
| | | refreshStatus() { |
| | | this.timer = setInterval(async () => { |
| | | let res = await this.$u.api.home() |
| | | if (res.code === 200) { |
| | | this.info = res.data |
| | | // 骑行中 |
| | | if (res.data.rideStatus === 1) { |
| | | return |
| | | } |
| | | this.show2 = false |
| | | // 已换车 |
| | | if (res.data.rideStatus === 2) { |
| | | this.show6 = true |
| | | } |
| | | clearInterval(this.timer) |
| | | } |
| | | }, 10000) |
| | | }, |
| | | // 获取首页信息 |
| | | getHomeInfo() { |
| | | this.$u.api.home() |
| | |
| | | } |
| | | }, 1000) |
| | | } |
| | | // 骑行中 |
| | | if (res.data.rideStatus === 1) { |
| | | this.show2 = true |
| | | this.refreshStatus() |
| | | } |
| | | if (res.data.rideStatus === 5) { |
| | | this.show5 = true |
| | |
| | | } |
| | | if (res.data.rideStatus === 1) { |
| | | this.show2 = true |
| | | this.refreshStatus() |
| | | } |
| | | if (res.data.rideStatus === 5) { |
| | | this.show5 = true |
| | |
| | | phoneNumber: mobile |
| | | }); |
| | | } |
| | | }, |
| | | destroyed() { |
| | | clearInterval(this.timer) |
| | | } |
| | | } |
| | | </script> |
| | |
| | | width: 100%; |
| | | padding: 0 30rpx; |
| | | box-sizing: border-box; |
| | | position: sticky; |
| | | position: fixed; |
| | | z-index: 9; |
| | | |
| | | text { |
| | |
| | | border-radius: 20rpx; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: space-between; |
| | | position: relative; |
| | | top: -24rpx; |
| | | text { |
| | | font-weight: 400; |
| | | } |
| | | } |
| | | |
| | | .index_box_poster { |