Handle submissions with no feedback

client/src/components/AssignmentWithSubmissions.vue

@@ -10,9 +10,9 @@
       <h4 class="assignment-with-submissions__heading">Lösung</h4>
       <p class="assignment-with-submissions__solution-text">{{assignment.solution}}</p>
     </div>
-    <p v-if="!assignment.submissions.length">Zu diesem Auftrag sind noch keine Ergebnisse vorhanden</p>
+    <p class="assignment-with-submissions__no-submissions" v-if="!assignment.submissions.length">Zu diesem Auftrag sind noch keine Ergebnisse vorhanden</p>
 
-    <div class="assignment-with-submissions__submissions submissions">
+    <div v-if="assignment.submissions.length" class="assignment-with-submissions__submissions submissions">
       <div class="submissions__header student-submission-row submission-header">
           <p class="submission-header__title">Lernende</p>
           <p class="submission-header__title">Ergebnisse</p>
@@ -113,6 +113,14 @@
       margin-top: 3rem;
     }
 
+    &__no-submissions {
+      margin-top: $large-spacing;
+    }
+
+  }
+
+  .submissions {
+    width: 100%;
   }
 
   .submission-header {

client/src/components/StudentSubmission.vue

@@ -9,7 +9,7 @@
           <student-submission-document :document="submission.document" class="entry-document"></student-submission-document>
       </p>
     </div>
-    <div class="student-submission__feedback entry">
+    <div class="student-submission__feedback entry" v-if="submission.submissionfeedback">
       <p class="entry__text" :class="{'entry__text--final': submission.submissionfeedback.final}">{{submission.submissionfeedback.text | trimToLength(50)}}</p>
     </div>
   </div>

client/src/components/content-blocks/assignment/Assignment.vue

@@ -21,7 +21,7 @@
         >
       </submission-form>
 
-      <div v-if="this.assignment.submission.submissionfeedback" class="submissionform-container__feedback">
+      <div v-if="this.assignment.submission.submissionfeedback" class="assignment__feedback">
         <p>{{feedbackText}}</p>
       </div>
     </template>
@@ -254,6 +254,10 @@
         color: $color-charcoal-dark;
       }
     }
+
+    &__feedback {
+      margin-top: $medium-spacing;
+    }
   }
 
 </style>

client/src/components/content-blocks/assignment/SubmissionForm.vue

@@ -55,7 +55,15 @@
       DocumentBlock
     },
 
-    props: ['userInput', 'saved', 'placeholder', 'action', 'reopen', 'document', 'sharedMsg'],
+    props: {
+      userInput: Object,
+      saved: Boolean,
+      placeholder: String,
+      action: String,
+      reopen: Function,
+      document: String,
+      sharedMsg: String
+    },
 
     computed: {
       final() {
@@ -105,10 +113,6 @@
     align-items: center;
   }
 
-  &__feedback {
-    margin-top: $medium-spacing;
-  }
-
   &__document {
     &:hover {
       cursor: pointer;

client/src/graphql/gql/fragments/assignmentParts.gql

@@ -9,6 +9,7 @@ fragment AssignmentParts on AssignmentNode {
     final
     document
     submissionfeedback {
+      id
       text
       teacher {
         firstName

client/src/pages/studentSubmission.vue

@@ -19,7 +19,7 @@
         @turnIn="turnIn"
         @saveInput="saveInput"
         @reopen="reopen"
-        :user-input="studentSubmission.submissionfeedback"
+        :user-input="feedback"
         :placholder="'Feedback erfassen'"
         :action="'Feedback teilen'"
         :shared-msg="'Dieses Feedback wurde geteilt.'"
@@ -60,6 +60,9 @@
       },
       fullName() {
         return `${this.studentSubmission.student.firstName} ${this.studentSubmission.student.lastName}`
+      },
+      feedback() {
+        return this.studentSubmission.submissionfeedback ? this.studentSubmission.submissionfeedback : {text: '', final: false};
       }
     },
 
@@ -78,7 +81,7 @@
 
     methods: {
       addEmoji(emoji) {
-        const feedbackText = this.studentSubmission.submissionfeedback.text + emoji;
+        const feedbackText = this.feedback.text + emoji;
         this.updateFeedbackText(feedbackText);
       },
       _save: debounce(function () {

client/src/pages/submissions.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="submissions-page skillbox__content">
+  <div class="submissions-page">
     <h2 class="submissions-page__heading">Aufgabe</h2>
     <assignment-with-submissions v-if="!$apollo.queries.assignment.loading"
                                  :assignment="assignment"