feat: show alert when login is success (and extract all thing about login into a LoginPage file)

Author: renanjava

frontend/src/App.vue

@@ -1,34 +1,17 @@
 <script lang="ts">
 import { defineComponent } from 'vue'
-import LoginForm from './components/LoginForm.vue'
-import Error from './components/Error.vue'
+import LoginPage from './pages/LoginPage.vue'
 
 export default defineComponent({
   name: 'App',
   components: {
-    LoginForm,
-    Error,
-  },
-  data() {
-    return {
-      error: false,
-      errorMessage: '',
-    }
-  },
-  methods: {
-    handleResponseForm(responseForm: Record<string, any>) {
-      this.error = !responseForm.successLogin
-      if (this.error) {
-        this.errorMessage = responseForm.errorMessage
-      }
-    },
+    LoginPage,
   },
 })
 </script>
 
 <template>
-  <LoginForm @response-form="handleResponseForm" />
-  <Error v-if="error === true" :message="errorMessage" />
+  <LoginPage />
 </template>
 
 <style scoped></style>

frontend/src/pages/LoginPage.vue

@@ -0,0 +1,38 @@
+<script lang="ts">
+import { defineComponent } from 'vue'
+import LoginForm from '../components/LoginForm.vue'
+import Error from '../components/Error.vue'
+
+export default defineComponent({
+  name: 'LoginPage',
+  components: {
+    LoginForm,
+    Error,
+  },
+  data() {
+    return {
+      error: false,
+      errorMessage: '',
+    }
+  },
+  methods: {
+    handleResponseForm(responseForm: Record<string, any>) {
+      this.error = !responseForm.successLogin
+      if (this.error) {
+        this.errorMessage = responseForm.errorMessage
+      }
+    },
+  },
+})
+</script>
+
+<template>
+  <LoginForm @response-form="handleResponseForm" />
+  <Error v-if="error === true" :message="errorMessage" />
+  <div class="notification is-success" v-else>
+    <button class="delete"></button>
+    Usuário logado com sucesso!
+  </div>
+</template>
+
+<style scoped></style>