From 10ef16e7dff84da0e9dbb2ec088888429a818c4c Mon Sep 17 00:00:00 2001
From: cshaptx4869 <994774638@qq.com>
Date: Thu, 29 Feb 2024 16:49:44 +0800
Subject: [PATCH] =?UTF-8?q?refactor(login):=20:recycle:=20=E4=BF=AE?=
 =?UTF-8?q?=E6=94=B9login=E5=AF=86=E7=A0=81=E6=A1=86=E5=8A=9F=E8=83=BD?=
 =?UTF-8?q?=E5=AE=9E=E7=8E=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/login/index.vue | 18 +++++-------------
 1 file changed, 5 insertions(+), 13 deletions(-)

diff --git a/src/views/login/index.vue b/src/views/login/index.vue
index fc9e4b9..f8dd267 100644
--- a/src/views/login/index.vue
+++ b/src/views/login/index.vue
@@ -43,7 +43,7 @@
 
         <!-- 密码 -->
         <el-tooltip
-          :disabled="isCapslock === false"
+          :visible="isCapslock"
           content="Caps lock is On"
           placement="right"
         >
@@ -53,20 +53,14 @@
               <el-input
                 v-model="loginData.password"
                 :placeholder="$t('login.password')"
-                :type="passwordVisible === false ? 'password' : 'input'"
+                type="password"
                 name="password"
                 @keyup="checkCapslock"
                 @keyup.enter="handleLogin"
                 size="large"
-                class="flex-1 h-[48px]"
+                class="h-[48px] pr-2"
+                show-password
               />
-              <span
-                class="mr-2 cursor-pointer"
-                @click="passwordVisible = !passwordVisible"
-              >
-                <el-icon v-if="passwordVisible === false"><View /></el-icon>
-                <el-icon v-else><Hide /></el-icon>
-              </span>
             </div>
           </el-form-item>
         </el-tooltip>
@@ -169,7 +163,6 @@ watchEffect(() => {
 
 const loading = ref(false); // 按钮loading
 const isCapslock = ref(false); // 是否大写锁定
-const passwordVisible = ref(false); // 密码是否可见
 const captchaBase64 = ref(); // 验证码图片Base64字符串
 const loginFormRef = ref(ElForm); // 登录表单ref
 
@@ -217,8 +210,7 @@ const loginRules = computed(() => {
  * 检查输入大小写状态
  */
 function checkCapslock(e: any) {
-  const { key } = e;
-  isCapslock.value = key && key.length === 1 && key >= "A" && key <= "Z";
+  isCapslock.value = e.getModifierState("CapsLock");
 }
 
 /**