소스 검색

支付宝支付方式修改

zaijin 2 년 전
부모
커밋
b264d92cf6
5개의 변경된 파일57개의 추가작업 그리고 28개의 파일을 삭제
  1. 1 1
      manifest.json
  2. 5 0
      pages/choosePayment/choosePayment.scss
  3. 39 27
      pages/choosePayment/choosePayment.vue
  4. BIN
      static/img/alipay-icon-new.png
  5. 12 0
      utils/judgEnvironment.js

+ 1 - 1
manifest.json

@@ -96,7 +96,7 @@
     "h5" : {
         "template" : "template.h5.html",
         "router" : {
-            "mode" : "hash",
+            "mode" : "history",
             "base" : ""
         },
         "sdkConfigs" : {

+ 5 - 0
pages/choosePayment/choosePayment.scss

@@ -16,6 +16,11 @@
           height: 45rpx;
           margin-right: 20rpx;
         }
+				text {
+					font-size: 20rpx;
+          color: #FA6400;
+          margin-left: 10rpx;
+				}
       }
       &:last-child {
         border-bottom: solid 1px #eeeeee;

+ 39 - 27
pages/choosePayment/choosePayment.vue

@@ -4,7 +4,7 @@
       v-model="payWayPop"
       :title-style="{ color: '#1E1E1E', fontSize: '34rpx' }"
       title="选择支付方式"
-      width="550rpx"
+      width="600rpx"
       :show-confirm-button="false"
       :show-cancel-button="false"
       :mask-close-able="true"
@@ -24,6 +24,17 @@
               </view>
             </view>
             <!-- #endif -->
+            <template v-if="alipayEnv">
+              <view class="pay-list-item">
+                <view class="pay-list-item-image">
+                  <image class="image" src="/static/img/alipay-icon-new.png" mode="aspectFit" />
+                  <view>支付宝支付<text>随机立减最高10元</text></view>
+                </view>
+                <view class="radioBox">
+                  <radio color="#2DCF8C" value="juhe" :checked="'juhe' === radioCurrent" />
+                </view>
+              </view>
+            </template>
             <view class="pay-list-item">
               <view class="pay-list-item-image">
                 <image class="image" src="/static/img/gy-icon-new.png" mode="aspectFit" />
@@ -33,16 +44,17 @@
                 <radio color="#2DCF8C" value="gzyh" :checked="'gzyh' === radioCurrent" />
               </view>
             </view>
-            <view class="pay-list-item">
-              <view class="pay-list-item-image">
-                <image class="image" src="/static/img/juhe-icon-new.png" mode="aspectFit" />
-                <!-- <image class="image" src="/static/img/alipay-icon-new.png" mode="aspectFill" /> -->
-                <view>聚合支付</view>
-              </view>
-              <view class="radioBox">
-                <radio color="#2DCF8C" value="juhe" :checked="'juhe' === radioCurrent" />
+            <template v-if="!alipayEnv">
+              <view class="pay-list-item">
+                <view class="pay-list-item-image">
+                  <image class="image" src="/static/img/juhe-icon-new.png" mode="aspectFit" />
+                  <view>聚合支付</view>
+                </view>
+                <view class="radioBox">
+                  <radio color="#2DCF8C" value="juhe" :checked="'juhe' === radioCurrent" />
+                </view>
               </view>
-            </view>
+            </template>
           </radio-group>
         </view>
         <view class="pay-coupon" v-if="radioCurrent === 'weixin' && isShowCoupon">
@@ -140,7 +152,7 @@
 </template>
 
 <script>
-import { getEnvIsWx } from '@/utils/judgEnvironment.js';
+import { getEnvIsWx, getEnvIsAlipay } from '@/utils/judgEnvironment.js';
 import $wxPay from '@/utils/wxPay.js';
 export default {
   props: {
@@ -206,6 +218,8 @@ export default {
       payWayPop: false,
       // 是否微信环境
       wxEnv: true,
+      // 支付宝环境
+      alipayEnv: true,
       // 支付方式选择
       radioCurrent: '',
       // 订单金额
@@ -229,9 +243,6 @@ export default {
       }
     };
   },
-  // created() {
-  //   this.wxEnv = getEnvIsWx();
-  // },
   methods: {
     /**
      * 打开弹框触发
@@ -243,6 +254,7 @@ export default {
      */
     openPopup(details, numType = 'single', orderType = 'road') {
       this.wxEnv = getEnvIsWx();
+      this.alipayEnv = getEnvIsAlipay();
       this.payWayPop = true;
       this.orderMoney = details.payAmount.toFixed(2);
       if (numType === 'single' && orderType === 'parking' && !this.isMonthPay) {
@@ -363,7 +375,13 @@ export default {
               type: 'error'
             });
           }
-        });
+        })
+				.catch((err) => {
+				  this.$refs.uToast.show({
+				    title: '无法调起支付!',
+				    type: 'error'
+				  });
+				});
     },
     /**
      * 聚合支付
@@ -387,17 +405,11 @@ export default {
           if (res.code === 200) {
             localStorage.setItem('jumpUrl', this.jumpUrl);
             location.href = res.data.qrCodeUrl;
-          } else {
-            this.$refs.uToast.show({
-              title: res.msg,
-              type: 'error'
-            });
-            this.modalClose();
           }
         })
         .catch((err) => {
           this.$refs.uToast.show({
-            title: '无法调起聚合支付!',
+            title: `无法调起${this.alipayEnv ? '支付宝' : this.wxEnv ? '微信' : '聚合'}支付!`,
             type: 'error'
           });
         });
@@ -589,7 +601,7 @@ export default {
           })
           .catch((err) => {
             this.$refs.uToast.show({
-              title: '无法调起微信支付!',
+              title: `无法调起${this.alipayEnv ? '支付宝' : this.wxEnv ? '微信' : '聚合'}支付!`,
               type: 'error'
             });
           });
@@ -617,7 +629,7 @@ export default {
           })
           .catch((err) => {
             this.$refs.uToast.show({
-              title: '无法调起微信支付!',
+              title: `无法调起${this.alipayEnv ? '支付宝' : this.wxEnv ? '微信' : '聚合'}支付!`,
               type: 'error'
             });
           });
@@ -690,13 +702,13 @@ export default {
     immediatePayment() {
       switch (this.radioCurrent) {
         case 'weixin': // 微信支付
-          this.wechatPay();
+          this.isMonthPay ? this.wechatMonthPay() : this.wechatPay();
           break;
         case 'gzyh':
-          this.gyBankPay();
+          this.isMonthPay ? this.gyBankMonthPay() : this.gyBankPay();
           break;
         case 'juhe':
-          this.juhePay();
+          this.isMonthPay ? this.juheMonthPay() : this.juhePay();
           break;
       }
     },

BIN
static/img/alipay-icon-new.png


+ 12 - 0
utils/judgEnvironment.js

@@ -10,3 +10,15 @@ export function getEnvIsWx() {
     return false;
   }
 }
+
+/**
+ * 判断当前浏览器环境是不是支付宝
+ */
+export function getEnvIsAlipay() {
+  let en = window.navigator.userAgent;
+  if (/AlipayClient/.test(en)) {
+    return true;
+  } else {
+    return false;
+  }
+}