[ADF-2353] replaced datatable with mat-list (#3085)

* [ADF-2353] replaced datatable with mat-list

* [ADF-2353] fixed test for the new mat-list comment
This commit is contained in:
Vito
2018-03-16 17:11:50 +00:00
committed by Eugenio Romano
parent ce14d68ea7
commit 6490260c5d
5 changed files with 136 additions and 109 deletions

View File

@@ -1,38 +1,31 @@
<adf-datatable
[rows]="comments"
[showHeader]="false"
(rowClick)="selectComment($event)" *ngIf="hasComments()">
<data-columns>
<data-column key="createdBy.email" title="{{'ADF_TASK_LIST.DETAILS.COMMENTS.CREATED_BY_HEADER' | translate }}">
<ng-template let-entry="$implicit">
<div id="comment-user-icon"
class="adf-comment-img-container">
<div
*ngIf="!entry.row.obj.createdBy.pictureId" class="adf-comment-user-icon">
{{getUserShortName(entry.row.obj.createdBy)}}</div>
<div>
<img *ngIf="entry.row.obj.createdBy.pictureId" class="adf-people-img"
[src]="peopleProcessService.getUserImage(entry.row.obj.createdBy)"/>
</div>
</div>
</ng-template>
</data-column>
<data-column key="message" title="{{'ADF_TASK_LIST.DETAILS.COMMENTS.MESSAGE_HEADER' | translate }}">
<ng-template let-entry="$implicit">
<div class="adf-comment-contents">
<div id="comment-user" class="adf-comment-user-name">
{{entry.row.obj.createdBy?.firstName}} {{entry.row.obj.createdBy?.lastName}}
</div>
<div id="comment-message" class="adf-comment-message">
{{entry.row.obj.message}}
</div>
<div id="comment-time" class="adf-comment-message-time">
{{transformDate(entry.row.obj.created)}}
</div>
</div>
</ng-template>
</data-column>
</data-columns>
</adf-datatable>
<mat-list class="adf-comment-list">
<mat-list-item *ngFor="let comment of comments"
(click)="selectComment(comment)"
class="adf-comment-list-item"
[class.is-selected]="comment.isSelected"
id="adf-comment-{{comment?.id}}">
<div id="comment-user-icon" class="adf-comment-img-container">
<div
*ngIf="!comment.createdBy.pictureId"
class="adf-comment-user-icon">
{{getUserShortName(comment.createdBy)}}</div>
<div>
<img *ngIf="comment.createdBy.pictureId"
class="adf-people-img"
[src]="peopleProcessService.getUserImage(comment.createdBy)"
/>
</div>
</div>
<div class="adf-comment-contents">
<div matLine id="comment-user" class="adf-comment-user-name">
{{comment.createdBy?.firstName}} {{comment.createdBy?.lastName}}
</div>
<div matLine id="comment-message" class="adf-comment-message">
{{comment.message}}
</div>
<div matLine id="comment-time" class="adf-comment-message-time">
{{transformDate(comment.created)}}
</div>
</div>
</mat-list-item>
</mat-list>