working on #79, #142, #60

digitaldeacon · Jul 6, 2017 · d6762f9 · d6762f9
1 parent 2b43aa5
commit d6762f9
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 7 deletions.
diff --git a/web/src/app/interaction/list/interaction-list.component.html b/web/src/app/interaction/list/interaction-list.component.html
@@ -26,13 +26,17 @@
             </md-menu>
         </md-card-header>
         <md-card-content>
-          <span *ngIf="interaction.recipients.length > 0">(
-            <ng-container *ngFor="let recipientId of interaction.recipients; let i = index">
-              <span *ngIf="i > 0">,</span>
-              {{recipientTag(recipientId)}}
-            </ng-container>)
-          </span>
           {{interaction.text}}
+            <div *ngIf="interaction.recipients.length > 0" style="margin-top: 2px">
+                <span i18n>Assigned: </span>
+                <ng-container *ngFor="let recipientId of interaction.recipients; let i = index">
+                    <span class="responsible"
+                          [class.responsible-complete]="interaction.actions[recipientId].completedOn"
+                          [class.responsible-done]="interaction.actions[recipientId].doneOn">
+                        {{recipientTag(recipientId)}}
+                    </span>
+                </ng-container>
+            </div>
         </md-card-content>
     </md-card>
 </div>
diff --git a/web/src/app/interaction/list/interaction-list.component.scss b/web/src/app/interaction/list/interaction-list.component.scss
@@ -18,4 +18,17 @@ md-card-actions {
       font-size: 18px
     }
   }
-}
+}
+.responsible {
+    padding: 3px;
+    background-color: #f7d6d1;
+    color: #fff;
+    border: 1px solid #333;
+    margin-right: 2px
+}
+.responsible.responsible-complete {
+    background-color: #ae9513 !important;
+}
+.responsible.responsible-done {
+    background-color: #9acb39 !important;
+}