【订单支付结果页】

1. 和支付结果的回调打通

pages/goods/cashier/index.vue

@@ -32,7 +32,7 @@
 		</view>
 		<view class="btn">
 			<view class="button acea-row row-center-wrapper" @click='goPay(channelCode)'>确认支付</view>
-			<view class="wait-pay" @click="goReturnUrl">暂不支付</view>
+			<view class="wait-pay" @click="goReturnUrl('cancel')">暂不支付</view>
 		</view>
 	</view>
 </template>
@@ -108,6 +108,21 @@
 				});
         PayOrderApi.getOrder(this.orderId).then(res => {
           // TODO 芋艿：如果已支付，则跳转回
+          if (res.data.status === 10) {
+            uni.showToast({
+              title: '支付成功'
+            })
+            this.goReturnUrl('success');
+            uni.hideLoading();
+            return;
+          } else if (res.data.status === 20) {
+            uni.showToast({
+              title: '无法支付，原因：订单已关闭'
+            })
+            this.goReturnUrl('close');
+            uni.hideLoading();
+            return;
+          }
 
 					console.log(res)
 					this.payPrice = res.data.price
@@ -374,7 +389,6 @@
 							// #endif
 							break;
 					}
-
 				}).catch(err => {
 					uni.hideLoading();
 					return that.$util.Tips({
@@ -409,21 +423,26 @@
        */
       getPayReturnUrl() {
         // #ifdef H5
-        return location.port
-          ? location.protocol + '//' + location.hostname + ':' + location.port + '/pages/goods/cashier/index?order_id=' + this.orderId
-          : location.protocol + '//' + location.hostname + '/pages/goods/cashier/index?order_id=' + this.orderId;
+        return location.href
         // #endif
         // #ifdef APP-PLUS
-        return '/pages/goods/order_details/index?order_id=' + this.orderId;
+        return '/pages/goods/order_details/index?order_id=' + this.orderId + '&returnUrl=' + this.returnUrl;
         // #endif
         return '';
       },
       /**
        * 回到业务的 URL
+       *
+       * @param payResult 支付结果
+       *                  ① success：支付成功
+       *                  ② cancel：取消支付
+       *                  ③ close：支付已关闭
        */
-      goReturnUrl() {
+      goReturnUrl(payResult) {
         uni.reLaunch({
-          url: this.returnUrl
+          url: this.returnUrl.indexOf('?') >= 0
+            ? this.returnUrl + '&payResult=' + payResult
+            : this.returnUrl + '?payResult=' + payResult
         })
       },
     }

pages/order_details/index.vue

@@ -425,8 +425,9 @@
        * 打开支付组件
        */
       goPay() {
+        const returnUrl = '/pages/order_pay_status/index?order_id=' + this.orderInfo.id;
         uni.navigateTo({
-          url: `/pages/goods/cashier/index?order_id=${this.orderInfo.payOrderId}&from_type=order`
+          url: `/pages/goods/cashier/index?order_id=${this.orderInfo.payOrderId}&returnUrl=${returnUrl}`
         })
       },
       /**

pages/order_pay_status/index.vue

@@ -16,7 +16,7 @@
 					<view>下单时间</view>
 					<view class='itemCom'>{{ order_pay_info.createTime ? formatDate(order_pay_info.createTime) : '-' }}</view>
 				</view>
-				<view class='item acea-row row-between-wrapper'>
+				<view class='item acea-row row-between-wrapper' v-if="order_pay_info.payStatus">
 					<view>支付方式</view>
 					<view class='itemCom'>{{ order_pay_info.payChannelName }}</view>
 				</view>
@@ -27,7 +27,10 @@
 				<!-- 失败时加上这个 -->
 				<view class='item acea-row row-between-wrapper' v-if="!order_pay_info.payStatus">
 					<view>失败原因</view>
-					<view class='itemCom'>{{ msg || '取消支付' }}</view>
+					<view class='itemCom' v-if="payResult === 'success'">获取支付结果失败，请稍后刷新</view> <!-- 一般情况下，是支付中心回调更新订单为已支付，存在延迟 -->
+					<view class='itemCom' v-else-if="payResult === 'close'">支付已关闭</view>
+					<view class='itemCom' v-else-if="payResult === 'cancel'">取消支付</view>
+					<view class='itemCom' v-else>未知原因</view>
 				</view>
 			</view>
 
@@ -63,7 +66,7 @@
 					payStatus: true,
 				},
 				status: 0,
-				msg: ''
+				payResult: ''
 			};
 		},
 		computed: mapGetters(['isLogin']),
@@ -92,7 +95,7 @@
         });
       }
       this.orderId = options.order_id;
-      this.msg = options.msg || '';
+      this.payResult = options.payResult;
       this.getOrderPayInfo();
 		},
 		methods: {

pages/users/order_confirm/index.vue

@@ -337,8 +337,9 @@
           ...this.getSettlementReqVO(),
           mark: this.mark,
         }).then(res => {
+          const returnUrl = '/pages/order_pay_status/index?order_id=' + res.data.id;
           uni.navigateTo({
-            url: `/pages/goods/cashier/index?order_id=${res.data.payOrderId}&from_type=order`
+            url: `/pages/goods/cashier/index?order_id=${res.data.payOrderId}&returnUrl=${returnUrl}`
           });
         }).catch(err => {
           uni.hideLoading();

pages/users/order_list/index.vue

@@ -217,8 +217,9 @@
 			 * 打开支付组件
 			 */
 			goPay(id, payOrderId) {
+        const returnUrl = '/pages/order_pay_status/index?order_id=' + id;
         uni.navigateTo({
-          url: `/pages/goods/cashier/index?order_id=${payOrderId}&from_type=order`
+          url: `/pages/goods/cashier/index?order_id=${payOrderId}&returnUrl=${returnUrl}`
         })
 			},
 			/**