forked from mirror/MrDoc
129 lines
5.1 KiB
HTML
129 lines
5.1 KiB
HTML
|
{% load staticfiles %}
|
|||
|
|
<!DOCTYPE html>
|
|||
|
|
<html lang='zh-CN'>
|
|||
|
|
<head>
|
|||
|
|
<title>忘记密码 - MrDoc</title>
|
|||
|
|
<meta charset="utf-8" />
|
|||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|||
|
|
<link rel="stylesheet" href="{% static 'layui/css/layui.css' %}" crossorigin="anonymous">
|
|||
|
|
<style>
|
|||
|
|
body{
|
|||
|
|
background-color: #fafafa;
|
|||
|
|
text-align: center;
|
|||
|
|
}
|
|||
|
|
.container{
|
|||
|
|
display: flex;
|
|||
|
|
display: -webkit-flex;
|
|||
|
|
justify-content: center;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
.login-form{
|
|||
|
|
margin-top: 15%;
|
|||
|
|
{#width: 400px;#}
|
|||
|
|
padding: 20px 50px 20px 60px;
|
|||
|
|
background-color: #fff;
|
|||
|
|
-webkit-box-shadow: #666 0px 0px 10px;
|
|||
|
|
-moz-box-shadow: #666 0px 0px 10px;
|
|||
|
|
box-shadow: #666 0px 0px 10px;
|
|||
|
|
}
|
|||
|
|
.register-link{
|
|||
|
|
font-size: 12px;
|
|||
|
|
}
|
|||
|
|
</style>
|
|||
|
|
</head>
|
|||
|
|
<body>
|
|||
|
|
<div class="container">
|
|||
|
|
<div></div>
|
|||
|
|
<div></div>
|
|||
|
|
<div class="login-form">
|
|||
|
|
<form class="layui-form" action="{% url 'forget_pwd' %}" method='POST'>
|
|||
|
|
{% csrf_token %}
|
|||
|
|
<div class="layui-form-item">
|
|||
|
|
<h2><strong>忘记密码 - MrDoc</strong></h2>
|
|||
|
|
</div>
|
|||
|
|
<span style='color:red;margin-bottom: 10px;'>{{ errormsg }}</span>
|
|||
|
|
<div class="layui-form-item">
|
|||
|
|
<div class="layui-input-inline">
|
|||
|
|
<input type="text" name="email" id="email" required lay-verify="required" placeholder="请输入注册邮箱" class="layui-input">
|
|||
|
|
</div>
|
|||
|
|
<button class="layui-btn layui-btn-normal" type="button" id="send_email_vcode" onclick="getCode(this)">发送验证码</button>
|
|||
|
|
</div>
|
|||
|
|
<div class="layui-form-item">
|
|||
|
|
<input type="text" name="vcode" required lay-verify="required" placeholder="请输入验证码" autocomplete="off" class="layui-input">
|
|||
|
|
</div>
|
|||
|
|
<div class="layui-form-item">
|
|||
|
|
<input type="password" name="password" required lay-verify="required" placeholder="请输入新密码" autocomplete="off" class="layui-input">
|
|||
|
|
</div>
|
|||
|
|
<div class="layui-form-item">
|
|||
|
|
<input type="password" name="confirm_password" required lay-verify="required" placeholder="请确认新密码" autocomplete="off" class="layui-input">
|
|||
|
|
</div>
|
|||
|
|
<div class="layui-form-item">
|
|||
|
|
<button class="layui-btn layui-btn-fluid layui-btn-radius layui-btn-normal" lay-submit type="submit">修改密码</button>
|
|||
|
|
</div>
|
|||
|
|
<a href="{% url 'login' %}" class="register-link">返回登录</a>
|
|||
|
|
</form>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</body>
|
|||
|
|
<script src="https://cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script>
|
|||
|
|
<script src="{% static 'layui/layui.all.js' %}"></script>
|
|||
|
|
<script>
|
|||
|
|
$.ajaxSetup({
|
|||
|
|
data: {csrfmiddlewaretoken: '{{ csrf_token }}' },
|
|||
|
|
});
|
|||
|
|
layer = layui.layer;
|
|||
|
|
btn = $("#send_email_vcode");
|
|||
|
|
// 发送验证码倒计时60s
|
|||
|
|
function getCode(e) {
|
|||
|
|
email = document.getElementById("email");
|
|||
|
|
if(email.value.length == 0){
|
|||
|
|
layer.msg("请输入电子邮箱");
|
|||
|
|
}else{
|
|||
|
|
if(!(/^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/.test(email.value))){
|
|||
|
|
layer.msg("电子邮箱有误，请重填")
|
|||
|
|
}else{
|
|||
|
|
//调用获取验证码的接口
|
|||
|
|
$.post("{% url 'send_email_vcode' %}",{'email':email.value},function(r){
|
|||
|
|
if(r.status){
|
|||
|
|
layer.msg("验证码发送成功，请查收！");
|
|||
|
|
}else{
|
|||
|
|
layer.msg(r.data)
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
//按照指定的周期（以毫秒计）来调用函数或计算表达式。
|
|||
|
|
//在ajax请求之后再调用函数
|
|||
|
|
t = setInterval(function () {
|
|||
|
|
countdown(e)
|
|||
|
|
}, 1000)
|
|||
|
|
//获取验证码成功后调用倒计时函数
|
|||
|
|
countdown(e);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
var time = 60;
|
|||
|
|
function countdown(e){
|
|||
|
|
if (time == 0) {
|
|||
|
|
//这里时设置当时间到0的时候重新设置点击事件，并且默认time修改为60
|
|||
|
|
//e.setAttribute("onclick","getcode(this)");
|
|||
|
|
|
|||
|
|
btn.attr("disabled", false);
|
|||
|
|
btn.html("获取验证码");
|
|||
|
|
btn.removeClass("disabled");
|
|||
|
|
btn.removeClass("layui-btn-disabled")
|
|||
|
|
time = 60;
|
|||
|
|
clearInterval(t);
|
|||
|
|
}else{
|
|||
|
|
//这里是显示时间倒计时的时候点击不生效
|
|||
|
|
//e.setAttribute("onclick", '');
|
|||
|
|
|
|||
|
|
btn.addClass("disabled");
|
|||
|
|
btn.addClass("layui-btn-disabled")
|
|||
|
|
btn.attr("disabled", true);
|
|||
|
|
btn.html("重新发送(" + time + ")");
|
|||
|
|
|
|||
|
|
//document.getElementById("getcode").innerHTML="重新发送"+time;
|
|||
|
|
time--;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
</html>
|