From 2d97142378ccfa2fb9dac76fcd1b1e85d847339a Mon Sep 17 00:00:00 2001
From: Amir <amirhassan.hamzan@gmail.com>
Date: Wed, 26 Oct 2022 11:52:36 +0800
Subject: [PATCH] Form submit.prevent in login

---
 src/components/authentication/TheLogin.vue | 115 +++++++++++----------
 1 file changed, 59 insertions(+), 56 deletions(-)

diff --git a/src/components/authentication/TheLogin.vue b/src/components/authentication/TheLogin.vue
index d539d5e..2d1b7b5 100644
--- a/src/components/authentication/TheLogin.vue
+++ b/src/components/authentication/TheLogin.vue
@@ -36,65 +36,68 @@
           >Daftar sekarang!</router-link
         >
       </div>
-      <div class="px-0 text-center md:px-8">
-        <div class="field grid">
-          <label
-            for="firstname3"
-            class="justify-content-end"
-            style="width: 170px"
-            >Username</label
-          >
-          <div class="col">
-            <span class="p-input-icon-right">
-              <i class="pi pi-user" />
-              <InputText
-                class="mb-2"
-                v-model="form.username"
-                type="text"
-                required
-              ></InputText>
-            </span>
+      <form @submit.prevent="submit">
+        <div class="px-0 text-center md:px-8">
+          <div class="field grid">
+            <label
+              for="firstname3"
+              class="justify-content-end"
+              style="width: 170px"
+              >Username</label
+            >
+            <div class="col">
+              <span class="p-input-icon-right">
+                <i class="pi pi-user" />
+                <InputText
+                  class="mb-2"
+                  v-model="form.username"
+                  type="text"
+                  required
+                ></InputText>
+              </span>
+            </div>
+            <InlineMessage class="flex-auto" v-if="v$.form.username.$error"
+              >Username diperlukan</InlineMessage
+            >
           </div>
-          <InlineMessage class="flex-auto" v-if="v$.form.username.$error"
-            >Username diperlukan</InlineMessage
-          >
-        </div>
-        <div class="field grid">
-          <label
-            for="firstname3"
-            class="justify-content-end"
-            style="width: 170px"
-            >Kata Laluan</label
-          >
-          <div class="col">
-            <span class="p-input-icon-left">
-              <i class="pi pi-user" />
-              <Password
-                class="mb-2"
-                v-model="form.password"
-                toggleMask
-                :feedback="false"
-              />
-            </span>
+          <div class="field grid">
+            <label
+              for="firstname3"
+              class="justify-content-end"
+              style="width: 170px"
+              >Kata Laluan</label
+            >
+            <div class="col">
+              <span class="p-input-icon-left">
+                <i class="pi pi-user" />
+                <Password
+                  class="mb-2"
+                  v-model="form.password"
+                  toggleMask
+                  :feedback="false"
+                />
+              </span>
+            </div>
+            <InlineMessage class="flex-auto" v-if="v$.form.password.$error"
+              >Kata laluan diperlukan</InlineMessage
+            >
+          </div>
+          <div class="">
+            <Button
+              @click="doLogin()"
+              type="submit"
+              class="p-button-sm"
+              label="Log Masuk"
+              icon="pi pi-sign-in"
+              :loading="isLoading"
+              iconPos="right"
+            ></Button>
+          </div>
+          <div class="flex justify-content-center mt-4">
+            <terms-and-conditions></terms-and-conditions>
           </div>
-          <InlineMessage class="flex-auto" v-if="v$.form.password.$error"
-            >Kata laluan diperlukan</InlineMessage
-          >
         </div>
-        <div class="">
-          <Button
-            @click="doLogin()"
-            class="p-button-sm"
-            label="Log Masuk"
-            icon="pi pi-sign-in"
-            :loading="isLoading"
-            iconPos="right"
-          ></Button>
-        </div>
-        <div class="flex justify-content-center mt-4">
-          <terms-and-conditions></terms-and-conditions>
-        </div>
-      </div>
+      </form>
     </div>
   </div>
 </template>