9 changed files with 505 additions and 6 deletions
@ -0,0 +1,258 @@ |
|||||
|
// pages/user/order/list.js
|
||||
|
import commonApi from "../../../../utils/https/common" |
||||
|
import util from "../../../../utils/util" |
||||
|
let app = getApp() |
||||
|
Page({ |
||||
|
|
||||
|
/** |
||||
|
* 页面的初始数据 |
||||
|
*/ |
||||
|
data: { |
||||
|
list:[], |
||||
|
keywords:"", |
||||
|
orderState:['组团中','等待确认','待出行','待出行','已完成','场馆拒接','已取消'], |
||||
|
type:-1, |
||||
|
lon:"", |
||||
|
lat:"" |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面加载 |
||||
|
*/ |
||||
|
onLoad: function (options) { |
||||
|
wx.getLocation({ |
||||
|
type: 'gcj02', |
||||
|
success: (r)=>{ |
||||
|
this.setData({ |
||||
|
lon:r.longitude, |
||||
|
lat:r.latitude |
||||
|
}) |
||||
|
this.getList(); |
||||
|
} |
||||
|
}) |
||||
|
|
||||
|
}, |
||||
|
gotoWeb:function(e){ |
||||
|
let web = e.currentTarget.dataset.web; |
||||
|
app.globalData.weburl = web; |
||||
|
wx.navigateTo({ |
||||
|
url: '/pages/pbService/web/index', |
||||
|
}) |
||||
|
}, |
||||
|
changeKeyword:function(e){ |
||||
|
this.setData({ |
||||
|
keywords:e.detail.value |
||||
|
}) |
||||
|
}, |
||||
|
refundInfo:function(e){ |
||||
|
let id = e.currentTarget.dataset.id; |
||||
|
wx.navigateTo({ |
||||
|
url: 'refundInfo/index?id='+id, |
||||
|
}) |
||||
|
}, |
||||
|
gotoComment:function(e){ |
||||
|
let id = e.currentTarget.dataset.id; |
||||
|
wx.navigateTo({ |
||||
|
url: '/pages/order/comment/index?id='+id, |
||||
|
}) |
||||
|
}, |
||||
|
// 再次预定
|
||||
|
order:function(e){ |
||||
|
let item = e.currentTarget.dataset.item; |
||||
|
console.log(item) |
||||
|
wx.navigateTo({ |
||||
|
url: '/pages/info/museumInfo/index?isGroup=1&id='+item.order_product_list[0].scene_id |
||||
|
}) |
||||
|
// util.orderMoreTime(item)
|
||||
|
}, |
||||
|
pay:function(e){ |
||||
|
let id = e.currentTarget.dataset.id; |
||||
|
wx.navigateTo({ |
||||
|
url: '/pages/order/pay/index?id='+id, |
||||
|
}) |
||||
|
}, |
||||
|
search:function(){ |
||||
|
this.setData({ |
||||
|
realKeyword:this.data.keywords, |
||||
|
list:[], |
||||
|
total:1 |
||||
|
}) |
||||
|
this.getList() |
||||
|
}, |
||||
|
getList:function(){ |
||||
|
let list = this.data.list; |
||||
|
if(list.length>=this.data.total) return; |
||||
|
commonApi.user_post("team_order/team_list",{ |
||||
|
state:this.data.type>-1?this.data.type:null, |
||||
|
offset:this.data.list.length, |
||||
|
limit:10, |
||||
|
keywords:this.data.keywords |
||||
|
}).then(res=>{ |
||||
|
let ajaxes = [],indexes=[] |
||||
|
res.data.list.map((item,index)=>{ |
||||
|
let orderNum = 0; |
||||
|
item.order_product_list.map(order=>{ |
||||
|
orderNum = orderNum + order.product_num; |
||||
|
// 景点线路场馆酒店四类产品的订单 如果是已支付未出票的显示出票中
|
||||
|
if(order.state=='PAID' && (order.product_model=='venue' || order.product_model=='ticket' || order.product_model=='hotel' || order.product_model=='line')){ |
||||
|
item.orderStateText="出票中" |
||||
|
} |
||||
|
}) |
||||
|
if(item.order_product_list.length==1 && item.order_product_list[0].scene_id && item.state!='UNPAID' && item.state!='CLOSED' && item.state.indexOf("REFUND")==-1){ |
||||
|
let ajax = commonApi.user_post("order/tripplan",{ |
||||
|
point_type: "gd", |
||||
|
child_order_id:item.order_product_list[0].child_order_id, |
||||
|
lat:this.data.lat, |
||||
|
lon:this.data.lon |
||||
|
}) |
||||
|
ajaxes.push(ajax); |
||||
|
indexes.push(index); |
||||
|
} |
||||
|
item.orderNum = orderNum; |
||||
|
}) |
||||
|
console.log(ajaxes) |
||||
|
if(ajaxes.length==0){ |
||||
|
this.setData({ |
||||
|
total:res.data.total, |
||||
|
list:list.concat(res.data.list) |
||||
|
}) |
||||
|
return; |
||||
|
} |
||||
|
Promise.all(ajaxes).then((r)=>{ |
||||
|
r.map((item,index)=>{ |
||||
|
if(item && item.data && item.data.url){ |
||||
|
res.data.list[indexes[index]].guihuaUrl = item.data.url |
||||
|
} |
||||
|
}) |
||||
|
this.setData({ |
||||
|
total:res.data.total, |
||||
|
list:list.concat(res.data.list) |
||||
|
}) |
||||
|
}) |
||||
|
|
||||
|
}) |
||||
|
}, |
||||
|
gotoDetail:function(e){ |
||||
|
let item = e.currentTarget.dataset.item; |
||||
|
wx.navigateTo({ |
||||
|
url: '/pages/info/groupOrderInfo/index?id='+item.order_id, |
||||
|
}) |
||||
|
}, |
||||
|
gotoProductDetail:function(e){ |
||||
|
let item = e.currentTarget.dataset.item; |
||||
|
util.orderMoreTime({order_product_list:[item]}) |
||||
|
}, |
||||
|
changeType:function(e){ |
||||
|
let type = e.currentTarget.dataset.type; |
||||
|
this.setData({ |
||||
|
type:Number(type), |
||||
|
list:[], |
||||
|
total:1 |
||||
|
}) |
||||
|
this.getList() |
||||
|
}, |
||||
|
refund:function(e){ |
||||
|
let index = e.currentTarget.dataset.index,list = this.data.list,item = list[index],that = this; |
||||
|
wx.showModal({ |
||||
|
title:"提示", |
||||
|
content:"确定取消吗?", |
||||
|
success:function(res){ |
||||
|
if(res.confirm){ |
||||
|
// 确定取消
|
||||
|
commonApi.user_post("order/refund",{ |
||||
|
order_id:item.order_id |
||||
|
}).then(res=>{ |
||||
|
if(res.code==1){ |
||||
|
wx.showToast({ |
||||
|
title: '已取消', |
||||
|
icon:'success' |
||||
|
}) |
||||
|
if(that.data.type){ |
||||
|
list.splice(index,1); |
||||
|
} |
||||
|
else { |
||||
|
list[index].state='WAIT_REFUND'; |
||||
|
} |
||||
|
that.setData({ |
||||
|
list:list |
||||
|
}) |
||||
|
} |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
|
}) |
||||
|
}, |
||||
|
cancel:function(e){ |
||||
|
let index = e.currentTarget.dataset.index,list = this.data.list,item = list[index],that = this; |
||||
|
wx.showModal({ |
||||
|
title:"提示", |
||||
|
content:"确定取消吗?", |
||||
|
success:function(res){ |
||||
|
if(res.confirm){ |
||||
|
// 确定取消
|
||||
|
commonApi.user_post("order/close",{ |
||||
|
order_id:item.order_id |
||||
|
}).then(res=>{ |
||||
|
if(res.code==1){ |
||||
|
wx.showToast({ |
||||
|
title: '已取消', |
||||
|
icon:'success' |
||||
|
}) |
||||
|
if(that.data.type){ |
||||
|
list.splice(index,1); |
||||
|
} |
||||
|
else { |
||||
|
list[index].state='CLOSED'; |
||||
|
} |
||||
|
that.setData({ |
||||
|
list:list |
||||
|
}) |
||||
|
} |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
|
}) |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面初次渲染完成 |
||||
|
*/ |
||||
|
onReady: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面显示 |
||||
|
*/ |
||||
|
onShow: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面隐藏 |
||||
|
*/ |
||||
|
onHide: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面卸载 |
||||
|
*/ |
||||
|
onUnload: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 页面相关事件处理函数--监听用户下拉动作 |
||||
|
*/ |
||||
|
onPullDownRefresh: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 页面上拉触底事件的处理函数 |
||||
|
*/ |
||||
|
onReachBottom: function () { |
||||
|
this.getList() |
||||
|
} |
||||
|
}) |
||||
@ -0,0 +1,5 @@ |
|||||
|
{ |
||||
|
"usingComponents": { |
||||
|
"title":"/pages/component/TitleHeader" |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,51 @@ |
|||||
|
<!--pages/user/order/list.wxml--> |
||||
|
<title title="订单"></title> |
||||
|
<view class="fixed-top"> |
||||
|
<view class="search-box"> |
||||
|
<view class="iconfont icon-sousuo"></view> |
||||
|
<input bindinput="changeKeyword" type="text" placeholder="搜索我的订单"></input> |
||||
|
<view class="search-btn" bindtap="search">搜索</view> |
||||
|
</view> |
||||
|
<view class="types"> |
||||
|
<view class="type-item{{type==-1?' active':''}}" bindtap="changeType" data-type="-1">全部</view> |
||||
|
<view class="type-item{{type===0?' active':''}}" bindtap="changeType" data-type="0">组团中</view> |
||||
|
<view class="type-item{{type===1?' active':''}}" bindtap="changeType" data-type="1">等待确认</view> |
||||
|
<view class="type-item{{type===2?' active':''}}" bindtap="changeType" data-type="2">待出行</view> |
||||
|
<view class="type-item{{type===3?' active':''}}" bindtap="changeType" data-type="3">已完成</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view style="height:176rpx"></view> |
||||
|
<view class="order-item" bindtap="gotoDetail" data-item="{{item}}" wx:for="{{list}}"> |
||||
|
<view class="order-top"> |
||||
|
<text>订单号:{{item.order_id}}</text> |
||||
|
<text class="status">{{orderState[item.team_state]}}</text> |
||||
|
</view> |
||||
|
<view data-item="{{item}}" class="order-info" wx:for="{{item.order_product_list}}"> |
||||
|
<image src="{{item.product_model=='movie'?item.product_img:item.sku_headimg}}" mode="aspectFill"></image> |
||||
|
<view class="sku-title textOver2">{{item.product_model=='movie'?item.product_title:(item.product_title+item.sku_name)}}</view> |
||||
|
<view class="sku-tips"> |
||||
|
<view class="sku-price">¥{{item.product_price/100}}</view> |
||||
|
<view class="sku-number">x{{item.product_num}}</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view style="text-align:right;font-size:28rpx;margin-right:30rpx;color:#333"> |
||||
|
<text>共{{item.orderNum}}件商品</text> |
||||
|
</view> |
||||
|
<view style="text-align:right;font-size:28rpx;margin:20rpx 30rpx;margin-bottom:0rpx;color:#333"> |
||||
|
<text class="all-price" style="color:#999">总价 ¥{{item.total_money/100}}</text><text class="all-price" style="margin-left:30rpx">需付款 ¥{{item.paid_money/100}}</text> |
||||
|
</view> |
||||
|
<!-- <view class="total"><text>共{{item.orderNum}}件商品</text><text style="margin-left:20rpx">合计</text> <text class="all-price">¥{{item.total_money/100}}</text></view> --> |
||||
|
<view class="btns"> |
||||
|
<view wx:if="{{item.guihuaUrl}}" catchtap="gotoWeb" data-web="{{item.guihuaUrl}}" class="btn" data-item="{{item}}">行程规划</view> |
||||
|
<view class="btn" catchtap="order" data-item="{{item}}">再次购买</view> |
||||
|
<view catchtap="gotoComment" data-id="{{item.order_id}}" class="btn" wx:if="{{item.state=='WAIT_COMMENT'}}">立即评价</view> |
||||
|
<view catchtap="cancel" data-index="{{index}}" class="btn" wx:if="{{item.state=='UNPAID'}}">取消预订</view> |
||||
|
<view catchtap="refund" data-index="{{index}}" class="btn" wx:if="{{item.state=='PAID'}}">取消预订</view> |
||||
|
<view catchtap="refundInfo" data-id="{{item.order_id}}" class="btn" wx:if="{{item.state=='WAIT_REFUND' || item.state=='REFUND' || item.state=='NEED_REFUND' || item.state=='REFUNDING'}}">退款详情</view> |
||||
|
<view catchtap="pay" data-id="{{item.order_id}}" class="btn active" wx:if="{{item.state=='UNPAID'}}">立即支付</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="empty-box" wx:if="{{list.length==0}}"> |
||||
|
<image src="https://static.ticket.sz-trip.com/xcxImages/other/order-empty.png" mode="widthFix"></image> |
||||
|
<view>还没有订单,赶快去下单吧~</view> |
||||
|
</view> |
||||
@ -0,0 +1,167 @@ |
|||||
|
/* pages/user/order/list.wxss */ |
||||
|
page { |
||||
|
background: #f6f6f6; |
||||
|
} |
||||
|
.fixed-top { |
||||
|
position: fixed; |
||||
|
left: 0; |
||||
|
right: 0; |
||||
|
background: white; |
||||
|
padding: 0 30rpx; |
||||
|
padding-top: 20rpx; |
||||
|
} |
||||
|
.types { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
line-height: 50rpx; |
||||
|
height: 95rpx; |
||||
|
color: #333; |
||||
|
font-size: 26rpx; |
||||
|
overflow-x: auto; |
||||
|
} |
||||
|
.type-item { |
||||
|
position: relative; |
||||
|
margin-right: 60rpx; |
||||
|
flex-shrink: 0; |
||||
|
} |
||||
|
.type-item.active { |
||||
|
color: #0B898E; |
||||
|
font-weight: bold; |
||||
|
} |
||||
|
.type-item.active::after { |
||||
|
display: block; |
||||
|
font-size: 0; |
||||
|
content: "1"; |
||||
|
width: 30rpx; |
||||
|
height: 4rpx; |
||||
|
background: #0B898E; |
||||
|
border-radius: 2rpx; |
||||
|
left: 50%; |
||||
|
position: absolute; |
||||
|
margin-left: -15rpx; |
||||
|
top: 100%; |
||||
|
} |
||||
|
.order-item { |
||||
|
margin: 20rpx 30rpx; |
||||
|
background: white; |
||||
|
border-radius: 20rpx; |
||||
|
} |
||||
|
.order-top { |
||||
|
display: flex; |
||||
|
padding: 0 20rpx; |
||||
|
height: 80rpx; |
||||
|
align-items: center; |
||||
|
border-bottom: 1rpx solid #d8d8d8; |
||||
|
font-size: 26rpx; |
||||
|
color: #888; |
||||
|
justify-content: space-between; |
||||
|
} |
||||
|
.order-top .status { |
||||
|
color: #D62828; |
||||
|
} |
||||
|
.order-info { |
||||
|
display: flex; |
||||
|
padding: 20rpx; |
||||
|
justify-content: space-between; |
||||
|
color: #333333; |
||||
|
font-size: 26rpx; |
||||
|
} |
||||
|
.order-info image { |
||||
|
flex-shrink: 0; |
||||
|
width: 140rpx; |
||||
|
height: 140rpx; |
||||
|
border-radius: 10rpx; |
||||
|
} |
||||
|
.order-info .sku-title { |
||||
|
flex: 1; |
||||
|
margin: 0 20rpx; |
||||
|
line-height: 40rpx; |
||||
|
height: 80rpx; |
||||
|
} |
||||
|
.sku-tips { |
||||
|
text-align: right; |
||||
|
flex-shrink: 0; |
||||
|
line-height: 40rpx; |
||||
|
} |
||||
|
.sku-tips .sku-price { |
||||
|
margin-bottom: 10rpx; |
||||
|
} |
||||
|
.total { |
||||
|
text-align: right; |
||||
|
margin-right: 20rpx; |
||||
|
} |
||||
|
.total .all-price { |
||||
|
font-size: 36rpx; |
||||
|
font-weight: bold; |
||||
|
} |
||||
|
.btns { |
||||
|
display: flex; |
||||
|
justify-content: flex-end; |
||||
|
padding: 20rpx; |
||||
|
align-items: center; |
||||
|
} |
||||
|
.btn { |
||||
|
width: 158rpx; |
||||
|
line-height: 58rpx; |
||||
|
background: #fff; |
||||
|
border: 1rpx solid #D8D8D8; |
||||
|
border-radius: 30rpx; |
||||
|
text-align: center; |
||||
|
font-size: 26rpx; |
||||
|
margin-left: 20rpx; |
||||
|
color: #333; |
||||
|
} |
||||
|
.active.btn { |
||||
|
background: #FC9132; |
||||
|
border-color: #FC9132; |
||||
|
color: #fff; |
||||
|
} |
||||
|
.search-box { |
||||
|
display: flex; |
||||
|
margin: 0 30rpx; |
||||
|
background: #EDEDED; |
||||
|
line-height: 60rpx; |
||||
|
border-radius: 30rpx; |
||||
|
padding-left: 20rpx; |
||||
|
font-size: 26rpx; |
||||
|
align-items: center; |
||||
|
justify-content: space-between; |
||||
|
} |
||||
|
.search-box .iconfont { |
||||
|
color: #999999; |
||||
|
font-size: 30rpx; |
||||
|
flex-shrink: 0; |
||||
|
} |
||||
|
.search-box input { |
||||
|
flex: 1; |
||||
|
margin: 0 15rpx; |
||||
|
} |
||||
|
.search-box .search-btn { |
||||
|
width: 110rpx; |
||||
|
text-align: center; |
||||
|
line-height: 40rpx; |
||||
|
color: #0B898E; |
||||
|
flex-shrink: 0; |
||||
|
font-size: 26rpx; |
||||
|
border-left: 1rpx solid #ccc; |
||||
|
} |
||||
|
.empty-box { |
||||
|
position: absolute; |
||||
|
left: 0; |
||||
|
right: 0; |
||||
|
top: 0; |
||||
|
bottom: 0; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
flex-direction: column; |
||||
|
font-size: 26rpx; |
||||
|
color: #888; |
||||
|
text-align: center; |
||||
|
z-index: -1; |
||||
|
} |
||||
|
.empty-box image { |
||||
|
width: 260rpx; |
||||
|
display: block; |
||||
|
margin-bottom: 20rpx; |
||||
|
} |
||||
Loading…
Reference in new issue