From 86a20f2982fbd7f766b321fb780b76ba96d14d27 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?J=C3=B6rn-Michael=20Miehe?= <jmm@yavook.de>
Date: Wed, 8 May 2019 21:34:40 +0200
Subject: [PATCH] FormDialog error message (snackbar)

---
 frontend/src/components/forms/FormDialog.vue | 25 +++++++++++++++++++-
 frontend/src/components/forms/Login.vue      |  4 +++-
 frontend/src/components/forms/Register.vue   |  6 ++++-
 3 files changed, 32 insertions(+), 3 deletions(-)

diff --git a/frontend/src/components/forms/FormDialog.vue b/frontend/src/components/forms/FormDialog.vue
index 490aa9e..34c940e 100644
--- a/frontend/src/components/forms/FormDialog.vue
+++ b/frontend/src/components/forms/FormDialog.vue
@@ -5,6 +5,13 @@
     </v-btn>
 
     <v-card>
+      <v-snackbar v-model="hasError" :timeout="6000" absolute top>
+        {{ errorText }}
+        <v-btn fab flat icon @click.native="hasError = false">
+          <v-icon>close</v-icon>
+        </v-btn>
+      </v-snackbar>
+
       <v-form
         ref="form"
         v-model="valid"
@@ -36,7 +43,9 @@ export default {
   name: 'FormDialog',
   data: () => ({
     dialog: false,
-    valid: true
+    valid: true,
+    hasError: false,
+    errorText: ''
   }),
 
   props: {
@@ -48,6 +57,20 @@ export default {
       if (this.$refs.form.validate()) {
         this.$emit('confirm')
       }
+    },
+
+    showError(text) {
+      let actually = () => {
+        this.hasError = true
+        this.errorText = text
+      }
+
+      if (this.hasError) {
+        this.hasError = false
+        window.setTimeout(actually, 100)
+      } else {
+        actually()
+      }
     }
   },
 
diff --git a/frontend/src/components/forms/Login.vue b/frontend/src/components/forms/Login.vue
index 3ced5fc..c1fd89d 100644
--- a/frontend/src/components/forms/Login.vue
+++ b/frontend/src/components/forms/Login.vue
@@ -1,5 +1,5 @@
 <template>
-  <FormDialog buttonText="Login" @confirm="doLogin">
+  <FormDialog ref="main" buttonText="Login" @confirm="doLogin">
     <v-card-title class="headline">
       Log In
     </v-card-title>
@@ -56,6 +56,8 @@ export default {
             let cookie_data = JSON.parse(response.data.message)
             Cookies.set('session', cookie_data.value, cookie_data.properties)
             this.$router.push('about')
+          } else {
+            this.$refs.main.showError(response.data.message)
           }
         })
     }
diff --git a/frontend/src/components/forms/Register.vue b/frontend/src/components/forms/Register.vue
index 8982dc0..a702c34 100644
--- a/frontend/src/components/forms/Register.vue
+++ b/frontend/src/components/forms/Register.vue
@@ -1,5 +1,5 @@
 <template>
-  <FormDialog buttonText="Register" @confirm="doRegister">
+  <FormDialog ref="main" buttonText="Register" @confirm="doRegister">
     <v-card-title class="headline">
       Register
     </v-card-title>
@@ -77,6 +77,10 @@ export default {
         .then(response => {
           // this.$refs.form.reset()
           console.log('register', response.data)
+          if (response.data.success) {
+          } else {
+            this.$refs.main.showError(response.data.message)
+          }
         })
     }
   }