msb_52843
/
dalong_mall
1
0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

登录页

Browse Source
master
james.zhao 6 years ago
parent bc3cbb76f6
commit acb39590b8
11 changed files with 1313 additions and 129 deletions
Show Stats Download Patch File Download Diff File

109
src/main/ui/login.html
Unescape View File

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html>
<html style="height: 100%;">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
@ -30,7 +30,7 @@
<!-- Theme style -->
<link rel="stylesheet" href="./static/lib/dist/css/AdminLTE.min.css">
<link rel="stylesheet" href="./static/css/main.css">
<link rel="stylesheet" href="./static/css/login.css">
<!--[if lt IE 9]>
@ -46,7 +46,36 @@
a:link {
color: #08c;
}
@media (min-width: 768px) {
.qrcode-target-show {
background-position: -201px -199px;
}
.qrcode-target-hide {
background-position: -260px -260px;
}
.qrcode-target {
/*position: absolute;*/
width: 60px;
height: 80px;
margin-left: 93%;
margin-top: 0%;
margin-bottom: -8%;
display: block;
top: 0;
right: 0;
_right: 1px;
background-image: url(https://file.royalpay.com.au/open/2017/08/24/1503560419337_eiPHQHQRxGymVPaRHKCPndIO87zRWQ.png);
background-repeat: no-repeat;
cursor: pointer;
z-index: 101;
-webkit-transition: background-position .2s cubic-bezier(0.25, .5, .5, .9);
-moz-transition: background-position .2s cubic-bezier(0.25, .5, .5, .9);
transition: background-position .2s cubic-bezier(0.25, .5, .5, .9);
}
}
@media (max-width: 768px) {
.qrcode-target-show {
background-position: -201px -199px;
}
@ -60,8 +89,8 @@
width: 60px;
height: 60px;
margin-left: 87%;
margin-top: -6%;
margin-bottom: -6%;
margin-top: -7%;
margin-bottom: -8%;
display: block;
top: 0;
right: 0;
@ -74,6 +103,9 @@
-moz-transition: background-position .2s cubic-bezier(0.25, .5, .5, .9);
transition: background-position .2s cubic-bezier(0.25, .5, .5, .9);
}
}
</style>
</head>
<body class="hold-transition login-page login-page-bg">
@ -121,44 +153,44 @@
</div>
</div>
<div class="login-box login-box-right divloginbox">
<div class="login-box-right">
<!-- /.login-logo -->
<div class="login-box-body login-box-bg">
<div class="login-container login-box-bg">
<a href="#" class="qrcode-target qrcode-target-show" id="app-btn" title="扫码登录" seed="authcenter-qrshow"></a>
<p style="text-align: center;"><img src="static/images/rp_logo_vertical.svg"
style="width: 80%;margin-top: -15%;margin-bottom: -10%;"></p>
<p style="text-align: center;"><img src="static/images/rp_login_logo.png"
style="width: 18%;margin-top: 14.1%"></p>
<p style="text-align: center;font-size:20px;">Easy Business，Easy Payment</p>
<div id="qrdiv" hidden style="width: 70%;margin-left: 13%;">
<p class="ad">Easy Business，Easy Payment</p>
<div id="qrdiv" hidden class="qrdiv">
<img style="width: 100%" id="qrimgdev">
<span style="margin-left: 13%">打开RoyalPay App扫码登录</span>
<span>打开RoyalPay App扫码登录</span>
</div>
<form action="" method="post" id="loginForm" visible>
<form action="" method="post" id="loginForm" visible class="form">
<div class="form-group has-feedback">
<input type="text" id="loginid-input" class="form-control" placeholder="Login ID">
<span class="glyphicon glyphicon-user form-control-feedback"></span>
<input type="text" id="loginid-input" class="form-control login-info" placeholder="Login ID">
<!--<span class="glyphicon glyphicon-user form-control-feedback"></span>-->
</div>
<div class="form-group has-feedback">
<input type="password" id="pwd-input" class="form-control" placeholder="Password">
<span class="glyphicon glyphicon-lock form-control-feedback"></span>
<input type="password" id="pwd-input" class="form-control login-info" placeholder="Password">
<!--<span class="glyphicon glyphicon-lock form-control-feedback"></span>-->
</div>
<!--<span style="padding-left: 70%;font-size: smaller" id="forgetPassword">Forgot Password</span>-->
<!--<br/>-->
<div class="row">
<div class="form-group col-xs-12">
<input type="text" name="verifyCode" class="form-control" style="width: 70%;display: inline"
<input type="text" name="verifyCode" class="form-control login-info" style="width: 70%;display: inline"
id="verifyCode" placeholder="Verification Code">
<img style="width:30%;display:inline;height: 34px;float: right" id="kaptcha"
<img class="captcha" id="kaptcha"
src="/global/userstatus/captcha-login"
title="点击更换"/>
</div>
<!-- /.col -->
<div class="col-xs-12 margin-bottom">
<button type="button" id="login-btn" style="background-color: #f06010"
class="btn btn-warning btn-block btn-flat">Sign In
<div class="col-xs-12 login-submit-margin">
<button type="button" id="login-btn"
class="btn btn-warning btn-block btn-flat login-submit">Sign In
</button>
</div>
<div class="col-xs-12" id="wechat-btn-div" hidden>
@ -166,33 +198,20 @@
<i class="fa fa-wechat"></i> WeChat Sign In
</button>
</div>
<a href="#" id="forgetPassword-btn">I forgot my password</a>
<a href="#" id="forgetPassword-btn" class="forget">I forgot my password</a>
</div>
</form>
<!--<div tabindex="-1" role="dialog" class="modal fade ng-isolate-scope in" style="z-index: 1050; display: none;"-->
<!--id="qrmodal">-->
<!--<div class="modal-dialog modal-sm">-->
<!--<div class="modal-content" uib-modal-transclude="">-->
<!--<div style="width: 100%;padding: 10px;" class="ng-scope">-->
<!--Use Royalpay App Scan<br>-->
<!--<img style="width: 100%" id="qrimg">-->
<!--</div>-->
<!--</div>-->
<!--</div>-->
<!--</div>-->
<div class="row">
<div class="login-submit-margin">
<div class="col-sm-12 download-app">Download Royalpay App:
&nbsp;&nbsp;
<a href="https://itunes.apple.com/cn/app/royalpay/id1049566852?l=en&mt=8"><img src="/static/images/Bitmap.png"></a>
<a href="https://royalpay-1256684202.cos.ap-chengdu.myqcloud.com/royalpay_release_2.1.3_20190420_google.apk"><img src="/static/images/Bitmap1.png"></a></div>
<!--<div class="col-sm-6">-->
<!---->
<!-- /* border-radius: 0; */
box-shadow: none;
border-color: #d2d6de;
height: 34px;
padding: 6px 12px;
font-size: 14px;
line-height: 1.42857143;
color: #555;
/* background-color: #fff; */
/* background-image: none; */
border: 1px solid #ccc;-->
<!--</div>-->
</div>
</div>
</div>
<!-- /.login-box-body -->
</div>

