Implement StatisticsPersonalNotesList with mock-data

aleksis/apps/alsijil/frontend/components/coursebook/statistics/StatisticsPersonalNotesList.vue

 <template>
   <v-card>
+    <v-virtual-scroll
+        :items="personalNotes"
+        height="100"
+        item-height="50"
+      >
+      <template v-slot:default="{ item }">
+        <v-list-item :key="item">
+          <v-list-item-content>
+            <v-list-item-title>
+              <!-- new_personal_note.documentation.course.groups.FORALL.shortName -->
+              5a
+              <!-- new_personal_note.documentation.subject/amends.subject -->
+              <!-- in subject-chip -->
+              Ma
+              <v-spacer />
+              <!-- new_personal_note.documentation.datetimeStart.toDate() -->
+              01.01.2031
+            </v-list-item-title>
+            <v-list-item-subtitle>
+              <!-- new_personal_note.note -->
+              Hier hat der Lehrer was notiert.
+            </v-list-item-subtitle>
+          </v-list-item-content>
+        </v-list-item>
+        <v-divider></v-divider>
+      </template>
+    </v-virtual-scroll>      
   </v-card>
 </template>
 
 <script>
 export default {
   name: "StatisticsPersonalNotesList",
+  data() {
+    return {
+      personalNotes: [1, 2, 3, 4],
+    };
+  },
+  // Mock for personalNotesQuery
+  // apollo: {
+  //   personalNotes: {
+  //     query: XXXX,
+  //   },
+  // },
 };
 </script>