add make login page functional using federation layer and enforce login in router

frontend/src/views/Login.vue

@@ -24,7 +24,9 @@
                                             <label class="form-label">Username</label>
                                             <input class="form-control form-control-lg" type="text"
                                                    name="username" placeholder="Enter your username"
+                                                   :class="errors.username?['is-invalid']:[]"
                                                    v-model="username"/>
+                                            <div class="invalid-feedback">{{ errors.username }}</div>
                                         </div>
                                         <div class="mb-3">
                                             <label class="form-label">Password</label>
@@ -65,6 +67,7 @@
 </template>
 
 <script>
+import {mapActions, mapMutations} from 'vuex';
 import router from "@/router";
 
 export default {
@@ -74,15 +77,15 @@ export default {
             msg: 'Welcome to ' + location.hostname,
             username: '',
             password: '',
-            remember: false
+            remember: false,
+            errors: {
+                username: '',
+            }
         }
     },
     methods: {
-        setRemember(remember) {
-        },
-        login(data) {
-            return true;
-        },
+        ...mapActions(['login']),
+        ...mapMutations(['setRemember']),
         async do_login(e) {
             e.preventDefault();
             if (await this.login({username: this.username, password: this.password, remember: this.remember})) {
@@ -92,11 +95,24 @@ export default {
                     await router.push({path: '/'});
                 }
             } else {
+                if (!this.username.includes('@')) {
+                    this.errors.username = 'Username should be in the form of user@domain';
+                }
                 this.msg = 'Invalid username or password';
             }
 
         },
 
+    },
+    mounted() {
+        if (this.$route.query.redirect) {
+            this.msg = 'You must be logged in to access that page';
+        }
+        const user = localStorage.getItem('user');
+        if (user) {
+            this.username = user;
+        }
+
     }
 }
 </script>