优化：支付、倒计时等

pagesMy/order.vue

@@ -1,11 +1,11 @@
 <template>
-	<view class="default_page" :style="{'min-height':h+'px', 'padding-top':mt+'px'}">
+	<view class="default_page adffc" :style="{'min-height':h+'px', 'padding-top':mt+'px'}">
 		<cus-header title='我的订单'></cus-header>
 		<view class="tab adfac">
 			<view class="tab-pre" :class="{'active':tindex===index}" @click="changeTab(item,index)"
 				v-for="(item,index) in statusList" :key="index">{{item.name}}</view>
 		</view>
-		<view class="list">
+		<view class="list" v-if="list.length">
 			<view class="list-pre" v-for="(item,index) in list" :key="index" @click.prevent="handleDetail(item)">
 				<view class="list-pre-top adfacjb">
 					<view class="list-pre-top-no">订单号：{{item.orderNo}}</view>
@@ -23,15 +23,23 @@
 				</view>
 				<view class="list-pre-btns adf">
 					<view class="list-pre-btns-pre cancel" v-if="item.orderStatus==0" @click.stop="orderCancel(item)">取消订单</view>
-					<view class="list-pre-btns-pre" @click.stop="buyAgain">再次购买</view>
+					<view class="list-pre-btns-pre" @click.stop="handlePay(item)" v-if="item.orderStatus==0">立即支付</view>
+					<view class="list-pre-btns-pre" @click.stop="buyAgain" v-else>再次购买</view>
 				</view>
 			</view>
 		</view>
+		<view class="empty adffcacjc" v-else>
+			<page-empty text="暂无订单"></page-empty>
+		</view>
+		<WechatPay ref="wxPay" @confirmPay="toPay" @cancelPay="cancelPay"></WechatPay>
 	</view>
 </template>
 
 <script>
+	import PageEmpty from '@/components/pageEmpty/index.vue'
+	import WechatPay from '@/components/wechatPay/index.vue'
 	export default {
+		components:{ PageEmpty, WechatPay },
 		data(){
 			return {
 				tindex:0,
@@ -66,19 +74,18 @@
 					userId:''
 				},
 				isOver:false,
-				list:[]
+				list:[],
+				orderNo:''
 			}
 		},
 		onReachBottom() {
 			if(this.isOver) return
 			this.getList()
 		},
-		onLoad(options) {
-			try{
+		onShow() {
+			if(uni.getStorageSync('userInfo')){
 				this.query.userId = JSON.parse(uni.getStorageSync('userInfo')).id;
-				this.getList()
-			}catch(e){
-				this.query.userId = '';
+				this.init()
 			}
 		},
 		methods:{
@@ -121,6 +128,24 @@
 					}
 				})
 			},
+			handlePay(item){
+				this.orderNo = item.orderNo;
+				this.$refs.wxPay.payShow = true;
+			},
+			toPay(){
+				this.$api.post('/pay/createOrder',{
+					orderNo:this.orderNo,
+					openId:JSON.parse(uni.getStorageSync('userInfo')).openId
+				}).then(({data:res})=>{
+					if(!res.hasOwnProperty('paySign')) return this.$showToast('支付失败')
+					this.$refs.wxPay.payShow = false;
+					this.$wxPay(res).then(result => {
+						uni.navigateTo({
+							url:'/pagesPublish/payResult'
+						})
+					})
+				})
+			},
 			buyAgain(){
 				uni.navigateTo({
 					url:'/pagesPublish/rechargeCenter'
@@ -275,5 +300,10 @@
 				}
 			}
 		}
+	
+		.empty{
+			padding-top: 110rpx;
+			flex: 1;
+		}
 	}
 </style>

pagesMy/orderDetail.vue

@@ -36,16 +36,16 @@
 			</view>
 			<view class="form-item adfacjb">
 				<view class="form-item-title">有效期至</view>
-				<view class="form-item-value">{{orderInfo.expirationTime}}</view>
+				<view class="form-item-value">{{orderInfo.expirationTime||''}}</view>
 			</view>
 		</view>
 		<view class="bottom adfacjb">
-			<template v-if="orderInfo.status!=0">
+			<template v-if="orderInfo.orderStatus!=0">
 				<view class="bottom-default" @click="buyAgain">再次购买</view>
 			</template>
 			<template v-else>
-				<view class="bottom-default half qx" @click="orderCancel">取消</view>
-				<view class="bottom-default half" @click="orderPay">去支付</view>
+				<view class="bottom-default half qx" @click="orderCancel">取消订单</view>
+				<view class="bottom-default half" @click="orderPay">立即支付</view>
 			</template>
 		</view>
 		<WechatPay ref="wxPay" @confirmPay="toPay" @cancelPay="cancelPay"></WechatPay>
@@ -60,7 +60,8 @@
 			return {
 				id:'',
 				orderInfo:null,
-				countDownTime:5 * 60 * 1000,
+				countDown:15*60,//15分钟 单位秒
+				countDownTime:0,
 				statusCfg:{
 					'-3':'已退款',
 					'-2':'已取消',
@@ -89,10 +90,18 @@
 				this.$api.get(`/que/order/${this.id}`).then(({data:res})=>{
 					if(res.code!==0) return this.$showToast(res.msg)
 					this.orderInfo = res.data;
+					if(this.orderInfo.orderStatus===0){
+						let diff = new Date().getTime() - new Date(this.orderInfo.createDate).getTime();
+						let diffS = Math.ceil(diff/1000)
+						if(diffS<this.countDown) this.countDownTime = (this.countDown-diffS)*1000;
+					}
 				})
 			},
 			finish(){
-				
+				this.$api.put(`/que/order/closeOrder/${this.orderInfo.orderNo}`).then(({data:res})=>{
+					this.$showToast('订单已取消')
+					this.getDetail();
+				})
 			},
 			buyAgain(){
 				uni.navigateTo({
@@ -109,9 +118,7 @@
 								if(res.code!==0) return this.$showToast(res.msg)
 								this.$showToast('取消成功')
 								setTimeout(()=>{
-									uni.redirectTo({
-										url:'/pagesMy/order'
-									})
+									uni.navigateBack()
 								},1500)
 							})
 						}
@@ -120,6 +127,8 @@
 			},
 			orderPay(){
 				this.$refs.wxPay.payShow = true;
+			},
+			toPay(){
 				this.$api.post('/pay/createOrder',{
 					orderNo:this.orderInfo.orderNo,
 					openId:JSON.parse(uni.getStorageSync('userInfo')).openId
@@ -131,7 +140,7 @@
 							url:'/pagesPublish/payResult'
 						})
 					})
-				})	
+				})
 			},
 		}
 	}