display the completed comment in the frontend

puzzle · Jan 7, 2025 · a57376a · a57376a
1 parent c453560
commit a57376a
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 1 deletion.
diff --git a/frontend/src/app/components/objective-detail/objective-detail.component.html b/frontend/src/app/components/objective-detail/objective-detail.component.html
@@ -22,7 +22,10 @@ <h3 class="mb-1">Beschrieb</h3>
 
         <div
           class="d-flex align-items-center flex-row justify-content-start"
-          *ngIf="objective.state.toUpperCase() != 'SUCCESSFUL' && objective.state.toUpperCase() != 'NOTSUCCESSFUL'"
+          *ngIf="
+            objective.state.toUpperCase() != 'SUCCESSFUL' && objective.state.toUpperCase() != 'NOTSUCCESSFUL';
+            else Completed
+          "
         >
           <button
             *ngIf="objective.writeable"
@@ -47,6 +50,12 @@ <h3 class="mb-1">Beschrieb</h3>
             Objective bearbeiten
           </button>
         </div>
+        <ng-template #Completed>
+          <h3 *ngIf="completed.comment !== ''" class="mb-1">Abschlusskommentar</h3>
+          <div *ngIf="completed.comment !== ''" class="linebreak mb-2-rem">
+            <p>{{ completed.comment }}</p>
+          </div>
+        </ng-template>
       </section>
     </div>
   </ng-container>

diff --git a/frontend/src/app/components/objective-detail/objective-detail.component.ts b/frontend/src/app/components/objective-detail/objective-detail.component.ts
@@ -7,6 +7,8 @@ import { KeyresultDialogComponent } from '../keyresult-dialog/keyresult-dialog.c
 import { ObjectiveFormComponent } from '../../shared/dialog/objective-dialog/objective-form.component';
 import { ActivatedRoute, Router } from '@angular/router';
 import { DialogService } from '../../services/dialog.service';
+import { CompletedService } from '../../services/completed.servce';
+import { Completed } from '../../shared/types/model/Completed';
 
 @Component({
   selector: 'app-objective-detail',
@@ -16,10 +18,12 @@ import { DialogService } from '../../services/dialog.service';
 })
 export class ObjectiveDetailComponent {
   objectiveId!: number;
+  completed!: Completed;
   objective$: BehaviorSubject<Objective> = new BehaviorSubject<Objective>({} as Objective);
 
   constructor(
     private objectiveService: ObjectiveService,
+    private completedService: CompletedService,
     private dialogService: DialogService,
     private refreshDataService: RefreshDataService,
     private router: Router,
@@ -29,6 +33,7 @@ export class ObjectiveDetailComponent {
   ngOnInit(): void {
     this.objectiveId = this.getIdFromParams();
     this.loadObjective(this.objectiveId);
+    this.loadComponent(this.objectiveId);
   }
 
   private getIdFromParams(): number {
@@ -46,6 +51,15 @@ export class ObjectiveDetailComponent {
       .subscribe((objective) => this.objective$.next(objective));
   }
 
+  loadComponent(id: number): void {
+    this.completedService
+      .getCompleted(id)
+      .pipe(catchError(() => EMPTY))
+      .subscribe((completed: Completed) => {
+        this.completed = completed;
+      });
+  }
+
   openAddKeyResultDialog() {
     this.dialogService
       .open(KeyresultDialogComponent, {

diff --git a/frontend/src/app/services/completed.servce.ts b/frontend/src/app/services/completed.servce.ts
@@ -16,4 +16,8 @@ export class CompletedService {
   deleteCompleted(objectiveId: number): Observable<Completed> {
     return this.httpClient.delete<Completed>('/api/v2/completed/' + objectiveId);
   }
+
+  getCompleted(objectiveId: number): Observable<Completed> {
+    return this.httpClient.get<Completed>('/api/v2/completed/' + objectiveId);
+  }
 }