add 支付页v4

master
luoyang 6 years ago
parent 19517c9bb8
commit e6917173ca

Binary file not shown.

After

Width:  |  Height:  |  Size: 215 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

@ -479,12 +479,14 @@
<option value="v1">v1</option>
<option value="v2">v2</option>
<option value="v3">v3</option>
<option value="v4">v4</option>
</select>
</div>
<div class="col-sm-6">
<img style="width: 200px" ng-if="paymentInfo.paypad_version=='v1'" src="/static/images/payment_page_v1.jpg">
<img style="width: 200px" ng-if="paymentInfo.paypad_version=='v2'" src="/static/images/payment_page_v2.jpg">
<img style="width: 200px" ng-if="paymentInfo.paypad_version=='v3'" src="/static/images/payment_page_v3.jpg">
<img style="width: 200px" ng-if="paymentInfo.paypad_version=='v4'" src="/static/images/payment_page_v4.jpg">
</div>
</div>
</div>

@ -584,6 +584,7 @@
<option value="v1">v1</option>
<option value="v2">v2</option>
<option value="v3">v3</option>
<option value="v4">v4</option>
</select>
</div>
<div class="col-sm-12">
@ -592,6 +593,7 @@
<img style="width: 200px" ng-if="paymentInfo.paypad_version=='v1'" src="/static/images/payment_page_v1.jpg">
<img style="width: 200px" ng-if="paymentInfo.paypad_version=='v2'" src="/static/images/payment_page_v2.jpg">
<img style="width: 200px" ng-if="paymentInfo.paypad_version=='v3'" src="/static/images/payment_page_v3.jpg">
<img style="width: 200px" ng-if="paymentInfo.paypad_version=='v4'" src="/static/images/payment_page_v4.jpg">
</div>
</div>
</div>

