From a3daef72033c734f502bc650af0bdc2e3f9d26e6 Mon Sep 17 00:00:00 2001
From: weichien00 <weichien00@gmail.com>
Date: Fri, 30 Jul 2021 14:47:05 +0800
Subject: [PATCH] add: vue emailVerification component.

---
 .../elements/EmailVerificationComponent.vue   | 77 +++++++++++++++++++
 1 file changed, 77 insertions(+)
 create mode 100644 resources/assets/vue/components/accounts/elements/EmailVerificationComponent.vue

diff --git a/resources/assets/vue/components/accounts/elements/EmailVerificationComponent.vue b/resources/assets/vue/components/accounts/elements/EmailVerificationComponent.vue
new file mode 100644
index 00000000..5169f3b0
--- /dev/null
+++ b/resources/assets/vue/components/accounts/elements/EmailVerificationComponent.vue
@@ -0,0 +1,77 @@
+<template>
+    <div class="row h-100 align-items-center justify-content-center text-center">
+        <div class="col">
+            <loading-component style="height: 200px; top: 0;" key="1" color="white" v-show="loading"></loading-component>
+            <div class="row" v-show="!loading">
+                <div class="col">
+                    <div class="row justify-content-center m-b-20">
+                        <div class="col-4">
+                            <i class="fa fs-80 text-white" :class="[{'fa-check-circle': !error}, {'fa-times': error}]"></i>
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="col">
+                            <div class="font-heading text-white fs-20 all-caps bold lh-25">Email {{error ? 'Failed Verification': 'Verified'}}</div>
+                            <div class="font-heading text-white fs-12 all-caps m-b-10 lh-25">Your Email address was{{ error ? 'n\'t' : '' }} successfully verified</div>
+                            <div class="font-heading text-white fs-12 all-caps m-b-20 lh-25">{{ error }}</div>
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="col">
+                            <a class="btn btn p-t-10 p-b-10 btn-primary bg-master-darker b-rad-none" :href="route('login')">
+                                <div class="row align-items-center">
+                                    <div class="col-auto p-r-10">
+                                        <i class="fa fa-angle-left fs-16" style="margin-top: 1px;"></i>
+                                    </div>
+                                    <div class="col p-l-5">
+                                        Back to login
+                                    </div>
+                                </div>
+                            </a>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+        </div>
+    </div>
+
+</template>
+<script>
+    export default {
+        props: {
+            token:{
+                type: String,
+                required: false
+            }
+        },
+        data(){
+            return {
+                loading: true,
+                error: '',
+                parameters: {
+                    token: this.token
+                }
+            }
+        },
+        created(){
+            this.submit(this.route('api.account.email.verify'), 'post', 'emailVerificationSection', false, false);
+        },
+        methods: {
+            successHandler(){
+
+                this.loading = false
+
+                this.error = '';
+
+                //this.$store.getters.isAuthenticated ? window.location.href = this.route('dashboard'): this.loading = false;;
+
+            },
+            errorHandler(error){
+                this.loading = false;
+                this.error = error.message;
+            }
+        }
+    }
+
+</script>
\ No newline at end of file