only one popup confirm

This commit is contained in:
Tykayn 2021-12-01 19:00:00 +01:00 committed by tykayn
parent 1f8315235c
commit 1307b9f1a3
3 changed files with 24 additions and 31 deletions

View File

@ -62,34 +62,19 @@
<h3 class="step-counter-text">Étape {{ step_current }} sur {{ step_max }}</h3> <h3 class="step-counter-text">Étape {{ step_current }} sur {{ step_max }}</h3>
</div> </div>
<div class="column is-narrow has-text-right"> <div class="column is-narrow has-text-right">
<a class="cancel-button" (click)="showCancelDialog()"> Annuler <i class="fa fa-times"></i> </a> <p-button class="cancel-button" (click)="showCancelDialog()">
Annuler <i class="fa fa-times"></i>
</p-button>
</div> </div>
</div> </div>
</div> </div>
<p-confirmDialog
[style]="{ width: '50vw' }"
key="positionDialog"
[baseZIndex]="10000"
rejectButtonStyleClass="p-button-outlined"
></p-confirmDialog>
<div class="step-bar-container" style="width: 100%;"> <div class="step-bar-container" style="width: 100%;">
<div class="step-bar-progress" [ngStyle]="{ width: (step_current / step_max) * 100 + '%' }"></div> <div class="step-bar-progress" [ngStyle]="{ width: (step_current / step_max) * 100 + '%' }"></div>
</div> </div>
<!-- modale de confirmation pour quitter-->
<p-confirmDialog #stepperConfirm [style]="{ width: '50vw' }">
<ng-template pTemplate="header">
<h3>{{ 'creation.dialog' | translate }}</h3>
</ng-template>
<ng-template pTemplate="footer">
<button
type="button"
pButton
icon="pi pi-times"
[label]="'dialogs.no' | translate"
(click)="stepperConfirm.reject()"
></button>
<button
type="button"
pButton
icon="pi pi-check"
[label]="'dialogs.yes' | translate"
(click)="stepperConfirm.accept()"
></button>
</ng-template>
</p-confirmDialog>
</section> </section>

View File

@ -10,6 +10,9 @@ import { Router } from '@angular/router';
styleUrls: ['./stepper.component.scss'], styleUrls: ['./stepper.component.scss'],
}) })
export class StepperComponent { export class StepperComponent {
@Input()
public stepperConfirm: HTMLElement;
@Input() @Input()
public step_current: number = 1; public step_current: number = 1;
@Input() @Input()
@ -20,16 +23,20 @@ export class StepperComponent {
public pollService: PollService, public pollService: PollService,
private confirmationService: ConfirmationService, private confirmationService: ConfirmationService,
private router: Router private router: Router
) {} ) {
this.step_current = this.pollService.step_current;
}
showCancelDialog() { showCancelDialog() {
this.confirmationService.confirm({ this.confirmationService.confirm({
message: 'Quitter la création de sondage?', header: 'Quitter ?',
header: "Retour à l' accueil", message: 'Souhaitez-vous vraiment quitter le sondage ? Toutes les informations seront effacées.',
reject: () => {}, accept: () => this.goToHome(),
accept: () => { reject: () => console.log('rejected'),
this.router.navigate(['/']);
},
}); });
} }
goToHome() {
this.confirmationService.close();
this.router.navigate(['/']);
}
} }

View File

@ -34,6 +34,7 @@
"title": "Créer un sondage", "title": "Créer un sondage",
"want": "Choisissez le type de sondage", "want": "Choisissez le type de sondage",
"dialog": "Quitter la création de sondage?", "dialog": "Quitter la création de sondage?",
"dialog_content": "Souhaitez-vous vraiment quitter le sondage ? Toutes les informations seront effacées.",
"advanced": "Options avancées", "advanced": "Options avancées",
"kind": { "kind": {
"classic": "Propositions", "classic": "Propositions",