374
src/main/ui/login_v1.html
Unescape View File

@ -0,0 +1,374 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="apple-touch-icon" sizes="57x57" href="ico/apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="ico/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="ico/apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="ico/apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="ico/apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="ico/apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="ico/apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="ico/apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="ico/apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="ico/android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="ico/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="ico/favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="ico/favicon-16x16.png">
<link rel="manifest" href="ico/manifest.json">
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="/ms-icon-144x144.png">
<meta name="theme-color" content="#ffffff">
<title>RoyalPay | Sign in</title>
<!-- Tell the browser to be responsive to screen width -->
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
<!-- Bootstrap 3.3.5 -->
<link href="static/lib/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- Font Awesome -->
<link href="static/lib/font-awesome-4.6.3/css/font-awesome.min.css" rel="stylesheet">
<!-- Theme style -->
<link rel="stylesheet" href="./static/lib/dist/css/AdminLTE.min.css">
<link rel="stylesheet" href="./static/css/main.css">
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<style>
a:hover {
color: #08c;
text-decoration: underline;
}
a:link {
color: #08c;
}
.qrcode-target-show {
background-position: -201px -199px;
}
.qrcode-target-hide {
background-position: -260px -260px;
}
.qrcode-target {
/*position: absolute;*/
width: 60px;
height: 60px;
margin-left: 87%;
margin-top: -6%;
margin-bottom: -6%;
display: block;
top: 0;
right: 0;
_right: 1px;
background-image: url(https://file.royalpay.com.au/open/2017/08/24/1503560419337_eiPHQHQRxGymVPaRHKCPndIO87zRWQ.png);
background-repeat: no-repeat;
cursor: pointer;
z-index: 101;
-webkit-transition: background-position .2s cubic-bezier(0.25, .5, .5, .9);
-moz-transition: background-position .2s cubic-bezier(0.25, .5, .5, .9);
transition: background-position .2s cubic-bezier(0.25, .5, .5, .9);
}
</style>
</head>
<body class="hold-transition login-page login-page-bg">
<div tabindex="-100" role="dialog" class="modal fade ng-isolate-scope in" style="z-index: 1055; display: none;"
id="findPassword">
<div class="modal-dialog modal-sm">
<div class="modal-content" uib-modal-transclude="">
<div style="width: 100%;padding: 10px;" class="ng-scope">
<p class="login-box-msg">Reset Password</p>
<form action="" method="post">
<div class="form-group has-feedback">
<input type="text" id="partner_code" class="form-control" placeholder="Partner Code">
<span class="glyphicon glyphicon-user form-control-feedback"></span>
</div>
<div class="row">
<div class="form-group col-xs-12">
<input type="text" name="verifyCode" class="form-control" style="width: 70%;display: inline"
id="email—verifyCode" placeholder="Verification Code">
<img style="width:30%;display:inline;height: 34px;float: right" id="email-kaptcha"
src="/global/userstatus/captcha-login"
title="点击更换"/>
</div>
<div class="col-xs-6">
<div class="checkbox icheck">
<label class="" style="font-size: smaller">
Please enter your partner code
</label>
</div>
</div>
<!-- /.col -->
<div class="col-xs-6">
<button type="button" id="submitEmail-btn" class="btn btn-primary btn-flat col-xs-6">
Submit
</button>
<button type="button" id="cancel-btn" class="btn btn-default btn-flat col-xs-6">Cancel
</button>
</div>
<!-- /.col -->
</div>
</form>
</div>
</div>
</div>
</div>
<div class="login-box login-box-right divloginbox">
<!-- /.login-logo -->
<div class="login-box-body login-box-bg">
<a href="#" class="qrcode-target qrcode-target-show" id="app-btn" title="扫码登录" seed="authcenter-qrshow"></a>
<p style="text-align: center;"><img src="static/images/rp_logo_vertical.svg"
style="width: 80%;margin-top: -15%;margin-bottom: -10%;"></p>
<p style="text-align: center;font-size:20px;">Easy Business，Easy Payment</p>
<div id="qrdiv" hidden style="width: 70%;margin-left: 13%;">
<img style="width: 100%" id="qrimgdev">
<span style="margin-left: 13%">打开RoyalPay App扫码登录</span>
</div>
<form action="" method="post" id="loginForm" visible>
<div class="form-group has-feedback">
<input type="text" id="loginid-input" class="form-control" placeholder="Login ID">
<span class="glyphicon glyphicon-user form-control-feedback"></span>
</div>
<div class="form-group has-feedback">
<input type="password" id="pwd-input" class="form-control" placeholder="Password">
<span class="glyphicon glyphicon-lock form-control-feedback"></span>
</div>
<!--<span style="padding-left: 70%;font-size: smaller" id="forgetPassword">Forgot Password</span>-->
<!--<br/>-->
<div class="row">
<div class="form-group col-xs-12">
<input type="text" name="verifyCode" class="form-control" style="width: 70%;display: inline"
id="verifyCode" placeholder="Verification Code">
<img style="width:30%;display:inline;height: 34px;float: right" id="kaptcha"
src="/global/userstatus/captcha-login"
title="点击更换"/>
</div>
<!-- /.col -->
<div class="col-xs-12 margin-bottom">
<button type="button" id="login-btn" style="background-color: #f06010"
class="btn btn-warning btn-block btn-flat">Sign In
</button>
</div>
<div class="col-xs-12" id="wechat-btn-div" hidden>
<button type="button" id="wechat-btn" style="background-color: #f06010" class="btn btn-warning btn-block btn-flat">
<i class="fa fa-wechat"></i> WeChat Sign In
</button>
</div>
<a href="#" id="forgetPassword-btn">I forgot my password</a>
</div>
</form>
<!--<div tabindex="-1" role="dialog" class="modal fade ng-isolate-scope in" style="z-index: 1050; display: none;"-->
<!--id="qrmodal">-->
<!--<div class="modal-dialog modal-sm">-->
<!--<div class="modal-content" uib-modal-transclude="">-->
<!--<div style="width: 100%;padding: 10px;" class="ng-scope">-->
<!--Use Royalpay App Scan<br>-->
<!--<img style="width: 100%" id="qrimg">-->
<!--</div>-->
<!--</div>-->
<!--</div>-->
<!--</div>-->
<!---->
<!-- /* border-radius: 0; */
box-shadow: none;
border-color: #d2d6de;
height: 34px;
padding: 6px 12px;
font-size: 14px;
line-height: 1.42857143;
color: #555;
/* background-color: #fff; */
/* background-image: none; */
border: 1px solid #ccc;-->
</div>
<!-- /.login-box-body -->
</div>
<!-- /.login-box -->
<!-- jQuery 2.1.4 -->
<script src="static/lib/jquery/jquery-2.1.4.min.js"></script>
<script src="static/lib/jquery/jquery.cookie.js"></script>
<!-- Bootstrap 3.3.5 -->
<script src="static/lib/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
if (window.console) {
var cons = console;
if (cons) {
cons.log("%c ", "padding:0px 300px;font-size:75px;background:url('https://file.royalpay.com.au/open/2017/08/24/1503558671611_yFZRCWzH7m3CVz2EJj2tu8jlmjS9PQ.png') no-repeat");
cons.log("%c温馨提示：请不要调皮地在此粘贴执行任何内容，这可能会导致您的账户受到攻击，给您带来损失 ！^_^'", " text-shadow: 0 1px 0 #ccc,0 2px 0 #c9c9c9,0 3px 0 #bbb,0 4px 0 #b9b9b9,0 5px 0 #aaa,0 6px 1px rgba(0,0,0,.1),0 0 5px rgba(0,0,0,.1),0 1px 3px rgba(0,0,0,.3),0 3px 5px rgba(0,0,0,.2),0 5px 10px rgba(0,0,0,.25),0 10px 10px rgba(0,0,0,.2),0 20px 20px rgba(0,0,0,.15);font-size:20px")
cons.log("做地球上最具互联网性、创新性、专业有爱的支付团队。 https://www.royalpay.com.au")
}
}
var ua = navigator.userAgent.toLowerCase();
if (ua.indexOf('micromessenger') >= 0) {
$('#wechat-btn-div').show();
$('#app-btn').hide();
$('#wechat-btn').click(function () {
location.href = '/global/userstatus/partner_signin_wechat';
});
}
function getUrlParam(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
var r = window.location.search.substr(1).match(reg); //匹配目标参数
if (r != null) {
return unescape(r[2]);
} else {
return null; //返回参数值
}
}
$('input').keypress(function (evt) {
if (evt.keyCode == 13) {
$('#login-btn').click();
}
});
$('#verifyCode').focus(function () {
var expire = $.cookie('code_expire_time');
if(expire!=null && new Date(parseInt(expire))<new Date()){
$('#kaptcha').click();
}
});
$('#login-btn').click(function () {
var loginid = $('#loginid-input').val();
if (loginid == null || loginid.length == 0) {
alert('请填写账号');
return;
}
var pwd = $('#pwd-input').val();
if (pwd == null || pwd.length == 0) {
alert('请填写密码');
return;
}
var verifyCode = $('#verifyCode').val();
if (verifyCode == null || verifyCode.length == 0) {
alert('请填写验证码');
return;
}
$.ajax({
url: '/global/userstatus/partner_signin',
method: 'post',
data: JSON.stringify({loginId: loginid, password: pwd, verifyCode: verifyCode}),
contentType: 'application/json',
dataType: 'text',
success: function () {
var from = getUrlParam("f");
location.href = from ? decodeURIComponent(from) : 'index.html'
},
error: function (jqXHR) {
alert(JSON.parse(jqXHR.responseText).message);
$('#kaptcha').attr("src", "/global/userstatus/captcha-login?" + Math.floor(Math.random() * 100));
}
})
});
$('#kaptcha').click(function () {
$(this).attr("src", "/global/userstatus/captcha-login?" + Math.floor(Math.random() * 100));
});
$('#email-kaptcha').click(function () {
$(this).attr("src", "/global/userstatus/captcha-login?" + Math.floor(Math.random() * 100));
});
$('#app-btn').click(function () {
if ($('#qrdiv').is(":visible")) {
$('#app-btn').attr('class', 'qrcode-target qrcode-target-show');
$('#loginForm').show();
$('#qrdiv').hide();
return;
}
if ($('#qrdiv').is(":hidden")) {
$('#app-btn').attr('class', 'qrcode-target qrcode-target-hide');
getNewQRCode();
}
});
function getNewQRCode() {
$.ajax({
url: '/global/userstatus/partner_signin_app_qrcode',
method: 'get',
dataType: 'json',
success: function (data) {
$('#qrimgdev').attr('src', data.code_img);
$('#qrdiv').show();
$('#loginForm').hide();
setTimeout(function () {
checkQRStatus(data.code_id)
}, 2000);
},
error: function (jqXHR) {
alert(jqXHR.responseJSON.message);
}
})
}
function checkQRStatus(codeId) {
$.ajax({
url: '/global/userstatus/partner_signin_app_qrcode/' + codeId + '/check',
method: 'get',
success: function () {
location.href = '/index.html'
},
error: function () {
if ($('#qrdiv').is(":visible")) {
setTimeout(function () {
checkQRStatus(codeId)
}, 2000)
}
}
})
}
$('#forgetPassword-btn').click(function () {
// $('#findPassword').show();
location.href = 'forget_password.html'
});
$('#cancel-btn').click(function () {
$('#findPassword').hide();
});
$('#submitEmail-btn').click(function () {
var partner_code = $('#partner_code').val();
if (partner_code == null || partner_code.length == 0) {
alert('请填入商户编码');
return;
}
var verifyCode = $('#email—verifyCode').val();
if (verifyCode == null || verifyCode.length == 0) {
alert('请填写验证码');
return;
}
$.ajax({
url: '/global/userstatus/partner_forgetpassword',
method: 'post',
data: JSON.stringify({partner_code: partner_code, verifyCode: verifyCode}),
contentType: 'application/json',
dataType: 'text',
success: function () {
alert("Reset password email has send your");
$('#findPassword').hide();
},
error: function (jqXHR) {
alert(JSON.parse(jqXHR.responseText).message);
$('#email-kaptcha').attr("src", "/global/userstatus/captcha-login?" + Math.floor(Math.random() * 100));
}
})
})
})
</script>
</body>
</html>

