232 lines
7.4 KiB
Vue
232 lines
7.4 KiB
Vue
<template>
|
||
<view>
|
||
<view class="order">
|
||
<view class="content">
|
||
<view v-if="list.length>0">
|
||
<view class="order-jf-li" v-for="(item,index) in list" :key="index" >
|
||
<view class="bianhao flex fsz28" @click.stop="godetails(item)">
|
||
<text>订单编号：{{item.order_no}}</text>
|
||
<text v-if=" item.status==1">
|
||
{{item.pay_status_text}} <text v-if=" item.shipping_status>0">,{{item.shipping_status_text}}</text>
|
||
<text v-if=" item.refund_status ==1">,{{item.refund_status_text}}</text>
|
||
|
||
</text>
|
||
<text v-if=" item.status>1"><text v-if=" item.refund_status ==2">{{item.refund_status_text}},</text>
|
||
{{item.status_text}}</text>
|
||
</view>
|
||
<view class="order-jf-img flex" @click.stop="godetails(item)">
|
||
<view class="left">
|
||
<image :src="item.goods_image" class="tu-row-item-l little-img"></image>
|
||
</view>
|
||
<view class=" fsz32 overflow4" style="margin-left:8px;flex: 0 0 68%;">
|
||
<view class="goods_name">{{item.goods_name}}</view>
|
||
<view class="fsz32" style="text-align: right;">
|
||
x{{item.number}}
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
<view class="order-jf-time flex fsz28" @click="godetails(item)">
|
||
<view class="fsz34">
|
||
<text class="fsz28" style="color:#333;">合计：</text> {{item.order_point}}积分+{{item.order_amount}}元
|
||
</view>
|
||
</view>
|
||
<view class="order-jf-btn fsz28">
|
||
<view class="btn btn-default" @click="godetails(item)">详情</view>
|
||
<template v-if="item.auth_cancel == 1">
|
||
<view class="btn btn-default" @click.stop="closeorder(item)">取消订单</view>
|
||
</template>
|
||
<template v-if="item.auth_pay == 1">
|
||
<view class="btn btn-default" @click.stop="gopay(item)">去支付</view>
|
||
</template>
|
||
<template v-if="item.auth_finish == 1">
|
||
<view class="btn btn-default" @click.stop="gofinish(item)">完成</view>
|
||
</template>
|
||
<view class="btn btn-default" @click.stop="gorefund(item)" v-if="item.auth_refund == 1">申请退款</view>
|
||
</view>
|
||
</view>
|
||
<uni-load-more :status="loadmore" :content-text="contentText" />
|
||
</view>
|
||
<view class="zanwuimg" v-if="list.length == 0">
|
||
<image src="../../static/img/null.png" mode="widthFix"></image>
|
||
<view>暂无相关订单</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default{
|
||
data(){
|
||
return{
|
||
page:1,
|
||
list:[],
|
||
ifBottomRefresh:false,
|
||
loadmore: 'more',
|
||
contentText: {
|
||
contentdown: '查看更多',
|
||
contentrefresh: '加载中',
|
||
contentnomore: '没有更多'
|
||
},
|
||
state:0,
|
||
orderId:'',
|
||
isshow:true,
|
||
}
|
||
},
|
||
onShow() {
|
||
uni.$on('getload',(data)=>{
|
||
this.getdata()
|
||
})
|
||
},
|
||
onLoad(options) {
|
||
this.getdata()
|
||
},
|
||
onReachBottom() {
|
||
this.page += 1
|
||
if (this.loadmore == 'noMore') return
|
||
this.ifBottomRefresh = true
|
||
this.getdata()
|
||
},
|
||
methods:{
|
||
onClickItem(e) {
|
||
this.current = e.currentIndex
|
||
this.ifBottomRefresh = false
|
||
this.getdata()
|
||
},
|
||
getdata(){
|
||
let data = {
|
||
page:this.page
|
||
}
|
||
this.$api.exchangeOrderlist(data,res=>{
|
||
if(res.code == '1'){
|
||
this.list= this.list.concat(res.data.list.data)
|
||
this.loadmore = this.list.length < res.data.list.total ? 'more' : 'noMore'
|
||
}
|
||
})
|
||
},
|
||
godetails(item){
|
||
uni.navigateTo({
|
||
url:'/pages/exchange/orderdetail?id='+item.id
|
||
})
|
||
},
|
||
gorefund(item){
|
||
uni.showModal({
|
||
title:'提示',
|
||
content: '确认申请退款吗?',
|
||
success:(ret)=>{
|
||
if(ret.confirm){
|
||
this.$api.exchangeRefund({id:item.id},res=>{
|
||
if(res.code == '1'){
|
||
uni.showToast({ title: '申请退款成功' , icon: 'success' })
|
||
this.page =1;
|
||
this.list =[];
|
||
this.getdata()
|
||
}else{
|
||
uni.showToast({ title: res.msg , icon: 'none' })
|
||
}
|
||
})
|
||
}
|
||
}
|
||
})
|
||
},
|
||
gofinish(item){
|
||
uni.showModal({
|
||
title:'提示',
|
||
content: '确认完成吗?',
|
||
success:(ret)=>{
|
||
if(ret.confirm){
|
||
this.$api.exchangeFinish({id:item.id},res=>{
|
||
if(res.code == '1'){
|
||
uni.showToast({ title: res.msg , icon: 'success' }) ;
|
||
this.page =1;
|
||
this.list =[];
|
||
this.getdata()
|
||
}else{
|
||
uni.showToast({ title: res.msg , icon: 'none' })
|
||
}
|
||
})
|
||
}
|
||
}
|
||
})
|
||
|
||
},
|
||
gopay(item){
|
||
let that = this
|
||
this.$api.exchangePay({order_id:item.id},data=>{
|
||
if(data.code == '1'){
|
||
uni.requestPayment({
|
||
provider: 'wxpay',
|
||
appid:data.data.appId,
|
||
nonceStr:data.data.nonceStr,
|
||
package:data.data.package,
|
||
timeStamp: data.data.timeStamp,
|
||
signType: data.data.signType,
|
||
paySign:data.data.paySign,
|
||
success: function(e) {
|
||
that.page=1;
|
||
that.list=[];
|
||
that.getdata()
|
||
},
|
||
fail(err) {
|
||
console.log(err,'失败')
|
||
}
|
||
});
|
||
}else{
|
||
uni.showToast({ title: data.msg , icon: 'none' })
|
||
}
|
||
})
|
||
},
|
||
closeorder(item){
|
||
uni.showModal({
|
||
title:'提示',
|
||
content: '确认取消订单吗?',
|
||
success:(ret)=>{
|
||
if(ret.confirm){
|
||
this.$api.exchangeCancelorder({id:item.id},res=>{
|
||
if(res.code == '1'){
|
||
uni.showToast({ title: '取消成功' , icon: 'success' })
|
||
this.page =1;
|
||
this.list =[];
|
||
this.getdata()
|
||
}else{
|
||
uni.showToast({ title: res.msg , icon: 'none' })
|
||
}
|
||
})
|
||
|
||
}
|
||
}
|
||
})
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
<style>
|
||
.mainwidth2{margin: 0;}
|
||
.order{width: 96%;margin: 0 auto;}
|
||
.order-jf-li{background: #fff;border-radius: 10rpx;padding: 24rpx; box-shadow: 2px 2px 5px 2px #eee;margin-bottom: 40rpx;}
|
||
.flex{display: flex;justify-content: space-between;margin-bottom: 30rpx;}
|
||
.bianhao{color:#777777;}
|
||
.order-jf-img .left{flex:0 0 30%;}
|
||
.order-jf-img .right{flex:0 0 68%;font-weight: 700;}
|
||
.order-jf-img .left image{width: 100%;height: 150rpx;border-radius: 10rpx;}
|
||
.order-jf-time{line-height: 50rpx;align-items: center;}
|
||
.order-jf-time .fsz34{font-weight: 700;color:red;}
|
||
.order-jf-btn{display: flex;justify-content: flex-end;position: relative;height: 64rpx;}
|
||
.order-jf-btn .state{color: #fa8a1e;padding: 0;position: absolute;left: 0;margin: 0;border: none;}
|
||
.content{margin-top: 30rpx;}
|
||
.order-jf-time .fsz28{color: #777;}
|
||
.kaipiao{position: relative;}
|
||
.kaipiao .tishi{position: absolute;width: 400rpx;background: #ddd;text-align: center;border-radius: 10rpx;top: -99rpx;left: -50%;}
|
||
.sanjiao{width: 0;height: 0;border-bottom: 18rpx solid transparent;position: absolute;border-top: 18rpx solid #ddd;border-left: 18rpx solid transparent;border-right: 18rpx solid transparent;left: 50%;transform: translateX(-50%);top: 62rpx;}
|
||
.goods_name{ line-height: 42rpx;
|
||
-webkit-line-clamp: 2;
|
||
display: -webkit-box;
|
||
text-overflow: ellipsis;
|
||
overflow: hidden;
|
||
-webkit-box-orient: vertical;
|
||
padding: 0rpx 18rpx;
|
||
box-sizing: border-box;
|
||
word-break: break-all;}
|
||
</style>
|