fix: 支付方法统一处理

yudao-ui-app/components/paymentMember/index.vue

@@ -20,8 +20,7 @@
       </view>
     </view>
     <view class="mask" @click='close' v-if="pay_close"></view>
-    <button style="cursor: pointer;display:none;" class="clipboard"
-      :data-clipboard-text="alipayLink">
+    <button style="cursor: pointer;display:none;" class="clipboard" :data-clipboard-text="alipayLink">
     </button>
     <!-- 支付宝支付界面 -->
     <u-modal :show="alipayShow" title="支付宝支付" @confirm="handleConfirm">
@@ -38,6 +37,7 @@
     wechatOrderPay,
     wechatQueryPayResult
   } from '@/api/order.js';
+  import uniPay from '@/libs/pay.js'
   import {
     memberTopUp
   } from '@/api/member.js';
@@ -82,126 +82,32 @@
         this.alipayShow = false
         window.location.reload()
       },
-      // 复制操作
-      _copy(context) {
-        // 创建输入框元素
-        let oInput = document.createElement('input');
-        // 将想要复制的值
-        oInput.value = context;
-        // 页面底部追加输入框
-        document.body.appendChild(oInput);
-        // 选中输入框
-        oInput.select();
-        // 执行浏览器复制命令
-        document.execCommand('Copy');
-        // 弹出复制成功信息
-        this.$util.Tips({
-          title: '复制链接成功'
-        })
-        this.alipayShow = true
-        // 复制后移除输入框
-        oInput.remove();
-      },
       close: function() {
         this.$emit('onChangeFun', {
           action: 'payClose'
         });
       },
       // 微信支付JSAPI调起
