Fixed student page. Now handles nonexistent feedback

The student page will no longer crash should there be no feedback objects for submissions and display a message to the user explaining that the submission hasn't been corrected due to the exam beeing pass only.

frontend/src/components/student/SubmissionList.vue

@@ -8,7 +8,7 @@
     >
       <template slot="items" slot-scope="props">
         <td>{{ props.item.type.name }}</td>
-        <td class="text-xs-right">{{ props.item.feedback.score }}</td>
+        <td class="text-xs-right">{{ props.item.feedback ?  props.item.feedback.score : 'N/A'}}</td>
         <td class="text-xs-right">{{ props.item.type.full_score }}</td>
         <td class="text-xs-right">
           <v-btn :to="`/submission/${props.item.type.pk}`" color="orange lighten-2">
@@ -62,7 +62,7 @@
     },
     computed: {
       sumScore () {
-        return this.submissions.map(a => a.feedback.score).reduce((a, b) => a + b)
+        return this.submissions.map(a => a.feedback && a.feedback.score).reduce((a, b) => a + b)
       },
       sumFullScore () {
         return this.submissions.map(a => a.type.full_score).reduce((a, b) => a + b)

frontend/src/components/submission_notes/base/FeedbackComment.vue

@@ -4,7 +4,7 @@
       <span class="tip tip-up" :style="{borderBottomColor: borderColor}"></span>
       <span v-if="of_tutor" class="of-tutor">Of tutor: {{of_tutor}}</span>
       <span class="comment-created">{{parsedCreated}}</span>
-      <div class="visibility-icon">
+      <div class="visibility-icon" v-if="show_visibility_icon">
         <v-tooltip top v-if="visible_to_student" size="20px">
           <v-icon
             slot="activator"
@@ -70,6 +70,10 @@
       visible_to_student: {
         type: Boolean,
         default: true
+      },
+      show_visibility_icon: {
+        type: Boolean,
+        default: true
       }
     },
     computed: {

frontend/src/pages/student/StudentPage.vue

@@ -3,7 +3,7 @@
       <v-layout justify center>
         <template v-if="loaded">
           <v-flex md10 mt-5 offset-xs1>
-            <h2>Submissions of {{ studentName }}</h2>
+            <h2>Submissions of {{ studentName || 'Student'}}</h2>
             <submission-list :submissions="submissions"/>
           </v-flex>
         </template>

frontend/src/pages/student/StudentSubmissionPage.vue

 <template>
   <v-container flex>
     <v-layout row wrap>
+      <v-flex xs6 offset-xs3>
+        <v-alert :value="!feedback" type="info">
+          This submission hasn't been corrected due to this being a pass only exam.
+        </v-alert>
+      </v-flex>
       <v-flex lg6 md12 mt-5>
         <base-annotated-submission>
           <v-toolbar
@@ -12,18 +17,21 @@
 
             <v-spacer/>
 
-            <h2>Score: {{score}} / {{submissionType.full_score}}</h2>
+            <h2>Score: {{feedback ? feedback.score : 'N/A'}} / {{submissionType.full_score}}</h2>
           </v-toolbar>
           <template slot="table-content">
             <tr v-for="(code, lineNo) in submission" :key="lineNo">
               <submission-line :code="code" :lineNo="lineNo">
-                <template v-for="(comment, index) in feedback[lineNo]">
-                  <feedback-comment
-                    v-if="feedback[lineNo] && showFeedback"
-                    v-bind="comment"
-                    :line-no="lineNo"
-                    :key="index"
-                  />
+                <template v-if="feedback">
+                  <template v-for="(comment, index) in feedback.feedback_lines[lineNo]">
+                    <feedback-comment
+                      v-if="feedback.feedback_lines[lineNo] && showFeedback"
+                      v-bind="comment"
+                      :line-no="lineNo"
+                      :key="index"
+                      :show_visibility_icon="false"
+                    />
+                  </template>
                 </template>
               </submission-line>
             </tr>
@@ -77,16 +85,12 @@
         'submission'
       ]),
       ...mapState({
-        score (state) { return state.studentPage.submissionData[this.id].feedback.score },
         submissionType (state) { return state.studentPage.submissionData[this.id].type },
         feedback (state) {
-          return state.studentPage.submissionData[this.$route.params.id].feedback.feedback_lines
+          return state.studentPage.submissionData[this.$route.params.id].feedback
         },
         showFeedback: function (state) {
           return state.submissionNotes.ui.showFeedback
-        },
-        feedbackIsFinal (state) {
-          return state.studentPage.submissionData[this.$route.params.id].feedback.is_final
         }
       })
     },

frontend/src/store/modules/student-page.js

@@ -25,16 +25,16 @@ export const studentPageMut = Object.freeze({
 const studentPage = {
   state: initialState(),
   mutations: {
-    [studentPageMut.SET_STUDENT_NAME]: function (state, name) {
+    [studentPageMut.SET_STUDENT_NAME] (state, name) {
       state.studentName = name
     },
-    [studentPageMut.SET_EXAM]: function (state, exam) {
+    [studentPageMut.SET_EXAM] (state, exam) {
       state.exam = exam
     },
-    [studentPageMut.SET_SUBMISSION_TYPES]: function (state, submissionTypes) {
+    [studentPageMut.SET_SUBMISSION_TYPES] (state, submissionTypes) {
       state.submissionTypes = submissionTypes
     },
-    [studentPageMut.SET_SUBMISSIONS_FOR_LIST]: function (state, submissions) {
+    [studentPageMut.SET_SUBMISSIONS_FOR_LIST] (state, submissions) {
       state.submissionsForList = submissions
     },
     /**
@@ -43,19 +43,19 @@ const studentPage = {
      * the former array elements. This is done to have direct access to the data
      * via the SubmissionType id.
      */
-    [studentPageMut.SET_FULL_SUBMISSION_DATA]: function (state, submissionData) {
+    [studentPageMut.SET_FULL_SUBMISSION_DATA] (state, submissionData) {
       state.submissionData = submissionData.reduce((acc, cur, index) => {
         acc[cur.type.pk] = cur
         return acc
       }, {})
     },
-    [studentPageMut.SET_VISITED]: function (state, visited) {
+    [studentPageMut.SET_VISITED] (state, visited) {
       state.visited = { ...state.visited, [visited.index]: visited.visited }
     },
-    [studentPageMut.SET_LOADED]: function (state, loaded) {
+    [studentPageMut.SET_LOADED] (state, loaded) {
       state.loaded = loaded
     },
-    [studentPageMut.RESET_STATE]: function (state) {
+    [studentPageMut.RESET_STATE] (state) {
       Object.assign(state, initialState())
     }
   },