js

Application/Home/View/Register/index.html

@@ -17,7 +17,7 @@
                 </p>
                 <div class="input-wrap">
                     <i class="iconfont iconjuxing23 va-m"></i>
-                    <input type="text" class="w w1 va-m" placeholder="请输入手机号">
+                    <input type="text" class="w w1 va-m" placeholder="请输入手机号" name="mobile">
                     <div class="sel lineBlock va-m">
                         <select name="interest">
                             <option value="0">中国 +86</option>
@@ -27,21 +27,24 @@
                 </div>
                 <div class="input-wrap">
                     <i class="iconfont iconpassword va-m"></i>
-                    <input type="text" class="w w1 va-m" placeholder="请输入密码">
+                    <input type="text" class="w w1 va-m" placeholder="请输入密码" name="password">
                     <i class="iconfont iconjuxing27 va-m lineBlock"></i>
                 </div>
+                <!--验证码-->
                 <div class="input-wrap" id="verifiCode" style="display: none">
                     <i class="iconfont iconjuxing26 va-m"></i>
-                    <input type="text" class="w w1 va-m" placeholder="请输入验证码">
-                    <img src="" alt="" width="100" height="30" class="lineBlock va-m codepic">
+                    <input type="text" class="w w1 va-m" name="captcha" placeholder="请输入图形验证码"/>
+                    <input type="hidden" class="w w1 va-m" name="captchaUuid" value=""/>
+                    <img src="" alt="" width="100" height="30" class="lineBlock va-m codepic"/>
                 </div>
                 <div class="input-wrap">
                     <i class="iconfont iconjuxing26 va-m"></i>
-                    <input type="text" class="w w1 va-m" placeholder="请输入手机号">
-                    <input type="button"  name="code" class="lineBlock text va-m" value="发送验证码" data-type="0"/>
+                    <input type="text" name="code"  class="w w1 va-m" placeholder="请输入手机验证码">
+                    <input type="button"  name="codetext" class="lineBlock text va-m" value="发送验证码"/>
                 </div>
+                <input type="hidden" name="code_type" value="1">
                 <div class="btn-wrap">
-                    <a href="javascript:;" class="btn">注册</a>
+                    <a href="javascript:;" class="btn" lay-submit lay-filter="register">注册</a>
                 </div>
                 <p class="agree">点击注册即默认同意<a>《IC业务助手协议》</a></p>
             </div>

dist/js/global/api.js

@@ -18,6 +18,14 @@
 (function (window) {
   apis = {
     /**
+     * 用户注册
+     */
+    authRegister: auth_url + '/auth/register',
+    /**
+     * 账号密码登录
+     */
+    authlogin: auth_url + '/auth/login',
+    /**
      * 获取图形验证码接口
      */
     captchaInfo: auth_url + '/captchaInfo',

dist/js/person/register.js

 !function () {
   window.RegisterController = {
+    isClick: false,
     init: function () {
       this.created(this).mounted(this).handleBind(this);
     },
@@ -12,25 +13,178 @@
       
       return this;
     },
+    getCode: function (opt, type, params) {
+      
+      var $verifiCode = $("#verifiCode"),
+        $code = $('input[name="code"]'),
+        $codetext = $('input[name="codetext"]'),
+        $codepic = $('.codepic');
+      
+      
+      if (type == 'captchaInfo') {
+        
+        //获取验证码
+        IcController.getData(apis.captchaInfo, 'GET', null, function (res) {
+          
+          if (res.captchaUrl) {
+            
+            $verifiCode.find('img').attr('src', res.captchaUrl);
+            
+            $verifiCode.find('input[name="captchaUuid"]').val(res.captchaUuid);
+            
+            $verifiCode.show();
+            
+            $verifiCode.find('input[name="captcha"]').focus();
+            
+          }
+        });
+      } else if (type == 'mobile') {
+        
+        //获取短信验证码
+        IcController.getData(apis.getRegistCode, 'POST', params, function (res) {
+          
+          if (res.err_code == 0) {
+            
+            $code.focus();
+            
+            //开始倒计时
+            var second = 60, timer = null;
+            
+            timer = setInterval(function () {
+              
+              second -= 1;
+              
+              if (second > 0) {
+                
+                $codetext.val(second + '秒');
+                
+                $codetext.attr('disabled', "true");
+                
+              } else {
+                
+                clearInterval(timer);
+                
+                $codetext.removeAttr('disabled');
+                
+                $codetext.val('重新获取');
+                
+                $codepic.trigger('click');
+                
+              }
+            }, 1000);
+            
+            
+          } else {
+            layer.msg(res.err_msg);
+          }
+          
+        });
+      }
+      
+    },
+    calcForm: function (opt) {
+      var $mobile = $('input[name="mobile"]'),
+        $password = $('input[name="password"]'),
+        $code = $('input[name="code"]');
+      
+      if (!$mobile.val()) {
+        
+        $mobile.parent('.input-wrap').addClass('error');
+        
+        return false;
+        
+      }
+      
+      if (!$password.val()) {
+        
+        $password.parent('.input-wrap').addClass('error');
+        
+        return false;
+        
+      }
+      
+      if (!$code.val()) {
+        
+        $code.parent('.input-wrap').addClass('error');
+        
+        return false;
+        
+      }
+      
+      $('.error').removeClass('error');
+      
+      return true;
+      
+    },
     handleBind: function (opt) {
       
       //发送验证码
-      $(document).on('click', 'input[name="code"]', function () {
+      $(document).on('click', 'input[name="codetext"]', function () {
         
-        //判断是否输入验证码
-        var captchaInfo = $(this).attr('data-type');
+        var $verifiCode = $("#verifiCode"),
+          captchaUuid = $verifiCode.find('input[name="captchaUuid"]').val(),
+          captcha = $verifiCode.find('input[name="captcha"]').val(),
+          mobile = $('input[name="mobile"]').val();
         
-        captchaInfo == 0 ? $(this).attr('data-type', 1) : '';
-        
-        IcController.getData(apis.captchaInfo,'GET',null,function (res) {
+        //判断是否有图形验证码id
+        if (!captchaUuid) {
+          
+          opt.getCode(opt, 'captchaInfo');
           
-          console.log(res)
           
+        } else {
           
-        })
+          //获取短信验证码
+          var params = {
+            captchaUuid: captchaUuid,
+            captcha: captcha,
+            mobile: mobile,
+            code_type: 1
+          }
+          opt.getCode(opt, 'mobile', params);
+          
+        }
+        
+        
+      });
+      
+      //更新验证码
+      $(document).on('click', '.codepic', function () {
         
+        opt.getCode(opt, 'captchaInfo');
         
+      });
+      
+      //注册提交
+      layui.form.on('submit(register)', function (data) {
+        
+        if (opt.calcForm()) {
+          $(data.elem).addClass("layui-btn-disabled");
+          
+          if (!opt.isClick) {
+            
+            opt.isClick = true;
+            
+            IcController.getData(apis.authRegister, 'POST', data.field, function (res) {
+              
+              if (res.err_msg == 0) {
+                
+                console.log(res)
+                
+              } else {
+                
+                layer.msg(res.err_msg);
+                
+                opt.isClick = false;
+                
+                $(data.elem).removeClass("layui-btn-disabled");
+                
+              }
+            });
+          }
+        } else {
         
+        }
       });
       
       return this;