有关密码框都加上小眼睛控制密码显隐

pages/login/login.js

@@ -127,10 +127,6 @@ Page({
       // 请求短信登录start
       UserApi.codeLogin(params).then(res => {
         if (res.success) {
-          wx.setStorage({
-            key: 'userInfo',
-            data: res.result.userInfo
-          })
           // 第一次登录系统，需要设置密码
           if(res.message === "updatePassword") {
             // 存临时token
@@ -138,9 +134,10 @@ Page({
               key: 'token-temp',
               data: res.result.token
             })
+            let userInfo = JSON.stringify(res.result.userInfo)
             // 跳转设置密码页
             wx.navigateTo({
-              url: '../setPassword/setPassword',
+              url: `../setPassword/setPassword?userInfo=${userInfo}`,
             })
           }else{
             // 存token和userInfo
@@ -148,6 +145,10 @@ Page({
               key: 'X-Access-Token',
               data: res.result.token
             })
+            wx.setStorage({
+              key: 'userInfo',
+              data: res.result.userInfo
+            })
             // 绑定微信
             this.wxBindPhone()
             // 跳转首页

pages/phonePassword/phonePassword.js

@@ -10,6 +10,8 @@ Page({
    * 页面的初始数据
    */
   data: {
+    show: true, // 默认显示的是闭眼睛
+    type: 'password',
     form: {
       currdatetime: '',
       requestCodeSuccess: true,
@@ -18,7 +20,19 @@ Page({
     rsaPublicKey: '', // 公钥
     flag: false
   },
-
+  showPassword(){
+    if(this.data.show){ // 显示睁开眼睛的时候 type="text"
+      this.setData({
+        type: 'text',
+        show: false
+      })
+    }else{
+      this.setData({
+        type: 'password',
+        show: true
+      })
+    }
+  },
   back(){
     wx.navigateBack({
       delta: 1
@@ -108,21 +122,33 @@ Page({
     if(this.data.flag){
       UserApi.passWordLogin(params).then(res => {
         if(res.success){
-          // 绑定微信
+          if(res.message == '请先用手机号登录'){
-          this.wxBindPhone()
+            wx.showToast({
-          // 存token和userInfo
+              title: '首次登录请用验证码方式登录',
-          wx.setStorage({
+              icon: 'none',
-            key: 'X-Access-Token',
+              duration: 2000
-            data: res.result.token
+            })
-          })
+            setTimeout(() => {
-          wx.setStorage({
+              wx.navigateBack()
-            key: 'userInfo',
+            }, 2000);
-            data: res.result.userInfo
+            return
-          })
+          }else{
-          // 跳转首页
+            // 绑定微信
-          wx.switchTab({
+            this.wxBindPhone()
-            url: '../home/home',
+            // 存token和userInfo
-          })
+            wx.setStorage({
+              key: 'X-Access-Token',
+              data: res.result.token
+            })
+            wx.setStorage({
+              key: 'userInfo',
+              data: res.result.userInfo
+            })
+            // 跳转首页
+            wx.switchTab({
+              url: '../home/home',
+            })
+          }
         }else{
           wx.showToast({
             title: res.message,

pages/phonePassword/phonePassword.wxml

@@ -10,7 +10,9 @@
     <view class="form-item">
       <view class="text-label">密码</view>
       <view class="text-value">
-        <input name="password" value="{{password}}" type="password" placeholder="请输入密码" />
+        <input name="password" value="{{password}}" type="{{type}}" placeholder="请输入密码" />
+        <image src="../../assets/images/show.png" class="show" wx:if="{{!show}}" bindtap="showPassword"></image>
+        <image src="../../assets/images/none.png" class="show" wx:if="{{show}}" bindtap="showPassword"></image>
       </view>
     </view>
     <view class="form-item">

pages/phonePassword/phonePassword.wxss

@@ -6,6 +6,9 @@
 .text-label {
   width: 60px !important;
 }
+.text-value{
+  position: relative;
+}
 .forget{
   color: #999;
   font-size: 14px;
@@ -27,4 +30,12 @@
   width: 100%;
   height: 90%;
   border-radius: 5px;
+}
+.show{
+  width: 15px;
+  height: 15px;
+  position: absolute;
+  right: 10px;
+  top: 8px;
+  z-index: 9;
 }

pages/setPassword/setPassword.js

@@ -11,10 +11,37 @@ Page({
     newPassword: '', // 密码
     verifyPassword: '', // 确认密码
     rsaPublicKey: '',
-    flag: false
+    flag: false,
+    show: true, // 默认显示的是闭眼睛
+    showVerify: true,
+    type: 'password',
+    typeVerify: 'password'
   },
-  bindBlurInput(e){
+  showPassword(){
-
+    if(this.data.show){ // 显示睁开眼睛的时候 type="text"
+      this.setData({
+        type: 'text',
+        show: false
+      })
+    }else{
+      this.setData({
+        type: 'password',
+        show: true
+      })
+    }
+  },
+  showPasswordVerify(){
+    if(this.data.showVerify){ // 显示睁开眼睛的时候 type="text"
+      this.setData({
+        typeVerify: 'text',
+        showVerify: false
+      })
+    }else{
+      this.setData({
+        typeVerify: 'password',
+        showVerify: true
+      })
+    }
   },
   // 登录
   formSubmit(e) {
@@ -84,6 +111,10 @@ Page({
             key: 'X-Access-Token',
             data: that.data.password
           })
+          wx.setStorage({
+            key: 'userInfo',
+            data: this.data.userInfo
+          })
           // 绑定微信
           this.wxBindPhone()
           wx.switchTab({
@@ -111,6 +142,9 @@ Page({
       UserApi.wxBind(params).then(res=>{})
     })
   },
+  onLoad(options){
+    this.data.userInfo = JSON.parse(options.userInfo)
+  },
   /**
    * 生命周期函数--监听页面显示
    */

pages/setPassword/setPassword.wxml

@@ -5,13 +5,17 @@
     <view class="form-item">
       <view class="text-label">密码</view>
       <view class="text-value">
-        <input name="newPassword" bindblur="bindBlurInput" value="{{newPassword}}" type="password" placeholder="请输入密码" />
+        <input name="newPassword" bindblur="bindBlurInput" value="{{newPassword}}" type="{{type}}" placeholder="请输入密码" />
+        <image src="../../assets/images/show.png" class="show" wx:if="{{!show}}" bindtap="showPassword"></image>
+        <image src="../../assets/images/none.png" class="show" wx:if="{{show}}" bindtap="showPassword"></image>
       </view>
     </view>
     <view class="form-item">
       <view class="text-label">确认密码</view>
       <view class="text-value">
-        <input name="verifyPassword" bindblur="bindBlurInput" value="{{verifyPassword}}" type="password" placeholder="请确认密码" />
+        <input name="verifyPassword" bindblur="bindBlurInput" value="{{verifyPassword}}" type="{{typeVerify}}" placeholder="请确认密码" />
+        <image src="../../assets/images/show.png" class="show" wx:if="{{!showVerify}}" bindtap="showPasswordVerify"></image>
+        <image src="../../assets/images/none.png" class="show" wx:if="{{showVerify}}" bindtap="showPasswordVerify"></image>
       </view>
     </view>
     <view class="btn-area">

pages/setPassword/setPassword.wxss

@@ -7,6 +7,9 @@ page {
 .form-box{
   transform: translateY(100%);
 }
+.text-value{
+  position: relative;
+}
 .set-password{
   display: block;
   font-size: 16px;
@@ -16,3 +19,11 @@ page {
   margin-bottom: 20px;
   letter-spacing: 0.5px;
 }
+.show{
+  width: 15px;
+  height: 15px;
+  position: absolute;
+  right: 10px;
+  top: 8px;
+  z-index: 9;
+}

pages/upDateInfo/upDateInfo.js

@@ -13,59 +13,54 @@ Page({
       oldpassword: '', // 旧密码
       password: '', // 新密码
       confirmpassword: '', // 确认新密码
-      // count: 60, // 倒计时秒
       rsaPublicKey: '', // 公钥
     },
-    // showGetCaptcha: true
+    showOld: true,
+    typeOld: 'password',
+    show: true, // 默认显示的是闭眼睛
+    showVerify: true,
+    type: 'password',
+    typeVerify: 'password'
+  },
+  showPasswordOld(){
+    if(this.data.showOld){ // 显示睁开眼睛的时候 type="text"
+      this.setData({
+        typeOld: 'text',
+        showOld: false
+      })
+    }else{
+      this.setData({
+        typeOld: 'password',
+        showOld: true
+      })
+    }
+  },
+  showPassword(){
+    if(this.data.show){ // 显示睁开眼睛的时候 type="text"
+      this.setData({
+        type: 'text',
+        show: false
+      })
+    }else{
+      this.setData({
+        type: 'password',
+        show: true
+      })
+    }
+  },
+  showPasswordVerify(){
+    if(this.data.showVerify){ // 显示睁开眼睛的时候 type="text"
+      this.setData({
+        typeVerify: 'text',
+        showVerify: false
+      })
+    }else{
+      this.setData({
+        typeVerify: 'password',
+        showVerify: true
+      })
+    }
   },
-
-  // // 获取验证码
-  // getVerCode() {
-  //   if (/^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/.test(this.data.form.phone)) {
-  //     UserApi.sendCode({
-  //       phone: this.data.form.phone
-  //     }).then(res => {
-  //       // 获取成功，倒计时 start
-  //       if (res.success) {
-  //         this.countDown()
-  //       } else {
-  //         wx.showToast({
-  //           title: '获取验证码失败',
-  //           icon: 'error',
-  //           duration: 2000
-  //         })
-  //       }
-  //     })
-  //   } else {
-  //     wx.showToast({
-  //       title: '请输入正确的手机号',
-  //       icon: 'none',
-  //       duration: 2000
-  //     })
-  //   }
-  // },
-  // 倒计时
-  // countDown() {
-  //   if (countdown === 0) {
-  //     this.setData({
-  //       showGetCaptcha: true
-  //     })
-  //     countdown = 60;
-  //     return;
-  //   } else {
-  //     this.setData({
-  //       showGetCaptcha: false
-  //     })
-  //     countdown--;
-  //     this.setData({
-  //       count: countdown
-  //     })
-  //   }
-  //   setTimeout(() => {
-  //     this.countDown()
-  //   }, 1000)
-  //   // 倒计时 end
-  // },
   // 提交
   formSubmit(e) {
     if(!e.detail.value.oldpassword){

pages/upDateInfo/upDateInfo.wxml

@@ -4,27 +4,25 @@
     <view class="form-item">
       <view class="text-label">旧密码</view>
       <view class="text-value">
-        <input name="oldpassword" value="{{oldpassword}}" type="password" placeholder="请输入旧密码" />
+        <input name="oldpassword" value="{{oldpassword}}" type="{{typeOld}}" placeholder="请输入旧密码" />
+        <image src="../../assets/images/show.png" class="show" wx:if="{{!showOld}}" bindtap="showPasswordOld"></image>
+        <image src="../../assets/images/none.png" class="show" wx:if="{{showOld}}" bindtap="showPasswordOld"></image>
       </view>
     </view>
-    <!-- <view class="form-item">
-      <view class="text-label">验证码</view>
-      <view class="text-value">
-        <input name="verifyCode" value="{{verifyCode}}" placeholder="请输入验证码" />
-      </view>
-      <view wx:if="{{showGetCaptcha}}" class="captcha" bindtap="getVerCode">获取验证码</view>
-      <view wx:else="{{showGetCaptcha}}" class="captcha count">{{count}}</view>
-    </view> -->
     <view class="form-item">
       <view class="text-label">新密码</view>
       <view class="text-value">
-        <input name="password" value="{{password}}" type="password" placeholder="请输入新密码" />
+        <input name="password" value="{{password}}" type="{{type}}" placeholder="请输入新密码" />
+        <image src="../../assets/images/show.png" class="show" wx:if="{{!show}}" bindtap="showPassword"></image>
+        <image src="../../assets/images/none.png" class="show" wx:if="{{show}}" bindtap="showPassword"></image>
       </view>
     </view>
     <view class="form-item">
       <view class="text-label">确认新密码</view>
       <view class="text-value">
-        <input name="confirmpassword" value="{{confirmpassword}}" type="password" placeholder="请确认新密码" />
+        <input name="confirmpassword" value="{{confirmpassword}}" type="{{typeVerify}}" placeholder="请确认新密码" />
+        <image src="../../assets/images/show.png" class="show" wx:if="{{!showVerify}}" bindtap="showPasswordVerify"></image>
+        <image src="../../assets/images/none.png" class="show" wx:if="{{showVerify}}" bindtap="showPasswordVerify"></image>
       </view>
     </view>
     <view class="btn-area">

pages/upDateInfo/upDateInfo.wxss

@@ -5,3 +5,14 @@
 .text-label {
   width: 80px !important;
 }
+.text-value{
+  position: relative;
+}
+.show{
+  width: 15px;
+  height: 15px;
+  position: absolute;
+  right: 10px;
+  top: 8px;
+  z-index: 9;
+}