瀏覽代碼

feat:add showPwd

Pan 7 年之前
父節點
當前提交
29ec7f8a18
共有 2 個文件被更改,包括 12 次插入2 次删除
  1. 二進制
      favicon.ico
  2. 12 2
      src/views/login/index.vue

二進制
favicon.ico


+ 12 - 2
src/views/login/index.vue

@@ -13,8 +13,9 @@
13 13
         <span class="svg-container">
14 14
           <svg-icon icon-class="password"></svg-icon>
15 15
         </span>
16
-        <el-input name="password" type="password" @keyup.enter.native="handleLogin" v-model="loginForm.password" autoComplete="on"
16
+        <el-input name="password" :type="pwdType" @keyup.enter.native="handleLogin" v-model="loginForm.password" autoComplete="on"
17 17
           placeholder="password"></el-input>
18
+          <span class="show-pwd" @click="showPwd"><svg-icon icon-class="eye" /></span>
18 19
       </el-form-item>
19 20
       <el-form-item>
20 21
         <el-button type="primary" style="width:100%;" :loading="loading" @click.native.prevent="handleLogin">
@@ -58,10 +59,18 @@ export default {
58 59
         username: [{ required: true, trigger: 'blur', validator: validateUsername }],
59 60
         password: [{ required: true, trigger: 'blur', validator: validatePass }]
60 61
       },
61
-      loading: false
62
+      loading: false,
63
+      pwdType: 'password'
62 64
     }
63 65
   },
64 66
   methods: {
67
+    showPwd() {
68
+      if (this.pwdType === 'password') {
69
+        this.pwdType = ''
70
+      } else {
71
+        this.pwdType = 'password'
72
+      }
73
+    },
65 74
     handleLogin() {
66 75
       this.$refs.loginForm.validate(valid => {
67 76
         if (valid) {
@@ -154,6 +163,7 @@ export default {
154 163
       font-size: 16px;
155 164
       color: $dark_gray;
156 165
       cursor: pointer;
166
+      user-select:none;
157 167
     }
158 168
     .thirdparty-button{
159 169
       position: absolute;