修改BUG:登录页面忘记密码功能增加行为验证码 closed #ITOIA closed #ITOIB

#Issue
https://gitee.com/LongbowEnterprise/dashboard/issues?id=ITOIA
https://gitee.com/LongbowEnterprise/dashboard/issues?id=ITOIB
This commit is contained in:
Argo Zhang 2019-03-18 09:25:19 +08:00
parent fd8fd918a3
commit 5790dbe2fb
5 changed files with 91 additions and 36 deletions

View File

@ -112,7 +112,7 @@
<span class="fa fa-user-circle-o"></span>
</div>
</div>
<input type="text" id="displayName" class="form-control" value="" placeholder="显示名称不可为空" maxlength="20" data-valid="true" />
<input type="text" id="displayName" class="form-control" value="" placeholder="显示名称不可为空" maxlength="20" data-valid="true" />
</div>
</div>
<div class="form-group">
@ -151,6 +151,13 @@
<i class="fa fa-save"></i>
<span>提交</span>
</button>
<div class="slidercaptcha forgot reg card">
<div class="card-header">
<span>请完成安全验证</span>
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
</div>
<div class="card-body"><div id="regcap"></div></div>
</div>
</div>
</div>
</div>
@ -199,6 +206,13 @@
<i class="fa fa-send-o"></i>
<span>提交</span>
</button>
<div class="slidercaptcha forgot card">
<div class="card-header">
<span>请完成安全验证</span>
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
</div>
<div class="card-body"><div id="forgotcap"></div></div>
</div>
</div>
</div>
</div>

View File

@ -38,6 +38,9 @@
.slidercaptcha {
top: -254px;
left: -15px;
}
.slidercaptcha, .slidercaptcha.forgot {
width: 310px;
height: 280px;
}

View File

@ -86,3 +86,17 @@
.slidercaptcha.card .card-header .close:hover {
color: #fff;
}
.slidercaptcha.forgot {
position: absolute;
left: auto;
right: 14px;
bottom: 14px;
top: auto;
margin: 0;
width: 274px;
}
.slidercaptcha.reg {
bottom: 60px;
}

View File

@ -14,42 +14,56 @@
});
$.extend({
captchaCheck: function (success) {
captchaCheck: function (captcha, success) {
$.bc({
url: "api/OnlineUsers",
method: "put",
callback: function (result) {
if (result) $captcha.addClass('d-block');
if (result) captcha.addClass('d-block');
else success();
}
});
},
capWidth: function () {
return $(window).width() < 768 ? 216 : 280;
},
capHeight: function () {
return $(window).width() < 768 ? 110 : 150;
},
capRegSuccess: function () {
$.bc({
url: "api/Register",
data: { UserName: $('#userName').val(), Password: $('#password').val(), DisplayName: $('#displayName').val(), Description: $('#description').val() },
modal: '#dialogNew',
method: "post",
callback: function (result) {
var title = result ? "提交成功<br/>等待管理员审批" : "提交失败";
lgbSwal({ timer: 1500, title: title, type: result ? "success" : "error" });
}
});
},
capForgotSuccess: function () {
$.bc({
url: "api/Register",
data: { UserName: $('#f_userName').val(), DisplayName: $('#f_displayName').val(), Reason: $('#f_desc').val() },
modal: '#dialogForgot',
method: "put",
callback: function (result) {
var title = result ? "提交成功<br/>等待管理员重置密码" : "提交失败";
lgbSwal({ timer: 1500, title: title, type: result ? "success" : "error" });
}
});
}
});
$('#btnSubmit').on('click', function () {
$.bc({
url: "api/Register",
data: { UserName: $('#userName').val(), Password: $('#password').val(), DisplayName: $('#displayName').val(), Description: $('#description').val() },
modal: '#dialogNew',
method: "post",
callback: function (result) {
var title = result ? "提交成功<br/>等待管理员审批" : "提交失败";
lgbSwal({ timer: 1500, title: title, type: result ? "success" : "error" });
}
});
$.captchaCheck($('#dialogNew .slidercaptcha'), $.capRegSuccess);
return false;
});
$('#btnForgot').on('click', function () {
$.bc({
url: "api/Register",
data: { UserName: $('#f_userName').val(), DisplayName: $('#f_displayName').val(), Reason: $('#f_desc').val() },
modal: '#dialogForgot',
method: "put",
callback: function (result) {
var title = result ? "提交成功<br/>等待管理员重置密码" : "提交失败";
lgbSwal({ timer: 1500, title: title, type: result ? "success" : "error" });
}
});
$.captchaCheck($('#dialogForgot .slidercaptcha'), $.capForgotSuccess);
return false;
});
$('.rememberPwd').on('click', function () {
@ -65,26 +79,36 @@
}
});
var $captcha = $('.slidercaptcha');
$('.slidercaptcha .close').on('click', function () {
$captcha.removeClass('d-block');
$('.slidercaptcha .close').on('click', function (e) {
$(this).parents('.slidercaptcha').removeClass('d-block');
return false;
});
$('button[type="submit"]').on('click', function (e) {
$.captchaCheck(function () {
$.captchaCheck($('#login .slidercaptcha'), function () {
$('form').submit();
});
return false;
});
$('#captcha').sliderCaptcha({
width: $(window).width() < 768 ? 216 : 280,
height: $(window).width() < 768 ? 110 : 150,
$('#captcha, #regcap, #forgotcap').sliderCaptcha({
width: $.capWidth(),
height: $.capHeight(),
setSrc: function () {
return 'http://pocoafrro.bkt.clouddn.com/Pic' + Math.round(Math.random() * 136) + '.jpg';
},
onSuccess: function () {
$('form').submit();
var parent = this.$element.parents('.slidercaptcha').removeClass('d-block');
this.reset();
if (parent.hasClass('reg')) {
$.capRegSuccess();
}
else if (parent.hasClass('forgot')) {
$.capForgotSuccess();
}
else {
$('form').submit();
}
}
});
});

View File

@ -185,7 +185,7 @@
$(this.refreshIcon).on('click', function () {
that.text.text(that.options.barText);
that.reset();
if ($.isFunction(that.options.onRefresh)) that.options.onRefresh.call(that.$element);
if ($.isFunction(that.options.onRefresh)) that.options.onRefresh.call(that);
});
var originX, originY, trail = [],
@ -226,10 +226,10 @@
} = that.verify()
if (spliced && verified) {
that.sliderContainer.addClass('sliderContainer_success');
if ($.isFunction(that.options.onSuccess)) that.options.onSuccess.call(that.$element);
if ($.isFunction(that.options.onSuccess)) that.options.onSuccess.call(that);
} else {
that.sliderContainer.addClass('sliderContainer_fail');
if ($.isFunction(that.options.onFail)) that.options.onFail.call(that.$element);
if ($.isFunction(that.options.onFail)) that.options.onFail.call(that);
setTimeout(() => {
that.text.text(that.options.failedText);
that.reset();