@ -0,0 +1,487 @@
/**
* Created by yixian on 2017-05-08
*/
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'); //只能输入两个小数
};
$(function () {
'use strict';
// document.querySelector('body').addEventListener('touchmove', function(e) {
// if (!document.querySelector('.coupons').contains(e.target)) {
// e.preventDefault();
// }
// });
var dataCache = {price: '0', coupons: [], coupon_groups: {}};
var exchangeRate = parseFloat(window.exchange_rate);
if (window.AlipayJSBridge) {
AlipayJSBridge.call('hideOptionMenu');
} else {
document.addEventListener('AlipayJSBridgeReady', function () {
AlipayJSBridge.call('hideOptionMenu');
}, false);
}
dataCache.paying = false;
var ctrl = {};
$('.ff.key').bind('touchstart', function () {
if (dataCache.paying) {
return;
}
var char = $(this).attr('data-char');
appendChar(char);
});
$('#audVal').bind('input porpertychange', function () {
if (dataCache.paying) {
return;
}
var char = $(this).val();
if (parseFloat(char) > 10000) {
char = char.slice(0, char.length - 1);
$(this).val(char);
return;
}
appendChar(char);
});
$('.coupons .use-check').click(function () {
if ($(this).hasClass('disabled')) {
return;
}
var couponId = $(this).attr('data-coupon-id');
var couponGroup = $(this).attr('data-coupon-group');
if (couponGroup) {
var prevCouponId = dataCache.coupon_groups[couponGroup];
if (prevCouponId) {
var prevIdx = dataCache.coupons.indexOf(prevCouponId);
if (prevIdx >= 0) {
dataCache.coupons.splice(prevIdx, 1);
}
if (prevCouponId != couponId) {
$('.coupons .use-check[data-coupon-id="' + prevCouponId + '"]').removeClass('checked').addClass('unchecked');
dataCache.coupon_groups[couponGroup] = couponId;
} else {
dataCache.coupon_groups[couponGroup] = null;
}
} else {
dataCache.coupon_groups[couponGroup] = couponId;
}
}
if ($(this).is('.checked')) {
$(this).removeClass('checked').addClass('unchecked');
} else {
$(this).removeClass('unchecked').addClass('checked');
}
var checked = $(this).is('.checked');
if (checked) {
dataCache.coupons.push(couponId);
updatePrice();
} else {
var idx = dataCache.coupons.indexOf(couponId);
dataCache.coupons.splice(idx, 1);
updatePrice();
}
});
$('.cb_bankpay').click(function () {
$.ajax({
url: '/sys/partners/' + window.client_moniker + '/jump/link',
method: 'GET',
success: function (res) {
location.href = res;
},
error: function (resp) {
var config = {
template: resp
};
showWeuiDialog(config);
}
})
});
$('#key_B').bind('touchstart', function () {
backspace();
});
function updatePoundage(price) {
if (window.extensions.indexOf('customerrate') >= 0 && window.rateValue != null) {
if (window.use_customised_rate) {
var rate = new Decimal(100).plus(window.rateValue).div(100);
var poundageValue = new Decimal(dataCache.price).mul(rate).sub(dataCache.price);
} else {
var rateRemain = new Decimal(100).sub(window.rateValue).div(100);
poundageValue = new Decimal(dataCache.price).div(rateRemain).sub(dataCache.price);
}
dataCache.poundageValue = poundageValue.toFixed(2, Decimal.ROUND_HALF_UP);
return poundageValue.plus(price).toFixed(2, Decimal.ROUND_HALF_UP);
}
return price;
}
function updatePrice() {
$('#audVal').html(dataCache.price);
var realPrice = dataCache.price;
$('#audValReal').html(realPrice);
var surchargeData = calculateSurcharge(realPrice);
var price = surchargeData.newPrice || realPrice;
var priceBeforeDiscount = price;
dataCache.discounts = [];
dataCache.tax = surchargeData.tax;
dataCache.surcharge = surchargeData.surcharge;
$(window.coupons).each(function () {
price = this.handleDiscount(price, dataCache.price, dataCache.discounts, dataCache.coupons);
});
dataCache.finalPrice = new Decimal(price).toFixed(2, Decimal.ROUND_FLOOR);
var rate = 'CNY' == window.currency ? 1 : exchangeRate;
var cnyVal = Decimal.mul(price, rate).toFixed(2, Decimal.ROUND_FLOOR);
dataCache.currencyPrice = 'CNY' == window.currency ? Decimal.div(priceBeforeDiscount, exchangeRate).toFixed(2, Decimal.ROUND_FLOOR) : priceBeforeDiscount;
$('#cnyVal').html(cnyVal)
}
function backspace() {
dataCache.price = dataCache.price.substring(0, dataCache.price.length - 1);
if (dataCache.price.length == 0) {
dataCache.price = '0';
}
updatePrice();
updatePoundageStatus();
}
function appendChar(char) {
if (char == "") {
char = '0';
}
var check = /[^\d.]/g;
if (check.test(char)) {
return;
}
var tmpChar = (char.split('.')).length-1;
if (tmpChar > 1) {
return;
}
var pointLocation = dataCache.price.indexOf('.');
if (pointLocation >= 0 || char == '.' || char.length < 5) {
if (pointLocation >= 0 && char == '.') {
return;
}
if (pointLocation >= 0 && pointLocation <= char.length - 4) {
return;
}
if (dataCache.price == '0' && char != '.') {
dataCache.price = '';
}
dataCache.price = char;
updatePrice();
updatePoundageStatus();
}
}
function updatePoundageStatus() {
$(window.coupons).each(function () {
var coupon = this;
var couponId = coupon.couponId();
if (coupon.isEnable(dataCache.currencyPrice || 0)) {
$('.coupons .use-check[data-coupon-id=' + couponId + ']').removeClass('disabled');
} else {
var dom = $('.coupons .use-check[data-coupon-id=' + couponId + ']').addClass('disabled');
var couponGroup = dom.attr('data-coupon-group');
if (couponGroup) {
if (dataCache.coupon_groups[couponGroup] == couponId) {
dataCache.coupon_groups[couponGroup] = null;
}
}
var idx = dataCache.coupons.indexOf(couponId);
if (idx >= 0) {
dataCache.coupons.splice(idx, 1);
}
dom.removeClass('checked').addClass('unchecked');
}
})
}
updatePoundageStatus();
$('#coupon-box-toggle').click(function () {
$('.coupons-container').addClass('show');
});
$('.coupons-container>.coupons-mask,.coupons-container #close-coupon-box').click(function () {
$(this).parents('.coupons-container').removeClass('show');
});
$('.remark-btn').click(function () {
var cfg = {
title: '备注 Remark',
template: '',
initialize: function (dialog) {
$('<textarea rows="2" autofocus="autofocus"></textarea>').addClass('remark-input').attr('name', 'remark').val(dataCache.remark || '').appendTo($('.weui_dialog_bd', dialog));
},
confirm: function (dialog, chosen) {
if (chosen) {
var remark = $('textarea[name="remark"]', dialog).val();
if (remark) {
$('#remark-box').text('备注:' + remark).show()
} else {
$('#remark-box').text('').hide();
}
dataCache.remark = remark;
}
}
};
showWeuiDialog(cfg);
});
$('.paydetail').click(function () {
var config = {
title: 'Payment Detail',
template: '',
initialize: function (dialog) {
var bd = $('.weui_dialog_bd', dialog);
var currencySymbol = window.currency == 'CNY' ? '¥' : '$';
$('<p></p>').html('Input Price 输入金额:' + currencySymbol + dataCache.price).appendTo(bd);
if (parseFloat(dataCache.surcharge) > 0) {
$('<p></p>').html('Surcharge 手续费(' + window.rateValue + '%):+' + currencySymbol + dataCache.surcharge).appendTo(bd);
}
if (parseFloat(dataCache.tax) > 0) {
$('<p></p>').html('GST(10%):' + currencySymbol + dataCache.tax).appendTo(bd);
}
$(dataCache.discounts).each(function () {
$('<p></p>').html(this.title + ':-' + currencySymbol + this.amount).appendTo(bd);
});
$('<p></p>').addClass('final').html('Final 支付金额:' + currencySymbol + (dataCache.finalPrice || 0)).appendTo(bd);
}
};
showWeuiDialog(config);
});
$('#key_P').click(function () {
debugger
dataCache.remark = $('.remark-textarea').val();
if (window.requireRemark) {
if (!dataCache.remark) {
var config = {
title: '请先输入备注',
template: ''
};
showWeuiDialog(config);
}
}
});
$('#key_P').bind('touchstart', function () {
dataCache.remark = $('.remark-textarea').val();
if (window.requireRemark) {
if (!dataCache.remark) {
return;
}
}
$('#key_P').addClass('hidden');
$('#key_Loading').removeClass('hidden');
if (dataCache.paying) {
return;
}
dataCache.paying = true;
var data = {price: dataCache.price + '', currency: window.currency};
if (dataCache.remark) {
data.description = dataCache.remark;
}
if (window.extensions.indexOf('preauthorize') >= 0) {
data.preauthorize = true;
}
if (window.extensions.indexOf('qrcodemode') >= 0) {
data.qrmode = true;
}
if (window.extensions.indexOf('customerrate') >= 0) {
data.customerrate = true;
}
data.coupons = dataCache.coupons;
data.qrcodeVersion = window.qrcodeVersion;
$.ajax({
url: '/api/v1.0/alipay/partners/' + window.client_moniker + '/orders',
method: 'POST',
data: JSON.stringify(data),
contentType: 'application/json',
dataType: 'json',
success: function (pay) {
if (pay.direct_paid) {
location.href = '/api/v1.0/alipay/partners/' + window.client_moniker + '/orders/' + pay.order_id + '/result';
return;
}
if (window.AlipayJSBridge) {
callPayment();
} else {
// 如果没有注入则监听注入的事件
document.addEventListener('AlipayJSBridgeReady', callPayment, false);
}
function callPayment() {
try {
AlipayJSBridge.call('tradePay', {
tradeNO: pay.trade_no
}, function (res) {
dataCache.paying = false;
if (res.resultCode == '9000') {
AlipayJSBridge.call('startApp', {
appId: '20000056',
param: {
actionType: 'showSuccPage',
payResult: res.result
},
closeCurrentApp: false
});
startCheckOrder(pay.order_id, '/api/v1.0/alipay/partners/' + window.client_moniker + '/orders/' + pay.order_id + '/result');
} else if (res.resultCode == '6001') {
//do nothing
} else {
if (res.memo) {
weuiAlert(res.memo);
}
}
$('#key_P').removeClass('hidden');
$('#key_Loading').addClass('hidden');
})
} catch (err) {
weuiAlert(err)
}
}
},
error: function (jqXhr) {
weuiAlert(jqXhr.responseJSON.message);
$('#key_P').removeClass('hidden');
$('#key_Loading').addClass('hidden');
dataCache.paying = false;
}
})
});
function startCheckOrder(orderId, url) {
function checkOrderStd() {
$.ajax({
url: '/api/v1.0/payment/orders/' + orderId + '/status',
method: 'GET',
dataType: 'json',
success: function (res) {
if (res.paid) {
location.href = url;
} else {
setTimeout(checkOrderStd, 500);
}
}
})
}
checkOrderStd();
}
function weuiAlert(msg) {
var config = {
template: msg
};
showWeuiDialog(config);
}
function showWeuiDialog(config) {
if (config.templateUrl) {
$.ajax({
url: config.templateUrl,
dataType: 'html',
success: function (template) {
buildDialog(template);
}
});
} else {
buildDialog(config.template);
}
function buildDialog(template) {
var defaultConfig = {backdrop: true};
config = $.extend({}, defaultConfig, config);
var dialog = $("<div></div>", {class: 'weui_dialog_confirm'});
var mask = $('<div></div>', {class: 'weui_mask'}).appendTo(dialog);
if (config.backdrop) {
mask.click(function () {
dialog.remove();
if ($.isFunction(config.dismiss)) {
config.dismiss();
}
})
}
var dialogBox = $("<div></div>", {class: 'weui_dialog'}).appendTo(dialog);
if (config.title) {
$('<div></div>', {class: 'weui_dialog_hd'}).append($('<strong></strong>', {class: 'weui_dialog_title'}).html(config.title)).appendTo(dialogBox);
}
var dialogBody = $("<div></div>", {class: 'weui_dialog_bd'}).appendTo(dialogBox);
if (template) {
dialogBody.append(template);
}
if ($.isFunction(config.initialize)) {
config.initialize(dialog);
}
var ft = $('<div class="weui_dialog_ft"></div>').appendTo(dialogBox);
if(window.paypad_version !== 'v3'){
if ($.isFunction(config.confirm)) {
var yes = $('<a></a>', {
class: 'weui_btn_dialog primary',
text: 'OK',
style: 'background: #0bb20c;color: #fff;'
}).appendTo(ft);
yes.click(function () {
config.confirm(dialog, true);
dialog.remove();
});
var no = $('<a></a>', {class: 'weui_btn_dialog default', text: 'Cancel'}).appendTo(ft);
no.click(function () {
config.confirm(dialog, false);
dialog.remove();
})
} else {
var ok = $('<a></a>', {
class: 'weui_btn_dialog primary',
text: 'OK',
style: 'background: #0bb20c;color: #fff;'
}).appendTo(ft);
ok.click(function () {
dialog.remove();
})
}
} else {
if ($.isFunction(config.confirm)) {
var yes = $('<a></a>', {
class: 'weui_btn_dialog primary',
text: 'OK',
style: 'background: #FF9705;color: #fff;'
}).appendTo(ft);
yes.click(function () {
config.confirm(dialog, true);
dialog.remove();
});
var no = $('<a></a>', {class: 'weui_btn_dialog default', text: 'Cancel'}).appendTo(ft);
no.click(function () {
config.confirm(dialog, false);
dialog.remove();
})
} else {
var ok = $('<a></a>', {
class: 'weui_btn_dialog primary',
text: 'OK',
style: 'background: #FF9705;color: #fff;'
}).appendTo(ft);
ok.click(function () {
dialog.remove();
})
}
}
dialog.appendTo($('body'));
}
}
});

