pc 密码流程修改

Application/Passport/View/Forget/index.html

@@ -10,7 +10,7 @@
 <div class="person-bar lineBlock va-m">
     <div class="person">
         <div class="wrap layui-form">
-            <ul class="status">
+            <!--<ul class="status">
                 <li class="lineBlock curr">
                     <em class="va-m lineBlock"></em>
                     <span class="va-m">验证手机号</span>
@@ -23,7 +23,7 @@
                     <em class="va-m lineBlock"></em>
                     <span class="va-m">设置成功</span>
                 </li>
-            </ul>
+            </ul>-->
             <div class="register" id="verify" style="display: block">
                 <p class="tit">
                     <em class="va-m lineBlock"></em>
@@ -50,15 +50,6 @@
                     <input type="text" class="w w1 va-m" placeholder="请输入手机验证码" name="code">
                     <input type="button"  name="codetext" class="lineBlock text va-m" value="发送验证码"/>
                 </div>
-                <div class="btn-wrap">
-                    <a href="javascript:;" class="btn" id="resetPassword">下一步</a>
-                </div>
-            </div>
-            <div class="register" id="rebuild" style="display: none">
-                <p class="tit">
-                    <em class="va-m lineBlock"></em>
-                    <span class="va-m">忘记密码</span>
-                </p>
                 <div class="input-wrap">
                     <i class="iconfont iconpassword va-m"></i>
                     <div class="pwd lineBlock">
@@ -66,6 +57,17 @@
                     </div>
                     <i class="iconfont iconiconxiantiaoshouji  va-m lineBlock eyes"></i>
                 </div>
+                <div class="input-wrap">
+                    <i class="iconfont iconpassword va-m"></i>
+                    <div class="pwdrehtml lineBlock">
+                        <input type="password" class="w w1 va-m" placeholder="再次输入密码" name="repassword">
+                    </div>
+                    <i class="iconfont iconiconxiantiaoshouji  va-m lineBlock eyesRe"></i>
+                </div>
+                <div class="error-text" style="display: none">
+                    <i class="iconfont iconjuxing20 va-m"></i>
+                    <span class="va-m"></span>
+                </div>
                 <div class="btn-wrap">
                     <a href="javascript:;" class="btn" lay-submit lay-filter="resetPassword">设置密码</a>
                 </div>
@@ -92,6 +94,15 @@
 
     {{# } }}
 </script>
+<script type="text/html" id="pwdHtmlRe">
+    {{# if (d.flag== 1) { }}
+    <input type="text" class="w w1 va-m" placeholder="再次输入密码" name="repassword" value="{{d.value}}">
+
+    {{# } else { }}
+    <input type="password" class="w w1 va-m" placeholder="再次输入密码" name="repassword" value="{{d.value}}">
+
+    {{# } }}
+</script>
 </body>
 
 </html>
\ No newline at end of file

dist/js/person/forget.js

@@ -87,10 +87,14 @@
     },
     calcForm: function (opt, type) {
       var $mobile = $('input[name="mobile"]'),
+        $code = $('input[name="code"]'),
         $password = $('input[name="password"]'),
-        $code = $('input[name="code"]');
+        $repassword = $('input[name="repassword"]');
+      
+      //密码长度要大于6位，由数字和字母组成
+      var reg = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,}$/;
       
-      if (!$mobile.val() && type === 1) {
+      if (!$mobile.val()) {
         
         $mobile.parent('.input-wrap').addClass('error');
         
@@ -98,7 +102,17 @@
         
       }
       
-      if (!$password.val() && type === 2) {
+      
+      if (!$code.val()) {
+        
+        $code.parent('.input-wrap').addClass('error');
+        
+        return false;
+        
+      }
+      
+      
+      if (!$password.val()) {
         
         $password.parent().parent('.input-wrap').addClass('error');
         
@@ -106,10 +120,8 @@
         
       }
       
-      //密码长度要大于6位，由数字和字母组成
-      var reg = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,}$/;
       
-      if (!reg.test($password.val()) && type === 2) {
+      if (!reg.test($password.val())) {
         
         $password.parent().parent('.input-wrap').addClass('error');
         
@@ -119,14 +131,26 @@
       }
       
       
-      if (!$code.val() && type === 1) {
+      if (!$repassword.val()) {
         
-        $code.parent('.input-wrap').addClass('error');
+        $repassword.parent().parent('.input-wrap').addClass('error');
         
         return false;
         
       }
       
+      
+      if ($password.val() != $repassword.val()) {
+        
+        $repassword.parent().parent('.input-wrap').addClass('error');
+        
+        $(".error-text").show().find("span").text('输入密码不一致');
+        
+        return false;
+        
+      }
+      
+      
       $('.error').removeClass('error');
       
       return true;
@@ -207,6 +231,20 @@
         
       });
       
+      //第二次密码
+      $('input[name="repassword"]').on('input propertychange', function () {
+        
+        var val = $(this).val();
+        var password = $('input[name="password"]').val();
+        
+        if (val == password) {
+          
+          $(".error-text").hide();
+          
+        }
+        
+      });
+      
       //手机验证码
       $('input[name="code"]').on('input propertychange', function () {
         
@@ -255,24 +293,46 @@
         
       });
       
-      //验证手机号验证
-      $(document).on('click', '#resetPassword', function () {
+      //查看密码
+      $(".eyesRe").on('click', function () {
         
-        if (opt.calcForm(opt, 1)) {
+        //兼容ie
+        var flag;
+        var self = this;
         
-          $(".status").find('li').eq(1).addClass('curr').siblings('li').removeClass('curr');
+        if ($(this).hasClass('iconiconxiantiaoshouji')) {
           
-          $("#verify").hide();
+          $(this).removeClass('iconiconxiantiaoshouji').addClass('iconjuxing27');
           
-          $("#rebuild").show();
+        } else {
+          
+          $(this).removeClass('iconjuxing27').addClass('iconiconxiantiaoshouji');
           
         }
+        
+        
+        flag = $(this).hasClass('iconjuxing27') ? '1' : '2';
+        
+        var data = {
+          value: $("input[name='repassword']").val(),
+          flag: flag
+        };
+        
+        var getTpl = pwdHtmlRe.innerHTML;
+        
+        layui.laytpl(getTpl).render(data, function (html) {
+          
+          $(".pwdrehtml").empty().html(html);
+          
         });
         
+      });
+      
+      
       //重设密码
       layui.form.on('submit(resetPassword)', function (data) {
         
-        if (opt.calcForm(opt, 2)) {
+        if (opt.calcForm(opt)) {
           $(data.elem).addClass("layui-btn-disabled");
           
           if (!opt.isClick) {