publish show

src/app/modules/shows/show/show.component.html

@@ -1,16 +1,18 @@
 <div *ngIf="(show$|async) as show">
   <app-card
-    heading="{{show.showType|showType}}, {{show.date.toDate()|date:'dd.MM.yyyy'}}">
-
-    <mat-checkbox [(ngModel)]="showText">Text anzeigen</mat-checkbox>
-
+    heading="{{show.showType|showType}}, {{show.date.toDate()|date:'dd.MM.yyyy'}} - {{getStatus(show)}}">
+    <i *ngIf="show.public">öffentliche Veranstaltung</i>
+    <i *ngIf="!show.public">geschlossene Veranstaltung</i>
+    <p>
+      <mat-checkbox [(ngModel)]="showText">Text anzeigen</mat-checkbox>
+    </p>
     <div *ngIf="showSongs && songs" class="song-list">
-      <app-song *ngFor="let song of showSongs" class="song-row"
-                [showId]="showId"
+      <app-song *ngFor="let song of showSongs" [showId]="showId"
                 [showSong]="song"
                 [showSongs]="showSongs"
-                [song]="getSong(song.songId)"
                 [showText]="showText"
+                [song]="getSong(song.songId)"
+                class="song-row"
       ></app-song>
     </div>
 
@@ -23,5 +25,11 @@
       </mat-form-field>
       <button mat-button>aus Übersicht</button>
     </div>
+    <app-button-row>
+      <button (click)="onArchive(true)" *ngIf="!show.archived" mat-button>Archivieren</button>
+      <button (click)="onArchive(false)" *ngIf="show.archived" mat-button>Wiederherstellen</button>
+      <button (click)="onPublish(true)" *ngIf="!show.published" mat-button>Veröffentlichen</button>
+      <button (click)="onPublish(false)" *ngIf="show.published" mat-button>Veröffentlichung zurückziehen</button>
+    </app-button-row>
   </app-card>
 </div>

src/app/modules/shows/show/show.component.ts

@@ -69,4 +69,18 @@ export class ShowComponent implements OnInit {
     const filtered = this.songs.filter(_ => _.id === songId);
     return filtered.length > 0 ? filtered[0] : null;
   }
+
+  public async onArchive(archived: boolean): Promise<void> {
+    await this.showService.update$(this.showId, {archived});
+  }
+
+  public async onPublish(published: boolean): Promise<void> {
+    await this.showService.update$(this.showId, {published});
+  }
+
+  public getStatus(show: Show): string {
+    if (show.published) return 'veröffentlicht';
+    if (show.reported) return 'gemeldet';
+    return 'entwurf';
+  }
 }

src/app/modules/shows/show/song/song.component.html

@@ -14,5 +14,5 @@
     <app-menu-button (click)="onDelete()" [icon]="faDelete" class="btnDelete"></app-menu-button>
   </div>
   <app-song-text (chordModeChanged)="onChordModeChanged($event)" *ngIf="showText" [chordMode]="showSong.chordMode"
-                 [text]="_song.text"></app-song-text>
+                 [showSwitch]="true" [text]="_song.text"></app-song-text>
 </div>

src/app/modules/shows/show/song/song.component.less

@@ -1,6 +1,4 @@
 
-
-
 .song {
   display: grid;
   grid-template-columns: 20px 20px auto 70px 25px;