修改密码copy

src/css/index.less

@@ -3,6 +3,25 @@
 .container{
   height: 100%;
 }
+.tips{
+  width: 420px;
+  height: 24px;
+  position: relative;
+  background: #EDEEEF;
+  top: -27px;
+  text-align: left;
+  & img{
+    margin-left: 16px;
+    margin-right: 4px;
+  }
+  & span{
+    font-size: 12px;
+    font-weight: 400;
+    color: #999999;
+    line-height: 24px;
+    text-align: left;
+  }
+}
 .header{
   /*position: fixed;*/
   width: 100%;
@@ -416,6 +435,7 @@
   }
   //修改密码
   .modalAction {
+    position: relative;
     // padding: 20px;
     input {
       border: 1px solid #E2E5EF;
@@ -438,12 +458,46 @@
       color: #FF4D4F;
       display: inline-block;
       position: absolute;
-      left: 105px;
-      bottom: 6px;
+
+      top: 37px;
+      left: 107px;
+      text-align: left;
+      & img{
+        margin-right: 5px;
+      }
+      & b{
+        font-weight: 400;
+      }
+    }
+    .newword {
+      color: #FF4D4F;
+      display: inline-block;
+      top: -26px;
+      left: -36px;
+      text-align: left;
+      & img{
+        margin-right: 5px;
+      }
+      & b{
+        font-weight: 400;
+      }
+    }
+    .sureword{
+      color: #FF4D4F;
+      display: inline-block;
+      top: -26px;
+      left: -36px;
+      text-align: left;
+      & img{
+        margin-right: 5px;
+      }
+      & b{
+        font-weight: 400;
+      }
     }
     .waring {
       text-align: left;
-      i {
+      s {
         margin-left: 15px;
         color: #FF4D4F;
         position: relative;

src/js/index.js

@@ -3,19 +3,50 @@ const $ = require('jquery');
 require('jquery-templates');
 const md5 = require('js-md5');
 require("./modal.js")
+const WarningIcon =  require("./../images/icon-Warning.png")
+const warnIcon = require("./../images/warn.png")
+const openEye = require("./../images/open-eye.png")
+const closeEye = require("./../images/close-eye.png")
 
 const {api} = require('./api.js')
 const {post,pageMap,delCookie,setCookie,getCookie,focusMenuItem,initScroll} = require('./utils.js');
 let userInfo={};
 let isPlacefile = getCookie('isPlacefile')||1
-
-$(function(){
+let passwordComplexity = getCookie('passwordComplexity')
+const modalDom = `
+      <p class="tips"><img src=${WarningIcon} /><span>为确保账号安全，请及时修改初始密码</span></p>
+      <div class="modalAction">
+        <p><span>原密码：</span><input type="text" placeholder="请输入原密码" class="oldword" id="oldWord" autocomplete="off"><img class="eye" src=${closeEye} /><p class="oldWaring warning"><img src=${warnIcon} /><b>请及时修改初始密码</b></p></p>
+        <p><span>新密码：</span><input type="text" disabled placeholder="请输入新密码" class="newword" id="newWord" autocomplete="off"><img class="eye" src=${closeEye} /><p class="newword warning"><img src=${warnIcon} /><b>请及时修改初始密码</b></p></p>
+        <p><span>确认新密码：</span><input type="text" disabled placeholder="请输入确认新密码" class="sureword" id="sureWord" autocomplete="off"><img class="eye" src=${closeEye} /><p class="sureword warning"><img src=${warnIcon} /><b>请及时修改初始密码</b></p></p>
+      </div>
+    `;
+const psdChecker = `<div class="psd-checkbox">
+                      <p class="label">密码至少包含：</p>
+                      <p class="big-letter"><i></i>1个大写字母</p>
+                      <p class="small-letter"><i></i>1个小写字母</p>
+                      <p class="special-letter"><i></i>1个特色字符</p>
+                      <p class="one-number"><i></i>1个数字</p>
+                      <p class="eight-str"><i></i>8位字符</p>
+                    </div>`;
+$(function () {
   getOwnDept();
   setInterval(() => {
       getTimeDetail()
   }, 1000);
-  //菜单展开收起
   sureChangeWord()
+  if (passwordComplexity!=='null') {
+      $.alerModal({
+          quiteBtn: true,
+          title: "修改密码",
+          type: "modal",
+          width: '450',
+          time: '1000',
+          sureText: '保存',
+          message: modalDom});
+      bindModalEvent();
+  }
+    //菜单展开收起
   $(".main").css({
     height:$(window).height()-52+'px'
   })
@@ -63,6 +94,121 @@ $(function(){
     $(this).parent().find('img').attr('src',require('../images/qiehuan2.png'))
   })
 });
+//切换密码明文
+function switchPwd(el) {
+  if(!el.is(".open")){
+      el.attr("src",openEye).addClass("open");
+      el.prev().attr("type",'text');
+  }else{
+      el.attr("src",closeEye).removeClass("open");
+      el.prev().attr("type",'password');
+  }
+}
+
+function toast(msg){
+    $.alerModal({"message":msg,type:"tip",time:'1000',isFather: true, fatherWrapper: $("#mainBox", parent.document)});
+}
+
+//绑定输入框事件
+function bindModalEvent(){
+  $(".modalAction .eye").off("click").on("click",function(){
+      switchPwd($(this))
+  })
+  $("#oldWord").off("input").on("input",function(){
+    const text = $(this).val();
+      if(text.trim()){
+          $("#newWord").attr("disabled",false);
+      }
+  })
+  $("#newWord").off("input").on("input",function(){
+      const text = $(this).val();
+      if(text.trim()){    //显示密码验证标签
+        const checker = $(".alertModal .psd-checkbox");
+        if(checker.length){
+            checker.show()
+        }else{
+            $(psdChecker).appendTo($(".alertModal"));
+        }
+        const psdOk = verifyPsd(text);
+        let psdsOk=false;
+        if(psdOk){
+            $("#sureWord").attr("disabled",false);
+            psdsOk = verifyPsdPart($("#oldWord").val(),$("#newWord").val(),$("#sureWord").val());
+        }
+        if(psdsOk){
+            //保存按钮启用
+            $(".sureChange .sureChange").addClass("active");
+        }
+      }
+  })
+    $("#sureWord").off("input").on("input",function(){
+        const text = $(this).val();
+        if(text.trim()){    //显示密码验证标签
+            let psdsOk=verifyPsdPart($("#oldWord").val(),$("#newWord").val(),$("#sureWord").val());
+            if(psdsOk){
+                //保存按钮启用
+                $(".alertModal .sureChange").addClass("active");
+            }else{
+                $(".alertModal .sureChange").removeClass("active");
+            }
+        }
+    })
+}
+
+//验证新密码规则
+function verifyPsd(text){console.log(text)
+  if(/(?=.*?[A-Z])/.test(text)){  //至少一个大写字母
+    $(".big-letter").addClass("active");
+  }else{
+      $(".big-letter").removeClass("active");
+  }
+  if(/(?=.*?[a-z])/.test(text)){  //至少一个大写字母
+      $(".small-letter").addClass("active");
+  }else{
+      $(".small-letter").removeClass("active");
+  }
+  if(/(?=.*?[0-9])/.test(text)){  //至少一个数字
+      $(".one-number").addClass("active");
+  }else{
+      $(".one-number").removeClass("active");
+  }
+  if(/(?=.*?[#?!@$，,%^&*-])/.test(text)){  //至少一个特殊字符
+      $(".special-letter").addClass("active");
+  }else{
+      $(".special-letter").removeClass("active");
+  }
+  if(text.length>7){  //至少8个字符
+      $(".eight-str").addClass("active");
+  }else{
+      $(".eight-str").removeClass("active");
+  }
+  if(text.length>12){
+    $(".newword b").text("密码最多12位");
+    $(".newword").show();
+    return false;
+  }
+  const regex = new RegExp('^(?=.*[a-z])(?=.*[A-Z])(?=.*\\d)(?=.*[$@~·$、，,\.!#%*?&])[A-Za-z\\d$@#$\.~、,，·!%*?&]{8,12}');
+  if(regex.test(text)){
+    return true
+  }
+  return false;
+}
+
+function verifyPsdPart(oldP,newP,confirmP){   //验证各密码关系规则
+  if(oldP.trim()===newP.trim()){
+    $(".newword b").text("原密码和新密码不能相同");
+      $(".newword").show();
+    return false
+  }
+  if(confirmP.trim()&&newP.trim()!==confirmP.trim()){
+      $(".sureword b").text("两次密码输入不一致");
+      $(".sureword").show();
+      return false
+  }
+  $(".warning").hide();
+  return true;
+}
+
 //判断有无某一权限
 function hasData(data,list){
   if(list&&list.length>0){
@@ -147,7 +293,7 @@ $(".slide-hide").off("click").click(function(){
     if(code === 'YH-BLZK-ZKPFGR'){
       url += `?doctorName=${userInfo.linkman}`
     }
-    $("#contentIframe").attr("src",url);console.log('$(".page")')
+    $("#contentIframe").attr("src",url);
     setTimeout(() => {
       bindMenu()
     }, 500);
@@ -227,36 +373,26 @@ function sureChangeWord(){
   $(document).on('click','.sureChange',function(){
     let oldword = $(".oldword").val().trim()
     let newword = $(".newword").val().trim()
-    let sureword = $(".sureword").val().trim()
-    if(!oldword){
-      $(".modalAction .waring i").html('请输入原密码')
-      return
-    }else if(!newword){
-      $(".modalAction .waring i").html('请输入新密码')
-      return
-    }else if(!sureword){
-      $(".modalAction .waring i").html('请确认新密码')
-      return
-    }else if(newword != sureword){
-      $(".modalAction .waring i").html('两次密码不一致')
-      return
-    }
     $(".modalAction .waring i").html('')
     changeWord(oldword,newword)
   })
 }
 function changeWord(oldword,newword){
   post(api.midifyPassword,{
-    "modifyPassword": md5(newword),
-    "password": md5(oldword)
+    "modifyPassword": newword,
+    "password": oldword
   }).then(function(res){
     const data = res.data;
     if(data.code==='0'){
       setCookie('behosDateStart','')
       setCookie('behosDateEnd','')
-      window.location.href = './login.html'
+      toast("密码修改成功，请重新登录");
+      setTimeout(()=>{
+          window.location.href = './login.html'
+      },1500);
     }else{
-      $(".oldWaring").html(data.msg)
+        $(".oldWaring b").text(data.msg);
+        $(".oldWaring").show();
       return
     }
   });
@@ -279,14 +415,9 @@ $("#changeWord").click(function(e){
     width:'450',
     time:'1000',
     sureText:'保存',
-    message:`
-    <div class="modalAction">
-      <p><span>原密码：</span><input type="text" placeholder="请输入原密码" class="oldword" autocomplete="off"><i class="oldWaring"></i></p>
-      <p><span>新密码：</span><input type="text" placeholder="请输入新密码" class="newword" autocomplete="off"></p>
-      <p><span>确认新密码：</span><input type="text" placeholder="请输入新密码" class="sureword" autocomplete="off"></p>
-      <p class="waring"><span></span><i></i></p>
-    </div>
-  `});
+    message:modalDom});
+    $(".alertModal .tips").hide();
+    bindModalEvent();
   $(".userAction").hide();
 })
 //推出登录
@@ -308,7 +439,7 @@ function getTimeDetail(){
 }
 
 // 左侧菜单滚动到页面顶部
-function bindMenu(){console.log('bindMenu')
+function bindMenu(){
   $("#contentIframe").contents().find('.partTitle a').eq(0).click(function(){
     $(".menuList").scrollTop(0)
   })

src/js/login.js

@@ -53,6 +53,7 @@ function sureLogin(){
     if(data.code == 0){
       setCookie('accessToken',data.data.accessToken)
       setCookie('isPlacefile',1)
+      setCookie('passwordComplexity', data.data.passwordComplexity)
       //setCookie('mmps',password);
       localStorage.setItem('accessToken',data.data.accessToken)
       $(".divModal").remove()

src/js/modal.js

@@ -90,7 +90,7 @@ const jQuery = require('jquery');
                 box.remove();
             }, ops.time);
         }
-        $(document).on('click',".alertModal .title img",function(){
+        $(document).on('click',".alertModal .title img,.alertModal .quite",function(){
             box.remove();
         })
     }