From 713edeeffa2656b07926792d7c0c24980c86b6df Mon Sep 17 00:00:00 2001 From: Marco Endrizzi <me00531@surrey.ac.uk> Date: Thu, 1 Apr 2021 10:15:35 -0700 Subject: [PATCH] Added firebase vuex methods to components --- src/App.vue | 12 +++++++++++- src/components/LoginRegister.vue | 23 ++++++++++++++--------- 2 files changed, 25 insertions(+), 10 deletions(-) diff --git a/src/App.vue b/src/App.vue index 3eac306..6491e00 100644 --- a/src/App.vue +++ b/src/App.vue @@ -1,10 +1,20 @@ <template> <router-view /> </template> + <script> import { defineComponent } from 'vue' +import { mapActions } from 'vuex' export default defineComponent({ - name: 'App' + name: 'App', + + methods: { + ...mapActions('firebase', ['handleAuthStateChanged']) + }, + + mounted() { + this.handleAuthStateChanged() + } }) </script> diff --git a/src/components/LoginRegister.vue b/src/components/LoginRegister.vue index 74cd287..a5301eb 100644 --- a/src/components/LoginRegister.vue +++ b/src/components/LoginRegister.vue @@ -1,12 +1,12 @@ <template lang="pug"> q-form.q-pa-lg(@submit='submitForm') - q-input.q-mb-md(v-model='email', type='email', label='Email') + q-input.q-mb-md(v-model='formData.email', type='email', label='Email') template(v-slot:prepend) q-icon(name='email') - q-input.q-mb-md(v-model='username', v-if='tab == "register"', type='username', label='Username') + q-input.q-mb-md(v-model='formData.username', v-if='tab == "register"', type='username', label='Username') template(v-slot:prepend) q-icon(name='person') - q-input.q-mb-md(type='password', v-model='password', label='Password') + q-input.q-mb-md(type='password', v-model='formData.password', label='Password') template(v-slot:prepend) q-icon(name='lock') //- Register only @@ -37,23 +37,28 @@ q-form.q-pa-lg(@submit='submitForm') </template> <script> +import { mapActions } from 'vuex' + export default { props: ['tab'], data() { return { - email: '', - username: '', - password: '' + formData: { + email: '', + username: '', + password: '' + } } }, methods: { submitForm() { if (this.tab == 'login') { - console.log('login the user') + this.loginUser(this.formData) } else { - console.log('register the user') + this.registerUser(this.formData) } - } + }, + ...mapActions('firebase', ['loginUser', 'registerUser']) } } </script> -- GitLab