fix: improve the lock-screen password validation logic (#4324)

* fix: after entering the password correctly, the verification still shows' failed ', resulting in the inability to enter the system

* chore: update

---------

Co-authored-by: zyy <532612154@qq.com>

packages/effects/layouts/src/widgets/lock-screen/lock-screen.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { computed, reactive, ref, watchEffect } from 'vue';
+import { computed, reactive, ref } from 'vue';
 
 import { LockKeyhole } from '@vben/icons';
 import { $t, useI18n } from '@vben/locales';
@@ -36,7 +36,6 @@ const minute = useDateFormat(now, 'mm');
 const date = useDateFormat(now, 'YYYY-MM-DD dddd', { locales: locale.value });
 
 const showUnlockForm = ref(false);
-const validPass = ref(true);
 const { lockScreenPassword } = storeToRefs(lockStore);
 
 const formState = reactive({
@@ -44,15 +43,14 @@ const formState = reactive({
   submitted: false,
 });
 
-const passwordStatus = computed(() => {
+const validPass = computed(
-  if (formState.submitted && !formState.password) {
+  () => lockScreenPassword?.value === formState.password,
-    return 'error';
+);
-  }
 
+const passwordStatus = computed(() => {
   if (formState.submitted && !validPass.value) {
     return 'error';
   }
-
   return 'default';
 });
 
@@ -62,21 +60,13 @@ const errorTip = computed(() => {
     : $t('widgets.lockScreen.errorPasswordTip');
 });
 
-watchEffect(() => {
-  if (!formState.password) {
-    validPass.value = true;
-  }
-});
-
 function handleSubmit() {
   formState.submitted = true;
-  if (passwordStatus.value !== 'default') {
+
-    return;
+  if (!validPass.value) {
-  }
-  if (lockScreenPassword?.value !== formState.password) {
-    validPass.value = false;
     return;
   }
+
   lockStore.unlockScreen();
 }