You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

517 lines
16 KiB
HTML

5 years ago
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="chrome=1,IE=edge">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="mobile-web-app-capable" content="yes">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<meta name="format-detection" content="telephone=no">
<link rel="stylesheet" href="__CSS__/weui.min.css">
<script src="__JS__/flex.min.js"></script>
<script type="text/javascript" src="__JS__/jquery.js"></script>
<title>支付中心</title>
</head>
<style>
html,
body {
background-color: #F5F5F5;
min-height: 100vh;
}
.weui-cells {
border-radius: .2rem;
box-shadow: 0px 0px .05rem rgba(0, 0, 0, .2);
margin-top: 0px;
}
.weui-cell {
height: 0.85rem;
font-size: .28rem;
color: #292929;
padding: 0px .3rem;
}
.bottombutton {
height: 1rem;
background-color: #21B1EB;
color: #ffffff;
font-size: .32rem;
text-align: center;
line-height: 1rem;
bottom: 0px;
}
img {
width: .72rem;
height: .72rem;
margin-right: .2rem;
/* margin: .3rem; */
}
.paylist .weui-cell {
padding: .2rem .3rem;
height: 1rem;
}
.paylist .weui-cell__hd {
display: flex;
}
.weui-cells:after {
border: 0px;
}
.weui-cells:before {
border: 0px;
}
/**/
.weui-label {
font-size: .32rem;
}
.weui-cell__bd{
padding-right: .2rem;
}
.weui-input {
background-color: #EDEDED;
height: .6rem;
border-radius: .1rem;
padding-left: .2rem;
}
.weui-cell {
margin: .3rem 0rem;
/* padding:0 .3rem; */
}
.weui-cell:before {
height: 0px;
content: none;
}
.redtxt.weui-cell__ft {
color: red;
font-size: .28rem;
margin-left: .17rem;
}
.paymoney:after{
content: " ";
position: absolute;
left: 0;
top: 0;
right: 0;
height: 1px;
border-top: 1px solid #e5e5e5;
color: #e5e5e5;
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transform: scaleY(.5);
transform: scaleY(.5);
left: .3rem;
right:.3rem;
z-index: 2;
}
.paypage{
padding: 0 .3rem 1.2rem;margin-top:-1.8rem;
}
5 years ago
.bottombutton{
height:1rem;background-color: #21B1EB;color: #ffffff;font-size: .32rem;text-align: center;line-height:1rem;bottom: 0px;
}
@media screen and (orientation: landscape) {
body{
line-height: 0;
}
.weui-footer_fixed-bottom{
position: relative;
bottom: 0px;
}
.paypage{
padding: 0 .3rem .3rem;margin-top:-1.8rem;
}
}
/* new */
.weui-dialog{
border-radius: 15px;
}
.dialogcodebtn{
border-bottom: 1px solid #a9a9a9;
margin:0 .3rem;
padding: 0px;
}
.dialogcodebtn .weui-input{
background-color:rgba(0,0,0,0);
padding-left: 0px;
}
.dialogcodebtn .weui-btn:after{
border:0px;
}
.dialogcodebtn .weui-btn{
padding: 0px;
text-align: center;
}
5 years ago
</style>
<script type="text/javascript">
var validCode=true;
var smsstatus = true;
function getSms() {
if ($("#custName").val() == '' || $("#idNo").val() == '' || $("#phoneNo").val() == '') {
$("#tipmsg").html('参数不能为空');
$("#msgdialog").show();
5 years ago
return ;
}
if (!smsstatus) return;
$("#sms").html("请求中");
smsstatus = false;
var sms=document.getElementById("sms");
/* $("#bankdialog").show();
return ; */
5 years ago
//获取短信验证码
$.ajax({
type: "POST",
url: "/sdk.php/WapPay/shortcut_pay",
dataType:'json',
data: {
'user_id' : $("#user_id").val(),
'game_id' : $("#game_id").val(),
'custName' : $("#custName").val(),
'cardNo' : $("#cardNo").val(),
'idNo' : $("#idNo").val(),
'phoneNo' : $("#phoneNo").val()
},
success:function(res){
// 返回列表数组,构造数据流模块
if (res.status == 1) {
var time=60;
if (validCode) {
validCode=false;
var t=setInterval(function () {
time--;
sms.innerText=time+"秒"
if (time==0) {
clearInterval(t);
5 years ago
sms.innerText="获取验证码";
5 years ago
validCode=true;
smsstatus = true;
}
},1000);
}
}
else {
if (res.status== 2) { // 未签约
// 展示未签约页面
$("#sign_mibile").html($("#phoneNo").val());
$("#bankdialog").show();
}
5 years ago
sms.innerText="获取验证码";
// $("#tipmsg").html(res.info);
// $("#msgdialog").show();
smsstatus = true;
5 years ago
}
}
});
}
var signsmsstatus = true;
function getSignSms() {
if ($("#custName").val() == '' || $("#idNo").val() == '' || $("#phoneNo").val() == '') {
$("#tipmsg").html('参数不能为空.');
$("#bankdialog").hide();
$("#msgdialog").show();
$("#tipok").click(function(){
$("#msgdialog").hide();
$("#bankdialog").show();
$(this).off("click");
});
return ;
}
if (!signsmsstatus) return;
$("#sign_sms").html("请求中");
signsmsstatus = false;
//获取短信验证码
$.ajax({
type: "POST",
url: "/sdk.php/WapPay/sign_contract",
dataType:'json',
data: {
'user_id' : $("#user_id").val(),
'game_id' : $("#game_id").val(),
'custName' : $("#custName").val(),
'cardNo' : $("#cardNo").val(),
'idNo' : $("#idNo").val(),
'phoneNo' : $("#phoneNo").val()
},
success:function(res){
// 返回列表数组,构造数据流模块
if (res.status == 1) {
var time=60;
if (validCode) {
validCode=false;
var sms=document.getElementById("sign_sms");
var t=setInterval(function () {
time--;
sms.innerText=time+"秒"
if (time==0) {
clearInterval(t);
5 years ago
sms.innerText="获取验证码";
validCode=true;
signsmsstatus = true;
}
},1000);
}
}
else {
tiptype = 2;
$("#tipmsg").html(res.info);
$("#msgdialog").show();
$("#bankdialog").hide();
5 years ago
$("#sign_sms").html("获取验证码");
signsmsstatus = true;
}
}
});
}
var signflag = true;
function signcontract() {
if (!signflag) return ;
signflag = false;
var code = $("#sign_code").val();
if (!code) {
$("#tipmsg").html('参数不能为空');
$("#bankdialog").hide();
$("#msgdialog").show();
tiptype = 2;
signflag = true;
return ;
}
$.ajax({
type: "POST",
url: "/sdk.php/WapPay/sign_contract",
dataType:'json',
data: {
'user_id' : $("#user_id").val(),
'game_id' : $("#game_id").val(),
'custName' : $("#custName").val(),
'cardNo' : $("#cardNo").val(),
'idNo' : $("#idNo").val(),
'phoneNo' : $("#phoneNo").val(),
'signCode' : code,
},
success:function(res){
if (res.status == 1) {
$("#tipmsg").html('签约成功');
$("#bankdialog").hide();
$("#msgdialog").show();
tiptype = 1;
} else {
$("#tipmsg").html(res.info);
$("#bankdialog").hide();
$("#msgdialog").show();
tiptype = 2;
signflag = true;
}
}
});
}
5 years ago
function submit_check() {
return false;
return true;
}
var btnpay = false;
function sendform() {
if (btnpay == true) return ;
btnpay = true;
var isok = false;
if ($("#custName").val() != '' && $("#idNo").val() != '' && $("#phoneNo").val() != '' && $("#smsCode").val() != '')
isok = true;
if (!isok) {
btnpay = false;
$("#tipmsg").html('参数不能为空');
$("#msgdialog").show();
// alert('参数不能为空');
5 years ago
}
if(isok){
$("#Dialog").show();
}
5 years ago
return isok;
}
var tiptype = 0;
$(function() {
/* $("#close_tip").click(function() {
$("#msgdialog").hide();
}); */
$("#close_img").click(function() {
$("#msgdialog").hide();
$("#bankdialog").hide();
});
$("#tipok,#close_tip").click(function() {
if (tiptype == 0) {
$("#msgdialog").hide();
}
if (tiptype == 1) {
$("#msgdialog").hide();
$("#bankdialog").hide();
5 years ago
$("#sign_sms").html("获取验证码");
signsmsstatus = true;
tiptype = 0;
}
if (tiptype == 2) {
$("#msgdialog").hide();
$("#bankdialog").show();
}
});
});
5 years ago
</script>
<body>
<!--加载提示框-->
<div class="js_dialog" id="Dialog" style="display: none">
<div class="weui-mask"></div>
<div class="weui-dialog" style="width: 4.2rem;max-width: 4.2rem;display: flex;">
<img src="__IMG__/load.gif" style="width: 4.2rem;height: 3.2rem;">
</div>
</div>
<!--提醒信息弹窗-->
<div class="js_dialog" id="msgdialog" style="display: none">
<div class="weui-mask"></div>
<div class="weui-dialog" style="width: 4.5rem;max-width: 4.5rrem;display: flex;flex-direction:column;padding-bottom: .3rem;">
<div id="close_tip" style="width: 100%;text-align: left;height: .6rem;display: flex;">
<img src="__IMG__/close-black.png" style="width: .3rem;height: .3rem;margin: .3rem 0 0 .3rem;">
</div>
<div style="width: 100%;text-align: center;">
<img src="__IMG__/txicon.png" style="width: 2.44rem;height: 1.46rem;">
</div>
<p id="tipmsg" style="text-align: center;font-size: .24rem;margin: .35rem auto;">
提示内容提示内容
</p>
<div style="width: 100%;text-align: center;display: flex;justify-content:center;">
<div id="tipok" style="width: 3.3rem;height: .6rem;background-color: #21B1EB;color: #ffffff;font-size: .28rem;border-radius:30px;line-height: .6rem;">
确认
</div>
</div>
</div>
</div>
<!--签约提示弹窗-->
<div class="js_dialog" id="bankdialog" style="display: none;">
<div class="weui-mask"></div>
<div class="weui-dialog" style="width: 6.3rem;max-width: 6.3rem;display: flex;flex-direction:column;padding-bottom: .3rem;">
<div id="" style="width: 100%;text-align: left;height: .6rem;display: flex;">
<img id="close_img" src="__IMG__/close-black.png" style="width: .3rem;height: .3rem;margin: .3rem 0 0 .3rem;">
<div style="font-size: .28rem;margin-top: .3rem; flex-grow:1;text-align: center;">银行卡签约</div>
</div>
<div style="margin:.3rem .3rem;text-align: left;">
<p style="font-size: .24rem;color:#A9A9A9; line-height: 1.2;">该银行卡未签约,无法进行充值,请获取短信验证进行签约</p>
<p style="font-size: .24rem;color:#292929;margin-top: .3rem;">手机:<span id="sign_mibile" style="margin-left:10px;"></span></p>
</div>
<div class="weui-cell weui-cell_vcode dialogcodebtn">
<div class="weui-cell__bd">
<input id="sign_code" class="weui-input" type="number" placeholder="请输入验证码">
</div>
<div class="weui-cell__ft ">
<a id="sign_sms" onclick="getSignSms()" href="javascript:;" class="weui-btn" style="width: 1.5rem;font-size: .24rem;background-color: #21B1EB;color: #fff;border-radius: .1rem;height: .5rem;line-height:.5rem;">获取验证码</a>
</div>
</div>
<div id="close" style="width: 100%;text-align: center;display: flex;justify-content:center;margin-top: .3rem;">
<div onclick="signcontract();" id="sign_contract" style="width: 5.3rem;height: .6rem;background-color: #21B1EB;color: #ffffff;font-size: .28rem;border-radius:5px;line-height: .6rem;">
确认
</div>
</div>
</div>
</div>
5 years ago
<div
style="height: 3.1rem;background-color: #21B1EB;color: #fff;border-bottom-left-radius:40%;border-bottom-right-radius:40%;padding: .43rem .3rem;line-height: 1.5;">
5 years ago
<p style="font-size: .4rem;">待支付……</p>
<p style="font-size: .24rem;margin-top:.32rem;">订单超过30分钟自动取消请在20分钟18秒内完成支付</p>
</div>
<form id="wfform" name="wfform" method="post" action="{:U('WapPay/shortcut_pay')}" target="_parent">
<input type="hidden" id="wfddll" name="wfddll" value="wfddll" />
<input type="hidden" name="user_id" id="user_id" value="{$user_id}" />
<input type="hidden" name="game_id" id="game_id" value="{$game_id}" />
<div class="paypage">
5 years ago
<div class="weui-cells weui-cells_form" style="padding: .3rem 0 0;">
<div class="weui-cell">
<div class="weui-cell__hd"><label class="weui-label">姓名:</label></div>
<div class="weui-cell__bd">
<input id="custName" name="custName" class="weui-input" type="text">
</div>
<div class="redtxt weui-cell__ft">
*
</div>
</div>
<div class="weui-cell">
<div class="weui-cell__hd"><label class="weui-label">银行卡号:</label></div>
<div class="weui-cell__bd">
<input id="cardNo" name="cardNo" class="weui-input" type="text">
</div>
<div class="redtxt weui-cell__ft">
*
</div>
</div>
<div class="weui-cell">
<div class="weui-cell__hd"><label class="weui-label">身份证号:</label></div>
<div class="weui-cell__bd">
<input id="idNo" name="idNo" class="weui-input" type="text">
</div>
<div class="redtxt weui-cell__ft">
*
</div>
</div>
<div class="weui-cell">
<div class="weui-cell__hd"><label class="weui-label">手机号:</label></div>
<div class="weui-cell__bd">
<input id="phoneNo" name="phoneNo" class="weui-input" type="text">
</div>
<div class="redtxt weui-cell__ft">
*
</div>
</div>
<div class="weui-cell weui-cell_vcode">
<div class="weui-cell__hd"><label class="weui-label">验证码:</label></div>
<div class="weui-cell__bd">
<input id="smsCode" name="smsCode" class="weui-input" type="number">
</div>
<div class="weui-cell__ft" style="margin-right: .24rem;margin-left:.3rem;">
<a id="sms" onclick="getSms()" href="javascript:;" class="weui-btn" style="font-size: .28rem;;background-color: #21B1EB;color: #fff;border-radius: .1rem;height: .6rem;line-height:.6rem;">获取验证码</a>
</div>
</div>
<div class="weui-cell paymoney" style="height:1.4rem;">
<div class="weui-cell__bd" >
<p style="font-size: .32rem;">支付金额:</p>
</div>
<div class="weui-cell__ft" style="font-size: .48rem;color: red;">{$pay_amount}</div>
</div>
</div>
</div>
<!-- -->
<div style="width: 100%;border: 0;" name="wfsubmit" class="weui-footer_fixed-bottom bottombutton">
<input style="width: 100%;border: 0;" onclick="return sendform()" type="submit" id="wfsubmit" name="wfsubmit" value="立即提交订单" class="weui-footer_fixed-bottom bottombutton"/>
</div>
5 years ago
</form>
</body>
</html>