This repository has been archived on 2025-04-11. You can view files and clone it, but cannot push or open issues or pull requests.
bee-frontend-ARCHIVED/src/app/shared/components/table/table.component.html
2024-08-24 22:27:08 +00:00

55 lines
1.8 KiB
HTML

<table class="w-full" [ngClass]="[background, foreground, border]">
<thead class="uppercase border-b text-sm" [ngClass]="[border]">
<tr>
<th
*ngFor="let column of columns; index as currentIndex"
[class]="'px-5 py-2 ' + column.headerCss"
[ngClass]="{
backgroundColumn: currentIndex % 2 === 0,
backgroundColumnAlternate: currentIndex % 2 === 1
}"
>
<div [innerHtml]="column.header"></div>
</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let item of items" class="border-b" [ngClass]="[border]">
<td
*ngFor="let column of columns; index as currentIndex"
[class]="'px-5 py-2 ' + column.columnCss"
[ngClass]="{
backgroundColumn: currentIndex % 2 === 0,
backgroundColumnAlternate: currentIndex % 2 === 1
}"
>
<div *ngIf="column.routerLink !== undefined">
<a [routerLink]="column.routerLink(item)">
<div *ngIf="column.columnContent !== undefined">
{{ column.columnContent }}
</div>
<div
*ngIf="column.columnFunction !== undefined"
[innerHtml]="column.columnFunction(item)"
></div>
</a>
</div>
<div *ngIf="column.routerLink === undefined">
<div *ngIf="column.columnContent !== undefined">
<div *ngIf="isBoolean(column.columnContent)">
<input type="checkbox" [(ngModel)]="column.columnContent" />
</div>
<div *ngIf="!isBoolean(column.columnContent)">
{{ column.columnContent }}
</div>
</div>
<div
*ngIf="column.columnFunction !== undefined"
[innerHtml]="column.columnFunction(item)"
></div>
</div>
</td>
</tr>
</tbody>
</table>