60 lines
1.3 KiB
HTML
60 lines
1.3 KiB
HTML
@if (data.headers.length > 0) {
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th class="spacer"></th>
|
|
@for (h of data.headers; track h) {
|
|
<th [title]="h.label">
|
|
{{ h.label }}
|
|
<span
|
|
class="clickable"
|
|
[class.button]="h.sort !== SORT.NONE"
|
|
[class.unused]="h.sort === SORT.NONE"
|
|
(click)="onSort($event, h)"
|
|
>
|
|
@switch (h.sort) { @case (SORT.ASC) {
|
|
<fa-icon [icon]="faSortUp"></fa-icon>
|
|
} @case(SORT.DSC) {
|
|
<fa-icon [icon]="faSortDown"></fa-icon>
|
|
} @default {
|
|
<fa-icon [icon]="faSort"></fa-icon>
|
|
} }
|
|
</span>
|
|
</th>
|
|
}
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
@for (row of data.data; track row; let i = $index) {
|
|
<tr>
|
|
<td>
|
|
@if (data.page) {
|
|
{{ (data.page.page - 1) * data.page.size + i + 1 }}
|
|
} @else {
|
|
{{ i + 1 }}
|
|
}
|
|
</td>
|
|
@for (h of data.headers; track h) {
|
|
<td>
|
|
{{ row[h.source] }}
|
|
</td>
|
|
}
|
|
</tr>
|
|
}
|
|
</tbody>
|
|
@if (data.page) {
|
|
<tfoot>
|
|
<tr>
|
|
<td [attr.colspan]="data.headers.length + 1">
|
|
<span>
|
|
Showing {{ (data.page.page - 1) * data.page.size + 1 }} to
|
|
{{ data.page.page * data.page.size }} of {{ data.total }}
|
|
</span>
|
|
<span> </span>
|
|
</td>
|
|
</tr>
|
|
</tfoot>
|
|
}
|
|
</table>
|
|
}
|