登录添加验证码

web/pages/login.html

@@ -29,7 +29,7 @@
                     <img src="./static/img/logo_2.png">
                     <!-- <p>乐谷游戏</p> -->
                 </div>
-            <form method="post" action="sidebar.html" id="formtest">
+                <form method="post" action="" id="formtest">
                     <div class="login-text-box">
                         <div class="login-text">
                             <div class="login-left-img">
@@ -37,11 +37,15 @@
                             </div>
                             <input type="text" class="login-form-control account" placeholder="输入用户名" name="username">
                         </div>
+                        <div class="login-text" style="margin-top: 22px;">
+                            <input type="text" class="login-form-control verification" placeholder="内部号请获取钉钉验证码在登陆"><div class="get-verification-but" >获取验证码</div>
+                        </div>
                         <div class="login-text" style="margin-top: 22px;">
                             <div class="login-left-img">
                                 <img src="./static/img/mima.png" style="width: 16px;">
                             </div>
-                <input type="password" class="login-form-control password" placeholder="输入密码" name="password">
+                            <input type="password" class="login-form-control password" placeholder="输入密码"
+                                name="password">
                         </div>
 
                         <div class="col-8">
@@ -49,11 +53,13 @@
                                 <!-- <input type="checkbox" id="remember" style="width: 20px; height: 20px;">
                                     <label for="remember" style="font-size: 14px; color: #d9d9d9;">
                                     记住密码
-                    </label> -->
+                                    </label> 
+                                -->
                             </div>
                         </div>
                         <div class="col-8" style="margin-top: 23px;">
-                <input type="button" value="登录" class="login-btn btn-primary btn-block login-denglu"></button>
+                            <input type="button" value="登录"
+                                class="login-btn btn-primary btn-block login-denglu"></button>
                         </div>
                     </div>
                 </form>

web/src/x.min.js

@@ -193,6 +193,8 @@ var X = window.X || {
             }
             if(url == 'data_mana/list'){
                 var url = ipurl+url+"?game="+ X.DATA.game+"&"+parms || "";
+            }else if(url.indexOf("send_auth_code") != -1){
+                var url = ipurl+url;
             } else {
                 var url = ipurl+url+"?game="+ X.DATA.game || "";
             }
@@ -12030,12 +12032,44 @@ var X = window.X || {
       
                 }
             };
+            var timer = null;
+            var time = 60;
+            $(".get-verification-but").click(function(e){
+                var account = $(".login-txt-box .account").val();
+                if(account == ""){
+                    layer.msg('请输入用户名', { icon: 3, time: 1000 });
+                    return
+                }
+                if(time != 60){
+                    return
+                }
+                X.api('user/send_auth_code','post',{name:account},function(d){
+                    layer.msg('验证码已发送请在钉钉消息里查看！！！', {
+                        icon: 1,
+                        time: 1000
+                    }, function() {
+                        timer = setInterval(() => {
+                            time--
+                            $(".get-verification-but").html(time + 's');
+                            if (time == 0) {
+                                clearInterval(timer);
+                                $(".get-verification-but").html('获取验证码');
+                                $('.get-verification-but').removeClass('on-get-verification-but');
+                            } else {
+                                $('.get-verification-but').addClass('on-get-verification-but');
+                            }
+                        }, 1000)
+                    });
+                })
+                
+            })
 
             function postlogin(){
                 var account = $(".login-txt-box .account").val();
                 var password = $(".login-txt-box .password").val();
+                var code = $(".verification").val();
                 // X.gourl("dashboard");
-                X.api('user/login',"post",{username:account,password:password},function (d){
+                X.api('user/login',"post",{username:account,password:password,scope:code},function (d){
                     // console.log(d);
                     X.DATA["userinfo"] = d;
                     X.loginCache(d);

web/srczip/common.js

@@ -192,6 +192,8 @@ var X = window.X || {
             }
             if(url == 'data_mana/list'){
                 var url = ipurl+url+"?game="+ X.DATA.game+"&"+parms || "";
+            }else if(url.indexOf("send_auth_code") != -1){
+                var url = ipurl+url;
             } else {
                 var url = ipurl+url+"?game="+ X.DATA.game || "";
             }

web/srczip/logic/login.js

@@ -21,12 +21,44 @@
       
                 }
             };
+            var timer = null;
+            var time = 60;
+            $(".get-verification-but").click(function(e){
+                var account = $(".login-txt-box .account").val();
+                if(account == ""){
+                    layer.msg('请输入用户名', { icon: 3, time: 1000 });
+                    return
+                }
+                if(time != 60){
+                    return
+                }
+                X.api('user/send_auth_code','post',{name:account},function(d){
+                    layer.msg('验证码已发送请在钉钉消息里查看！！！', {
+                        icon: 1,
+                        time: 1000
+                    }, function() {
+                        timer = setInterval(() => {
+                            time--
+                            $(".get-verification-but").html(time + 's');
+                            if (time == 0) {
+                                clearInterval(timer);
+                                $(".get-verification-but").html('获取验证码');
+                                $('.get-verification-but').removeClass('on-get-verification-but');
+                            } else {
+                                $('.get-verification-but').addClass('on-get-verification-but');
+                            }
+                        }, 1000)
+                    });
+                })
+                
+            })
 
             function postlogin(){
                 var account = $(".login-txt-box .account").val();
                 var password = $(".login-txt-box .password").val();
+                var code = $(".verification").val();
                 // X.gourl("dashboard");
-                X.api('user/login',"post",{username:account,password:password},function (d){
+                X.api('user/login',"post",{username:account,password:password,scope:code},function (d){
                     // console.log(d);
                     X.DATA["userinfo"] = d;
                     X.loginCache(d);

web/static/css/style.css

@@ -1186,3 +1186,25 @@ input.editable-select {
 .touserinfo { cursor: pointer; }
 .search_data-zwsj { text-align: center; }
 
+.get-verification-but { 
+    width: 80px;
+    background-color: #fff;
+    border: 0px;
+    border-left: 1px solid #d9d9d9;
+    height: calc(2.25rem + 2px);
+    padding: 8px 0;
+    cursor: pointer;
+    line-height: calc(2.25rem + 2px);
+    text-align: center;
+}
+
+.on-get-verification-but {
+    background: #f0f0f0;
+    
+}
+
+.verification {
+    width: calc(100% - 100px);
+    padding: 8px 10px;
+}
+