From 4a4820cf117ddf20c7caf80dc31a4985c1f8a65b Mon Sep 17 00:00:00 2001
From: Adrian Kunz <clashsoft@hotmail.com>
Date: Sat, 13 Jul 2024 00:17:01 +0200
Subject: [PATCH] feat: Delete photos

---
 src/app/audit/photos/photos.component.html |  1 +
 src/app/audit/photos/photos.component.scss | 32 ++++------------------
 src/app/audit/photos/photos.component.ts   |  8 ++++++
 src/app/shared/services/audit.service.ts   |  3 ++
 4 files changed, 17 insertions(+), 27 deletions(-)

diff --git a/src/app/audit/photos/photos.component.html b/src/app/audit/photos/photos.component.html
index f004d504..4b013cc6 100644
--- a/src/app/audit/photos/photos.component.html
+++ b/src/app/audit/photos/photos.component.html
@@ -81,6 +81,7 @@
               :
               (item.auditName.auditName | uppercase)
         }}
+        <button class="btn btn-link bi-trash" ngbTooltip="Delete" (click)="deletePhoto(item.id)"></button>
       </div>
     </div>
   }
diff --git a/src/app/audit/photos/photos.component.scss b/src/app/audit/photos/photos.component.scss
index 9dd44a91..0de8aadc 100644
--- a/src/app/audit/photos/photos.component.scss
+++ b/src/app/audit/photos/photos.component.scss
@@ -5,40 +5,18 @@
 .image-box {
   position: relative;
   overflow: hidden;
-  // padding: 4px;
-  // margin: 6px 3px;
-  // width: 50%;
-  // max-width: 300px;
+  min-height: 100px;
 }
 
-// img {
-  // display: block;
-  // width: 100%;
-  // height: auto;
-  // min-height: 230px;
-  // padding: 4px;
-// }
-
-// .imagee {
-//   background-color: #ebebeb;
-//   background-size: cover;
-//   background-position: center center;
-//   background-repeat: no-repeat;
-// }
-
 .overlay {
   position: absolute;
   bottom: 0;
-  // background: rgb(0, 0, 0);
-  background: rgba(0, 0, 0, 0.5); /* Black see-through */
-  color: #f1f1f1;
   width: 100%;
-  transition: 0.7s ease;
-  opacity: 0;
-  color: white;
-  font-size: 15px;
-  padding: 10px;
   text-align: center;
+  color: white;
+  background: rgba(0, 0, 0, 0.5); /* Black see-through */
+  opacity: 0;
+  transition: opacity 0.7s ease;
 }
 
 .image-box:hover .overlay {
diff --git a/src/app/audit/photos/photos.component.ts b/src/app/audit/photos/photos.component.ts
index d6973d34..4d7622bc 100644
--- a/src/app/audit/photos/photos.component.ts
+++ b/src/app/audit/photos/photos.component.ts
@@ -156,4 +156,12 @@ export class PhotosComponent implements OnInit {
   changeSubType() {
     this.getData({pageIndex: 0, pageSize: 8});
   }
+
+  deletePhoto(id: number) {
+    this.auditService.deletePhoto(id).subscribe(() => {
+      this.data = this.data.filter((a: any) => a.id !== id);
+      this.data2 = this.data2.filter((a: any) => a.id !== id);
+      this.dataForLength = this.dataForLength.filter((a: any) => a.id !== id);
+    });
+  }
 }
diff --git a/src/app/shared/services/audit.service.ts b/src/app/shared/services/audit.service.ts
index 8df26fb1..b856b2db 100644
--- a/src/app/shared/services/audit.service.ts
+++ b/src/app/shared/services/audit.service.ts
@@ -49,6 +49,9 @@ export class AuditService {
   getPhotos(auditId: Number): Observable<any> {
     return this.http.get(`${this.rootUrl}api/auditPhoto?auditId=${auditId}`);
   }
+  deletePhoto(id: number): Observable<any> {
+    return this.http.delete(`${this.rootUrl}api/auditPhoto`, {params: {id}});
+  }
   uploadPhoto(auditId: Number, formData: any): Observable<any> {
     return this.http.post(`${this.rootUrl}api/auditPhoto?auditId=${auditId}`, formData);
   }