|
|
@@ -0,0 +1,198 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<html lang="zh-CN" xmlns="http://www.w3.org/1999/xhtml"
|
|
|
+ xmlns:th="http://www.thymeleaf.org">
|
|
|
+
|
|
|
+<head>
|
|
|
+ <meta charset="UTF-8">
|
|
|
+ <meta name="viewport" content="width=device-width, initial-scale=1">
|
|
|
+
|
|
|
+ <title>慕测平台</title>
|
|
|
+ <meta name="keywords" content="" />
|
|
|
+ <meta name="description" content="" />
|
|
|
+
|
|
|
+ <link rel="stylesheet" type="text/css" th:href="@{/vendor/bootstrap/css/bootstrap.min.css}">
|
|
|
+ <link rel="stylesheet" type="text/css" th:href="@{/fonts/font-awesome-4.7.0/css/font-awesome.min.css}">
|
|
|
+ <link rel="stylesheet" type="text/css" th:href="@{/fonts/iconic/css/material-design-iconic-font.min.css}">
|
|
|
+ <link rel="stylesheet" type="text/css" th:href="@{/css/util.css}">
|
|
|
+ <link rel="stylesheet" type="text/css" th:href="@{/css/main.css}">
|
|
|
+</head>
|
|
|
+
|
|
|
+<body>
|
|
|
+
|
|
|
+<div class="limiter">
|
|
|
+ <div class="container-login100" th:style="'background-image:url(/images/bg.jpg);'">
|
|
|
+ <div class="wrap-login100 p-l-40 p-r-40 p-t-30 p-b-25">
|
|
|
+ <!--邮箱找回-->
|
|
|
+ <form id="byEmail" th:action="@{/page/forgetPassword/check}" method="post" class="login100-form">
|
|
|
+ <div id="login-logo" class="p-b-15" style="text-align: center;">
|
|
|
+ <img style="width: 80px;" th:src="@{/images/mooctest.png}" >
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <span class="login100-form-title p-b-30">找回密码</span>
|
|
|
+
|
|
|
+ <div class="wrap-input100 validate-input m-b-23" data-validate="请输入邮箱">
|
|
|
+ <span class="label-input100">邮箱</span>
|
|
|
+ <input id="email" class="input100" type="email" name="mobile" placeholder="请输入邮箱" required="邮箱不可为空">
|
|
|
+ <span class="focus-input100" data-symbol=""></span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="wrap-input100 validate-input" data-validate="请输入验证码">
|
|
|
+ <span class="label-input100">验证码</span>
|
|
|
+ <input class="input100" type="text" name="verifyCode" placeholder="请输入验证码" required="验证码不可为空">
|
|
|
+ <span class="focus-input100" data-symbol=""></span>
|
|
|
+ </div>
|
|
|
+ <div p-t-8 p-b-20>
|
|
|
+ <div class="text-right">
|
|
|
+ <a href="#" onclick="findByMobile()">手机找回</a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="text-center p-t-6 p-b-8">
|
|
|
+ <span id="e_info" style="color: red" th:text="${result==null}?' ':${result.msg}"></span>
|
|
|
+ </div>
|
|
|
+ <div class="container-login100-form-btn" style="width: 50%; float: left;">
|
|
|
+ <div class="wrap-login100-form-btn">
|
|
|
+ <div class="login100-form-bgbtn"></div>
|
|
|
+ <button type="button" id="sendMobileVerify" class="login100-form-btn" onclick="sendEmailVerifyCode(this)" >获取验证码</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="container-login100-form-btn">
|
|
|
+ <div class="wrap-login100-form-btn">
|
|
|
+ <div class="login100-form-bgbtn"></div>
|
|
|
+ <button type="submit" class="login100-form-btn">验 证</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="flex-col-c p-t-10">
|
|
|
+ <a href="/page/login" class="txt2">返回登录</a>
|
|
|
+ </div>
|
|
|
+ </form>
|
|
|
+ <!--手机找回-->
|
|
|
+ <form id="byMobile" style="display: none;" th:action="@{/page/forgetPassword/check}" method="post" class="login100-form">
|
|
|
+ <div style="text-align: center;" class="p-b-15">
|
|
|
+ <img style="width: 80px;" th:src="@{/images/mooctest.png}" >
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <span class="login100-form-title p-b-30">找回密码</span>
|
|
|
+
|
|
|
+ <div class="wrap-input100 validate-input m-b-23" data-validate="请输入手机号">
|
|
|
+ <span class="label-input100">手机号</span>
|
|
|
+ <input id="mobile" class="input100" type="text" name="mobile" placeholder="请输入手机号" required="手机号不可为空">
|
|
|
+ <span class="focus-input100" data-symbol=""></span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="wrap-input100 validate-input" data-validate="请输入验证码">
|
|
|
+ <span class="label-input100">验证码</span>
|
|
|
+ <input class="input100" type="text" name="verifyCode" placeholder="请输入验证码" required="验证码不可为空">
|
|
|
+ <span class="focus-input100" data-symbol=""></span>
|
|
|
+ </div>
|
|
|
+ <div p-t-8 p-b-20>
|
|
|
+ <div class="text-right">
|
|
|
+ <a href="#" onclick="findByEmail()">邮箱找回</a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="text-center p-t-6 p-b-8">
|
|
|
+ <span id="m_info" style="color: red" th:text="${result==null}?' ':${result.msg}"></span>
|
|
|
+ </div>
|
|
|
+ <div class="container-login100-form-btn" style="width: 50%; float: left;">
|
|
|
+ <div class="wrap-login100-form-btn">
|
|
|
+ <div class="login100-form-bgbtn"></div>
|
|
|
+ <button type="button" id="sendVerify" class="login100-form-btn" onclick="sendMobileVerifyCode(this)" >获取验证码</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="container-login100-form-btn">
|
|
|
+ <div class="wrap-login100-form-btn">
|
|
|
+ <div class="login100-form-bgbtn"></div>
|
|
|
+ <button type="submit" form="byMobile" class="login100-form-btn">验 证</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="flex-col-c p-t-10">
|
|
|
+ <a href="/page/login" class="txt2">返回登录</a>
|
|
|
+ </div>
|
|
|
+ </form>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</div>
|
|
|
+
|
|
|
+<script th:src="@{/vendor/jquery/jquery-3.2.1.min.js}"></script>
|
|
|
+<script th:src="@{/js/main.js}"></script>
|
|
|
+<script type="text/javascript">
|
|
|
+
|
|
|
+ function findByEmail() {
|
|
|
+ document.getElementById("byEmail").style.display="block";
|
|
|
+ document.getElementById("byMobile").style.display="none";
|
|
|
+ document.getElementById("m_info").innerHTML=" ";
|
|
|
+ document.getElementById("e_info").innerHTML=" ";
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+
|
|
|
+ function findByMobile() {
|
|
|
+ document.getElementById("byEmail").style.display="none";
|
|
|
+ document.getElementById("byMobile").style.display="block";
|
|
|
+ document.getElementById("m_info").innerHTML=" ";
|
|
|
+ document.getElementById("e_info").innerHTML=" ";
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+
|
|
|
+ function sendMobileVerifyCode(obj) {
|
|
|
+ var mobile = $("#mobile").val();
|
|
|
+ if (mobile == null || mobile.trim() == "") {
|
|
|
+ document.getElementById("m_info").innerText = "手机号不能为空";
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (!mobile.match(/^(13[0-9]{9})|(18[0-9]{9})|(14[0-9]{9})|(17[0-9]{9})|(15[0-9]{9})$/)){
|
|
|
+ document.getElementById("info").innerText = "手机号格式不正确，请重新输入";
|
|
|
+ return
|
|
|
+ }
|
|
|
+
|
|
|
+ var data = {"mobile":mobile};
|
|
|
+ $.ajax({
|
|
|
+ url:"/api/verify/mobile",
|
|
|
+ type:"PUT",
|
|
|
+ data:data,
|
|
|
+ timeout: 3000,
|
|
|
+ success:function (result) {
|
|
|
+ console.log(result);
|
|
|
+ if (result.status != 2000) {
|
|
|
+ alert("发送失败, 原因:"+result.msg);
|
|
|
+ document.getElementById("m_info").innerText = result.msg;
|
|
|
+ }else{
|
|
|
+ alert("发送成功，请尽快查收！");
|
|
|
+ document.getElementById("m_info").innerHTML = " ";
|
|
|
+ settime(obj);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ function sendEmailVerifyCode(obj) {
|
|
|
+ var email = $("#email").val();
|
|
|
+ if (email == null || email.trim() == "") {
|
|
|
+ document.getElementById("e_info").innerText = "邮箱不能为空";
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (!email.match(/^([a-zA-Z0-9_\-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([a-zA-Z0-9\-]+\.)+))([a-zA-Z]{1,5}|[0-9]{1,3})(\]?)$/)){
|
|
|
+ document.getElementById("e_info").innerText = "邮箱格式不正确，请重新输入";
|
|
|
+ return
|
|
|
+ }
|
|
|
+
|
|
|
+ var data = {"email":email};
|
|
|
+ $.ajax({
|
|
|
+ url:"/api/verify/mail",
|
|
|
+ type:"PUT",
|
|
|
+ data:data,
|
|
|
+ timeout: 3000,
|
|
|
+ success:function (result) {
|
|
|
+ console.log(result);
|
|
|
+ if (result.status != 2000) {
|
|
|
+ alert("发送失败, 原因:"+result.msg);
|
|
|
+ }else{
|
|
|
+ alert("发送成功，请前往邮箱查收！");
|
|
|
+ document.getElementById("e_info").innerHTML = " "
|
|
|
+ settime(obj);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+</script>
|
|
|
+</body>
|
|
|
+</html>
|
xuexb