From 9bcdc0dfc6918b225244d4f89713b6a194e81ff7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jakob=20Gr=C3=B8nhaug?= <jakob@gronha.ug>
Date: Tue, 2 May 2023 12:39:04 +0200
Subject: [PATCH] =?UTF-8?q?all=20funksjonalitet=20og=20filopplasting=20p?=
 =?UTF-8?q?=C3=A5=20plass?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/ProfileCreationView.vue | 42 +++++++++++++++++++++----------
 1 file changed, 29 insertions(+), 13 deletions(-)

diff --git a/src/views/ProfileCreationView.vue b/src/views/ProfileCreationView.vue
index 22cb341..1f0d2c8 100644
--- a/src/views/ProfileCreationView.vue
+++ b/src/views/ProfileCreationView.vue
@@ -1,6 +1,8 @@
 <script>
-import Toggle from '../components/Toggle.vue';
+import { mapStores } from 'pinia';
+import router from '../router'
 import { API } from '../util/API';
+import { useAuthStore } from '../stores/authStore'
 
 export default {
     data: () => {
@@ -14,20 +16,33 @@ export default {
         };
     },
     methods: {
-        submit() {
-            this.profile.isRestricted = this.$refs.toggle.state;
-            API.addProfile(this.profile);
+        async submit() {
+            await API.addProfile(this.profile)
+            .then((profile) => {
+                let id = profile.id;
+
+                let image = document.getElementById("profile_img").files[0];
+                
+                API.uploadProfileImage(image, id)
+                .then((updatedProfile) => {
+                    this.authStore.profile = updatedProfile;                     
+                    router.push("/");
+                });
+
+            })
         },
         updateImg() {
-            let file = document.getElementById("avatar").files[0];
+            let file = document.getElementById("profile_img").files[0];
             let reader = new FileReader();
             reader.onload = function (ev) {
-                document.getElementById("avatar_preview").src = ev.target.result;
+                document.getElementById("profile_img_preview").src = ev.target.result;
             };
             reader.readAsDataURL(file);
         }
     },
-    components: { Toggle }
+    computed: {
+        ...mapStores(useAuthStore)
+    }
 }
 </script>
 
@@ -36,20 +51,21 @@ export default {
         <h1>Ny profil</h1>
 
         <form action="todo" method="post">
-            <label for="avatar" id="avatar_label">
+            <label for="profile_img" id="profile_img_label">
                 <div class="img_hover">
-                    <img :src="image" alt="fjes" id="avatar_preview">
+                    <img :src="image" alt="fjes" id="profile_img_preview">
                     <p class="hover_text">
                         Klikk for å endre
                     </p>
                 </div>
             </label>
-            <input type="file" name="avatar" id="avatar" @change="updateImg">
+            <input @change="updateImg" type="file"
+                accept=".jpeg, .jpg" id="profile_img" name="profile_img">
             <label for="name">Navn</label>
             <input name="name" type="text" v-model="profile.name">
             <div class="check_container">
-                <label for="child">Begrenset:</label>
-                <Toggle ref="toggle" />
+                <label for="limited">Begrenset:</label>
+                <input type="checkbox" name="limited" id="limited">
             </div>
         </form>
         <button @click="submit">Opprett</button>
@@ -84,7 +100,7 @@ main {
     }
 }
 
-#avatar_label {
+#profile_img_label {
     display: flex;
     justify-content: center;
     width: 100%;
-- 
GitLab