Initial commit

layouts/unverified.vue

@@ -0,0 +1,58 @@
+<template>
+  <v-app>
+    <v-main>
+      <v-container fill-height>
+        <v-card max-width="500px" class="mx-auto">
+          <v-card-title>
+            Verifiziere deine E-Mail-Adresse!
+          </v-card-title>
+          <v-card-text>
+            <p>Wir haben eine E-Mail an deine E-Mail-Adresse <strong>{{ userEmail }}</strong> geschickt.
+            Folge dem Link in der E-Mail, um dein Konto zu verifizieren.</p>
+            <p>Solltest du keine E-Mail erhalten haben, wirf einen Blick in deinen Spam-Ordner.</p>
+          </v-card-text>
+          <v-card-actions>
+            <v-spacer></v-spacer>
+            <v-btn depressed color="primary" :loading="loading" @click="sendVerificationEmail">E-Mail erneut senden</v-btn>
+          </v-card-actions>
+        </v-card>
+      </v-container>
+    </v-main>
+    <ToastComponent />
+  </v-app>
+</template>
+
+<script>
+import { sendEmailVerification } from 'firebase/auth'
+
+export default {
+  name: 'UnverifiedLayout',
+  layout: 'unverified',
+  data () {
+    return {
+      loading: false
+    }
+  },
+  computed: {
+    userEmail () {
+      return this.$auth.currentUser.email
+    }
+  },
+  methods: {
+    sendVerificationEmail () {
+      this.loading = true
+
+      sendEmailVerification(this.$auth.currentUser)
+      .then(() => {
+        // Email verification sent!
+        this.loading = false
+        this.$toast({
+          content: 'Erfolg! Folge dem Link in der E-Mail, die wir dir gerade geschickt haben, um deine Registrierung abzuschließen!',
+          color: 'success',
+          timeout: -1
+        })
+      })
+    }
+  }
+}
+</script>