Selaa lähdekoodia

大额网银支付

Admin 3 vuotta sitten
vanhempi
commit
95ead1e85c

+ 12 - 0
src/main/resources/static/css/pay/caimei-paycash.css

@@ -100,6 +100,18 @@ input::-webkit-outer-spin-button {
     .pay-alert-content .pay-alert .content p{text-align: left;font-size: 14px;color: #666666;font-weight: normal;}
     .pay-alert-content .pay-alert .button{width: 100%;height: 32px;float: left;padding: 0 14px;box-sizing: border-box;}
     .pay-alert-content .pay-alert .button a{width: 90px;height: 32px;display: block;background: #E15616;border-radius: 2px;font-size: 14px;text-align: center;line-height: 32px;color: #FFFFFF;float: right;}
+    /*大额银联转账弹窗*/
+    .pay-alert-content .pay-big-alert{width: 460px;height: 386px;background: #FFFFFF;border-radius: 2px;position: absolute;top: 0;right: 0;left: 0;bottom: 0;margin: auto;z-index: 9998;}
+    .pay-alert-content .pay-big-alert .title{width: 100%;height: 48px;box-sizing: border-box;font-size: 14px;line-height: 48px;text-align: left;color: #333333;float: left;position: relative;border-bottom: 1px solid #EFEFEF;background-color: #FFFFFF;padding: 0 14px;}
+    .pay-alert-content .pay-big-alert .title .icon-close{width: 16px;height: 16px;display: block;position: absolute;right:12px;top: 12px;background: url("/img/base/icon.png")-319px 0 no-repeat;cursor: pointer;}
+    .pay-alert-content .pay-big-alert .content{margin: 20px 0;width: 100%;height: auto;line-height: 24px;float: left;padding: 0 14px;box-sizing: border-box;}
+    .pay-alert-content .pay-big-alert .content p.text{text-align: left;font-size: 12px;color: #E15616;font-weight: normal;line-height: 20px;margin-bottom: 10px;}
+    .pay-alert-content .pay-big-alert .content p{text-align: left;font-size: 14px;color: #4A4F58;font-weight: bold;line-height: 34px;}
+    .pay-alert-content .pay-big-alert .content p span{font-weight: normal;}
+    .pay-alert-content .pay-big-alert .button{width: 100%;height: 32px;float: left;padding: 0 14px;box-sizing: border-box;}
+    .pay-alert-content .pay-big-alert .button a{height: 32px;padding: 0 12px;margin-left: 16px;display: block;background: #E15616;border-radius: 2px;font-size: 14px;text-align: center;line-height: 32px;color: #FFFFFF;float: right;box-sizing: border-box;}
+    .pay-alert-content .pay-big-alert .button a.btn-close{border: 1px solid #B8BFCA;color: #4A4F58;background-color: #FFFFFF;}
+
     .payment-transfer{width: 100%;height: auto;padding: 0 24px;}
     .payment-transfer .payment-transfer-main{width: 100%;height: auto;}
     .payment-transfer .payment-transfer-main .label{width: 100%;height: 38px;line-height: 38px;font-size: 13px;color: #333;}

+ 12 - 0
src/main/resources/static/js/common/serviceapi/pay.service.js

@@ -40,6 +40,18 @@ var PayApi = {
                 callback(res);
             });
         },
+        PayOrderTransferUnion: function (params, callback) {// 正常订单大额银联转账
+            Http.AjaxService({
+                url:'/order/pay/transfer/union',
+                type:'POST',
+                data:params,
+                json:false,
+                isHost:true
+            })
+            .then(function(res){
+                callback(res);
+            });
+        },
         PayOrderPcMallAlipay: function (params, callback) {// 正常订单支付宝支付
             Http.AjaxService({
                 url:'/order/pay/alipay',

+ 58 - 14
src/main/resources/static/js/pay/caimei-paycash.js

@@ -35,11 +35,13 @@ var payContainer = new Vue({
         discernReceiptList:[],//支付记录列表
         tabIndex:0,//支付方式 0 移动支付 1网银支付 2线下转账
         mbOrderId:'',//支付订单ID
+        bigPayInfo:{},// 银联转账信息
         BankUserType:1,
         mobileTabIndex:null,
         bankTabIndex:0,
         isRequest:false,
         isPayAlert:false,
+        isPayBigAlert:false,
         isPaySwitch:false,
         paySuccessCounter:'',
         bankPayLink_url:'',
@@ -48,7 +50,7 @@ var payContainer = new Vue({
         invoiceStatus:false,
         isReceiptStatus:false,
         onlinePay:'',
-        payStatusText:'使用微信和网银支付全部金额后,供应商会在24小时后发货(周末、节假日顺延)。若着急发货,可以选择使用线下转账进行付款。',
+        payStatusText:'使用任何一种线上支付方式支付全部金额后,供应商会在24小时后发货(周末、节假日顺延)。若着急发货,可以选择使用线下转账进行付款。',
         productID:'',//发布商品的ID
         is_Wechat_bowcr:false,
         comboInfo: null, //选中的svip套餐信息
@@ -108,10 +110,10 @@ var payContainer = new Vue({
                     _self.receiptStatus =  data.order.receiptStatus;
                     _self.onlinePay = data.onlinePay;
                     if(_self.receiptAmount>0){
-                        _self.payStatusText = '使用微信和网银支付全部金额后,供应商会在24小时后发货(周末、节假日顺延)。';
+                        _self.payStatusText = '使用任何一种线上支付方式支付全部金额后,供应商会在24小时后发货(周末、节假日顺延)。若着急发货,可以选择使用线下转账进行付款。';
                         _self.isReceiptStatus = false;
                     }else{
-                        _self.payStatusText = '使用微信和网银支付全部金额后,供应商会在24小时后发货(周末、节假日顺延)。若着急发货,可以选择使用线下转账进行付款。';
+                        _self.payStatusText = '使用任何一种线上支付方式支付全部金额后,供应商会在24小时后发货(周末、节假日顺延)。若着急发货,可以选择使用线下转账进行付款。';
                         _self.isReceiptStatus = true;
                     }
                     _self.isRequest = true;
@@ -280,7 +282,7 @@ var payContainer = new Vue({
                 CAIMEI.dialog('支付系统遇到点小问题,请稍后重试', false);
                 return;
             }
-            if(_self.pageType === '3'){// 移动支付优惠券
+            if(_self.pageType === '3'){// 网银支付优惠券
                 _self.PayCouponUnionPayFn();
             }else{
                 if(_self.onlinePay == 2){
@@ -305,14 +307,22 @@ var payContainer = new Vue({
                     } else if (_self.pageType === '2') { // 网银付会员
                         _self.payVipPcMallPay();
                     } else {
-                        var params = {//正常订单
-                            payAmount:Math.round(_self.payAmount*100),
-                            bankCode:_self.payInfo.payBankNum,
-                            returnUrl:'https://www.caimei365.com/pay/success.html?pageType=www&type=success&payAmount='+_self.payAmount,
-                            orderId:_self.payInfo.payOrderId,
-                            userType:_self.payInfo.payUserType
-                        };
-                        _self.PayOrderPcMallPay(params,_self.payInfo.payBankNum);
+                        if(_self.mobileTabIndex === 4){
+                            var params = {
+                                payAmount:Math.round(_self.payAmount*100),
+                                orderId:_self.payInfo.payOrderId
+                            }
+                            _self.PayOrderTransferUnion(params);
+                        }else{
+                            var params = {//正常订单
+                                payAmount:Math.round(_self.payAmount*100),
+                                bankCode:_self.payInfo.payBankNum,
+                                returnUrl:'https://www.caimei365.com/pay/success.html?pageType=www&type=success&payAmount='+_self.payAmount,
+                                orderId:_self.payInfo.payOrderId,
+                                userType:_self.payInfo.payUserType
+                            };
+                            _self.PayOrderPcMallPay(params);
+                        }
                     }
                 }
             }
@@ -332,6 +342,22 @@ var payContainer = new Vue({
                 }
             })
         },
+        PayOrderTransferUnion:function (params) {// 大额网银转账
+            var _self = this;
+            _self.isSubMitStatus=true;
+            PayApi.PayOrderTransferUnion(params,function(response){
+                if(response.code == 0){
+                    _self.isPayBigAlert = true;
+                    _self.isSubMitStatus=false;
+                    _self.mbOrderId = response.data.data.mbOrderId;
+                    _self.bigPayInfo = JSON.parse(response.data.data.payInfo)
+                    console.log('bigPayInfo',_self.bigPayInfo)
+                }else{
+                    _self.isSubMitStatus=false;
+                    CAIMEI.Alert(response.msg,'确定',false);
+                }
+            })
+        },
         PayOrderPcMallAlipay:function (params){// 正常订单支付宝支付
             var _self = this;
             _self.isSubMitStatus=true;
@@ -538,7 +564,6 @@ var payContainer = new Vue({
         },
         RefreshBody:function(){//刷新页面
             var _self = this;
-
             if(_self.payInfo.payBankNum == 'WEIXIN'){
                 if( _self.pageType == '2' ){ // 验证支付(支付会员)
                     PayApi.PayOrderPayVipCheck({recordId : _self.vipRecordId},function(response){
@@ -580,6 +605,22 @@ var payContainer = new Vue({
                 });
             }
         },
+        RefreshBigBody:function () {// 校验是否完成银联支付
+            var _self = this;
+            PayApi.PayOrderFindOrderStatus({mbOrderId:_self.mbOrderId},function(response){
+                _self.isPayBigAlert = false;
+                var data = response.data.data;
+                if(data.status === '1'){
+                    setTimeout(()=>{
+                        _self.windowLocationHref('success');
+                    },1000)
+                }else{
+                    setTimeout(()=>{
+                        _self.windowLocationHref('error');
+                    },1000)
+                }
+            });
+        },
         windowLocationHref:function(state){
             var _self = this;
             if( _self.pageType === '1'){
@@ -614,7 +655,7 @@ var payContainer = new Vue({
         layerConfirm:function(){
             var _self = this;
             CAIMEI.Alert('本次交易暂不支持线上支付,请使用线下转账方式付款。','知道了',true,function () {
-                _self.payStatusText = '使用微信和网银支付全部金额后,供应商会在24小时后发货(周末、节假日顺延)。若着急发货,可以选择使用线下转账进行付款。';
+                _self.payStatusText = '使用任何一种线上支付方式支付全部金额后,供应商会在24小时后发货(周末、节假日顺延)。若着急发货,可以选择使用线下转账进行付款。';
                 _self.isReceiptStatus = true;
             });
         },
@@ -797,6 +838,9 @@ var payContainer = new Vue({
                 }
             });
         },
+        closeBigAlert:function () {
+            this.isPayBigAlert = false
+        }
     },
     mounted: function () {
         var _self = this;

+ 24 - 3
src/main/resources/templates/pay/caimei-paycash.html

@@ -95,7 +95,10 @@
                 </div>
                 <div class="method-content">
                     <div class="payment" id="mobilePayment" v-if="tabIndex === 0">
-                        <div class="payment-title" v-if="pageType !== '2' && pageType != '3'">{{payStatusText}}</div>
+                        <template v-if="pageType !== '2' && pageType != '3'">
+                            <div class="payment-title">1.{{payStatusText}}</div>
+                            <div class="payment-title">2.大额支付请使用大额银联转账方式进行付款。</div>
+                        </template>
                         <div class="pay-bank">
                             <div class="bank-list" id="mobileContent">
                                 <a v-if="!is_Wechat_bowcr" href="javascript:void(0);" class="bank-a mIcon" @click="checkMobilePay(0,'ALIPAY')" :class="{ active: mobileTabIndex === 0 }">
@@ -118,7 +121,7 @@
                                 </a>
                             </div>
                         </div>
-                        <div class="pay-bank"  v-if="(mobileTabIndex === 2 || mobileTabIndex === 4) && isPC">
+                        <div class="pay-bank"  v-if="mobileTabIndex === 2 && isPC">
                             <div class="bank-list mfw" id="bankContent">
                                 <a href="javascript:void(0);" v-if="item.b2B!=''" class="bank-b mIcon" v-for="(item, index) in bankListData" :key="index" :class="{ active: bankTabIndex === index }"  @click="checkBankPay(index,item)">
                                     <img :src="item.bankLogo" :alt="item.bankName">
@@ -164,7 +167,7 @@
     </div>
     <div class="pay-button-main" v-if="tabIndex == 0">
         <div class="inner">
-            <div class="pay-button" v-if="mobileTabIndex === 2 || mobileTabIndex === 3">
+            <div class="pay-button" v-if="mobileTabIndex === 2 || mobileTabIndex === 3 || mobileTabIndex === 4">
                 <a v-show="isPC" href="javascript:void(0);" id="paySubmit" @click="PaySubmitFn" :class="isSubMitStatus ? 'disabled' : ''" onclick="_czc.push(['_trackEvent','线上支付','点击','网银支付','','Um_Event_CopyUnionPay'])">立即支付</a>
             </div>
             <div class="pay-button" v-else>
@@ -182,6 +185,24 @@
             <div class="button" id="payButton"><a href="javascript:void(0);" @click="RefreshBody">已完成支付</a></div>
         </div>
     </div>
+    <div class="pay-alert-content" v-if="isPayBigAlert">
+        <div class="pay-big-alert">
+            <div class="title"><p>大额银联转账信息</p><i class="icon-close" @click.stop="RefreshBigBody"></i></div>
+            <div class="content">
+                <p class="text">请使用银行手机app或者网银输入以下信息进行转账。 每次发起支付请求,收款账号都会变化,请使用最新的收款账号进行转账。</p>
+                <p>户名: <span>{{ bigPayInfo.receiveName }}</span></p>
+                <p>收款账号: <span>{{ bigPayInfo.receiveAccountNo }}</span></p>
+                <p>银行: <span>{{ bigPayInfo.accountName }}</span></p>
+                <p>收款方开户地: <span>{{ bigPayInfo.areaInfo }}</span></p>
+                <p>收款网点: <span>{{ bigPayInfo.accountName }}</span></p>
+            </div>
+            <div class="button">
+                <a class="btn btn-close" href="javascript:void(0);" @click="closeBigAlert">换种支付方式</a>
+                <a class="btn btn-confirm" href="javascript:void(0);" @click="RefreshBigBody">已完成转账,请点击</a>
+            </div>
+        </div>
+    </div>
+
 </div>
 <!-- 引入底部 -->
 <template th:replace="components/footer"></template>