@ -0,0 +1,620 @@
.header-banner {
background:url(/static/images/pay_v4_banner.png) no-repeat;
background-size: 92% 100%;
background-position: center;
box-shadow:0 0 10px #dddddd inset;
}
.merchant-title{
font-family: PingFang-SC-Medium;
font-size: 13px;
color: #FFFFFF;
letter-spacing: 0;
}
.line{
padding-left: 30px;
color: #FFD194;
}
body {
-webkit-touch-callout: auto;
-webkit-user-select: auto;
-khtml-user-select: auto;
-moz-user-select: auto;
-ms-user-select: auto;
user-select: auto;
box-sizing: border-box;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
div, span, p, ul, li {
box-sizing: border-box;
}
.warning-sm{
color:red;
font-size:10px;
transform-origin: left;
transform: scale(0.8);
}
.weui_grid {
padding: 7px;
height: 53px;
}
.ff.key {
position: relative;
}
.ff {
font-size: 26px;
color: #FFFFFF;
}
.ff img {
margin: 10px auto;
display: block;
width: 34px;
}
div.wait {
top: 0;
margin-left: auto;
margin-right: auto;
left: 0;
right: 0;
position: absolute;
vertical-align: middle;
text-align: center;
bottom: 0;
opacity: .5;
background-color: gray;
z-index: 10000;
}
.bisnam {
font-size: 16px;
color: #aaaaaa;
text-align: left;
margin-top: 10px;
padding: 0;
}
.rmbcurrency {
font-size: 13px;
color: #FFFFFF;
vertical-align: text-bottom;
line-height: 38px;
padding-left: 10px;
}
.static .rmbcurrency {
font-size: 14px;
line-height: 30px;
}
.rmbvalue {
font-size: 24px;
color: #FFFFFF;
vertical-align: text-bottom;
float: right;
}
.rmbvalue:before {
content: '≈¥';
font-size: 16px;
}
.paydetail {
float: right;
margin-top: 5px;
margin-left: 5px;
}
.static .rmbvalue {
font-size: 18px;
}
.currency {
font-size: 40px;
color: #FFFFFF;
/* line-height: 67px; */
vertical-align: text-bottom;
padding-left: 10px;
padding-right: 3px;
line-height: 1.45;
}
.static .currency {
color: #FFFFFF;
font-size: 25px;
}
.value {
font-size: 50px;
line-height: 66px;
color: #FFFFFF;
margin-left: -5px;
vertical-align: text-bottom;
padding-right: 10px;
width: 87%;
}
.static .value {
color: #FFFFFF;
font-size: 24px;
}
input.value {
background: transparent;
border: none;
line-height: 50px;
}
input.value:active {
background: transparent;
}
input.value:focus {
border: none;
outline: none;
user-select: auto;
-webkit-user-select: auto;
-moz-user-select: auto;
}
.pp {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
overflow-x: hidden;
background-color: #fbf9fe;
}
.new_year {
width:100%;
height:100%;
position:absolute;
top:18%;
left:0;
z-index:-1;
border-radius: 0 0 25px 25px;
}
.bankpay {
text-align: center;
padding: 20px;
color: #FFFFFF;
}
@media screen and (max-height: 520px){
.bankpay {
text-align: center;
padding: 0;
color: #FFFFFF;
}
}
.row {
width: 100%;
padding: 0 30px;
}
.hidden {
display: none;
}
.hide-keyboard-btn {
width: 100%;
}
.hide-keyboard-btn:after {
content: '';
transform: rotate(45deg);
border-right: 2px solid #ccc;
border-bottom: 2px solid #ccc;
width: 30px;
height: 30px;
transform-origin: center;
display: block;
margin: auto;
}
.remark-box.visible {
display: block;
}
.remark-box.visible .remark-input {
font-size: 1.4em;
border: none;
background: #fff;
}
.white-box {
background: #fff;
width: 96%;
margin: 10px auto;
display: block;
position: relative;
padding: 0 10px;
box-sizing: border-box;
}
.white-box.full {
width: 100%;
}
.logo-box .banner {
width: 100%;
display: block;
}
.logo {
margin: auto;
display: block;
margin-top: 20px;
max-height: 60px;
max-width: 80%;
}
.logo-small {
max-height: 100px;
}
.currencyrow {
box-sizing: border-box;
margin-top: 0;
text-align: left;
margin-bottom: 0px;
}
@media screen and (max-height:670px){
.currencyrow {
box-sizing: border-box;
margin-top: 0;
text-align: left;
margin-bottom: 0px;
}
}
@media screen and (max-height: 520px){
.currencyrow {
box-sizing: border-box;
margin-top: 20px;
text-align: center;
margin-bottom: 20px;
}
}
.currencyrow:after {
content: '';
display: block;
clear: both;
}
.currencyrow > * {
display: inline-block;
vertical-align: bottom;
margin-bottom: 0;
box-sizing: border-box;
}
.remark-input {
width: 100%;
font-size: 26px;
border-radius: 0;
outline: none;
}
.remark-box {
display: none;
}
.remark-box .remark-mask {
text-align: center;
height: 50px;
font-size: 0.9em;
line-height: 35px;
color: #ccc;
}
.remark-label {
position: absolute;
top: 5px;
right: 5px;
font-size: 20px;
z-index: 1;
font-weight: bold;
color: #0d6aad;
}
.coupons {
width: 100%;
}
.coupons > li {
display: block;
width: 100%;
float: none;
color: #888888;
border-bottom: 1px dashed #aaa;
padding: 5px 0px;
}
.coupons > li:after {
content: '';
clear: both;
display: block
}
.coupons > li:last-child {
border: none;
}
.coupons .title, .coupons .desc, .coupons label {
display: block;
}
.coupons .coupon-content {
display: block;
float: left;
}
.coupons .title {
font-weight: bold;
font-size: 1em;
}
.coupons .use-check {
position: relative;
display: block;
width: 25px;
background-repeat: no-repeat;
height: 25px;
background-size: contain;
float: right;
margin-right: 5px;
margin-top: 10px;
}
.coupons .use-check.checked {
background-image: url(/static/images/checkbox-checked.png);
}
.coupons .use-check.unchecked {
background-image: url(/static/images/checkbox-unchecked.png);
}
.coupons .use-check.disabled {
background-image: url(/static/images/checkbox-disabled.png) !important;
}
.coupons .desc {
font-size: 1em;
}
.weui-wepay-logos {
background: transparent;
}
.row.weui_grids:before, .row.weui_grids .weui_grid:before, .row.weui_grids .weui_grid:after {
display: none;
}
.button_sp_area {
display: block;
position: relative;
margin-top: 10px;
}
.button_sp_area:after {
content: '';
clear: both;
display: block;
}
.button_sp_area a {
height: 50px;
line-height: 50px;
padding: 0px;
font-family: Helvetica;
font-size: 20px;
float: left;
text-align: center;
border-radius: 0;
color: #fff;
}
.button_sp_area .paynow {
width: 65%;
background: #FEB900;
}
.button_sp_area.alipay .paynow {
background-color: #FEB900;
}
.button_sp_area.rpay .paynow {
background-color: #FEB900;
}
.button_sp_area .remark-btn {
width: 35%;
background: #FF9705
}
.pay-brands {
text-align: center;
line-height: 20px;
font-size: 24px;
margin-top: 12px;
color: #dddddd;
}
.pay-brands img {
height: 18px;
}
.pay-brands img.wechat-logo {
height: 14px;
}
.weui_dialog_bd .final {
font-weight: bold;
}
#coupon-box-toggle {
padding: 0 20px;
margin-bottom: 10px;
text-align: right;
color: #30af69;
font-size: 12px;
cursor: pointer;
}
#coupon-box {
padding: 0 20px;
margin-bottom: 30px;
text-align: right;
color: #30af69;
font-size: 12px;
cursor: pointer;
}
.coupons-container {
position: fixed;
z-index: 1;
top: 0;
left: 0;
right: 0;
bottom: 0;
overflow: auto;
display: none;
}
.coupons-container.show{
display: block;
}
.coupons-container > .coupons-mask {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, .6);
z-index: 1;
}
.coupons-container > .coupon-box {
position: fixed;
z-index: 4;
left: 50%;
top: 50%;
width: 95%;
background: #fff;
padding: 10px;
transform: translate(-50%, -50%);
}
.coupons-container .coupon-box-title{
width: 100%;
display: block;
background: #fff;
padding: 0 10px 5px;
font-size: 14px;
border-bottom: 1px solid #d0d0d0;
}
.coupons-container .coupon-box-title:after{
content: '';
display: block;
clear: both;
}
.coupons-container .coupon-box-title>.title{
float: left;
display: block;
color: #0BB20C;
}
.coupons-container .coupon-box-title>#close-coupon-box{
color: #700;
float: right;
display: block;
cursor: pointer;
}
.actCharity-red{
color: #FB5252;
display: inline;
}
.actCharity{
display: inline;
font-family: PingFang-SC-Medium;
font-size: 13px;
color: #FFFFFF;
letter-spacing: 0;
text-align: center;
}
.remark-textarea{
font-size: 17px;
width: calc(100% - 70px);
margin: 0 20px;
height: 78px;
border: 1px solid #EBE8E8;
padding:15px;
}
.remark-textarea::-webkit-input-placeholder {
font-size: 13px;
color: #BCBCBC;
}
.paynow-button{
background: #19AD18;
border: 1px solid #179B16;
border-radius: 3px;
width: calc(100% - 40px);
margin: 0 20px;
display: block;
font-size: 16px;
color: #FFFFFF;
letter-spacing: 0;
text-align: center;
height: 48px;
line-height: 48px;
margin-top: 31px;
}
.bankpay-button{
border: 1px solid #FF6600;
border-radius: 3px;
font-size: 16px;
color: #FF6600;
letter-spacing: 0;
text-align: center;
display: block;
height: 48px;
line-height: 48px;
background-color: white;
}
#coupon-box-toggle.canUse-coupon{
padding: 0 30px;
margin-bottom: 10px;
text-align: right;
color: #FF6600;
font-size: 12px;
cursor: pointer;
margin: 11px;
}
input::-webkit-input-placeholder{
font-size: 50px;
color: #FFFFFF;
line-height: 60px;
vertical-align: text-bottom;
}

