Ajout d'un popup de validation suite à la réponse d'une demande de délégation

src/app/demandes-delegation/demandes-delegation.component.html

@@ -1,4 +1,11 @@
 <app-nav-menu></app-nav-menu>
-<h1>Liste des demandes de délégations</h1>
-
-<app-demande-delegation *ngFor="let demandeDelegation of demandesDelegation" [demandeDelegation]="demandeDelegation" (eventEmitter)="donnerReponse($event)"></app-demande-delegation>
+<h2>Liste de vos demandes de délégations en attente</h2>
+<ng-container *ngIf="chargement">
+    <mat-spinner></mat-spinner>
+</ng-container>
+<ng-container *ngIf="!chargement">
+    <p *ngIf="demandesDelegation.length==0">
+        Aucune demande de délégation en cours.
+    </p>
+    <app-demande-delegation *ngFor="let demandeDelegation of demandesDelegation" [demandeDelegation]="demandeDelegation" (eventEmitter)="donnerReponse($event)"></app-demande-delegation>
+</ng-container>

src/app/demandes-delegation/demandes-delegation.component.ts

@@ -1,5 +1,6 @@
-import { Component, OnInit } from '@angular/core';
-import { CollaborateurDTO, DemandeDelegationDTO, DemandesDelegationService } from '@shared/api-swagger';
+import { Component, Inject, OnInit } from '@angular/core';
+import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
+import { CollaborateurDTO, DemandeDelegationDTO, DemandesDelegationService, EtatDemande } from '@shared/api-swagger';
 import { cles } from '@shared/utils/cles';
 import { Subscription } from 'rxjs';
 
@@ -20,7 +21,7 @@ export class DemandesDelegationComponent implements OnInit {
   
   demandeDelegationSubscription: Subscription;
   demandeDelegationReponseSubscription: Subscription;
-  constructor(private demandeDelegationService: DemandesDelegationService) {}
+  constructor(private demandeDelegationService: DemandesDelegationService, private matDialog: MatDialog) {}
 
 
   ngOnInit() {
@@ -50,7 +51,17 @@ export class DemandesDelegationComponent implements OnInit {
     console.log(event);
     const id: number = event.id;
     this.demandeDelegationReponseSubscription = this.demandeDelegationService.updateDemandeDelegation(event, event.id).subscribe(
-      () => this.demandesDelegation.filter(d => d.id != id),
+      () => {
+        let data: any = {
+          acceptee: false
+        };
+        if(event.etatDemande == EtatDemande.Validee) {
+          data.acceptee = true,
+          data.ep = event.ep
+        }
+        this.demandesDelegation = this.demandesDelegation.filter(d => d.id != id);
+        this.matDialog.open(DialogValidationReponse, {data:data});
+      },
       err => console.log(err)
     );
   }
@@ -64,3 +75,13 @@ export class DemandesDelegationComponent implements OnInit {
     }
   }
 }
+
+
+@Component({
+  selector: "dialog-validation-reponse",
+  templateUrl: "./dialog-validation-reponse.html"
+})
+export class DialogValidationReponse {
+  constructor(@Inject(MAT_DIALOG_DATA)public data: any, private matDialog: MatDialogRef<DialogValidationReponse>) {}
+  fermer() {this.matDialog.close();}
+}

src/app/demandes-delegation/demandes-delegation.module.ts

@@ -8,7 +8,7 @@ import { MaterialModule } from "@shared/angular-material/angular-material.module
 import {NavMenuModule} from '@shared/nav-menu/nav-menu.module';
 
 
-import { DemandesDelegationComponent } from './demandes-delegation.component';
+import { DemandesDelegationComponent, DialogValidationReponse } from './demandes-delegation.component';
 import { DemandeDelegationComponent, DialogReponseDemandeDelegation } from './details-demande-delegation/demande-delegation.component';
 import { DemandesDelegationRoutingModule } from './demandes-delegation.routing.module';
 
@@ -16,7 +16,7 @@ import { DemandesDelegationRoutingModule } from './demandes-delegation.routing.m
 @NgModule({
   declarations: [ 
     DemandesDelegationComponent, DemandeDelegationComponent,
-    DialogReponseDemandeDelegation
+    DialogReponseDemandeDelegation, DialogValidationReponse
   ],
   exports: [ DemandesDelegationComponent
   ],

src/app/demandes-delegation/details-demande-delegation/demande-delegation.component.ts

@@ -86,6 +86,7 @@ enregistrer() {
     return;
   let demandeDelegation: DemandeDelegationDTO = this.data.demandeDelegation;
   demandeDelegation.etatDemande = this.data.etatDemande;
+  demandeDelegation.raisonRefus = this.raisonRefus;
   this.reponse = {
     engistree: true,
     demandeDelegation: demandeDelegation

src/app/demandes-delegation/details-demande-delegation/dialog-reponse-demande-delegation.html

@@ -0,0 +1,9 @@
+<p>{{texte}}</p>
+<div>
+    <mat-form-field *ngIf="estRefus" appearance="fill">
+        <mat-label>Raison du refus</mat-label>
+        <textarea matInput [(ngModel)]="raisonRefus"></textarea>
+    </mat-form-field>
+</div>
+<button mat-raised-button (click)="enregistrer()" color="primary">Enregister la réponse</button>
+<button mat-raised-button (click)="fermer()" color="warn">Annuler</button>

src/app/demandes-delegation/dialog-validation-reponse.html

@@ -0,0 +1,4 @@
+<p>Votre réponse à la demande de délégation a bien été enregistrée</p>
+
+<button *ngIf="data.acceptee" (click)="fermer()" [routerLink]="['/ep', data.ep.id]" mat-raised-button>Accéder à l'EP</button>
+<button mat-raised-button (click)="fermer()">Fermer</button>