From 2ddb3c44bd43f8e67f95fdaff21925882c6e5234 Mon Sep 17 00:00:00 2001
From: "Fredrick W. Warren" <fred.warren@gmail.com>
Date: Fri, 12 Feb 2021 15:30:28 -0800
Subject: [PATCH] 16.08 Login - Reuse the Register Component

---
 .../Auth/{Register.vue => LoginRegister.vue}       | 12 ++++++++++--
 src/pages/PageAuth.vue                             | 14 ++++++++++----
 2 files changed, 20 insertions(+), 6 deletions(-)
 rename src/components/Auth/{Register.vue => LoginRegister.vue} (90%)

diff --git a/src/components/Auth/Register.vue b/src/components/Auth/LoginRegister.vue
similarity index 90%
rename from src/components/Auth/Register.vue
rename to src/components/Auth/LoginRegister.vue
index fa4ece0..03b04a4 100644
--- a/src/components/Auth/Register.vue
+++ b/src/components/Auth/LoginRegister.vue
@@ -5,7 +5,7 @@
       <template v-slot:avatar>
         <q-icon name="account_circle" color="primary" />
       </template>
-      Register to access your Todos anywhere
+      {{ title }}
       </q-banner>
     </div>
     <div class="row q-mb-md">
@@ -46,6 +46,10 @@
 
 <script>
 export default {
+  props: [
+    'tab',
+    'title'
+  ],
   data () {
     return {
       formData: {
@@ -65,7 +69,11 @@ export default {
       this.$refs.email.validate()
       this.$refs.password.validate()
       if (!this.$refs.email.hasError && !this.$refs.password.hasError) {
-        console.log('Bang Bang')
+        if (this.tab === 'login') {
+          console.log('login')
+        } else {
+          console.log('register')
+        }
       }
     }
   }
diff --git a/src/pages/PageAuth.vue b/src/pages/PageAuth.vue
index 5956617..8358cb7 100644
--- a/src/pages/PageAuth.vue
+++ b/src/pages/PageAuth.vue
@@ -19,11 +19,17 @@
       <q-tab-panels v-model="tab" animated>
         <q-tab-panel name="login">
           <div class="text-h6">Login</div>
-          Lorem ipsum dolor sit amet consectetur adipisicing elit.
+            <login-register
+              :tab="tab"
+              title="Please enter your email and passoword"
+          />
         </q-tab-panel>
 
         <q-tab-panel name="register">
-          <register />
+          <login-register
+          :tab="tab"
+          title="Register to access your Todos anywhere"
+          />
         </q-tab-panel>
       </q-tab-panels>
     </q-card>
@@ -31,7 +37,7 @@
 </template>
 
 <script>
-import register from 'components/Auth/Register.vue'
+import loginRegister from 'components/Auth/LoginRegister.vue'
 
 export default {
   name: 'Auth',
@@ -41,7 +47,7 @@ export default {
     }
   },
   components: {
-    register
+    loginRegister
   }
 }
 </script>