Send new and edited personal Notes to the server

aleksis/apps/alsijil/assets/components/alsijil/PersonalNotes.js

+import gql from 'graphql-tag';
+
 const ID_NO_PERSON = null;
 
 export default {
@@ -65,6 +67,73 @@ export default {
                 return
             }
 
+            // We save the user input in case of an error
+            const variables = {
+                "personId": this.editedPersonID,
+                "late": this.editedTardiness,
+                "absent": this.editedAbsent,
+                "excused": this.editedExcused,
+                "excuseType": this.editedExcuseType,
+                "extraMarks": this.editedExtraMarks,
+                "remarks": this.editedRemarks,
+                "lessonDocumentation": this.lessonDocumentationId,
+            }
+
+            console.log(variables)
+
+            // Call to the graphql mutation
+            this.$apollo.mutate({
+                // Query
+                mutation: gql`mutation updateOrCreatePersonalNote(
+                    $personId: ID!,
+                    $lessonDocumentation: ID!,
+                    $late: Int,
+                    $absent: Boolean,
+                    $excused: Boolean, 
+                    $excuseType: ID, 
+                    $extraMarks: [ID],
+                    $remarks: String
+                ) {
+                    updateOrCreatePersonalNote(personId: $personId,
+                        lessonDocumentation: $lessonDocumentation,
+                        late: $late,
+                        absent: $absent,
+                        excused: $excused,
+                        excuseType: $excuseType,
+                        extraMarks: $extraMarks,
+                        remarks: $remarks
+                    ) {
+                        personalNote {
+                            id
+                            person {
+                                id
+                                fullName
+                            }
+                            remarks
+                            absent
+                            excused
+                            excuseType {
+                                id
+                            }
+                            extraMarks {
+                                id
+                            }
+                        }
+                    }
+                }
+                `,
+                // Parameters
+                variables: variables,
+            }).then((data) => {
+                // Result
+                console.log(data)
+                // FIXME: check if data changed (?), display success message
+            }).catch((error) => {
+                // Error
+                console.error(error)
+                // FIXME: Notify the user about the error, maybe retry
+            })
+
             if (this.newPersonalNote) {
                 this.personalNotes.push({
                     person: {