fix: #319 only allow confirm button when all the fields are filled in

This commit is contained in:
Cindy Chang
2024-08-14 10:44:04 +08:00
parent df341c26ab
commit 2ec7029887

View File

@@ -265,6 +265,10 @@ export default defineComponent({
await router.push('/account-admin');
break;
case MODAL_ACCT_EDIT:
await checkAccountIsUnique();
if(!isAccountUnique.value) {
return;
}
// 要注意的是舊的username跟新的username可以是不同的
await acctMgmtStore.editAccount(
currentViewingUser.value.username, {
@@ -305,31 +309,19 @@ export default defineComponent({
}
}
onMounted(() => {
watch(
[inputUserAccount, inputName, inputPwd, inputConfirmPwd, isPwdMatched],
([newAccount, newName, newPwd, newConfirmPwd, newPwdMatched]) => {
if (shouldDisalbeConfirmButton(newAccount, newName, newPwd, newConfirmPwd, newPwdMatched)) {
isConfirmDisabled.value = true;
} else {
isConfirmDisabled.value = false;
}
},
{ immediate: true }
);
watch(
[inputPwd, inputConfirmPwd],
([newPwd, newConfirmPwd]) => {
isPwdMatched.value = newPwd === newConfirmPwd && newPwd.length;
isPwdLengthValid.value = newPwd.length >= PWD_VALID_LENGTH && newConfirmPwd.length >= PWD_VALID_LENGTH;
// 只要[確認密碼]或[密碼]有更動confirm 按鈕就可點選
if ((newPwd || newConfirmPwd) && inputUserAccount.length && inputName.length) {
isConfirmDisabled.value = false;
}
watch(
[inputPwd, inputConfirmPwd, inputUserAccount, inputName],
([newPwd, newConfirmPwd, newAccount, newName]) => {
isPwdMatched.value = newPwd === newConfirmPwd && newPwd.length;
isPwdLengthValid.value = newPwd.length >= PWD_VALID_LENGTH && newConfirmPwd.length >= PWD_VALID_LENGTH;
// 只要[確認密碼]或[密碼]欄位有更動且所有欄位都不是空的confirm 按鈕就可點選
if (newPwd.length > 0 && newConfirmPwd.length > 0 && newAccount.length > 0 && newName.length > 0) {
isConfirmDisabled.value = false;
} else {
isConfirmDisabled.value = true;
}
)
});
}
);
return {
isConfirmDisabled,