Add possibility to create new personal notes

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

@@ -34,6 +34,18 @@ export default {
             this.editedExcused = personalNote.excused || false;
             this.editedExcuseType = personalNote.excuse_type || null;
             this.editedExtraMarks = personalNote.extra_marks || [];
+
+            this.newPersonalNote = !!(personalNote && Object.keys(personalNote).length === 0 && Object.getPrototypeOf(personalNote) === Object.prototype);
+        },
+        createPersonalNote() {
+            this.editedPersonID = ID_NO_PERSON;
+            this.editedTardiness = 0;
+            this.editedAbsent = false;
+            this.editedExcused = false;
+            this.editedExcuseType = null;
+            this.editedExtraMarks = [];
+            this.newPersonalNote = true;
+            this.dialog = true;
         },
         personalNoteByStudentID(studentID) {
             if (this.editedPersonID === ID_NO_PERSON) {
@@ -46,16 +58,30 @@ export default {
                 return
             }
 
-            // Loop through all personal notes and update the ones that match the editedPersonID
-            this.personalNotes.forEach(item => {
-                if (item.student.id === this.editedPersonID) {
-                    item.tardiness = this.editedTardiness;
-                    item.absent = this.editedAbsent;
-                    item.excused = this.editedExcused;
-                    item.excuse_type = this.editedExcuseType;
-                    item.extra_marks = this.editedExtraMarks;
-                }
-            });
+            if (this.newPersonalNote) {
+                this.personalNotes.push({
+                    student: {
+                        id: this.editedPersonID,
+                        full_name: this.studentNameByID(this.editedPersonID)
+                    },
+                    tardiness: this.editedTardiness,
+                    absent: this.editedAbsent,
+                    excused: this.editedExcused,
+                    excuse_type: this.editedExcuseType,
+                    extra_marks: this.editedExtraMarks
+                });
+            } else {
+                // Loop through all personal notes and update the ones that match the editedPersonID
+                this.personalNotes.forEach(item => {
+                    if (item.student.id === this.editedPersonID) {
+                        item.tardiness = this.editedTardiness;
+                        item.absent = this.editedAbsent;
+                        item.excused = this.editedExcused;
+                        item.excuse_type = this.editedExcuseType;
+                        item.extra_marks = this.editedExtraMarks;
+                    }
+                });
+            }
         },
         cancelDialog() {
             this.dialog = false;
@@ -89,6 +115,13 @@ export default {
                 personalNoteString += ")";
             }
             return personalNoteString;
+        },
+        studentNameByID(studentID) {
+            try {
+                return this.persons.filter(item => item.id === studentID)[0].full_name;
+            } catch (TypeError) {
+                return "";
+            }
         }
     },
     props: ["personalNotes", "groups", "excuseTypes", "extraMarks"],
@@ -104,6 +137,7 @@ export default {
             editedExcused: false,
             editedExcuseType: null,
             editedExtraMarks: [],
+            newPersonalNote: false,
         }
     },
     computed: {
@@ -143,6 +177,7 @@ export default {
           outlined
           v-bind="attrs"
           v-on="on"
+          @click="createPersonalNote"
         >
           <v-icon>
             mdi-plus