user can delete submitted document

client/src/components/content-blocks/DocumentBlock.vue

@@ -2,17 +2,25 @@
   <div class="document-block">
     <document-icon class="document-block__icon"></document-icon>
     <a :href="value.url" class="document-block__link" target="_blank">{{urlName}}</a>
+    <a v-if="showTrashIcon" class="document-block__remove" v-on:click="$emit('trash')">
+      <trash-icon class="document-block__trash-icon"></trash-icon>
+    </a>
   </div>
 </template>
 
 <script>
   import DocumentIcon from '@/components/icons/DocumentIcon';
+  import TrashIcon from '@/components/icons/TrashIcon';
 
   export default {
-    props: ['value'],
+    props: {
+      value: Object,
+      showTrashIcon: Boolean,
+    },
 
     components: {
-      DocumentIcon
+      DocumentIcon,
+      TrashIcon,
     },
 
     computed: {
@@ -28,6 +36,10 @@
 </script>
 
 <style scoped lang="scss">
+  @import '@/styles/_variables.scss';
+  @import '@/styles/_functions.scss';
+  @import '@/styles/_mixins.scss';
+
   .document-block {
     margin-bottom: 30px;
     display: grid;
@@ -42,5 +54,21 @@
     &__link {
       text-decoration: underline;
     }
+
+    &__remove {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      width: 50px;
+      height: 50px;
+    }
+
+    &__trash-icon {
+      width: 25px;
+      height: 25px;
+      fill: $color-grey;
+      cursor: pointer;
+      justify-self: center;
+    }
   }
 </style>

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

@@ -34,8 +34,15 @@
         <div
           class="assignment__file-upload"
           v-if="inputType === 'file'">
-          <p>{{assignment.submission.document}}</p>
+          <div v-if="assignment.submission.document">
+            <document-block
+              :value="{url: assignment.submission.document}"
+              show-trash-icon
+              v-on:trash="changeDocumentUrl('')"
+            ></document-block>
+          </div>
           <document-form
+            v-if="!assignment.submission.document"
             :value="{url: ''}"
             v-on:link-change-url="changeDocumentUrl"
           ></document-form>
@@ -61,14 +68,16 @@
   import FinalSubmission from '@/components/content-blocks/assignment/FinalSubmission';
   import SubmissionForm from '@/components/content-blocks/assignment/SubmissionForm';
   import DocumentForm from '@/components/content-forms/DocumentForm';
+  import DocumentBlock from '@/components/content-blocks/DocumentBlock';
 
   export default {
     props: ['value'],
 
     components: {
+      DocumentBlock,
       DocumentForm,
       SubmissionForm,
-      FinalSubmission
+      FinalSubmission,
     },
 
     computed: {
@@ -97,6 +106,9 @@
           this.unsaved = false;
         });
       }, 500),
+      change: function() {
+        console.log(arguments)
+      },
       saveInput: function (answer) {
         this.unsaved = true;
         /*