<p-table
[value]="videoAbuses" [lazy]="true" [paginator]="true" [totalRecords]="totalRecords" [rows]="rowsPerPage"
[sortField]="sort.field" [sortOrder]="sort.order" (onLazyLoad)="loadLazy($event)" dataKey="id"
+ [showCurrentPageReport]="true" i18n-currentPageReportTemplate
+ currentPageReportTemplate="Showing {first} to {last} of {totalRecords} reports"
>
<ng-template pTemplate="header">
- <tr>
- <th style="width: 40px"></th>
+ <tr> <!-- header -->
+ <th style="width: 40px;"></th>
<th i18n>Reporter</th>
- <th i18n pSortableColumn="createdAt">Created <p-sortIcon field="createdAt"></p-sortIcon></th>
+ <th style="width: 200px;" i18n pSortableColumn="createdAt">Created <p-sortIcon field="createdAt"></p-sortIcon></th>
<th i18n>Video</th>
<th i18n pSortableColumn="state" style="width: 80px;">State <p-sortIcon field="state"></p-sortIcon></th>
<th style="width: 120px;"></th>
<ng-template pTemplate="body" let-expanded="expanded" let-videoAbuse>
<tr>
-
- <td class="expand-cell">
- <span class="expander" i18n-ngbTooltip ngbTooltip="More information" [pRowToggler]="videoAbuse">
+ <td class="c-hand" [pRowToggler]="videoAbuse" i18n-ngbTooltip ngbTooltip="More information" placement="top-left" container="body">
+ <span class="expander">
<i [ngClass]="expanded ? 'glyphicon glyphicon-menu-down' : 'glyphicon glyphicon-menu-right'"></i>
</span>
</td>
<td>{{ videoAbuse.createdAt }}</td>
<td>
- <a [href]="getVideoUrl(videoAbuse)" i18n-title title="Go to the video" target="_blank" rel="noopener noreferrer">
+ <a [href]="getVideoUrl(videoAbuse)" i18n-title title="Open video in a new tab" target="_blank" rel="noopener noreferrer">
{{ videoAbuse.video.name }}
</a>
</td>