@ -0,0 +1,476 @@
/**
* Created by yixian on 2017-05-08
*/
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'); //只能输入两个小数
};
$(function () {
'use strict';
// document.querySelector('body').addEventListener('touchmove', function(e) {
// if (!document.querySelector('.coupons').contains(e.target)) {
// e.preventDefault();
// }
// });
var dataCache = {price: '0', coupons: [], coupon_groups: {}};
var exchangeRate = 'CNY' == window.currency ? 1 : parseFloat(window.exchange_rate);
dataCache.paying = false;
var ctrl = {};
$('.ff.key').bind('touchstart', function () {
if (dataCache.paying) {
return;
}
var char = $(this).attr('data-char');
appendChar(char);
});
$('#audVal').bind('input porpertychange', function () {
if (dataCache.paying) {
return;
}
var char = $(this).val();
if (parseFloat(char) > 10000) {
char = char.slice(0, char.length - 1);
$(this).val(char);
return;
}
appendChar(char);
});
$('.coupons .use-check').click(function () {
if ($(this).hasClass('disabled')) {
return;
}
var couponId = $(this).attr('data-coupon-id');
var couponGroup = $(this).attr('data-coupon-group');
if (couponGroup) {
var prevCouponId = dataCache.coupon_groups[couponGroup];
if (prevCouponId) {
var prevIdx = dataCache.coupons.indexOf(prevCouponId);
if (prevIdx >= 0) {
dataCache.coupons.splice(prevIdx, 1);
}
if (prevCouponId != couponId) {
$('.coupons .use-check[data-coupon-id="' + prevCouponId + '"]').removeClass('checked').addClass('unchecked');
dataCache.coupon_groups[couponGroup] = couponId;
} else {
dataCache.coupon_groups[couponGroup] = null;
}
} else {
dataCache.coupon_groups[couponGroup] = couponId;
}
}
if ($(this).is('.checked')) {
$(this).removeClass('checked').addClass('unchecked');
} else {
$(this).removeClass('unchecked').addClass('checked');
}
var checked = $(this).is('.checked');
if (checked) {
dataCache.coupons.push(couponId);
updatePrice();
} else {
var idx = dataCache.coupons.indexOf(couponId);
dataCache.coupons.splice(idx, 1);
updatePrice();
}
});
$('.cb_bankpay').click(function () {
$.ajax({
url: '/sys/partners/' + window.client_moniker + '/jump/link',
method: 'GET',
success: function (res) {
location.href = res;
},
error: function (resp) {
var config = {
template: resp
};
showWeuiDialog(config);
}
})
});
$('#key_B').bind('touchstart', function () {
backspace();
});
function updatePoundage(price) {
if (window.extensions.indexOf('customerrate') >= 0 && window.rateValue != null) {
if (window.use_customised_rate) {
var rate = new Decimal(100).plus(window.rateValue).div(100);
var poundageValue = new Decimal(dataCache.price).mul(rate).sub(dataCache.price);
} else {
var rateRemain = new Decimal(100).sub(window.rateValue).div(100);
poundageValue = new Decimal(dataCache.price).div(rateRemain).sub(dataCache.price);
}
dataCache.poundageValue = poundageValue.toFixed(2, Decimal.ROUND_HALF_UP);
return poundageValue.plus(price).toFixed(2, Decimal.ROUND_HALF_UP);
}
return price;
}
function updatePrice() {
$('#audVal').html(dataCache.price);
var realPrice = dataCache.price;
$('#audValReal').html(realPrice);
var surchargeData = calculateSurcharge(realPrice);
var price = surchargeData.newPrice || realPrice;
var priceBeforeDiscount = price;
dataCache.discounts = [];
dataCache.tax = surchargeData.tax;
dataCache.surcharge = surchargeData.surcharge;
$(window.coupons).each(function () {
price = this.handleDiscount(price, dataCache.price, dataCache.discounts, dataCache.coupons);
});
dataCache.finalPrice = new Decimal(price).toFixed(2, Decimal.ROUND_FLOOR);
var rate = 'CNY' == window.currency ? 1 : exchangeRate;
var cnyVal = Decimal.mul(price, rate).toFixed(2, Decimal.ROUND_FLOOR);
dataCache.currencyPrice = 'CNY' == window.currency ? Decimal.div(priceBeforeDiscount, exchangeRate).toFixed(2, Decimal.ROUND_FLOOR) : priceBeforeDiscount;
$('#cnyVal').html(cnyVal)
}
function backspace() {
dataCache.price = dataCache.price.substring(0, dataCache.price.length - 1);
if (dataCache.price.length == 0) {
dataCache.price = '0';
}
updatePrice();
updatePoundageStatus();
}
function appendChar(char) {
if (char == "") {
char = '0';
}
var check = /[^\d.]/g;
if (check.test(char)) {
return;
}
var tmpChar = (char.split('.')).length-1;
if (tmpChar > 1) {
return;
}
var pointLocation = dataCache.price.indexOf('.');
if (pointLocation >= 0 || char == '.' || char.length < 5) {
if (pointLocation >= 0 && char == '.') {
return;
}
if (pointLocation >= 0 && pointLocation <= char.length - 4) {
return;
}
if (dataCache.price == '0' && char != '.') {
dataCache.price = '';
}
dataCache.price = char;
updatePrice();
updatePoundageStatus();
}
}
function updatePoundageStatus() {
$(window.coupons).each(function () {
var coupon = this;
var couponId = coupon.couponId();
if (coupon.isEnable(dataCache.currencyPrice || 0)) {
$('.coupons .use-check[data-coupon-id=' + couponId + ']').removeClass('disabled');
} else {
var dom = $('.coupons .use-check[data-coupon-id=' + couponId + ']').addClass('disabled');
var couponGroup = dom.attr('data-coupon-group');
if (couponGroup) {
if (dataCache.coupon_groups[couponGroup] == couponId) {
dataCache.coupon_groups[couponGroup] = null;
}
}
var idx = dataCache.coupons.indexOf(couponId);
if (idx >= 0) {
dataCache.coupons.splice(idx, 1);
}
dom.removeClass('checked').addClass('unchecked');
}
})
}
updatePoundageStatus();
$('#coupon-box-toggle').click(function () {
$('.coupons-container').addClass('show');
});
$('.coupons-container>.coupons-mask,.coupons-container #close-coupon-box').click(function () {
$(this).parents('.coupons-container').removeClass('show');
});
$('.remark-btn').click(function () {
var cfg = {
title: '备注 Remark',
template: '',
initialize: function (dialog) {
$('<textarea rows="2" autofocus="autofocus"></textarea>').addClass('remark-input').attr('name', 'remark').val(dataCache.remark || '').appendTo($('.weui_dialog_bd', dialog));
},
confirm: function (dialog, chosen) {
if (chosen) {
var remark = $('textarea[name="remark"]', dialog).val();
if (remark) {
$('#remark-box').text('备注:' + remark).show()
} else {
$('#remark-box').text('').hide();
}
dataCache.remark = remark;
}
}
};
showWeuiDialog(cfg);
});
$('.paydetail').click(function () {
var config = {
title: 'Payment Detail',
template: '',
initialize: function (dialog) {
var bd = $('.weui_dialog_bd', dialog);
var currencySymbol = window.currency == 'CNY' ? '¥' : '$';
$('<p></p>').html('Input Price 输入金额:' + currencySymbol + dataCache.price).appendTo(bd);
if (parseFloat(dataCache.surcharge) > 0) {
$('<p></p>').html('Surcharge 手续费(' + window.rateValue + '%):+' + currencySymbol + dataCache.surcharge).appendTo(bd);
}
if (parseFloat(dataCache.tax) > 0) {
$('<p></p>').html('GST(10%):' + currencySymbol + dataCache.tax).appendTo(bd);
}
$(dataCache.discounts).each(function () {
$('<p></p>').html(this.title + ':-' + currencySymbol + this.amount).appendTo(bd);
});
$('<p></p>').addClass('final').html('Final 支付金额:' + currencySymbol + (dataCache.finalPrice || 0)).appendTo(bd);
}
};
showWeuiDialog(config);
});
$('#key_P').click(function () {
debugger
dataCache.remark = $('.remark-textarea').val();
if (window.requireRemark) {
if (!dataCache.remark) {
var config = {
title: '请先输入备注',
template: ''
};
showWeuiDialog(config);
}
}
});
$('#key_P').bind('touchstart', function () {
dataCache.remark = $('.remark-textarea').val();
if (window.requireRemark) {
if (!dataCache.remark) {
return;
}
}
$('#key_P').addClass('hidden');
$('#key_Loading').removeClass('hidden');
if (dataCache.paying) {
return;
}
dataCache.paying = true;
var data = {price: dataCache.price + '', currency: window.currency};
if (dataCache.remark) {
data.description = dataCache.remark;
}
if (window.extensions.indexOf('preauthorize') >= 0) {
data.preauthorize = true;
}
if (window.extensions.indexOf('qrcodemode') >= 0) {
data.qrmode = true;
}
if (window.extensions.indexOf('customerrate') >= 0) {
data.customerrate = true;
}
data.coupons = dataCache.coupons;
data.qrcodeVersion = window.qrcodeVersion;
$.ajax({
url: '/api/payment/v1.0/wechat_jsapi_payment/partners/' + window.client_moniker + '/preorder',
method: 'get',
data: data,
traditional: true,
dataType: 'json',
success: function (pay) {
if (data.qrmode) {
location.href = pay.pay_url;
return;
}
if (pay.direct_paid) {
location.href = '/api/payment/v1.0/wechat_jsapi_payment/partners/' + window.client_moniker + '/orders/' + pay.order_id;
return;
}
var paydata = pay.jsapi;
WeixinJSBridge.invoke('getBrandWCPayRequest', {
'appId': paydata.appId,
'timeStamp': paydata.timeStamp,
'nonceStr': paydata.nonceStr,
'package': paydata.package,
'signType': paydata.signType,
'paySign': paydata.paySign
}, function (res) {
dataCache.paying = false;
if (res.err_msg == 'get_brand_wcpay_request:ok') {
startCheckOrder(pay.order_id, '/api/payment/v1.0/wechat_jsapi_payment/partners/' + window.client_moniker + '/orders/' + pay.order_id);
} else {
if (res.err_msg != 'get_brand_wcpay_request:cancel' && res.err_msg != 'get_brand_wcpay_request:fail') {
weuiAlert('WeChat Error:' + res.err_msg);
}
}
$('#key_P').removeClass('hidden');
$('#key_Loading').addClass('hidden');
})
},
error: function (jqXhr) {
var respText = jqXhr.responseText;
try {
weuiAlert(JSON.parse(respText).message);
$('#key_P').removeClass('hidden');
$('#key_Loading').addClass('hidden');
dataCache.paying = false;
} catch (e) {
alert("Unexpected Error:" + respText);
$('#key_P').removeClass('hidden');
$('#key_Loading').addClass('hidden');
dataCache.paying = false;
}
}
})
});
function startCheckOrder(orderId, url) {
function checkOrderStd() {
$.ajax({
url: '/api/v1.0/payment/orders/' + orderId + '/status',
method: 'GET',
dataType: 'json',
success: function (res) {
if (res.paid) {
location.href = url;
} else {
setTimeout(checkOrderStd, 500);
}
}
})
}
checkOrderStd();
}
function weuiAlert(msg) {
var config = {
template: msg
};
showWeuiDialog(config);
}
function showWeuiDialog(config) {
if (config.templateUrl) {
$.ajax({
url: config.templateUrl,
dataType: 'html',
success: function (template) {
buildDialog(template);
}
});
} else {
buildDialog(config.template);
}
function buildDialog(template) {
var defaultConfig = {backdrop: true};
config = $.extend({}, defaultConfig, config);
var dialog = $("<div></div>", {class: 'weui_dialog_confirm'});
var mask = $('<div></div>', {class: 'weui_mask'}).appendTo(dialog);
if (config.backdrop) {
mask.click(function () {
dialog.remove();
if ($.isFunction(config.dismiss)) {
config.dismiss();
}
})
}
var dialogBox = $("<div></div>", {class: 'weui_dialog'}).appendTo(dialog);
if (config.title) {
$('<div></div>', {class: 'weui_dialog_hd'}).append($('<strong></strong>', {class: 'weui_dialog_title'}).html(config.title)).appendTo(dialogBox);
}
var dialogBody = $("<div></div>", {class: 'weui_dialog_bd'}).appendTo(dialogBox);
if (template) {
dialogBody.append(template);
}
if ($.isFunction(config.initialize)) {
config.initialize(dialog);
}
var ft = $('<div class="weui_dialog_ft"></div>').appendTo(dialogBox);
if(window.paypad_version !== 'v3'){
if ($.isFunction(config.confirm)) {
var yes = $('<a></a>', {
class: 'weui_btn_dialog primary',
text: 'OK',
style: 'background: #0bb20c;color: #fff;'
}).appendTo(ft);
yes.click(function () {
config.confirm(dialog, true);
dialog.remove();
});
var no = $('<a></a>', {class: 'weui_btn_dialog default', text: 'Cancel'}).appendTo(ft);
no.click(function () {
config.confirm(dialog, false);
dialog.remove();
})
} else {
var ok = $('<a></a>', {
class: 'weui_btn_dialog primary',
text: 'OK',
style: 'background: #0bb20c;color: #fff;'
}).appendTo(ft);
ok.click(function () {
dialog.remove();
})
}
} else {
if ($.isFunction(config.confirm)) {
var yes = $('<a></a>', {
class: 'weui_btn_dialog primary',
text: 'OK',
style: 'background: #FF9705;color: #fff;'
}).appendTo(ft);
yes.click(function () {
config.confirm(dialog, true);
dialog.remove();
});
var no = $('<a></a>', {class: 'weui_btn_dialog default', text: 'Cancel'}).appendTo(ft);
no.click(function () {
config.confirm(dialog, false);
dialog.remove();
})
} else {
var ok = $('<a></a>', {
class: 'weui_btn_dialog primary',
text: 'OK',
style: 'background: #FF9705;color: #fff;'
}).appendTo(ft);
ok.click(function () {
dialog.remove();
})
}
}
dialog.appendTo($('body'));
}
}
});
Loading…
Cancel
Save