fix: auth form

kirklin · Feb 10, 2024 · 4c6d14b · 4c6d14b
1 parent 2e45be6
commit 4c6d14b
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 6 deletions.
diff --git a/apps/admin/autoResolver/components.d.ts b/apps/admin/autoResolver/components.d.ts
@@ -17,6 +17,7 @@ declare module 'vue' {
     NBreadcrumbItem: typeof import('@celeris/ca-components')['NBreadcrumbItem']
     NButton: typeof import('@celeris/ca-components')['NButton']
     NCard: typeof import('@celeris/ca-components')['NCard']
+    NCheckbox: typeof import('@celeris/ca-components')['NCheckbox']
     NCol: typeof import('@celeris/ca-components')['NCol']
     NCollapse: typeof import('@celeris/ca-components')['NCollapse']
     NCollapseItem: typeof import('@celeris/ca-components')['NCollapseItem']
@@ -29,6 +30,8 @@ declare module 'vue' {
     NDropdown: typeof import('@celeris/ca-components')['NDropdown']
     NEl: typeof import('@celeris/ca-components')['NEl']
     NEmpty: typeof import('@celeris/ca-components')['NEmpty']
+    NForm: typeof import('@celeris/ca-components')['NForm']
+    NFormItem: typeof import('@celeris/ca-components')['NFormItem']
     NGlobalStyle: typeof import('@celeris/ca-components')['NGlobalStyle']
     NGrid: typeof import('@celeris/ca-components')['NGrid']
     NGridItem: typeof import('@celeris/ca-components')['NGridItem']

diff --git a/apps/admin/src/pages/login/components/AuthForm/components/ForgotPassword.vue b/apps/admin/src/pages/login/components/AuthForm/components/ForgotPassword.vue
@@ -16,6 +16,7 @@ import type { ForgotPasswordFromType } from "~/pages/login/types";
 const { t } = useI18n();
 const formRef = ref<FormInst | null>(null);
 const message = useMessage();
+const { loading, setLoading } = useLoading(false);
 const model = ref<ForgotPasswordFromType>({
   phoneNumber: "",
 });
@@ -36,7 +37,9 @@ const rules: FormRules = {
 
 function forgotPassword(e: Event) {
   e.preventDefault();
+  setLoading(true);
   formRef.value?.validate((errors: Array<FormValidationError> | undefined) => {
+    setLoading(false);
     if (!errors) {
       message.success(t("page.login.form.resetLinkSentMessage"));
     }
@@ -56,7 +59,7 @@ function forgotPassword(e: Event) {
     </NFormItem>
     <div class="flex flex-col items-end gap-6">
       <div class="w-full">
-        <NButton type="primary" class="!w-full" size="large" @click="forgotPassword">
+        <NButton type="primary" :loading="loading" class="!w-full" size="large" @click="forgotPassword">
           {{ t('page.login.form.sendResetLinkButton') }}
         </NButton>
       </div>

diff --git a/apps/admin/src/pages/login/components/AuthForm/components/SignIn.vue b/apps/admin/src/pages/login/components/AuthForm/components/SignIn.vue
@@ -34,10 +34,7 @@ async function signIn(e: Event) {
   e.preventDefault();
   try {
     // Validate the login form
-    const errors = await loginFormRef.value?.validate();
-    if (errors) {
-      return;
-    }
+    await loginFormRef.value?.validate();
 
     loading.value = true;
 

diff --git a/apps/admin/src/pages/login/components/AuthForm/components/SignUp.vue b/apps/admin/src/pages/login/components/AuthForm/components/SignUp.vue
@@ -26,6 +26,7 @@ const model = ref<SignUpFromType>({
   confirmPassword: "123456",
 });
 const message = useMessage();
+const loading = ref<boolean>(false);
 const notification = useNotification();
 const rules: FormRules = {
   username: [
@@ -60,6 +61,7 @@ const rules: FormRules = {
 
 function signUp(e: Event) {
   e.preventDefault();
+  loading.value = true;
   formRef.value?.validate(async (errors: Array<FormValidationError> | undefined) => {
     if (!errors) {
       // Login the user
@@ -72,12 +74,14 @@ function signUp(e: Event) {
         errorMessageMode: "none",
       });
       if (userInfo) {
+        loading.value = false;
         notification.success({
           title: t("page.login.notification.loginSuccessMessage"),
           content: t("page.login.notification.welcomeBackMessage", { username: userInfo.fullName }),
         });
       }
     } else {
+      loading.value = false;
       message.error("Invalid credentials");
     }
   });
@@ -112,7 +116,7 @@ function signUp(e: Event) {
     </NFormItem>
     <div class="flex flex-col items-end">
       <div class="w-full">
-        <NButton type="primary" class="!w-full" size="large" @click="signUp">
+        <NButton type="primary" :loading="loading" class="!w-full" size="large" @click="signUp">
           {{ t('page.login.form.registerButton') }}
         </NButton>
       </div>