v-modeling til faktiske verdier

src/views/ProfileSettings.vue

@@ -9,18 +9,18 @@
             <Icon icon="material-symbols:person" :color=iconColor :style="{ fontSize: '500px'}" />
         </div>
 
-        <h2>{{profile.name}}</h2>
+        <h2>{{this.currentProfile.name}}</h2>
         <button id="changeUserBtn" >Bytt bruker</button>
 
         <form @submit.prevent="submit">
             <label for="brukernavn">Profilnavn</label><br>
-            <input type="text" required><br>
+            <input type="text" required v-model="this.currentProfile.name"><br>
           <br>
             <h4>Brukertype</h4>
-            <input type="radio" id="normal" value="false">
+            <input type="radio" id="normal" value="false" v-model="this.currentProfile.isRestricted">
             <label for="normal"> Standard</label><br>
 
-            <input type="radio" id="restricted" value="true" >
+            <input type="radio" id="restricted" value="true" v-model="this.currentProfile.isRestricted">
             <label for="restricted"> Begrenset - Kan ikke redigere ukeplan eller handleliste</label><br>
 
             <br>
@@ -42,8 +42,8 @@
 
         </form>
 
-        <h1>App-innstillinger</h1>
 
+        <!-- <h1>App-innstillinger</h1>
         <form @submit.prevent="submit">
 
             <h2>-Matpreferanser-</h2>
@@ -69,7 +69,7 @@
 
             <button class="saveBtn" @click="saveFoodPreference">Lagre matpreferanser <br>  og allergener</button>
         </form>
-
+        -->
         <h1>Konto-innstillinger</h1>
         <form @submit.prevent="submit">
 
@@ -115,21 +115,17 @@ import { useAuthStore } from "@/stores/authStore";
 export default {
     name: "ProfileSettings",
     components: {Icon},
-    setup() {
-        //const store = useAuthStore();
-        //this.curruser= store.user;
-    },
     computed: {
         ...mapStores(useAuthStore),
         profile() {
             const store = useAuthStore();
+            this.currentProfile.name = store.profile.name;
+            this.currentProfile.isRestricted = store.profile.restricted;
             return store.profile
         },
-        currentUser() {
-            //return store.user;
-        },
-        currentProfile() {
-            //return store.profile;
+        user() {
+            const store = useAuthStore();
+            return store.user
         },
         iconColor() {
             return "#000000"
@@ -141,18 +137,16 @@ export default {
     },
     data() {
         return {
-            curruser : "",
-            /*user: {
-                id: "",
+            currentUser: {
                 username: "petter@hello.no",
                 password: "",
 
             },
-            qprofile: {
-                name: "Petter",
-                isRestricted: false,
+            currentProfile: {
+                name: "",
+                isRestricted: true,
                 image: "../components/images/w66XcIlw.jpeg",
-            },*/
+            },
             foodPreferences: [],
             allergens: [],
             deletionConfirmation: false,
@@ -166,6 +160,7 @@ export default {
     },
     methods: {
       saveUserSettings(){
+          console.log(this.currentProfile.isRestricted)
         alert("(Denne knappen gjør ingen ting) brukerinnstillinger lagret!")
           API.updateProfile(
               this.user.id,