-      wxPayJSAPI(payData) {
-        function onBridgeReady() {
-          WeixinJSBridge.invoke('getBrandWCPayRequest', {
-              "appId": payData.appId, //公众号ID，由商户传入
-              "timeStamp": payData.timeStamp, //时间戳，自1970年以来的秒数
-              "nonceStr": payData.nonceStr, //随机串
-              "package": payData.packageValue,
-              "signType": payData.signType, //微信签名方式：
-              "paySign": payData.paySign //微信签名
-            },
-            function(res) {
-              if (res.err_msg == "get_brand_wcpay_request:ok") {
-                window.location.reload()
-                // uni.switchTab({
-                //   url: '/pages/member_application/index'
-                // })
-              }
-            })
-        }
-        if (typeof WeixinJSBridge == "undefined") {
-          if (document.addEventListener) {
-            document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false)
-          } else if (document.attachEvent) {
-            document.attachEvent('WeixinJSBridgeReady', onBridgeReady)
-            document.attachEvent('onWeixinJSBridgeReady', onBridgeReady)
-          }
-        } else {
-          onBridgeReady()
-        }
-      },
+
       goPay: function(paytype) {
         let that = this;
         if (that.payInfo.orderInfos.length === 0) return that.$util.Tips({
           title: '请选择要支付的订单'
         });
-        uni.showLoading({
-          title: '支付中',
-          mask: true
-        });
-        if(paytype === 'WXPAY' && that.openId) {
-          that.payInfo.openid = that.openId
-
-        } else if(paytype === 'WXPAY' && !that.openId){
-          return that.$util.Tips({
-            title: '请在微信客户端进行支付操作'
-          });
-        }
-        memberTopUp({
-          ...that.payInfo,
-          payType: paytype
-        }).then(res => {
-          let jsConfig = res.data
-          switch (paytype) {
-            case 'WXPAY':
-              uni.hideLoading();
-              that.wxPayJSAPI(jsConfig.jsapiResult)
-              break;
-            case 'ALIPAY':
-              uni.hideLoading();
-              this.alipayLink = jsConfig.body
-              // this._copy(jsConfig.body)
-              setTimeout(()=>{
+        uniPay({
+          payInfo: that.payInfo,
+          payType: paytype,
+          createOrderFun: memberTopUp,
+          wxPaySuccess: () => {
+            window.location.reload()
+          },
+          aliPaySuccess: (link) => {
+            that.alipayLink = link
+            setTimeout(() => {
               document.querySelector(".clipboard").click();
-                this.alipayShow = true
+              that.alipayShow = true
             }, 500)
-              // const div = document.createElement('div')
-              // /* 下面的data.content就是后台返回接收到的数据 */
-              // div.innerHTML = jsConfig.body
-              // document.body.appendChild(div)
-              // document.forms[0].submit()
-              break;
-            case 'weixinh5':
-              uni.hideLoading();
-              location.replace(jsConfig.mwebUrl + '&redirect_url=' + window.location.protocol +
-                '//' + window.location.host + goPages + '&status=1');
-              return that.$util.Tips({
-                title: "支付中",
-                icon: 'success'
-              }, () => {
-                that.$emit('onChangeFun', {
-                  action: 'pay_complete'
-                });
-              });
-              break;
           }
-        }).catch(err => {
-          uni.hideLoading();
-          return that.$util.Tips({
-            title: err
-          }, () => {
-            that.$emit('onChangeFun', {
-              action: 'pay_fail'
-            });
-          });
         })
       }
     }

yudao-ui-app/libs/pay.js

@@ -0,0 +1,91 @@
+import util from 'utils/util'
+import store from '@/store'
+
+const payTypes = ['WXPAY', 'ALIPAY']
+/**
+ * 统一支付处理方法
+ * @param payInfo // 支付下单信息
+ * @param payType // 支付类型
+ * @param createOrderFun // 预下单方法
+ * @param wxPaySuccess // 微信支付成功回调
+ * @param aliPaySuccess // 支付宝支付成功回调
+ */
+const unityPay = (options) => {
+  let _options = {
+    payInfo: {},
+    payType: '',
+    createOrderFun: () => {},
+    wxPaySuccess: () => {},
+    aliPaySuccess: () => {}
+  }
+  Object.assign(_options, options)
+  if (!_options.payType) {
+    return util.Tips({
+      title: '请选择支付方式'
+    })
+  }
+  if (!payTypes.includes(_options.payType)) {
+    throw new Error('支付方式参数值为 WXPAY、ALIPAY')
+  }
+  // 目前微信只支持JSAPI，h5支付开通后取消该验证
+  const openId = store.state.app.openId || ''
+  if (_options.payType === 'WXPAY' && !openId) {
+    return util.Tips({
+      title: '请在微信客户端进行支付操作'
+    })
+  }
+  _options.payInfo.openid = openId
+  uni.showLoading({
+    title: '支付中',
+    mask: true
+  })
+  _options.createOrderFun({
+    ..._options.payInfo,
+    payType: _options.payType
+  }).then(res => {
+    const payConfig = res.data
+    switch (_options.payType) {
+      // 微信JSAPI支付
+      case 'WXPAY':
+        wxPayJSAPI(payConfig.jsapiResult)
+        break
+      case 'ALIPAY':
+        _options.aliPaySuccess(payConfig.body)
+        break
+    }
+  }).catch(() => {
+    util.Tips({
+      title: '预下单失败'
+    })
+  }).finally(uni.hideLoading)
+}
+
+const wxPayJSAPI = (payData) => {
+  function onBridgeReady() {
+    WeixinJSBridge.invoke('getBrandWCPayRequest', {
+        "appId": payData.appId, //公众号ID，由商户传入
+        "timeStamp": payData.timeStamp, //时间戳，自1970年以来的秒数
+        "nonceStr": payData.nonceStr, //随机串
+        "package": payData.packageValue,
+        "signType": payData.signType, //微信签名方式：
+        "paySign": payData.paySign //微信签名
+      },
+      function(res) {
+        if (res.err_msg == "get_brand_wcpay_request:ok") {
+          _options.wxPaySuccess()
+        }
+      })
+  }
+  if (typeof WeixinJSBridge == "undefined") {
+    if (document.addEventListener) {
+      document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false)
+    } else if (document.attachEvent) {
+      document.attachEvent('WeixinJSBridgeReady', onBridgeReady)
+      document.attachEvent('onWeixinJSBridgeReady', onBridgeReady)
+    }
+  } else {
+    onBridgeReady()
+  }
+}
+
+export default unityPay