Browse Source

feat 购物流程添加支付结果模拟

tumobi 7 years ago
parent
commit
107f1132ea

+ 1 - 0
app.json

@@ -16,6 +16,7 @@
     "pages/auth/register/register",
     "pages/auth/reset/reset",
     "pages/pay/pay",
+    "pages/payResult/payResult",
     "pages/ucenter/index/index",
     "pages/topic/topic",
     "pages/comment/comment",

+ 1 - 0
config/api.js

@@ -28,6 +28,7 @@ module.exports = {
     CartCheckout: NewApiRootUrl + 'cart/checkout', // 下单前信息确认
 
     OrderSubmit: NewApiRootUrl + 'order/submit', // 提交订单
+    PayPrepayId: NewApiRootUrl + 'pay/pay_prepay', //获取微信统一下单prepay_id
 
     CollectList: NewApiRootUrl + 'collect/list',  //收藏列表
     CollectAddOrDelete: NewApiRootUrl + 'collect/addordelete',  //添加或取消收藏

+ 0 - 1
pages/comment/comment.js

@@ -1,6 +1,5 @@
 var app = getApp();
 var util = require('../../utils/util.js');
-
 var api = require('../../config/api.js');
 
 Page({

+ 47 - 10
pages/pay/pay.js

@@ -1,24 +1,61 @@
 var app = getApp();
+var util = require('../../utils/util.js');
+var api = require('../../config/api.js');
 
 Page({
-  data:{
+  data: {
+    orderId: 0,
+    actualPrice: 0.00
   },
-  onLoad:function(options){
+  onLoad: function (options) {
     // 页面初始化 options为页面跳转所带来的参数
+    this.setData({
+      orderId: options.orderId,
+      actualPrice: options.actualPrice
+    })
   },
-  onReady:function(){
-    
+  onReady: function () {
+
   },
-  onShow:function(){
+  onShow: function () {
     // 页面显示
-    
+
   },
-  onHide:function(){
+  onHide: function () {
     // 页面隐藏
-    
+
   },
-  onUnload:function(){
+  onUnload: function () {
     // 页面关闭
-    
+
+  },
+  //向服务请求支付参数
+  requestPayParam() {
+    let that = this;
+    util.request(api.PayPrepayId, { orderId: that.data.orderId, payType: 1 }).then(function (res) {
+      if (res.errno === 0) {
+        let payParam = res.data;
+        wx.requestPayment({
+          'timeStamp': payParam.timeStamp,
+          'nonceStr': payParam.timeStamp,
+          'package': payParam.nonceStr,
+          'signType': payParam.signType,
+          'paySign': payParam.paySign,
+          'success': function (res) {
+            wx.redirectTo({
+              url: '/pages/payResult/payResult?status=true',
+            })
+          },
+          'fail': function (res) {
+            wx.redirectTo({
+              url: '/pages/payResult/payResult?status=false',
+            })
+          }
+        })
+      }
+    });
+  },
+  startPay() {
+    this.requestPayParam();
   }
 })

+ 1 - 1
pages/pay/pay.json

@@ -1,3 +1,3 @@
 {
-    
+  "navigationBarTitleText": "支付订单"
 }

+ 2 - 2
pages/pay/pay.wxml

@@ -1,7 +1,7 @@
 <view class="container">
     <view class="total">
       <view class="label">订单金额</view>
-      <view class="txt">33.80元</view>
+      <view class="txt">{{actualPrice}}元</view>
     </view>
     <view class="pay-list">
         <view class="h">请选择支付方式</view>
@@ -25,5 +25,5 @@
     </view>
     <view class="tips">小程序只支持微信支付,如需其它支付方式,请在网页版支付</view>
 
-    <view class="pay-btn">确定</view>
+    <view class="pay-btn" bindtap="startPay">确定</view>
 </view>

+ 28 - 0
pages/payResult/payResult.js

@@ -0,0 +1,28 @@
+var app = getApp();
+
+Page({
+  data:{
+    status: false,
+  },
+  onLoad:function(options){
+    // 页面初始化 options为页面跳转所带来的参数
+    this.setData({
+      status: options.status
+    })
+  },
+  onReady:function(){
+    
+  },
+  onShow:function(){
+    // 页面显示
+    
+  },
+  onHide:function(){
+    // 页面隐藏
+    
+  },
+  onUnload:function(){
+    // 页面关闭
+    
+  }
+})

+ 4 - 0
pages/payResult/payResult.json

@@ -0,0 +1,4 @@
+{
+    "navigationBarTitleText": "付款结果",
+    "navigationBarBackgroundColor": "#fafafa"
+}

+ 23 - 0
pages/payResult/payResult.wxml

@@ -0,0 +1,23 @@
+<view class="container">
+  <view class="pay-result">
+    <view class="success" wx:if="{{status == true}}">
+      <view class="msg">付款成功</view>
+      <view class="btns">
+        <navigator class="btn" url="/pages/ucenter/order/order" open-type="redirect">查看订单</navigator>
+        <navigator class="btn" url="/pages/index/index" open-type="switchTab">继续逛</navigator>
+      </view>
+    </view>
+    <view class="error" wx:if="{{status != true}}">
+      <view class="msg">付款失败</view>
+      <view class="tips">
+        <view class="p">请在 <text class="time">1小时</text> 内完成付款</view>
+        <view class="p">否则订单将会被系统取消</view>
+      </view>
+      <view class="btns">
+        <navigator class="btn" url="/pages/ucenter/order/order" open-type="redirect">查看订单</navigator>
+        <navigator class="btn" url="/pages/pay/pay" open-type="redirect">重新付款</navigator>
+      </view>
+    </view>
+  </view>
+
+</view>

+ 59 - 0
pages/payResult/payResult.wxss

@@ -0,0 +1,59 @@
+page {
+  min-height: 100%;
+  width: 100%;
+  background: #fff;
+}
+
+.container {
+  height: 100%;
+  background: #fff;
+}
+
+.pay-result {
+  background: #fff;
+}
+
+.pay-result .msg {
+  text-align: center;
+  margin: 100rpx auto;
+  color: #2bab25;
+  font-size: 36rpx;
+}
+
+.pay-result .btns {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.pay-result .btn {
+  text-align: center;
+  height: 80rpx;
+  margin: 0 20rpx;
+  width: 200rpx;
+  line-height: 78rpx;
+  border: 1px solid #868686;
+  color: #000000;
+  border-radius: 5rpx;
+}
+
+.pay-result .error .msg {
+  color: #b4282d;
+  margin-bottom: 60rpx;
+}
+
+.pay-result .error .tips {
+  color: #7f7f7f;
+  margin-bottom: 70rpx;
+}
+
+.pay-result .error .tips .p {
+  font-size: 24rpx;
+  line-height: 42rpx;
+  text-align: center;
+}
+
+.pay-result .error .tips .p {
+  line-height: 42rpx;
+  text-align: center;
+}

+ 2 - 2
pages/shopping/checkout/checkout.js

@@ -101,8 +101,8 @@ Page({
     let that = this;
     util.request(api.OrderSubmit, { addressId: that.data.addressId, couponId: that.data.couponId }, 'POST').then(function (res) {
       if (res.errno === 0) {
-        wx.navigateTo({
-          url: '/pages/pay/pay'
+        wx.redirectTo({
+          url: '/pages/pay/pay?orderId=' + res.data.orderInfo.id + '&actualPrice=' + res.data.orderInfo.actual_price
         })
       
       } else {