file delete

WEB/src/app/components/songs/song-files/song-files.component.html

@@ -36,15 +36,6 @@
             </button>
           </th>
           <td mat-cell *matCellDef="let element">
-            <button
-              mat-icon-button
-              (click)="onClickDownload(element.ID, element.Name)"
-              matTooltip="Datei herunterladen"
-              matTooltipPosition="left"
-              *ngIf="fileEditId !== element.ID"
-            >
-              <fa-icon [icon]="faDownload"></fa-icon>
-            </button>
             <button
               mat-icon-button
               (click)="onClickEdit(element.ID)"
@@ -54,6 +45,15 @@
             >
               <fa-icon [icon]="faEdit"></fa-icon>
             </button>
+            <button
+              mat-icon-button
+              (click)="onClickDownload(element.ID, element.Name)"
+              matTooltip="Datei herunterladen"
+              matTooltipPosition="left"
+              *ngIf="fileEditId !== element.ID"
+            >
+              <fa-icon [icon]="faDownload"></fa-icon>
+            </button>
             <button
               mat-icon-button
               matTooltip="Zurück zur Tabelle"
@@ -63,6 +63,15 @@
             >
               <fa-icon [icon]="faArrow"></fa-icon>
             </button>
+            <button
+              mat-icon-button
+              matTooltip="Anhang löschen"
+              matTooltipPosition="left"
+              (click)="onClickDelete(element.ID)"
+              *ngIf="fileEditId === element.ID"
+            >
+              <fa-icon [icon]="faTrash"></fa-icon>
+            </button>
           </td>
         </ng-container>
 

WEB/src/app/components/songs/song-files/song-files.component.ts

@@ -1,8 +1,15 @@
+import { switchMap } from 'rxjs/operators';
 import { Component, OnInit, ChangeDetectorRef } from '@angular/core';
 import { Song } from 'src/app/models/song.model';
 import { SongsService } from 'src/app/data/songs.service';
 import { DownloadService } from 'src/app/data/download.service';
-import { faFileUpload, faDownload, faEdit, faLongArrowAltLeft } from '@fortawesome/free-solid-svg-icons';
+import {
+  faFileUpload,
+  faDownload,
+  faEdit,
+  faLongArrowAltLeft,
+  faTrash
+} from '@fortawesome/free-solid-svg-icons';
 import { FileuploadFactory } from 'src/app/services/fileupload.factory';
 import { FileUploader } from 'ng2-file-upload';
 
@@ -15,6 +22,7 @@ export class SongFilesComponent {
   public song: Song;
   public selectedSongId = 0;
   public faFileUpload = faFileUpload;
+  public faTrash = faTrash;
   public faArrow = faLongArrowAltLeft;
   public faDownload = faDownload;
   public faEdit = faEdit;
@@ -27,7 +35,7 @@ export class SongFilesComponent {
   constructor(
     private downloadService: DownloadService,
     private fileuploadFactory: FileuploadFactory,
-    songService: SongsService,
+    private songService: SongsService,
     change: ChangeDetectorRef
   ) {
     songService.selectedSong.subscribe(_ => {
@@ -35,7 +43,8 @@ export class SongFilesComponent {
         this.selectedSongId = _.ID;
         this.song = _;
         this.newFileUploader = this.fileuploadFactory.provideForNewFiles(_.ID);
-        this.newFileUploader.onCompleteItem = () => songService.selectSong(_.ID).subscribe();
+        this.newFileUploader.onCompleteItem = () =>
+          songService.selectSong(_.ID).subscribe();
         this.newFileUploader.onProgressItem = () => change.markForCheck;
       } else {
         this.selectedSongId = 0;
@@ -49,11 +58,17 @@ export class SongFilesComponent {
   public onClickDownload(fileId: number, filename): void {
     this.downloadService.get(this.selectedSongId, fileId, filename);
   }
-  public onFileOverNew(hover: boolean) {
+  public onFileOverNew(hover: boolean): void {
     this.fileOverNew = hover;
   }
-  public onClickEdit(fileId: number) {
+  public onClickEdit(fileId: number): void {
     this.fileEditId = fileId;
   }
-
+  public onClickDelete(fileId: number): void {
+    const songId = this.song.ID;
+    this.songService
+      .deleteFile$(songId, fileId)
+      .pipe(switchMap(() => this.songService.selectSong(songId)))
+      .subscribe();
+  }
 }

WEB/src/app/data/songs.service.ts

@@ -106,4 +106,19 @@ export class SongsService extends OdataService {
     const get = this.httpClient.get(url);
     return get;
   }
+
+  public deleteFile$(
+    songId: number,
+    fileId: number
+  ): Observable<any> {
+    const url =
+      base +
+      '/api/songs/' +
+      songId +
+      '/files/' +
+      fileId +
+      '/delete';
+    const get = this.httpClient.get(url);
+    return get;
+  }
 }