로그인 인증 구현

pages/register/index.vue

@@ -11,11 +11,25 @@
         <md-card-content>
           <md-field md-clearable>
             <label for="email">Email</label>
-            <md-input id="email" v-model="form.email" type="email" name="email" autocomplete="email"/>
+            <md-input
+              id="email"
+              v-model="form.email"
+              :disabled="loading"
+              type="email"
+              name="email"
+              autocomplete="email"
+            />
           </md-field>
           <md-field>
             <label for="password">password</label>
-            <md-input id="password" v-model="form.password" type="password" name="password" autocomplete="password" />
+            <md-input
+              id="password"
+              v-model="form.password"
+              :disabled="loading"
+              type="password"
+              name="password"
+              autocomplete="password"
+            />
           </md-field>
         </md-card-content>
 
@@ -28,6 +42,10 @@
           </md-button>
         </md-card-actions>
       </form>
+
+      <md-snackbar :md-active.sync="isAuthenticated">
+        {{ form.email }} was successfully registerd!
+      </md-snackbar>
     </md-card>
   </div>
 </template>
@@ -40,6 +58,21 @@ export default {
       password: ''
     }
   }),
+  computed: {
+    loading () {
+      return this.$store.getters.loading
+    },
+    isAuthenticated () {
+      return this.$store.getters.isAuthenticated
+    }
+  },
+  watch: {
+    isAuthenticated (value) {
+      if (value) {
+        setTimeout(() => this.$router.push('/'), 2000)
+      }
+    }
+  },
   methods: {
     async resisterUser () {
       await this.$store.dispatch('authenticateUser', {

store/index.js

@@ -6,6 +6,7 @@ const createStore = () => {
       headlines: [],
       loading: false,
       category: '',
+      token: '',
       country: 'us'
     },
     mutations: {
@@ -20,6 +21,9 @@ const createStore = () => {
       },
       setCountry (state, country) {
         state.country = country
+      },
+      setToken (state, token) {
+        state.token = token
       }
     },
     actions: {
@@ -36,7 +40,7 @@ const createStore = () => {
             '/register/',
             userPayload
           )
-          console.log(autuUserData)
+          commit('setToken', autuUserData.idToken)
           commit('setLoading', false)
         } catch (error) {
           console.log(error)
@@ -47,7 +51,8 @@ const createStore = () => {
       headlines: state => state.headlines,
       loading: state => state.loading,
       category: state => state.category,
-      country: state => state.country
+      country: state => state.country,
+      isAuthenticated: state => !!state.token
     }
   })
 }