From 0404b35b1f7c35b0c971231d7ea85eff30b01da2 Mon Sep 17 00:00:00 2001 From: dulingling Date: Thu, 2 Jan 2020 19:04:03 +0800 Subject: [PATCH] =?UTF-8?q?Add:=E6=B7=BB=E5=8A=A0=E6=94=AF=E4=BB=98?= =?UTF-8?q?=E5=AE=9D=E6=94=AF=E4=BB=98=E9=A1=B5=E9=9D=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- pom.xml | 2 +- .../ui/static/templates/alipay/v5/payment.css | 605 +++++++++++++++++ .../ui/static/templates/alipay/v5/payment.js | 448 +++++++++++++ .../ui/static/templates/alipay/v6/payment.css | 608 ++++++++++++++++++ 4 files changed, 1662 insertions(+), 1 deletion(-) create mode 100644 src/main/ui/static/templates/alipay/v5/payment.css create mode 100644 src/main/ui/static/templates/alipay/v5/payment.js create mode 100644 src/main/ui/static/templates/alipay/v6/payment.css diff --git a/pom.xml b/pom.xml index 5b827ddb1..aec08dcbd 100644 --- a/pom.xml +++ b/pom.xml @@ -9,7 +9,7 @@ 4.0.0 manage - 1.3.12 + 1.3.13 UTF-8 1.4.0 diff --git a/src/main/ui/static/templates/alipay/v5/payment.css b/src/main/ui/static/templates/alipay/v5/payment.css new file mode 100644 index 000000000..ec676b992 --- /dev/null +++ b/src/main/ui/static/templates/alipay/v5/payment.css @@ -0,0 +1,605 @@ + +body { + -webkit-touch-callout: none; + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + 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); +} +.ff.key { + position: relative; +} +.weui_grid{ + padding: 15px 10px; + border-right: 1px solid #eee; + border-bottom: 1px solid #eee; +} +.ff { + font-size: 26px; + color: #333333; +} + +.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; + margin-top: 10px; + margin-bottom: 10px; +} + +.rmbcurrency { + font-size: 18px; + color: #888888; + vertical-align: text-bottom; + line-height: 38px; +} + +.static .rmbcurrency { + font-size: 14px; + line-height: 30px; +} + +.rmbvalue { + font-size: 24px; + color: #888888; + 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: #000; + line-height: 66px; + vertical-align: text-bottom; + margin-right: 10px; +} + +.static .currency { + color: #555555; + font-size: 25px; +} + +.value { + font-size: 40px; + line-height: 66px; + color: #000; + margin-left: -5px; + vertical-align: text-bottom; + padding-right: 10px; +} + +.static .value { + color: #333333; + 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: none; + -webkit-user-select: none; + -moz-user-select: none; +} + +.pp { + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + overflow-x: hidden; + background-color: #fbf9fe; +} + +.row { + width: 100%; + padding: 0 20px; + background: white; +} + +.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-box { + margin-bottom: 50px; +} + +.logo-small { + max-height: 100px; +} + +.currencyrow { + box-sizing: border-box; + padding: 0px 20px; + text-align: left; + background: #fff; +} + +.currencyrow:after { + content: ''; + display: block; + clear: both; +} + +.currencyrow > * { + display: inline-block; + vertical-align: bottom; + margin-bottom: 0; + box-sizing: border-box; +} + +.currencyrow > .remark-btn { + float: right; + display: block; + width: 30px; + height: 30px; + margin-top: 17px; + background: url(../../../images/remark_btn.png) no-repeat; + background-size: cover; +} + +.remark-input { + width: 100%; + font-size: 16px; + border-radius: 0; + outline: none; + border: 0px; + height: 50px; + border-top: 1px solid #eee; + padding: 10px 0px; + margin-bottom: 20px; +} + +.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%; + margin-top: -1px; + background: #fff; + max-height: 350px; + overflow: auto; + padding: 0 10px; + border-radius: 0 0 6px 6px; +} + +.coupons > li { + display: block; + width: 100%; + float: none; + color: #888888; + border-radius: 6px; + padding: 10px; + margin: 15px 0; + background: #fff; + box-shadow: 0 0 10px #aaa; +} + +.coupons > li:after { + content: ''; + clear: both; + display: block +} + +.coupons > li:last-child { + border: none; + border-radius: 0 15px 15px 0; +} + +.coupons > li .coupon-content { + position: relative; + width: 100%; + border-radius: 4px; + border: 1px dashed #aaa; + padding: 10px 15px; +} + +.coupons .title, .coupons .desc, .coupons label { + display: block; +} + +.coupons .coupon-content { + display: block; + float: left; +} + +.coupons .title { + font-weight: bold; + font-size: 1em; + color: #000000; + position: relative; +} + +.coupon-background-image { + width: 100%; +} + +.coupon-logo { + height: 25px; + padding-right: 5px; + position: relative; + top: 6px; +} + +.coupon-image { + width: 100%; + position: relative; + display: block; +} + +.coupon-box-title .coupon-image { + margin: 0; +} + +.coupons .use-check { + position: absolute; + display: block; + top: 0; + background-size: cover; + width: 34px; + height: 34px; + right: 0; +} + +.coupons .use-check.checked { + background-image: url(/static/images/coupon_checked@3x.png); +} + +.coupons .use-check.unchecked { + background-image: url(/static/images/coupon_unchecked@2x.png); +} + +.coupons .use-check.disabled { + background-image: url(/static/images/coupon_disabled@2x.png) !important; +} + +.coupons .desc { + font-size: 13px; + color: #323200; + margin-top: 5px; + letter-spacing: 0px; + position: relative; + line-height: 18px; +} + +.weui-wepay-logos { + background: transparent; +} + +.row.weui_grids:before, .row.weui_grids .weui_grid:before, .row.weui_grids .weui_grid:after { + display: none; +} + +.keyboard-grids { + padding: 0; + margin-top: 10px; + background: #fff; + bottom: 0; +} + +.keyboard-grids:after { + display: block; + content: ''; + clear: both; +} + +.keyboard-grids .key { + float: left; + position: relative; + width: 25%; + text-align: center; + border-right: 1px solid #eee; + border-bottom: 1px solid #eee; + margin-right: -1px; + margin-bottom: -1px; + height: 60px; + line-height: 60px; +} + +.keyboard-grids .key.del > img { + height: 24px; + display: block; + position: relative; + margin: 19px auto; +} + +.keyboard-grids .key.paynow { + height: 180px; + float: right; + background: #108ee9; + color: #fff; +} + +.keyboard-grids .key.paynow.alipay { + background: #108ee9; +} +.keyboard-grids .key.paynow.rpay { + background: #FF2D55; +} + +.alipay { + color: #108ee9; +} + +.wechat { + color: #09bb07; +} + +.keyboard-grids .key.paynow > .label { + display: block; + position: absolute; + width: 100%; + text-align: center; + top: 50%; + transform: translateY(-50%); +} + +.keyboard-grids .key.zero-btn { + width: 50%; +} + +.pay-brands { + text-align: center; + line-height: 20px; + font-size: 24px; + /* position: fixed; */ + width: 100%; + padding-top: 5px; + padding-bottom: 10px; + bottom: 240px; + color: #dddddd; + background: #fbf9fe; + margin-left: -25px; +} + +.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-top: 10px; + text-align: right; + 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%; + transform: translate(-50%, -50%); +} + +.coupons-container .coupon-box-title { + width: 100%; + display: block; + position: relative; +} + +.coupons-container .coupon-box-title:after { + content: ''; + display: block; + clear: both; +} + +.coupon-close-image { + width: 30px; +} + +.coupons-container .coupon-box-title > .title { + display: block; + text-align: center; + font-size: 18px; + color: #FFFFFF; + position: absolute; + width: 100%; + bottom: 34%; +} + +.coupons-container .coupon-box-title > #close-coupon-box { + color: #700; + position: absolute; + display: block; + cursor: pointer; + top: -40px; + right: 0; +} + +.actCharity{ + display: inline; +} + +.title_client_name{ + padding: 15px 0px 20px 20px; + background: white; +} + +.bank_button{ + background-color: #eee; + border: 0px; + color: white; + padding: 28px 13%; + margin: 15px 10px; + line-height: 5px; + border-radius: 7px; + font-size: 16px; +} + +.pay_button{ + + background-color: #eee; + border: 0px; + color: white; + padding: 28px 13%; + margin: 15px 0px; + line-height: 5px; + border-radius: 7px; + font-size: 16px; +} + diff --git a/src/main/ui/static/templates/alipay/v5/payment.js b/src/main/ui/static/templates/alipay/v5/payment.js new file mode 100644 index 000000000..263cf63db --- /dev/null +++ b/src/main/ui/static/templates/alipay/v5/payment.js @@ -0,0 +1,448 @@ +/** + * Created by yixian on 2017-05-08 + */ + +$(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 = {}; + + 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); + }); + + $('.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) { + var pointLocation = dataCache.price.indexOf('.'); + if (pointLocation >= 0 || char == '.' || dataCache.price.length < 5) { + if (pointLocation >= 0 && char == '.') { + return; + } + if (pointLocation >= 0 && pointLocation <= dataCache.price.length - 3) { + 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'); + }); + + $('.paydetail').click(function () { + var config = { + title: 'Payment Detail', + template: '', + initialize: function (dialog) { + var bd = $('.weui_dialog_bd', dialog); + var currencySymbol = window.currency == 'CNY' ? '¥' : '$'; + $('

').html('Input Price 输入金额:' + currencySymbol + dataCache.price).appendTo(bd); + if (parseFloat(dataCache.surcharge) > 0) { + $('

').html('Surcharge 手续费(' + window.rateValue + '%):+' + currencySymbol + dataCache.surcharge).appendTo(bd); + } + if (parseFloat(dataCache.tax) > 0) { + $('

').html('GST(10%):' + currencySymbol + dataCache.tax).appendTo(bd); + } + $(dataCache.discounts).each(function () { + $('

').html(this.title + ':-' + currencySymbol + this.amount).appendTo(bd); + }); + $('

').addClass('final').html('Final 支付金额:' + currencySymbol + (dataCache.finalPrice || 0)).appendTo(bd); + } + }; + showWeuiDialog(config); + }); + + $('#key_P').click(function () { + if (window.requireRemark) { + if (!dataCache.remark) { + var config = { + title: '请先输入备注', + template: '' + }; + showWeuiDialog(config); + } + + } + }); + + function addBlurListen() { + $('.remark-input').on('blur', function (event) { + dataCache.remark = $('textarea[name="remark"]').val(); + }); + } + addBlurListen(); + + $('#audVal').bind('DOMNodeInserted', function(e) { + if(dataCache.price==0){ + $('.pay_button').css({"background-color":"#eee",}).attr('disabled',true); + $('.bank_button').css({"background-color":"#eee",}).attr('disabled',true); + }else{ + $('.pay_button').css({"background-color":"#19AD18",}).attr('disabled',false); + $('.bank_button').css({"background-color":"#FF6600",}).attr('disabled',false); + } + }); + $('#key_P').bind('touchstart', function () { + if (window.requireRemark) { + if ($('textarea[name="remark"]').val()=="") { + 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_div').removeClass('hidden'); + $('#key_Loading_div').addClass('hidden'); + }) + } catch (err) { + weuiAlert(err) + } + } + }, + error: function (jqXhr) { + weuiAlert(jqXhr.responseJSON.message); + $('#key_P_div').removeClass('hidden'); + $('#key_Loading_div').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 = $("
", {class: 'weui_dialog_confirm'}); + var mask = $('
', {class: 'weui_mask'}).appendTo(dialog); + if (config.backdrop) { + mask.click(function () { + dialog.remove(); + if ($.isFunction(config.dismiss)) { + config.dismiss(); + } + }) + } + var dialogBox = $("
", {class: 'weui_dialog'}).appendTo(dialog); + if (config.title) { + $('
', {class: 'weui_dialog_hd'}).append($('', {class: 'weui_dialog_title'}).html(config.title)).appendTo(dialogBox); + } + var dialogBody = $("
", {class: 'weui_dialog_bd'}).appendTo(dialogBox); + if (template) { + dialogBody.append(template); + } + if ($.isFunction(config.initialize)) { + config.initialize(dialog); + } + var ft = $('
').appendTo(dialogBox); + if(window.paypad_version !== 'v3'){ + if ($.isFunction(config.confirm)) { + var yes = $('', { + 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 = $('', {class: 'weui_btn_dialog default', text: 'Cancel'}).appendTo(ft); + no.click(function () { + config.confirm(dialog, false); + dialog.remove(); + }) + } else { + var ok = $('', { + 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 = $('', { + 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 = $('', {class: 'weui_btn_dialog default', text: 'Cancel'}).appendTo(ft); + no.click(function () { + config.confirm(dialog, false); + dialog.remove(); + }) + } else { + var ok = $('', { + class: 'weui_btn_dialog primary', + text: 'OK', + style: 'background: #FF9705;color: #fff;' + }).appendTo(ft); + ok.click(function () { + dialog.remove(); + }) + } + } + dialog.appendTo($('body')); + addBlurListen(); + } + + } +}); diff --git a/src/main/ui/static/templates/alipay/v6/payment.css b/src/main/ui/static/templates/alipay/v6/payment.css new file mode 100644 index 000000000..a025a5abc --- /dev/null +++ b/src/main/ui/static/templates/alipay/v6/payment.css @@ -0,0 +1,608 @@ + +body { + -webkit-touch-callout: none; + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + 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); +} +.ff.key { + position: relative; +} +.weui_grid{ + padding: 15px 10px; + border-right: 1px solid #eee; + border-bottom: 1px solid #eee; +} +.ff { + font-size: 26px; + color: #333333; +} + +.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; + margin-top: 10px; + margin-bottom: 10px; +} + +.rmbcurrency { + font-size: 18px; + color: #888888; + vertical-align: text-bottom; + line-height: 38px; + +} + +.static .rmbcurrency { + font-size: 14px; + line-height: 30px; +} + +.rmbvalue { + font-size: 24px; + color: #888888; + 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: #000; + line-height: 66px; + vertical-align: text-bottom; + margin-right: 10px; +} + +.static .currency { + color: #555555; + font-size: 25px; +} + +.value { + font-size: 40px; + line-height: 66px; + color: #000; + margin-left: -5px; + vertical-align: text-bottom; + padding-right: 10px; +} + +.static .value { + color: #333333; + 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: none; + -webkit-user-select: none; + -moz-user-select: none; +} + +.pp { + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + overflow-x: hidden; + background-color: #fbf9fe; +} + +.row { + width: 100%; + padding: 0 20px; + background: white; +} + +.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-box { + padding: 20px 20px 30px 20px ; + background-color: #FF8533; +} + +.logo-small { + max-height: 100px; +} + +.currencyrow { + box-sizing: border-box; + padding: 0px 20px; + text-align: left; + background: #fff; +} + +.currencyrow:after { + content: ''; + display: block; + clear: both; +} + +.currencyrow > * { + display: inline-block; + vertical-align: bottom; + margin-bottom: 0; + box-sizing: border-box; +} + +.currencyrow > .remark-btn { + float: right; + display: block; + width: 30px; + height: 30px; + margin-top: 17px; + background: url(../../../images/remark_btn.png) no-repeat; + background-size: cover; +} + +.remark-input { + width: 100%; + font-size: 16px; + border-radius: 0; + outline: none; + border: 0px; + height: 50px; + border-top: 1px solid #eee; + padding: 10px 0px; + margin-bottom: 20px; +} + +.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%; + margin-top: -1px; + background: #fff; + max-height: 350px; + overflow: auto; + padding: 0 10px; + border-radius: 0 0 6px 6px; +} + +.coupons > li { + display: block; + width: 100%; + float: none; + color: #888888; + border-radius: 6px; + padding: 10px; + margin: 15px 0; + background: #fff; + box-shadow: 0 0 10px #aaa; +} + +.coupons > li:after { + content: ''; + clear: both; + display: block +} + +.coupons > li:last-child { + border: none; + border-radius: 0 15px 15px 0; +} + +.coupons > li .coupon-content { + position: relative; + width: 100%; + border-radius: 4px; + border: 1px dashed #aaa; + padding: 10px 15px; +} + +.coupons .title, .coupons .desc, .coupons label { + display: block; +} + +.coupons .coupon-content { + display: block; + float: left; +} + +.coupons .title { + font-weight: bold; + font-size: 1em; + color: #000000; + position: relative; +} + +.coupon-background-image { + width: 100%; +} + +.coupon-logo { + height: 25px; + padding-right: 5px; + position: relative; + top: 6px; +} + +.coupon-image { + width: 100%; + position: relative; + display: block; +} + +.coupon-box-title .coupon-image { + margin: 0; +} + +.coupons .use-check { + position: absolute; + display: block; + top: 0; + background-size: cover; + width: 34px; + height: 34px; + right: 0; +} + +.coupons .use-check.checked { + background-image: url(/static/images/coupon_checked@3x.png); +} + +.coupons .use-check.unchecked { + background-image: url(/static/images/coupon_unchecked@2x.png); +} + +.coupons .use-check.disabled { + background-image: url(/static/images/coupon_disabled@2x.png) !important; +} + +.coupons .desc { + font-size: 13px; + color: #323200; + margin-top: 5px; + letter-spacing: 0px; + position: relative; + line-height: 18px; +} + +.weui-wepay-logos { + background: transparent; +} + +.row.weui_grids:before, .row.weui_grids .weui_grid:before, .row.weui_grids .weui_grid:after { + display: none; +} + +.keyboard-grids { + padding: 0; + margin-top: 10px; + background: #fff; + bottom: 0; +} + +.keyboard-grids:after { + display: block; + content: ''; + clear: both; +} + +.keyboard-grids .key { + float: left; + position: relative; + width: 25%; + text-align: center; + border-right: 1px solid #eee; + border-bottom: 1px solid #eee; + margin-right: -1px; + margin-bottom: -1px; + height: 60px; + line-height: 60px; +} + +.keyboard-grids .key.del > img { + height: 24px; + display: block; + position: relative; + margin: 19px auto; +} + +.keyboard-grids .key.paynow { + height: 180px; + float: right; + background: #09bb07; + color: #fff; +} + +.keyboard-grids .key.paynow.alipay { + background: #108ee9; +} +.keyboard-grids .key.paynow.rpay { + background: #FF2D55; +} + +.alipay { + color: #108ee9; +} + +.wechat { + color: #09bb07; +} + +.keyboard-grids .key.paynow > .label { + display: block; + position: absolute; + width: 100%; + text-align: center; + top: 50%; + transform: translateY(-50%); +} + +.keyboard-grids .key.zero-btn { + width: 50%; +} + +.pay-brands { + text-align: center; + line-height: 20px; + font-size: 24px; + /* position: fixed; */ + width: 100%; + padding-top: 5px; + padding-bottom: 10px; + bottom: 240px; + color: white; + background: #FF8533; +} + +.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-top: 10px; + text-align: right; + 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%; + transform: translate(-50%, -50%); +} + +.coupons-container .coupon-box-title { + width: 100%; + display: block; + position: relative; +} + +.coupons-container .coupon-box-title:after { + content: ''; + display: block; + clear: both; +} + +.coupon-close-image { + width: 30px; +} + +.coupons-container .coupon-box-title > .title { + display: block; + text-align: center; + font-size: 18px; + color: #FFFFFF; + position: absolute; + width: 100%; + bottom: 34%; +} + +.coupons-container .coupon-box-title > #close-coupon-box { + color: #700; + position: absolute; + display: block; + cursor: pointer; + top: -40px; + right: 0; +} + +.actCharity{ + display: inline; +} + +.title_client_name{ + padding: 15px 0px 20px 20px; + background-color: #F8F8F8; + border-radius: 11px 11px 0px 0px; + color: white; + text-align: center; + color: #555555; +} + +.bank_button{ + background-color: #eee; + border: 0px; + color: white; + padding: 28px 13%; + margin: 15px 10px; + line-height: 5px; + border-radius: 7px; + font-size: 16px; +} + +.pay_button{ + background-color: #eee; + border: 0px; + color: white; + padding: 28px 13%; + margin: 15px 0px; + line-height: 5px; + border-radius: 7px; + font-size: 16px; +} \ No newline at end of file