Myth
5 years ago
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