|
|
|
|
@ -1,7 +1,6 @@ |
|
|
|
|
<template> |
|
|
|
|
<view class="v-order-list"> |
|
|
|
|
<mescroll-body top="0" :topbar="true" :safearea="true" ref="mescrollRef" @init="mescrollInit" |
|
|
|
|
:down="downOption" @down="downCallback" @up="upCallback"> |
|
|
|
|
<mescroll-body ref="mescrollRef" @init="mescrollInit" @down="downCallback" @up="upCallback"> |
|
|
|
|
<view class="list_item container-fluid m-b-24" v-for="(item,index) in orderList"> |
|
|
|
|
<view class="item_title">{{item.hotelName}}</view> |
|
|
|
|
<view class="row"> |
|
|
|
|
@ -10,7 +9,11 @@ |
|
|
|
|
</view> |
|
|
|
|
<view class="item_content col"> |
|
|
|
|
<view class="content-title">{{item.houseName}}</view> |
|
|
|
|
<view class="content-date">{{item.checkTime}}--{{item.checkOutTime}}</view> |
|
|
|
|
<view class="content-date">{{item.checkTime}} |
|
|
|
|
<image src="https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/icon-data-line.png" |
|
|
|
|
mode="widthFix"> |
|
|
|
|
</image> |
|
|
|
|
{{item.checkOutTime}}</view> |
|
|
|
|
<view class="content-price">总价：¥{{item.orderAmount}}</view> |
|
|
|
|
<view class="content-bottom"> |
|
|
|
|
<view class="btn" v-if="item.orderStatus=='0'">去支付</view> |
|
|
|
|
@ -22,8 +25,8 @@ |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="tip-bage"></view> |
|
|
|
|
<view class="tip-state" v-if="item.orderStatus=='2'">等待商家确认中，请及时关注订单状态</view> |
|
|
|
|
<view class=""></view> |
|
|
|
|
<view class="tip-state m-t-12" v-if="item.orderStatus=='2'">等待商家确认中，请及时关注订单状态</view> |
|
|
|
|
<view class="state" :class="'type'+item.orderStatus">{{stateMessage(item.orderStatus)}}</view> |
|
|
|
|
</view> |
|
|
|
|
</mescroll-body> |
|
|
|
|
@ -49,7 +52,6 @@ |
|
|
|
|
this.upCallback() |
|
|
|
|
}, |
|
|
|
|
methods: { |
|
|
|
|
|
|
|
|
|
stateMessage: function(val) { |
|
|
|
|
//订单状态 0未支付 1已支付 2已取消 3 预定失败 4预定成功 5 已入住 6已离店 7 退款中 8已退款 |
|
|
|
|
switch (val) { |
|
|
|
|
@ -87,7 +89,6 @@ |
|
|
|
|
//联网加载数据 |
|
|
|
|
if (page) { |
|
|
|
|
this.loadData(page.num); |
|
|
|
|
|
|
|
|
|
} else { |
|
|
|
|
this.loadData(1); |
|
|
|
|
uni.pageScrollTo({ |
|
|
|
|
@ -96,6 +97,21 @@ |
|
|
|
|
}); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
/*下拉刷新的回调 */ |
|
|
|
|
downCallback(mescroll) { |
|
|
|
|
this.loadData(mescroll) |
|
|
|
|
//this.get_data(mescroll); |
|
|
|
|
// #ifdef H5 |
|
|
|
|
this.top = uni.upx2px(100 + 88) + 'px'; // H5的高度需加上 88的标题栏 |
|
|
|
|
// #endif |
|
|
|
|
// #ifndef H5 |
|
|
|
|
this.top = uni.upx2px(100) + 'px'; // 非H5不必加 |
|
|
|
|
// #endif |
|
|
|
|
setTimeout(() => { |
|
|
|
|
mescroll.endSuccess(); |
|
|
|
|
this.top = 0; |
|
|
|
|
}, 2500); |
|
|
|
|
}, |
|
|
|
|
// 下拉刷新 |
|
|
|
|
loadData(pageNo) { |
|
|
|
|
let that = this |
|
|
|
|
@ -173,7 +189,15 @@ |
|
|
|
|
padding: 30rpx 24rpx 20rpx 24rpx; |
|
|
|
|
background-color: #fff; |
|
|
|
|
border-radius: 10rpx; |
|
|
|
|
.item_title{ padding-left: 30rpx; font-size: 32rpx; color: #1B1B1B; font-weight: bold;} |
|
|
|
|
|
|
|
|
|
.item_title { |
|
|
|
|
margin-bottom: 10rpx; |
|
|
|
|
padding-left: 30rpx; |
|
|
|
|
font-size: 32rpx; |
|
|
|
|
color: #1B1B1B; |
|
|
|
|
font-weight: bold; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.item_image { |
|
|
|
|
width: 180rpx; |
|
|
|
|
height: 180rpx; |
|
|
|
|
@ -181,9 +205,9 @@ |
|
|
|
|
overflow: hidden; |
|
|
|
|
|
|
|
|
|
.img { |
|
|
|
|
width: 180rpx; |
|
|
|
|
width: 180rpx; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.tip-bage { |
|
|
|
|
position: absolute; |
|
|
|
|
@ -230,13 +254,14 @@ |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.tip-state { |
|
|
|
|
|
|
|
|
|
margin-left: -24rpx; |
|
|
|
|
margin-bottom: -24rpx; |
|
|
|
|
color: #0983FF; |
|
|
|
|
padding: 16rpx 30rpx; |
|
|
|
|
font-size: 28rpx; |
|
|
|
|
padding: 10rpx 30rpx; |
|
|
|
|
font-size: 24rpx; |
|
|
|
|
background: linear-gradient(to right, rgba(9, 131, 255, .15), transparent); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.item_content { |
|
|
|
|
|
|
|
|
|
.content-title, |
|
|
|
|
@ -246,24 +271,26 @@ |
|
|
|
|
color: #666666; |
|
|
|
|
font-size: 28rpx; |
|
|
|
|
} |
|
|
|
|
.content-date{image{width: 24rpx;height: 22rpx;margin: 0 10rpx;}} |
|
|
|
|
.content-bottom { |
|
|
|
|
text-align: right; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.btn { |
|
|
|
|
display: inline-block; |
|
|
|
|
margin: 0 10rpx; |
|
|
|
|
padding: 0 20rpx; |
|
|
|
|
border: 1rpx solid #CCCCCC; |
|
|
|
|
color: #1B1B1B; |
|
|
|
|
font-size: 28rpx; |
|
|
|
|
text-align: center; |
|
|
|
|
height: 64rpx; |
|
|
|
|
line-height: 64rpx; |
|
|
|
|
border-radius: 64rpx; |
|
|
|
|
height: 60rpx; |
|
|
|
|
line-height: 60rpx; |
|
|
|
|
border-radius: 60rpx; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
</style> |
