登录注册忘记密码

templates/outerNet/forgetPaw.html

@@ -24,6 +24,24 @@
             right:  -86px;
             text-decoration: underline;
         }
+        .borderline .loginBox .loginInp{
+            width: 100%;
+            height: 37px;
+            line-height: 37px;
+            border: 1px solid #d7d7d7;
+            border-radius: 4px;
+            position: relative;
+            margin-bottom: 20px;
+        }
+        .loginBtnCover button{
+            width: 100%;
+            line-height: 37px;
+            border-radius: 6px;
+            color: #ffffff;
+            font-size: 18px;
+            background-color: #61a830;
+            margin-bottom: 20px;
+        }
     </style>
 </head>
 
@@ -178,8 +196,8 @@
 
             {% if not curr_user.username %}
             <div class="not_loginCover">
-                <a href="login2" target="_blank">登录</a>
-                <a href="register" target="_blank">注册</a>
+                <a href="login2">登录</a>
+                <a href="register">注册</a>
             </div>
             {% else %}
             <div class="yet_loginCover">
@@ -219,22 +237,18 @@
                         <input type="text" id="phone" placeholder="请输入手机号">
                     </div>
                     <div class="loginInp verificationCode">
-                        <input type="password" id="password" placeholder="请输入验证码">
-                        <a href="">发送验证码</a>
+                        <input type="password" id="code" placeholder="请输入验证码">
+                        <a href="javascript:;" id="sendCodeBtn">发送验证码</a>
                     </div>
                     <div class="loginInp">
                         <input type="password" id="password" placeholder="请输入新密码">
                     </div>
+                    <div class="loginInp">
+                        <input type="password" id="repassword" autocomplete="off" placeholder="请再次输入密码">
+                    </div>
                     <div class="loginBtnCover">
-                        <button id="loginBtn" onclick="login()">注 册</button>
+                        <button id="loginBtn" onclick="resetPwd()">确 定</button>
                     </div>
-                    <!-- <div class="remPswCover">
-                        <div class="remPwdInpBox">
-                            <input type="checkbox" id="remPwdFlag">
-                            <div></div>
-                        </div>
-                        <label for="remPwdFlag">记住密码</label>
-                    </div> -->
                 </div>
             </div>
         </div>
@@ -345,65 +359,124 @@
     <script src="{% static '/lib/js/jquery-2.1.4.min.js'%}"></script>
     <script
         src="https://webapi.amap.com/maps?v=1.4.15&key=3939967b919a8003377dd113fc445a3d&plugin=AMap.Driving"></script>
-    <!-- <script src="{% static '/lib/layui/layui.js'%}"></script> -->
+    <script src="{% static '/lib/layui/layui.js'%}"></script>
     <!-- <script src="{% static '/js/index2.js'%}"></script> -->
     <script>
+        var layer;
+        layui.use(['layer'], function () {
+            layer = layui.layer;
+        });
+        $('#sendCodeBtn').on('click',function(){
+            verifyCode($(this))
+        })
+        // 获取验证码
+        function verifyCode(obj){
+            var phone = $("#phone").val();
+            if (!phone) {
+                $("#phone").focus();
+                return;
+            }else{
+                if(!(/^1[3456789]\d{9}$/.test(phone))){ 
+                    layer.msg("手机号码有误，请重填");
+                    return false; 
+                }
+            }
+            var num = 60;
+            obj.html(num--+'秒');
+            var t = setInterval(() => {
+                var currnum = num--;
+                if(num < 0){
+                    obj.html('发送验证码');
+                    clearInterval(t);
+                    $('#sendCodeBtn').bind("click",function(){verifyCode($(this))});
+                }else{
+                    $('#sendCodeBtn').unbind("click");
+                    obj.html(currnum+'秒');
+                }
+            }, 1000);
+            sendCode();
+        }
+        function sendCode(){
+            
+            $.ajax({
+                url: 'prove_code',
+                data: {
+                    ret:'see',
+                    mobile:$("#phone").val()
+                },
+                type: 'post',
+                dataType: 'json',
+                success: function (data) {
+                    if (data == 0) {
+                        layer.msg("验证码已发送");
+                    }  else {
+                        layer.msg("验证码请求失败");
+                    }
+                },
+                error: function (type) {
 
+                }
+            })
+        }
         // 注册