181
src/main/ui/m_login.html
Unescape View File

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html>
<html style="height: 100%;">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
@ -30,70 +30,158 @@
<!-- Theme style -->
<link rel="stylesheet" href="./static/lib/dist/css/AdminLTE.min.css">
<link rel="stylesheet" href="./static/css/main.css">
<link rel="stylesheet" href="./static/css/m_login.css">
<!-->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<style>
@media (min-width: 768px) {
.qrcode-target-show {
background-position: -199px -199px;
}
.qrcode-target-hide {
background-position: -260px -260px;
}
.qrcode-target {
/*position: absolute;*/
width: 60px;
height: 80px;
margin-left: 96%;
margin-top: 0%;
margin-bottom: -8%;
display: block;
top: 0;
right: 0;
_right: 1px;
background-image: url(https://file.royalpay.com.au/open/2017/08/24/1503560419337_eiPHQHQRxGymVPaRHKCPndIO87zRWQ.png);
background-repeat: no-repeat;
cursor: pointer;
z-index: 101;
-webkit-transition: background-position .2s cubic-bezier(0.25, .5, .5, .9);
-moz-transition: background-position .2s cubic-bezier(0.25, .5, .5, .9);
transition: background-position .2s cubic-bezier(0.25, .5, .5, .9);
}
}
@media (max-width: 768px) {
.qrcode-target-show {
background-position: -201px -199px;
}
.qrcode-target-hide {
background-position: -260px -260px;
}
.qrcode-target {
/*position: absolute;*/
width: 60px;
height: 60px;
margin-left: 87%;
margin-top: -7%;
margin-bottom: -8%;
display: block;
top: 0;
right: 0;
_right: 1px;
background-image: url(https://file.royalpay.com.au/open/2017/08/24/1503560419337_eiPHQHQRxGymVPaRHKCPndIO87zRWQ.png);
background-repeat: no-repeat;
cursor: pointer;
z-index: 101;
-webkit-transition: background-position .2s cubic-bezier(0.25, .5, .5, .9);
-moz-transition: background-position .2s cubic-bezier(0.25, .5, .5, .9);
transition: background-position .2s cubic-bezier(0.25, .5, .5, .9);
}
}
</style>
</head>
<body class="hold-transition login-page login-page-bg">
<div tabindex="-1" role="dialog" class="modal fade ng-isolate-scope in" style="z-index: 1050; display: none;"
id="qrmodal">
<div class="modal-dialog modal-sm">
<div class="modal-content" uib-modal-transclude="">
<div style="width: 100%;padding: 10px;" class="ng-scope">
请使用微信扫描<br>
<img style="width: 100%" id="qrimg">
</div>
</div>
</div>
</div>
<div class="login-box login-box-right divloginbox">
<!--<div tabindex="-1" role="dialog" class="modal fade ng-isolate-scope in" style="z-index: 1050; display: none;"-->
<!--id="qrmodal">-->
<!--<div class="modal-dialog modal-sm">-->
<!--<div class="modal-content" uib-modal-transclude="">-->
<!--<div style="width: 100%;padding: 10px;" class="ng-scope">-->
<!--请使用微信扫描<br>-->
<!--<img style="width: 100%" id="qrimg">-->
<!--</div>-->
<!--</div>-->
<!--</div>-->
<!--</div>-->
<div class="row" style="text-align: center">
<a href="#" class="qrcode-target qrcode-target-show" id="app-btn" title="扫码登录" seed="authcenter-qrshow"></a>
<div class="login-container text-center">
<!-- /.login-logo -->
<div class="login-box-body login-box-bg">
<p style="text-align: center;"><img src="static/images/rp_logo_vertical.svg" style="width: 80%;margin-top: -15%;margin-bottom: -10%;"></p>
<div class="login-box-bg">
<div class="col-md-6">
<p style="text-align: center;"><img src="static/images/rp_login_logo.png" style="width: 40%;margin-top: 10%"></p>
<p style="text-align: center;font-size:20px;">Easy Business，Easy Payment</p>
<p class="ad">Easy Business，Easy Payment</p>
</div>
<form action="" method="post">
<div class="col-md-6">
<div id="qrdiv" hidden class="qrdiv">
<img style="width: 60%" id="qrimgdev"><br>
<span>请使用微信扫描</span>
</div>
<form action="" method="post" id="loginForm">
<div class="form-group has-feedback">
<input type="text" id="loginid-input" class="form-control" placeholder="账号">
<span class="glyphicon glyphicon-user form-control-feedback"></span>
<input type="text" id="loginid-input" class="form-control login-info" placeholder="Login ID">
<!--<span class="glyphicon glyphicon-user form-control-feedback"></span>-->
</div>
<div class="form-group has-feedback">
<input type="password" id="pwd-input" class="form-control" placeholder="密码">
<span class="glyphicon glyphicon-lock form-control-feedback"></span>
<input type="password" id="pwd-input" class="form-control login-info" placeholder="Password">
<!--<span class="glyphicon glyphicon-lock form-control-feedback"></span>-->
</div>
<div class="row">
<div class="form-group col-xs-12">
<input type="text" name="verifyCode" class="form-control" style="width: 70%;display: inline"
id="verifyCode" placeholder="验证码">
<input type="text" name="verifyCode" class="form-control login-info" style="width: 70%;display: inline"
id="verifyCode" placeholder="Verification Code">
<img style="width:30%;display:inline;height: 34px;float: right" id="kaptcha"
src="/global/userstatus/captcha-login"
title="点击更换"/>
</div>
<!-- /.col -->
<div class="col-xs-12 margin-bottom">
<button type="button" id="login-btn" style="background-color: #f06010" class="btn btn-warning btn-block btn-flat">Sign In</button>
<button type="button" id="login-btn" class="btn btn-info btn-block btn-flat login-submit">Sign In</button>
</div>
<div class="col-xs-12">
<button type="button" id="wechat-btn" style="background-color: #f06010" class="btn btn-warning btn-block btn-flat">
<div class="col-xs-12" hidden id="wechat-btn-div">
<button type="button" id="wechat-btn" class="btn btn-warning btn-block btn-flat">
<i class="fa fa-wechat"></i> WeChat Sign In
</button>
</div>
<!-- /.col -->
</div>
</form>
</div>
<div class="row">
<div class="login-submit-margin">
<div class="col-md-12 download-app">
Download Royalpay App:
&nbsp;&nbsp;
<a href="https://itunes.apple.com/cn/app/royalpay/id1049566852?l=en&mt=8"><img src="/static/images/Bitmap.png"></a>
<a href="https://royalpay-1256684202.cos.ap-chengdu.myqcloud.com/royalpay_release_2.1.3_20190420_google.apk"><img src="/static/images/Bitmap1.png"></a>
</div>
<!--<div class="col-sm-6">-->
<!---->
<!--</div>-->
</div>
</div>
</div>
<!-- /.login-box-body -->
</div>
</div>
<!-- /.login-box -->
<!-- jQuery 2.1.4 -->
@ -162,18 +250,37 @@
$(this).attr("src", "/global/userstatus/captcha-login?" + Math.floor(Math.random() * 100));
});
$('#wechat-btn').click(function () {
var ua = navigator.userAgent.toLowerCase();
if (ua.indexOf('micromessenger') >= 0) {
location.href = '/global/userstatus/manager_signin_wechat'
} else {
$('#wechat-btn-div').show();
$('#app-btn').hide();
$('#wechat-btn').click(function () {
location.href = '/global/userstatus/partner_signin_wechat';
});
}
$('#app-btn').click(function () {
if ($('#qrdiv').is(":visible")) {
$('#app-btn').attr('class', 'qrcode-target qrcode-target-show');
$('#loginForm').show();
$('#qrdiv').hide();
return;
}
if ($('#qrdiv').is(":hidden")) {
$('#app-btn').attr('class', 'qrcode-target qrcode-target-hide');
getNewQRCode();
}
});
function getNewQRCode() {
$.ajax({
url: '/global/userstatus/manager_signin_wechat_qrcode',
method: 'get',
dataType: 'json',
success: function (data) {
$('#qrmodal').find('img#qrimg').attr('src', data.code_img);
$('#qrmodal').show();
$('#qrimgdev').attr('src', data.code_img);
$('#qrdiv').show();
$('#loginForm').hide();
setTimeout(function () {
checkQRStatus(data.code_id)
}, 2000);
@ -183,6 +290,14 @@
}
})
}
$('#wechat-btn').click(function () {
var ua = navigator.userAgent.toLowerCase();
if (ua.indexOf('micromessenger') >= 0) {
location.href = '/global/userstatus/manager_signin_wechat'
} else {
getNewQRCode();
}
});
$('#qrmodal').click(function () {
$(this).hide()

208
src/main/ui/m_login_v1.html
Unescape View File

@ -0,0 +1,208 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="apple-touch-icon" sizes="57x57" href="ico/apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="ico/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="ico/apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="ico/apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="ico/apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="ico/apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="ico/apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="ico/apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="ico/apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="ico/android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="ico/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="ico/favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="ico/favicon-16x16.png">
<link rel="manifest" href="ico/manifest.json">
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="/ms-icon-144x144.png">
<meta name="theme-color" content="#ffffff">
<title>RoyalPay | 管理登录</title>
<!-- Tell the browser to be responsive to screen width -->
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
<!-- Bootstrap 3.3.5 -->
<link href="static/lib/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- Font Awesome -->
<link href="static/lib/font-awesome-4.6.3/css/font-awesome.min.css" rel="stylesheet">
<!-- Theme style -->
<link rel="stylesheet" href="./static/lib/dist/css/AdminLTE.min.css">
<link rel="stylesheet" href="./static/css/main.css">
<!-->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body class="hold-transition login-page login-page-bg">
<div tabindex="-1" role="dialog" class="modal fade ng-isolate-scope in" style="z-index: 1050; display: none;"
id="qrmodal">
<div class="modal-dialog modal-sm">
<div class="modal-content" uib-modal-transclude="">
<div style="width: 100%;padding: 10px;" class="ng-scope">
请使用微信扫描<br>
<img style="width: 100%" id="qrimg">
</div>
</div>
</div>
</div>
<div class="login-box login-box-right divloginbox">
<!-- /.login-logo -->
<div class="login-box-body login-box-bg">
<p style="text-align: center;"><img src="static/images/rp_logo_vertical.svg" style="width: 80%;margin-top: -15%;margin-bottom: -10%;"></p>
<p style="text-align: center;font-size:20px;">Easy Business，Easy Payment</p>
<form action="" method="post">
<div class="form-group has-feedback">
<input type="text" id="loginid-input" class="form-control" placeholder="账号">
<span class="glyphicon glyphicon-user form-control-feedback"></span>
</div>
<div class="form-group has-feedback">
<input type="password" id="pwd-input" class="form-control" placeholder="密码">
<span class="glyphicon glyphicon-lock form-control-feedback"></span>
</div>
<div class="row">
<div class="form-group col-xs-12">
<input type="text" name="verifyCode" class="form-control" style="width: 70%;display: inline"
id="verifyCode" placeholder="验证码">
<img style="width:30%;display:inline;height: 34px;float: right" id="kaptcha"
src="/global/userstatus/captcha-login"
title="点击更换"/>
</div>
<!-- /.col -->
<div class="col-xs-12 margin-bottom">
<button type="button" id="login-btn" style="background-color: #f06010" class="btn btn-warning btn-block btn-flat">Sign In</button>
</div>
<div class="col-xs-12">
<button type="button" id="wechat-btn" style="background-color: #f06010" class="btn btn-warning btn-block btn-flat">
<i class="fa fa-wechat"></i> WeChat Sign In
</button>
</div>
<!-- /.col -->
</div>
</form>
</div>
<!-- /.login-box-body -->
</div>
<!-- /.login-box -->
<!-- jQuery 2.1.4 -->
<script src="static/lib/jquery/jquery-2.1.4.min.js"></script>
<script src="static/lib/jquery/jquery.cookie.js"></script>
<!-- Bootstrap 3.3.5 -->
<script src="static/lib/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
function getUrlParam(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
var r = window.location.search.substr(1).match(reg); //匹配目标参数
if (r != null) {
return unescape(r[2]);
}else {
return null; //返回参数值
}
}
$('input').keypress(function (evt) {
if (evt.keyCode == 13) {
$('#login-btn').click();
}
});
$('#verifyCode').focus(function () {
var expire = $.cookie('code_expire_time');
if(expire!=null && new Date(parseInt(expire))<new Date()){
$('#kaptcha').click();
}
});
$('#login-btn').click(function () {
var loginid = $('#loginid-input').val();
if (loginid == null || loginid.length == 0) {
alert('请填写账号');
return;
}
var pwd = $('#pwd-input').val();
if (pwd == null || pwd.length == 0) {
alert('请填写密码');
return;
}
var verifyCode = $('#verifyCode').val();
if (verifyCode == null || verifyCode.length == 0) {
alert('请填写验证码');
return;
}
$.ajax({
url: '/global/userstatus/manager_signin',
method: 'post',
data: JSON.stringify({loginId: loginid, password: pwd, verifyCode: verifyCode}),
contentType: 'application/json',
dataType: 'text',
success: function () {
var from = getUrlParam("f");
location.href = from ? decodeURIComponent(from) : 'managev2.html'
},
error: function (jqXHR) {
alert(JSON.parse(jqXHR.responseText).message);
$('#kaptcha').attr("src", "/global/userstatus/captcha-login?" + Math.floor(Math.random() * 100));
}
})
});
$('#kaptcha').click(function () {
$(this).attr("src", "/global/userstatus/captcha-login?" + Math.floor(Math.random() * 100));
});
$('#wechat-btn').click(function () {
var ua = navigator.userAgent.toLowerCase();
if (ua.indexOf('micromessenger') >= 0) {
location.href = '/global/userstatus/manager_signin_wechat'
} else {
$.ajax({
url: '/global/userstatus/manager_signin_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);
}
})
}
});
$('#qrmodal').click(function () {
$(this).hide()
});
function checkQRStatus(codeId) {
$.ajax({
url: '/global/userstatus/manager_signin_wechat_qrcode/' + codeId + '/check',
method: 'get',
success: function () {
location.href = '/managev2.html'
},
error: function () {
setTimeout(function () {
checkQRStatus(codeId)
}, 2000)
}
})
}
})
</script>
</body>
</html>

253
src/main/ui/static/css/login.css
Unescape View File

@ -0,0 +1,253 @@
/***login***/
@media (min-width: 768px) {
.login-box-right {
width: 42.2%;
height: 100%;
background-color: black;
opacity: 0.8;
position: relative;
left: 57.8%
}
.login-page-bg {
width: 100%;
height: 100%;
background-color: #d2d6de;
background: url(../images/bg2.png);
/*background: url(../images/logonbg.jpg) ;*/
position: relative;
background-size: 100% 100%;
}
.login-container {
text-align: center;
}
.ad {
text-align: center;
font-size: 20px;
color: #FFFFFF;
}
.qrdiv {
width: 50%;
margin-left: 26%;
color: #FFFFFF;
}
.form {
padding: 4% 25%
}
.login-box-bg {
/*background-color: rgba(255,255,255,0.5);*/
/*box-shadow: 0px 2px 20px 2px rgba(0, 0, 0, 0.3);*/
/*filter: alpha(opacity=40);*/
/*opacity: 0.8;*/
}
.login-info{
/*height: 45px;*/
background-color: black;
font-size: 18px;
color: white;
}
.captcha {
width: 30%;
display: inline;
height: 34px;
float: right
}
.login-submit{
background-color: #f06010;
font-size: 18px;
}
.login-submit-margin{
margin-top: 10%;
}
.forget{
color: #f06010;
font-size: 18px;
}
.download-app{
color: #FFFFFF;
font-size: 15px;
}
.download-app img{
width: 100px;
}
.divloginbox {
animation: loginbox 1s;
-moz-animation: loginbox 1s;
-webkit-animation: loginbox 1s;
-o-animation: loginbox 1s;
}
@keyframes loginbox {
from {
margin-right: -30%
}
to {
margin-right: 35%
}
}
@-moz-keyframes loginbox {
from {
margin-right: -30%
}
to {
margin-right: 35%
}
}
@-webkit-keyframes loginbox {
from {
margin-right: -30%
}
to {
margin-right: 35%
}
}
@-o-keyframes loginbox {
from {
margin-right: -30%
}
to {
margin-right: 35%
}
}
}
@media (max-width: 768px) {
.login-page-bg {
background: url('');
background-color: #d2d6de;
}
.login-box-right {
margin-top: 20%;
margin: 7% auto;
width: 90%;
}
.login-box-bg {
/*background-color: rgba(255,255,255,0.5);*/
box-shadow: 0px 2px 20px 2px rgba(0, 0, 0, 0.3);
filter: alpha(opacity=40);
opacity: 0.7;
}
.login-container {
text-align: center;
background: #fff;
padding: 20px;
border-top: 0;
color: #666;
}
.ad {
text-align: center;
font-size: 20px;
color: #000000;
}
.qrdiv {
width: 50%;
margin-left: 26%;
}
.form {
}
.login-info{
}
.captcha {
width: 30%;
display: inline;
height: 34px;
float: right
}
.login-submit{
background-color: #f06010;
}
.login-submit-margin{
margin-bottom: 20px;
margin-top:20px;
}
.forget{
}
.download-app{
color: #000000;
font-size: 15px;
}
.download-app img{
width: 50px;
}
.divloginbox {
animation: loginboxtop 1s;
-moz-animation: loginboxtop 1s;
-webkit-animation: loginboxtop 1s;
-o-animation: loginboxtop 1s;
}
@keyframes loginboxtop {
from {
margin-top: 0
}
to {
margin-top: 20%
}
}
@-moz-keyframes loginboxtop {
from {
margin-top: 0
}
to {
margin-top: 20%
}
}
@-webkit-keyframes loginboxtop {
from {
margin-top: 0
}
to {
margin-top: 20%
}
}
@-o-keyframes loginboxtop {
from {
margin-top: 0
}
to {
margin-top: 20%
}
}
}
/***login***/

215
src/main/ui/static/css/m_login.css
Unescape View File

@ -0,0 +1,215 @@
/***login***/
@media (min-width: 768px) {
.login-container {
width: 800px;
margin: 12% auto;
margin-bottom: 0;
}
.login-info{
background-color: black;
opacity: 0.8;
color: white;
border-radius:4px
}
.login-box-right {
margin-right: 35%;
}
.login-page-bg {
width: 100%;
height: 100%;
background-color: #d2d6de;
background: url(../images/bg3.png);
/*background: url(../images/logonbg.jpg) ;*/
position: relative;
background-size: 100% 100%;
}
.login-box-bg {
/*background-color: rgba(255,255,255,0.5);*/
/*box-shadow: 0px 2px 20px 2px rgba(0, 0, 0, 0.3);*/
filter: alpha(opacity=40);
opacity: 0.8;
}
.ad {
text-align: center;
font-size: 20px;
color: #FFFFFF;
}
.login-submit{
background-color: #54C7FF;
border-color: #54C7FF;
margin-top: 10%;
color: white;
}
.qrdiv {
color: #FFFFFF;
}
.login-submit-margin{
margin-top: 45%;
color: #FFFFFF;
}
.download-app {
font-size: 15px;
}
.download-app img{
width: 100px;
}
.divloginbox {
animation: loginbox 1s;
-moz-animation: loginbox 1s;
-webkit-animation: loginbox 1s;
-o-animation: loginbox 1s;
}
@keyframes loginbox {
from {
margin-right: -30%
}
to {
margin-right: 35%
}
}
@-moz-keyframes loginbox {
from {
margin-right: -30%
}
to {
margin-right: 35%
}
}
@-webkit-keyframes loginbox {
from {
margin-right: -30%
}
to {
margin-right: 35%
}
}
@-o-keyframes loginbox {
from {
margin-right: -30%
}
to {
margin-right: 35%
}
}
}
@media (max-width: 768px) {
.login-container {
width: 90%;
margin: 7% auto;
}
.login-info{
}
.login-page-bg {
background: url('');
background-color: #d2d6de;
}
.login-box-right {
margin-top: 20%;
margin-right: auto;
}
.login-box-bg {
/*background-color: rgba(255,255,255,0.5);*/
box-shadow: 0px 2px 20px 2px rgba(0, 0, 0, 0.3);
filter: alpha(opacity=40);
opacity: 0.7;
background-color: white;
}
.login-submit{
background-color: #e08e0b;
border-color: #e08e0b;
}
.ad {
text-align: center;
font-size: 20px;
color: #000000;
}
.qrdiv {
color: #000000;
}
.login-submit-margin{
margin-top: 10%;
}
.download-app {
font-size: 15px;
}
.download-app img{
width: 50px;
}
.divloginbox {
animation: loginboxtop 1s;
-moz-animation: loginboxtop 1s;
-webkit-animation: loginboxtop 1s;
-o-animation: loginboxtop 1s;
}
@keyframes loginboxtop {
from {
margin-top: 0
}
to {
margin-top: 20%
}
}
@-moz-keyframes loginboxtop {
from {
margin-top: 0
}
to {
margin-top: 20%
}
}
@-webkit-keyframes loginboxtop {
from {
margin-top: 0
}
to {
margin-top: 20%
}
}
@-o-keyframes loginboxtop {
from {
margin-top: 0
}
to {
margin-top: 20%
}
}
}
/***login***/

BIN
src/main/ui/static/images/Bitmap.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.3 KiB

BIN
src/main/ui/static/images/Bitmap1.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.2 KiB

BIN
src/main/ui/static/images/bg2.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.7 MiB

BIN
src/main/ui/static/images/bg3.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.1 MiB

BIN
src/main/ui/static/images/rp_login_logo.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.5 KiB

Write Preview
Loading…
Cancel
Save