user account view functionality partially done

src/webapp/main/src/App.vue

@@ -178,11 +178,6 @@ export default {
         }
     },
     created () {
-        // if ( window.webpage.engine.trident ) {
-        //     alert( 'Welcome! We have detected that you are still using Internet Explorer or a similar browser. As a modern webapp, libreevent does NOT officially support Internet Explorer. If you run into problems whilst using this webapp, please switch to a modern browser like Firefox.' )
-        // } else if ( window.webpage.engine.presto ) {
-        //     alert( 'Welcome! We have detected that you are a very old version of Opera or related browser. As a modern webapp, libreevent does only support modern browsers. If you run into issues whilst using this webapp, please switch to a modern browser, like Firefox.' )
-        // }
         this.theme = localStorage.getItem( 'theme' ) ?? '';
         if ( window.matchMedia( '(prefers-color-scheme: dark)' ).matches || this.theme === '☼' ) {
             document.documentElement.classList.add( 'dark' );
@@ -191,6 +186,21 @@ export default {
             document.documentElement.classList.add( 'light' );
             this.theme = '☽';
         }
+        console.log( `
+                _ _ _                                   _   
+                | (_) |                                 | |  
+                | |_| |__  _ __ ___  _____   _____ _ __ | |_ 
+                | | | '_ \\| '__/ _ \\/ _ \\ \\ / / _ \\ '_ \\| __|
+                | | | |_) | | |  __/  __/\\ V /  __/ | | | |_ 
+                |_|_|_.__/|_|  \\___|\\___| \\_/ \\___|_| |_|\\__|
+
+You opened the developer tools. Know some coding? Want to help make this software even better?
+Then come and join the development team of libreevent, the free and open source event management
+solution. Your help is greatly appreciated by the team as well as all its users!
+
+=> https://github.com/simplePCBuilding/libreevent
+=> https://libreevent.janishutz.com/
+        ` );
     }
 }
 </script>

src/webapp/main/src/views/user/AccountView.vue

@@ -2,7 +2,8 @@
     <div>
         <h1>Account</h1>
         <p>Welcome, {{ accountData.first_name }} {{ accountData.name }}!</p>
-        <table>
+        <button @click="resendMailConfirmation()" v-if="!accountData.mail_confirmed">Resend confirmation email</button>
+        <table class="userData">
             <tr>
                 <td>
                     Email
@@ -19,8 +20,26 @@
                     {{ accountData.first_name }} {{ accountData.name }}
                 </td>
             </tr>
+            <tr>
+                <td>
+                    Email notifications
+                </td>
+                <td>
+                    <div v-if="accountData.marketing">Enabled</div>
+                    <div v-else>Disabled</div>
+                </td>
+            </tr>
+            <tr>
+                <td>
+                    Two-Factor Authentication
+                </td>
+                <td>
+                    <div v-if="accountData.two_fa == 'enhanced'">Enhanced</div>
+                    <div v-else-if="accountData.two_fa == 'standard'">Standard</div>
+                    <div v-else>Disabled</div>
+                </td>
+            </tr>
         </table>
-        <button>Resend confirmation email</button>
         <notifications ref="notification" location="topright" size="bigger"></notifications>
         <popups ref="popups" size="big" @data="data => { savePwd( data ) }"></popups>
     </div>
@@ -33,6 +52,12 @@
     }
 </style>
 
+<style scoped>
+    .userData {
+        width: 50%;
+    }
+</style>
+
 <script>
     import { useUserStore } from '@/stores/userStore';
     import { mapStores } from 'pinia';
@@ -52,6 +77,17 @@
         computed: {
             ...mapStores( useUserStore )
         },
+        methods: {
+            resendMailConfirmation() {
+                fetch( localStorage.getItem( 'url' ) + '/user/resendEmail' ).then( res => {
+                    if ( res.status === 200 ) {
+                        this.$refs.notification.createNotification( 'Confirmation email sent.', 5, 'ok', 'normal' );
+                    } else {
+                        this.$refs.notification.createNotification( 'An error occurred whilst sending the confirmation mail. Please retry', 20, 'error', 'normal' );
+                    }
+                } );
+            }
+        },
         created () {
             // TODO: FUTURE Also get all orders of user (using join functions)
             fetch( localStorage.getItem( 'url' ) + '/user/details' ).then( res => {
@@ -59,7 +95,11 @@
                     res.json().then( data => {
                         if ( data.status ) {
                             this.accountData = data.data;
-                            console.log( data );
+                            if ( this.accountData.marketing ) {
+                                this.accountData.marketing = true;
+                            } else {
+                                this.accountData.marketing = false;
+                            }
                             if ( !data.data.mail_confirmed ) {
                                 setTimeout( () => {
                                     this.$refs.notification.createNotification( 'Your account is unverified. Please confirm your email using the link we have sent to your email!', 20, 'info', 'normal' );