-        function login() {
-            var username = $("#username").val();
-            var password = $("#password").val();
-            if (!username) {
-                $("#username").focus();
+        function resetPwd() {
+            var phone = $("#phone").val();
+            var code = $("#code").val();
+            var pwd = $("#password").val();
+            var repwd = $("#repassword").val();
+            if (!phone) {
+                $("#phone").focus();
+                return;
+            }else{
+                if(!(/^1[3456789]\d{9}$/.test(phone))){ 
+                    layer.msg("手机号码有误，请重填");
+                    return false; 
+                }
+            }
+            if (!code) {
+                $("#code").focus();
                 return;
             }
-            if (!password) {
+            // layer.msg("验证码有误，请重新获取");
+         
+            if (!pwd) {
                 $("#password").focus();
                 return;
             }
+            if (!repwd) {
+                $("#repassword").focus();
+                return;
+            }
+
+            if(!(pwd == repwd)){ 
+                layer.msg("输入两次密码不一致，请重新填写");
+                return false; 
+            }
 
             // $('.notLogin').toggle();
             // $('.isLogin').toggle();
             // window.open("back_manage");
 
             $.ajax({
-                url: 'user_land',
+                url: 'reset_password',
                 data: {
-                    username: username,
-                    password: password
+                    ret : "land", 
+                    mobile: phone,
+                    password: pwd,
+                    password2: repwd,
+                    code: code
                 },
                 type: 'post',
                 dataType: 'json',
                 success: function (data) {
-                    if (data.code == 1) {
-                        // var hrefstr = 'person_farm?name=' + data.username;
-                        window.location = 'home2'
-                        window.open('back_manage')
-                        // $('.isLogin').toggle();
-                        // $('#person_farm').attr('href', hrefstr)
-                        // $('.userPhoto').attr('src', data.user_img)
-                        // $('.notLogin').hide();
-                        // $('.isLogin').show();
-                    } else if (data == 0) {
-                        $('body').append('<div class="hint">用户不存在</div>')
-                        setTimeout(function () {
-                            $('.hint').remove();
-                        }, 1000)
-                    } else if (data == 2) {
-                        $('body').append('<div class="hint">用户名错误</div>')
-                        setTimeout(function () {
-                            $('.hint').remove();
-                        }, 1000)
-                    } else if (data == 3) {
-                        $('body').append('<div class="hint">密码错误</div>')
-                        setTimeout(function () {
-                            $('.hint').remove();
-                        }, 1000)
-                    } else {
-                        $('body').append('<div class="hint">登录失败</div>')
-                        setTimeout(function () {
-                            $('.hint').remove();
-                        }, 1000)
+                    if(data==0){
+                        window.location.href='login2'
+                    }else if(data==1){
+                        layer.msg("该手机号已注册，请直接登录");
+                    }else if(data==2){
+                        layer.msg("验证码错误，请重新获取验证码");
+                    }else if(data==4){
+                        layer.msg("两次密码输入不一致");
                     }
                 },
                 error: function (type) {

templates/outerNet/index2.html

@@ -143,8 +143,8 @@
             </div>
             {% if not curr_user.username %}
             <div class="not_loginCover">
-                <a href="login2" target="_blank">登录</a>
-                <a href="register" target="_blank">注册</a>
+                <a href="login2">登录</a>
+                <a href="register">注册</a>
             </div>
             {% else %}
             <div class="yet_loginCover">

templates/outerNet/login2.html

@@ -142,8 +142,8 @@
             </div>
             {% if not curr_user.username %}
             <div class="not_loginCover">
-                <a href="login2" target="_blank">登录</a>
-                <a href="register" target="_blank">注册</a>
+                <a href="login2">登录</a>
+                <a href="register">注册</a>
             </div>
             {% else %}
             <div class="yet_loginCover">
@@ -180,11 +180,11 @@
                 <div class="loginBox">
                     <div class="title">用户登录</div>
                     <div class="loginInp">
-                        <input type="text" id="username" placeholder="用户名">
+                        <input type="text" id="username" placeholder="手机号">
                     </div>
                     <div class="loginInp">
                         <input type="password" id="password" placeholder="密码">
-                        <a href="forgetPaw" target="_blank">忘记密码？</a>
+                        <a href="forgetPaw">忘记密码？</a>
                     </div>
                     <div class="loginBtnCover">
                         <button id="loginBtn" onclick="login()">登 录</button>

templates/outerNet/register.html

@@ -24,6 +24,24 @@
             right:  -86px;
             text-decoration: underline;
         }
+        .borderline .loginBox .loginInp{
+            width: 100%;
+            height: 37px;
+            line-height: 37px;
+            border: 1px solid #d7d7d7;
+            border-radius: 4px;
+            position: relative;
+            margin-bottom: 20px;
+        }
+        .loginBtnCover button{
+            width: 100%;
+            line-height: 37px;
+            border-radius: 6px;
+            color: #ffffff;
+            font-size: 18px;
+            background-color: #61a830;
+            margin-bottom: 20px;
+        }
     </style>
 </head>
 
@@ -149,37 +167,10 @@
                     <button>搜索</button>
                 </div>
             </div>
-            <!-- <div class="not_loginCover">
-                <a href="login2" target="_blank">登录</a>
-                <a href="" target="_blank">注册</a>
-            </div> -->
-            <!-- <div class="yet_loginCover">
-                <div class="person">
-                    <div class="userHeadImg">
-                        <img src="http://www.xbxxnyggw.cn/file/upload/201901/22/230441831.jpg" alt="">
-                    </div>
-                    <div class="userCtrl">
-                        <div class="userCtrlTop">
-                            <div class="userInfo">
-                                <div>
-                                    <span>admin</span>
-                                </div>
-                            </div>
-                        </div>
-                        <div class="userCtrlBtm"><a href="back_manage" target="_blank">进入后台管理</a></div>
-                    </div>
-                    <div class="exit">
-                        <a href="">
-                            <i class="fa fa-power-off" aria-hidden="true"></i>
-                        </a>
-                    </div>
-                </div>
-            </div> -->
-
             {% if not curr_user.username %}
             <div class="not_loginCover">
-                <a href="login2" target="_blank">登录</a>
-                <a href="register" target="_blank">注册</a>
+                <a href="login2">登录</a>
+                <a href="register">注册</a>
             </div>
             {% else %}
             <div class="yet_loginCover">
@@ -216,17 +207,20 @@
                 <div class="loginBox">
                     <div class="title">注册</div>
                     <div class="loginInp">
-                        <input type="text" id="phone" placeholder="请输入手机号">
+                        <input type="text" id="phone" autocomplete="off" placeholder="请输入手机号">
+                    </div>
+                    <div class="loginInp verificationCode">
+                        <input type="text" id="code" autocomplete="off" placeholder="请输入验证码">
+                        <a href="javascript:;" id="sendCodeBtn">发送验证码</a>
                     </div>
                     <div class="loginInp">
-                        <input type="password" id="password" placeholder="请输入密码">
+                        <input type="password" id="password" autocomplete="off" placeholder="请输入密码">
                     </div>
-                    <div class="loginInp verificationCode">
-                        <input type="password" id="password" placeholder="请输入验证码">
-                        <a href="">发送验证码</a>
+                    <div class="loginInp">
+                        <input type="password" id="repassword" autocomplete="off" placeholder="请再次输入密码">
                     </div>
                     <div class="loginBtnCover">
-                        <button id="loginBtn" onclick="login()">注 册</button>
+                        <button id="loginBtn" onclick="register()">注 册</button>
                     </div>
                     <!-- <div class="remPswCover">
                         <div class="remPwdInpBox">
@@ -345,65 +339,124 @@
     <script src="{% static '/lib/js/jquery-2.1.4.min.js'%}"></script>
     <script
         src="https://webapi.amap.com/maps?v=1.4.15&key=3939967b919a8003377dd113fc445a3d&plugin=AMap.Driving"></script>
-    <!-- <script src="{% static '/lib/layui/layui.js'%}"></script> -->
+    <script src="{% static '/lib/layui/layui.js'%}"></script>
     <!-- <script src="{% static '/js/index2.js'%}"></script> -->
     <script>
+        var layer;
+        layui.use(['layer'], function () {
+            layer = layui.layer;
+        });
+        $('#sendCodeBtn').on('click',function(){
+            verifyCode($(this))
+        })
+        // 获取验证码
+        function verifyCode(obj){
+            var phone = $("#phone").val();
+            if (!phone) {
+                $("#phone").focus();
+                return;
+            }else{
+                if(!(/^1[3456789]\d{9}$/.test(phone))){ 
+                    layer.msg("手机号码有误，请重填");
+                    return false; 
+                }
+            }
+            var num = 60;
+            obj.html(num--+'秒');
+            var t = setInterval(() => {
+                var currnum = num--;
+                if(num < 0){
+                    obj.html('发送验证码');
+                    clearInterval(t);
+                    $('#sendCodeBtn').bind("click",function(){verifyCode($(this))});
+                }else{
+                    $('#sendCodeBtn').unbind("click");
+                    obj.html(currnum+'秒');
+                }
+            }, 1000);
+            sendCode();
+        }
+        function sendCode(){
+            
+            $.ajax({
+                url: 'prove_code',
+                data: {
+                    ret:'see',
+                    mobile:$("#phone").val()
+                },
+                type: 'post',
+                dataType: 'json',
+                success: function (data) {
+                    if (data == 0) {
+                        layer.msg("验证码已发送");
+                    }  else {
+                        layer.msg("验证码请求失败");
+                    }
+                },
+                error: function (type) {
 
+                }
+            })
+        }
         // 登录
-        function login() {
-            var username = $("#username").val();
-            var password = $("#password").val();
-            if (!username) {
-                $("#username").focus();
+        function register() {
+            var phone = $("#phone").val();
+            var code = $("#code").val();
+            var pwd = $("#password").val();
+            var repwd = $("#repassword").val();
+            if (!phone) {
+                $("#phone").focus();
+                return;
+            }else{
+                if(!(/^1[3456789]\d{9}$/.test(phone))){ 
+                    layer.msg("手机号码有误，请重填");
+                    return false; 
+                }
+            }
+            if (!code) {
+                $("#code").focus();
                 return;
             }
-            if (!password) {
+            // layer.msg("验证码有误，请重新获取");
+         
+            if (!pwd) {
                 $("#password").focus();
                 return;
             }
+            if (!repwd) {
+                $("#repassword").focus();
+                return;
+            }
+
+            if(!(pwd == repwd)){ 
+                layer.msg("输入两次密码不一致，请重新填写");
+                return false; 
+            }
 
             // $('.notLogin').toggle();
             // $('.isLogin').toggle();
             // window.open("back_manage");
 
             $.ajax({
-                url: 'user_land',
+                url: 'prove_code',
                 data: {
-                    username: username,
-                    password: password
+                    ret : "land", 
+                    mobile: phone,
+                    password: pwd,
+                    password2: repwd,
+                    code: code
                 },
                 type: 'post',
                 dataType: 'json',
                 success: function (data) {
-                    if (data.code == 1) {
-                        // var hrefstr = 'person_farm?name=' + data.username;
-                        window.location = 'home2'
-                        window.open('back_manage')
-                        // $('.isLogin').toggle();
-                        // $('#person_farm').attr('href', hrefstr)
-                        // $('.userPhoto').attr('src', data.user_img)
-                        // $('.notLogin').hide();
-                        // $('.isLogin').show();
-                    } else if (data == 0) {
-                        $('body').append('<div class="hint">用户不存在</div>')
-                        setTimeout(function () {
-                            $('.hint').remove();
-                        }, 1000)
-                    } else if (data == 2) {
-                        $('body').append('<div class="hint">用户名错误</div>')
-                        setTimeout(function () {
-                            $('.hint').remove();
-                        }, 1000)
-                    } else if (data == 3) {
-                        $('body').append('<div class="hint">密码错误</div>')
-                        setTimeout(function () {
-                            $('.hint').remove();
-                        }, 1000)
-                    } else {
-                        $('body').append('<div class="hint">登录失败</div>')
-                        setTimeout(function () {
-                            $('.hint').remove();
-                        }, 1000)
+                    if(data==5){
+                        window.location.href='login2'
+                    }else if(data==1){
+                        layer.msg("该手机号已注册，请直接登录");
+                    }else if(data==2){
+                        layer.msg("验证码错误，请重新获取验证码");
+                    }else if(data==4){
+                        layer.msg("两次密码输入不一致");
                     }
                 },
                 error: function (type) {