51 lines
1.8 KiB
HTML
51 lines
1.8 KiB
HTML
@if (songs$ | async; as songs) {
|
|
<app-page-frame title="Lieder">
|
|
<div class="sidebar-content" sidebar>
|
|
<app-filter [songs]="songs"></app-filter>
|
|
</div>
|
|
<div content>
|
|
<app-card [padding]="false">
|
|
@for (song of songs; track trackBy($index, song)) {
|
|
<div [routerLink]="song.id" class="list-item">
|
|
<div class="number">{{ song.number }}</div>
|
|
<div class="title">
|
|
<span>{{ song.title }}</span>
|
|
@if (song.hasChordValidationIssues) {
|
|
<span class="validation-star" title="Akkord-Validierungsfehler vorhanden">*</span>
|
|
}
|
|
</div>
|
|
<div>
|
|
<ng-container *appRole="['contributor']">
|
|
@if (song.status === 'draft') {
|
|
<div class="warning">
|
|
<fa-icon [icon]="faDraft"></fa-icon>
|
|
</div>
|
|
}
|
|
@if (song.status === 'set') {
|
|
<div class="neutral">
|
|
<fa-icon [icon]="faDraft"></fa-icon>
|
|
</div>
|
|
}
|
|
@if (song.status === 'final') {
|
|
<div class="success">
|
|
<fa-icon [icon]="faFinal"></fa-icon>
|
|
</div>
|
|
}
|
|
</ng-container>
|
|
@if (song.legalType === 'open') {
|
|
<div class="warning">
|
|
<fa-icon [icon]="faLegal"></fa-icon>
|
|
</div>
|
|
}
|
|
</div>
|
|
<div>{{ song.key }}</div>
|
|
</div>
|
|
}
|
|
<div *appRole="['contributor']" class="list-action">
|
|
<app-button [fullWidth]="true" [icon]="faNewSong" routerLink="new">Neuen Song anlegen</app-button>
|
|
</div>
|
|
</app-card>
|
|
</div>
|
|
</app-page-frame>
|
|
}
|