james.zhao
6 years ago
parent
a7920ffa89
commit
a108cc15d3
@ -0,0 +1,228 @@
|
||||
.gateway-background {
|
||||
width:100%;
|
||||
height:100%;
|
||||
/*position: fixed;*/
|
||||
background: url("../img/gateway_bg.png");
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
z-index: -1;
|
||||
overflow-y: auto;
|
||||
background-size:100% 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
align-content: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.head-bar{
|
||||
display: inline;
|
||||
text-align: center;
|
||||
}
|
||||
.head-bar img{
|
||||
width: 500px;
|
||||
height: 40px;
|
||||
top: 60px;
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
.order-box{
|
||||
height: 650px;
|
||||
width: 800px;
|
||||
margin: 2% auto;
|
||||
/*box-shadow: 0px 0px 25px 0px rgba(0,0,0,0.21);*/
|
||||
}
|
||||
|
||||
.order-box-bank{
|
||||
height: 900px;
|
||||
width: 800px;
|
||||
margin: 2% auto;
|
||||
/*box-shadow: 0px 0px 25px 0px rgba(0,0,0,0.21);*/
|
||||
}
|
||||
|
||||
.order-box:after{
|
||||
content:'';
|
||||
display:block;
|
||||
clear:both;
|
||||
}
|
||||
.order-box .left{
|
||||
display: inline;
|
||||
opacity: 0.84;
|
||||
background: #f06010;
|
||||
width:40%;
|
||||
float: left;
|
||||
height: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
/*.order-box .left .m-logo{*/
|
||||
/*background: #FFFFFF;*/
|
||||
/*border-radius: 100px;*/
|
||||
/*width: 120px;*/
|
||||
/*height: 120px;*/
|
||||
/*margin-top: 15%;*/
|
||||
/*display: inline-block;*/
|
||||
/*}*/
|
||||
.m-logo{
|
||||
line-height: 100px;
|
||||
}
|
||||
.m-logo img{
|
||||
width: 100px;
|
||||
padding: 10px;
|
||||
}
|
||||
.short-name{
|
||||
margin-top: 40px;
|
||||
font-family: MicrosoftYaHei;
|
||||
font-size: 18px;
|
||||
}
|
||||
.intro{
|
||||
margin: 100px 0 50px;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.order-box .right{
|
||||
display: inline;
|
||||
background: #FFFFFF;
|
||||
width:60%;
|
||||
float: right;
|
||||
height: 80%;
|
||||
padding: 20px 40px;
|
||||
}
|
||||
.order-box .right-bank{
|
||||
display: inline;
|
||||
background: #FFFFFF;
|
||||
width:60%;
|
||||
float: right;
|
||||
height: 90%;
|
||||
padding: 20px 40px;
|
||||
}
|
||||
.order-box .brand{
|
||||
display: inline;
|
||||
background: #f06010 ;
|
||||
width:60%;
|
||||
float: right;
|
||||
height: 20%;
|
||||
vertical-align: middle;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.order-box .brand-bank{
|
||||
display: inline;
|
||||
background: #f06010 ;
|
||||
width:60%;
|
||||
float: right;
|
||||
height: 10%;
|
||||
vertical-align: middle;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.order-box .brand img{
|
||||
width: 246px;
|
||||
height: 51px;
|
||||
margin-top: 7%
|
||||
}
|
||||
|
||||
.order-box .brand-bank img{
|
||||
width: 246px;
|
||||
height: 51px;
|
||||
margin-top: 3%
|
||||
}
|
||||
|
||||
.order-box .right .title {
|
||||
font-family: PingFang-SC-Medium;
|
||||
font-size: 20px;
|
||||
color: #434343;
|
||||
letter-spacing: 0px;
|
||||
padding-bottom: 10px;
|
||||
padding-top: 20px;
|
||||
}
|
||||
.order-box .right input {
|
||||
background-color: #EEEEEE;
|
||||
border: none;
|
||||
outline: none;
|
||||
height: 45px;
|
||||
}
|
||||
.order-box .right .form_margin {
|
||||
|
||||
}
|
||||
.order-box .right .form_input {
|
||||
height: 45px;
|
||||
}
|
||||
.footer-bottom{
|
||||
font-family: PingFangSC-Regular;
|
||||
color: #FFFFFF;
|
||||
letter-spacing: 0px;
|
||||
margin-top: 50px;
|
||||
}
|
||||
|
||||
.footer-bottom-success{
|
||||
margin-top: 60px;
|
||||
color: #444444;
|
||||
}
|
||||
|
||||
.warning{
|
||||
font-size: x-small;
|
||||
color: #f06010;
|
||||
}
|
||||
.submit{
|
||||
color: #fff;
|
||||
background-color: #f06010;
|
||||
border-color: #f06010;
|
||||
}
|
||||
/*成功页*/
|
||||
.order-box .success-logo{
|
||||
text-align: center;
|
||||
height: 150px;
|
||||
background: #F0F3FA;
|
||||
line-height: 150px;
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 22px;
|
||||
color: #444444;
|
||||
letter-spacing: 0px;
|
||||
|
||||
}
|
||||
|
||||
.order-info{
|
||||
padding: 50px 100px;
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 17px;
|
||||
color: #444444;
|
||||
letter-spacing: 0px;
|
||||
}
|
||||
|
||||
@media(max-width:800px){
|
||||
.order-box{
|
||||
width:100%;
|
||||
}
|
||||
.order-info{
|
||||
padding:50px 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.gateway-background .modal {
|
||||
background-color: rgba(0,0,0,.8);
|
||||
}
|
||||
|
||||
.gateway-background .modal-dialog {
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
align-content: center;
|
||||
}
|
||||
.surcharge{
|
||||
font-size: 0.8em;
|
||||
color: #909090;
|
||||
}
|
||||
.exchange{
|
||||
font-size: 0.8em;
|
||||
color: #909090;
|
||||
}
|
||||
.div-inline {
|
||||
display: inline;
|
||||
width: 50%;
|
||||
}
|
||||
.div-inline-select {
|
||||
text-align: center;
|
||||
text-align-last: center;
|
||||
}
|
||||
@ -0,0 +1,239 @@
|
||||
var num = function(obj){
|
||||
obj.value = obj.value.replace(/[^\d.]/g,""); //清除"数字"和"."以外的字符
|
||||
obj.value = obj.value.replace(/^\./g,""); //验证第一个字符是数字
|
||||
obj.value = obj.value.replace(/\.{2,}/g,"."); //只保留第一个, 清除多余的
|
||||
obj.value = obj.value.replace(".","$#$").replace(/\./g,"").replace("$#$",".");
|
||||
obj.value = obj.value.replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3'); //只能输入两个小数
|
||||
|
||||
var surchargeData = calculateSurcharge(obj.value-0);
|
||||
var surchargeAmount = Decimal.add(surchargeData.surcharge,surchargeData.tax);
|
||||
$('#surchargeAmount').html(surchargeAmount+'');
|
||||
$('#totalAmount').html(surchargeData.newPrice+'');
|
||||
if(surchargeAmount+0==0 || !window.c4surcharge){
|
||||
$('.surcharge').hide();
|
||||
}else {
|
||||
$('.surcharge').show();
|
||||
}
|
||||
|
||||
};
|
||||
var bankList = [
|
||||
{label:'邮政储蓄银行',value:'BANK_CARD-B2C-POST-P2P'},
|
||||
{label:'深圳发展银行',value:'BANK_CARD-B2C-SDB-P2P'},
|
||||
{label:'民生银行',value:'BANK_CARD-B2C-CMBC-P2P'},
|
||||
{label:'北京银行',value:'BANK_CARD-B2C-BCCB-P2P'},
|
||||
{label:'上海银行',value:'BANK_CARD-B2C-SHB-P2P'},
|
||||
{label:'招商银行',value:'BANK_CARD-B2C-CMBCHINA-P2P'},
|
||||
{label:'中信银行',value:'BANK_CARD-B2C-ECITIC-P2P'},
|
||||
{label:'浦发银行',value:'BANK_CARD-B2C-SPDB-P2P'},
|
||||
{label:'兴业银行',value:'BANK_CARD-B2C-CIB-P2P'},
|
||||
{label:'华夏银行',value:'BANK_CARD-B2C-HXB-P2P'},
|
||||
{label:'农业银行',value:'BANK_CARD-B2C-ABC-P2P'},
|
||||
{label:'广发银行',value:'BANK_CARD-B2C-GDB-P2P'},
|
||||
{label:'工商银行',value:'BANK_CARD-B2C-ICBC-P2P'},
|
||||
{label:'中国银行',value:'BANK_CARD-B2C-BOC-P2P'},
|
||||
{label:'交通银行',value:'BANK_CARD-B2C-BOCO-P2P'},
|
||||
{label:'建设银行',value:'BANK_CARD-B2C-CCB-P2P'},
|
||||
{label:'平安银行',value:'BANK_CARD-B2C-PINGANBANK-P2P'},
|
||||
{label:'光大银行',value:'BANK_CARD-B2C-CEB-P2P'}
|
||||
];
|
||||
var select = $("select#bank-select");
|
||||
if (select.val() != "")
|
||||
select.prev().hide();
|
||||
select.bind("change", function () {
|
||||
if ($(this).val() != "") {
|
||||
$(this).prev().hide();
|
||||
}
|
||||
});
|
||||
function loadBankSelect() {
|
||||
var bankId = document.getElementById("bank-select");
|
||||
for (var i = 0; i < bankList.length; i++) {
|
||||
var bank = bankList[i];
|
||||
var op = document.createElement("option");
|
||||
op.setAttribute("value", bank.value);
|
||||
op.setAttribute("label", bank.label);
|
||||
bankId.appendChild(op);
|
||||
}
|
||||
}
|
||||
var bank = function (obj) {
|
||||
obj.value = obj.value.replace(/\s/g, '').replace(/(.{4})/g, "$1 ");
|
||||
};
|
||||
|
||||
var reg = /^[0-9]{14,19}$/i;
|
||||
function checkNum() {
|
||||
var bankNum = document.getElementById("bank-num").value;
|
||||
bankNum = bankNum.replace(/\s+/g,"");
|
||||
if (!(reg.test(bankNum))) {
|
||||
alert("银行号有误");
|
||||
document.getElementById('bank-num').focus();
|
||||
document.getElementById('bank-num').style.border = "1px solid #CDC28D";
|
||||
return false;
|
||||
}
|
||||
document.getElementById('bank-num').style.border = "";
|
||||
|
||||
return true;
|
||||
|
||||
};
|
||||
|
||||
function onChange(str,num) {
|
||||
if (str.length == num) {
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
|
||||
|
||||
$(document).ready(function () {
|
||||
$('.surcharge').hide();
|
||||
var payUrl = window.location.href;
|
||||
$.cookie("payURL",payUrl,{ expires: 1,path:'/' });
|
||||
loadBankSelect();
|
||||
|
||||
$('#bank-num').bind('keydown', function (e) {
|
||||
var key = e.which;
|
||||
var bankNum = $('#bank-num').val();
|
||||
|
||||
if (bankNum.substring(bankNum.length-1,bankNum.length)==' ' && key == 8) {
|
||||
$('#bank-num').val(bankNum.substring(0,bankNum.length-2));
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
$('#gateway').click(function() {
|
||||
if($(this).prop("checked")==true){
|
||||
$('.gateway').removeClass("hidden");
|
||||
$('#yeepay-order').addClass("order-box-bank");
|
||||
$('#yeepay-brand').addClass("brand-bank");
|
||||
$('#yeepay-right').addClass("right-bank");
|
||||
}else{
|
||||
$('.gateway').addClass("hidden");
|
||||
$('#yeepay-order').removeClass("order-box-bank");
|
||||
$('#yeepay-brand').removeClass("brand-bank");
|
||||
$('#yeepay-right').removeClass("right-bank");
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
var customer_id = ""||$.cookie("CustomerID");
|
||||
if (customer_id==null||customer_id == ""){
|
||||
getQrcode();
|
||||
}
|
||||
function getQrcode(){
|
||||
$.ajax({
|
||||
url: '/global/userstatus/customer_wechat_qrcode',
|
||||
method: 'get',
|
||||
dataType: 'json',
|
||||
success: function (data) {
|
||||
$('#qrmodal').find('img#qrimg').attr('src', data.code_img);
|
||||
$('#qrmodal').show();
|
||||
setTimeout(function () {
|
||||
checkQRStatus(data.code_id)
|
||||
}, 2000);
|
||||
},
|
||||
error: function (jqXHR) {
|
||||
alert(jqXHR.responseJSON.message);
|
||||
}
|
||||
})
|
||||
}
|
||||
function checkQRStatus(codeId) {
|
||||
$.ajax({
|
||||
url: '/global/userstatus/customer_wechat_qrcode/' + codeId + '/check',
|
||||
method: 'get',
|
||||
success: function (data) {
|
||||
$('#qrmodal').hide();
|
||||
customer_id = $.cookie("CustomerID");
|
||||
},
|
||||
error: function () {
|
||||
setTimeout(function () {
|
||||
checkQRStatus(codeId)
|
||||
}, 2000)
|
||||
}
|
||||
})
|
||||
}
|
||||
$('input').keypress(function (evt) {
|
||||
if (evt.keyCode == 13) {
|
||||
$('#login-btn').click();
|
||||
}
|
||||
});
|
||||
$('#commit-btn').click(function () {
|
||||
|
||||
var price = $('#price').val();
|
||||
if (price == null || price.length == 0) {
|
||||
alert('请填写订单金额');
|
||||
return;
|
||||
}
|
||||
var product = $('#product').val();
|
||||
if (product == null || product.length == 0) {
|
||||
alert('请填写真实的商品名称');
|
||||
return;
|
||||
}
|
||||
|
||||
var select_currency = $('#select_currency').val();
|
||||
var remark = $('#remark').val();
|
||||
|
||||
var payName = $('#name').val();
|
||||
|
||||
var cardNum = $('#card-num').val();
|
||||
|
||||
var bankNum = ($('#bank-num').val()).replace(/\s+/g,"");
|
||||
|
||||
var bankSelect = $('#bank-select').val();
|
||||
|
||||
var phone = $('#phone').val();
|
||||
var jsonData = {user_id:customer_id,price:price,product_name:product,description:remark,currency: select_currency};
|
||||
if($('#gateway').prop('checked') == true){
|
||||
if (payName == null || onChange(payName,0)) {
|
||||
alert('请填写支付人姓名');
|
||||
return;
|
||||
}
|
||||
if (cardNum == null || onChange(cardNum,0) || !onChange(cardNum,18)) {
|
||||
alert('身份证号有误');
|
||||
return;
|
||||
}
|
||||
if (bankNum == null || onChange(bankNum,0)) {
|
||||
alert('请填写银行卡号');
|
||||
return;
|
||||
}
|
||||
if (bankSelect == null || onChange(bankSelect,0)) {
|
||||
alert('请选择支付银行');
|
||||
return;
|
||||
}
|
||||
if (phone == null || !onChange(phone,11)) {
|
||||
alert('手机号码有误');
|
||||
return;
|
||||
}
|
||||
jsonData = {user_id:customer_id,price:price,product_name:product,description:remark,currency: select_currency,
|
||||
payer_name: payName,payer_identity_card: cardNum,card_number: bankNum,bank_id: bankSelect,phone:phone};
|
||||
}
|
||||
|
||||
var commit = confirm("是否确认提交支付");
|
||||
if (commit){
|
||||
$('#commit-btn').addClass('hidden');
|
||||
$('#commit-btn-loading').removeClass('hidden');
|
||||
$.ajax({
|
||||
url: '/api/v1.0/yeepay/partners/'+window.client_moniker+'/share',
|
||||
method: 'put',
|
||||
data: JSON.stringify(jsonData),
|
||||
contentType: 'application/json',
|
||||
dataType: 'json',
|
||||
success: function (res) {
|
||||
if(res.return_code != 'SUCCESS'){
|
||||
alert(res.message);
|
||||
$('#commit-btn').removeClass('hidden');
|
||||
$('#commit-btn-loading').addClass('hidden');
|
||||
}else {
|
||||
location.href = res.pay_url+'?'+res.sign_url;
|
||||
}
|
||||
},
|
||||
error: function (jqXHR) {
|
||||
alert(JSON.parse(jqXHR.responseText).message);
|
||||
$('#commit-btn').removeClass('hidden');
|
||||
$('#commit-btn-loading').addClass('hidden');
|
||||
}
|
||||
})
|
||||
} else {
|
||||
$('#commit-btn').removeClass('hidden');
|
||||
$('#commit-btn-loading').addClass('hidden');
|
||||
}
|
||||
});
|
||||
})
|
||||
Loading…
Reference in new issue