main-site
/
mooctest-user


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138
							<!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="@{/api/user/mobile}" 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="mobile" class="input100" type="text" name="mobile" placeholder="请输入手机号" required="手机号不可为空">
                    <span class="focus-input100" data-symbol="&#xf206;"></span>
                </div>
                <div class="wrap-input100 validate-input" data-validate="请输入验证码">
                    <span class="label-input100">验证码</span>
                    <input id="verifyCode" class="input100" type="text" name="verifyCode" placeholder="请输入验证码" required="验证码不可为空">
                    <span class="focus-input100" data-symbol="&#xf190;"></span>
                </div>

                <div class="text-center p-t-6 p-b-8">
                    <span id="info" style="color: red" th:text="${result==null}?'&nbsp;':${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="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="button" onclick="updateMobile()" 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>
        </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 sendMobileVerifyCode(obj) {
        var mobile = $("#mobile").val();
        if (mobile == null || mobile.trim() == "") {
            document.getElementById("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("info").innerText = result.msg;
                }else{
                    alert("发送成功，请尽快查收！");
                    document.getElementById("info").innerHTML = "&nbsp;";
                    settime(obj);
                }
            }
        })
    }

    function updateMobile() {
        var mobile = $("#mobile").val();
        var verifyCode = $("#verifyCode").val();
        if (mobile == null || mobile.trim() == "") {
            document.getElementById("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
        }
        if (verifyCode == null || verifyCode.trim()==""){
            document.getElementById("info").innerText = "请填写验证码";
            return;
        }
        var data = {"mobile":mobile, "verifyCode":verifyCode};
        $.ajax({
            url:"/api/user/mobile",
            type:"PUT",
            data:JSON.stringify(data),
            contentType: 'application/json; charset=utf-8',
            dataType:"json",
            timeout: 3000,
            success:function (result) {
                console.log(result);
                if (result.status != 2000) {
                    document.getElementById("info").innerText = result.msg;
                }else{
                    document.location.href="/page/operation/success";
                }
            }
        })

    }
</script>
</body>
</html>