fourcal/src/main/resources/templates/admin/account_password.ftl

260 lines
12 KiB
Plaintext
Raw Normal View History

2021-10-28 08:09:50 +00:00
<#assign base=request.contextPath />
<#import "../common/defaultLayout.ftl" as defaultLayout>
<@defaultLayout.layout>
<style>
/*验证:提示信息样式 begin*/
.am-alert-danger {
background-color: transparent;
border-color: transparent;
color: red;
}
.am-alert {
margin-bottom: 1em;
padding: .625em;
background: transparent;
border: none;
border-radius: 0;
}
/*验证:提示信息样式 end*/
</style>
<div class="admin-content">
<form id="accountForm" name="accountForm" method="POST" class="am-form">
<input type="hidden" id="id" name="id" value="${(SysUser.id)!1}"/>
<div class="am-tabs am-margin" style="min-height: 200px;" data-am-tabs>
<ul class="am-tabs-nav am-nav am-nav-tabs">
<li class="am-active"><a href="#tab1">修改密码</a></li>
</ul>
<div class="am-tabs-bd">
<div class="am-tab-panel am-fade am-in am-active" id="tab1">
<span style="color: red">密码长度至少8位且同时包含数字、小写字母、大写字母、特殊字符[`~!@#$%^&*()_+<>?:"{},.\/;'[\]])中任意两种</span>
<div class="am-g am-form-group am-margin-top">
<div class="am-u-sm-4 am-u-md-2 am-text-right">账号名:
</div>
<div class="am-u-sm-6 am-u-md-6">
<input type="text" value="${(SysUser.userName)!'admin'}" readonly/>
</div>
<div class="am-u-sm-2 am-u-md-4 input-msg"></div>
</div>
<div class="am-g am-form-group am-margin-top">
<div class="am-u-sm-4 am-u-md-2 am-text-right">原密码:<span style="color: red;">*</span>
</div>
<div class="am-u-sm-6 am-u-md-6">
<input class="am-input-sm js-pattern-password" data-validation-message="请输入原密码"
type="password" name="password" id="password" placeholder="请输入原密码" required/>
</div>
<div class="am-u-sm-2 am-u-md-4 input-msg">
<div class="am-alert am-alert-danger">${passwordMessages!''}</div>
</div>
</div>
<div class="am-g am-form-group am-margin-top">
<div class="am-u-sm-4 am-u-md-2 am-text-right">新密码:<span style="color: red;">*</span>
</div>
<div class="am-u-sm-6 am-u-md-6">
<input class="am-input-sm js-pattern-newPassword"
data-validation-message="请输入新密码(8-20位非中文字符)" type="password" id="newPassword"
name="newPassword" placeholder="请输入新密码(8-20位非中文字符)" required/>
</div>
<div class="am-u-sm-2 am-u-md-4 input-msg">
<div class="am-alert am-alert-danger">${newPasswordMessages!''}</div>
</div>
</div>
<div class="am-g am-form-group am-margin-top">
<div class="am-u-sm-4 am-u-md-2 am-text-right">确认密码:<span style="color: red;">*</span>
</div>
<div class="am-u-sm-6 am-u-md-6">
<input class="am-input-sm js-pattern-newPasswordConfirm"
data-validation-message="请输入确认密码" type="password" id="newPasswordConfirm"
name="newPasswordConfirm" placeholder="请输入确认密码" required/>
</div>
<div class="am-u-sm-2 am-u-md-4 input-msg">
<div class="am-alert am-alert-danger">${newPasswordConfirmMessages!''}</div>
</div>
</div>
</div>
</div>
</div>
<div class="am-margin">
<button type="button" id="save" name="save" class="am-btn am-btn-primary am-btn-xs">提交保存</button>
</div>
</form>
</div>
<script type="text/javascript" src="${base}/common/js/rsa/jsencrypt.min.js"></script>
<script src="${base}/layer/layer.js"></script>
<script type="text/javascript">
$(function () {
$('#save').click(function () {
if (flag == -1) {
return false;
}
var id = $("#id").val();
var pwd = $("#password").val();
var newPwd = $("#newPassword").val();
if (pwd == newPwd) {
alert("新密码跟旧密码不能一样");
return false;
}
var encrypt = new JSEncrypt();
encrypt.setPublicKey("${publickey!''}");
var encryptedPwd = encrypt.encrypt(pwd);
var encryptedNewPwd = encrypt.encrypt(newPwd);
$.ajax({
type: 'post',
url: "${base}/account/updatePassword",
data: {
"id": id,
"password": encryptedPwd,
"newPassword": encryptedNewPwd
},
cache: false,
dataType: 'json',
success: function (data) {
if (0 == data.status) {
layer.alert(data.msg, function (index) {
layer.close(index);
window.location.href = "${base}/admin/logout";
});
} else {
layer.alert(data.msg, function (index) {
layer.close(index);
});
}
},
error: function () {
layer.msg("密码修改失败,请联系管理员");
}
});
});
var flag = 0;
/*表单验证begin*/
//自定义规则用法验证元素上加class="js-pattern-sort"
if ($.AMUI && $.AMUI.validator) {
$.AMUI.validator.patterns.newPassword = /^[\@A-Za-z0-9\!\#\$\%\^\&\*\.\~]{8,20}$/;
}
var $myField = null;
var myMsg = "";
$("#accountForm").validator({
//自定义验证
validate: function (validity) {
var $field = $(validity.field);
var v = $field.val();
if ($field.is('#newPasswordConfirm')) {
if (v && (v != $('#newPassword').val())) {
$myField = $field;
myMsg = "两次密码输入不一致"
validity.valid = false;
}
}
if ($field.is('#newPasswordConfirm') || $field.is('#newPassword')) {
if(v.length < 8){
myMsg = "密码长度至少8位"
$myField = $field;
validity.valid = false;
}
var ls = 0;
var reg_num = /[0-9]/;
var result = v.match(reg_num);
console.log("数字验证" + result);
if (result != null) {
ls++;
/*myMsg = "密码不符合规范"
$myField = $field;
validity.valid = false;*/
}
reg_num = /[a-z]/i;
result = v.match(reg_num);
console.log("小写验证" + result);
if (result != null) {
ls++;
/*myMsg = "密码不符合规范"
$myField = $field;
validity.valid = false;*/
}
reg_num = /[A-Z]/;
result = v.match(reg_num);
console.log("大写验证" + result);
if (result != null) {
ls++;
/*myMsg = "密码不符合规范"
$myField = $field;
validity.valid = false;*/
}
reg_num = /[`~!@#$%^&*()_+<>?:"{},.\/;'[\]]/im;
result = v.match(reg_num);
console.log("特殊字符验证" + result);
if (result != null) {
ls++;
/*myMsg = "密码不符合规范"
$myField = $field;
validity.valid = false;*/
}
console.log("ls===========" + ls);
if (ls < 2) {
myMsg = "密码应包含大小写字母、数字、特殊字符中任意两种"
$myField = $field;
validity.valid = false;
}
}
},
// 域通过验证时回调
onValid: function (validity) {
var $field = $(validity.field);
flag = 0;
$(validity.field).closest('.am-form-group').find('.am-alert').hide();
},
// 验证出错时的回调, validity 对象包含相关信息,格式通 H5 表单元素的 validity 属性
onInValid: function (validity) {
flag = -1;
var $field = $(validity.field);
var $group = $field.closest('.am-form-group');
var $alert = $group.find('.am-alert');
// 使用自定义的提示信息 或 插件内置的提示信息
console.log("accountForm fail=" + $field.attr.name);
var msg = $field.data('validationMessage') || this.getValidationMessage(validity);
if ($myField && myMsg && $field.val() && $field.is($myField)) {
msg = myMsg;
$myField = null;
myMsg = "";
} else {
// 使用自定义的提示信息 或 插件内置的提示信息
msg = $field.data('validationMessage') || this.getValidationMessage(validity);
}
if (!$alert.length) {
$alert = $("<div class='am-alert am-alert-danger'></div>").hide().appendTo($group.find(".input-msg"));
}
$alert.html(msg).show();
}
});
/*表单验证end*/
});
</script>
</@defaultLayout.layout>