Use v-model with personal notes

aleksis/apps/alsijil/static/js/vue/components/alsijil/LessonDocumentation.js

@@ -95,9 +95,11 @@ export default {
           <v-col sm="12" md="4" lg="3">
             <personal-notes
               :groups="groups"
-              :personal-notes="personalNotes"
               :excuse-types="excuseTypes"
               :extra-marks="extraMarks"
+              
+              v-model="personalNotes"
+              @change="$emit('change-personal-notes', $event)"
             ></personal-notes>
           </v-col>
         </v-row>

aleksis/apps/alsijil/static/js/vue/components/alsijil/PersonalNotes.js

 const ID_NO_PERSON = null;
 
 export default {
+    model: {
+        prop: "personalNotes",
+        event: "change",
+    },
     created() {
         this.ID_NO_PERSON = ID_NO_PERSON;
     },
@@ -19,7 +23,7 @@ export default {
                     item.extra_marks = [];
                 }
             });
-
+            this.$emit('change', this.personalNotes)
         },
         editPersonalNote(personID) {
             console.log("editing personal note of person", personID);
@@ -82,6 +86,7 @@ export default {
                     }
                 });
             }
+            this.$emit('change', this.personalNotes)
         },
         cancelDialog() {
             this.dialog = false;