Merge branch 'pincode-view' into 'main'

Pincode view

See merge request !17

src/router/index.js

@@ -4,7 +4,7 @@ import LoginView from '../views/LoginView.vue'
 import SelectProfileView from '../views/SelectProfileView.vue'
 import ProfileCreationView from '../views/ProfileCreationView.vue'
 import RegisterAccountView from '../views/RegisterAccountView.vue'
-
+import PinCodeView from "@/views/PinCodeView.vue";
 import FridgeView from "@/views/FridgeView.vue";
 
 
@@ -35,11 +35,17 @@ const router = createRouter({
       path: '/registerAccount',
       name: 'registerAccount',
       component: RegisterAccountView
-    },{
+    },
+    {
+      path: '/pincode',
+      name: 'pincode',
+      component: PinCodeView
+    },
+    {
       path: '/myFridge',
       name: 'myFridge',
       component: FridgeView
-    },
+    }
   ]
 })
 

src/util/API.js

@@ -72,7 +72,11 @@ export const API = {
     })
       .then((response) => {
           authStore.setProfile(response.data)
+          if (!response.data.restricted) {
+              router.push('pincode')
+          } else {
               router.push("/")
+          }
 
       })
       .catch(() => {

src/views/PinCodeView.vue

+<script>
+import router from '@/router/index.js';
+
+export default {
+    methods: {
+        sendToHomePage() {
+            router.push("/");
+        }
+    }
+}
+</script>
+
+<template>
+    <main>
+        <h1>PIN</h1>
+        <div class="pincode-container">
+            <input id="pincode-field" type="tel" maxlength="4" placeholder="0000"/>
+            <button id="pincode-button" type="button" @click="sendToHomePage">OK</button>
+        </div>
+    </main>
+</template>
+
+<style scoped lang="scss">
+h1 {
+    font-size: 50px;
+}
+main {
+    padding: 50px 10px;
+    text-align: center;
+}
+
+.pincode-container {
+    width: 100%;
+    display: flex;
+    justify-content: center;
+    padding: 10px;
+    input {
+        border-radius: 0;
+        border: 1px solid black;
+        height: 50px;
+        width: 100px;
+        margin: 0 5px;
+        font-size: 38px;
+        padding: 5px;
+    }
+}
+
+
+button {
+    border-radius: 0;
+    border: 1px solid black;
+    width: 50px;
+}
+</style>
\ No newline at end of file