src/components/lists/ShowList.vue

@@ -186,8 +186,9 @@
 								<div class="field">
 									<label class="label" for="">Assignees</label>
 									<ul class="assingees">
-										<li v-for="a in taskEditTask.assignees" :key="a.id">
-											{{a}}
+										<li v-for="(a, index) in taskEditTask.assignees" :key="a.id">
+											{{a.username}}
+											<a @click="deleteAssigneeByIndex(index)"><icon icon="times"/></a>
 										</li>
 									</ul>
 								</div>
@@ -447,6 +448,9 @@
 			addAssignee() {
 				this.taskEditTask.assignees.push(this.newAssignee)
 			},
+			deleteAssigneeByIndex(index) {
+				this.taskEditTask.assignees.splice(index, 1)
+			},
 			findUser(query) {
 				if(query === '') {
 					this.clearAll()

src/styles/tasks.scss

@@ -120,4 +120,23 @@
       width: 100%;
     }
   }
+
+  ul.assingees {
+    list-style: none;
+    margin: 0;
+
+    li{
+      padding: 0.5em 0.5em 0;
+
+      a{
+        float: right;
+        color: $red;
+        transition: all $transition;
+
+        &:hover{
+          color: darken($red, 15);
+        }
+      }
+    }
+  }
 }