From b9c3bc3b3febd02f2ba1af36dcbb0219e52fff0c Mon Sep 17 00:00:00 2001 From: Jane Sandberg <sandbej@linnbenton.edu> Date: Wed, 19 Dec 2018 15:51:25 -0800 Subject: [PATCH] LP1809183: Allow passing template to eg-confirm-dialog Adds an input called dialogBodyTemplate to <eg-confirm-dialog>. This can be useful when you want to pass ICU messages to <eg-confirm-dialog> (e.g. "Are you sure you want to cancel these 3 holds?" vs. "Are you sure you want to cancel this hold?"). If both dialogBody and dialogBodyTemplate are defined, it will show the dialogBodyTemplate message. Also adds a sandbox example. Signed-off-by: Jane Sandberg <sandbej@linnbenton.edu> Signed-off-by: Bill Erickson <berickxx@gmail.com> --- .../src/eg2/src/app/share/dialog/confirm.component.html | 9 ++++++++- Open-ILS/src/eg2/src/app/share/dialog/confirm.component.ts | 1 + .../src/eg2/src/app/staff/sandbox/sandbox.component.html | 13 +++++++++++++ Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.ts | 13 +++++++++++++ 4 files changed, 35 insertions(+), 1 deletion(-) diff --git a/Open-ILS/src/eg2/src/app/share/dialog/confirm.component.html b/Open-ILS/src/eg2/src/app/share/dialog/confirm.component.html index 3db73cc8e0..05cf562123 100644 --- a/Open-ILS/src/eg2/src/app/share/dialog/confirm.component.html +++ b/Open-ILS/src/eg2/src/app/share/dialog/confirm.component.html @@ -6,7 +6,14 @@ <span aria-hidden="true">×</span> </button> </div> - <div class="modal-body"><p>{{dialogBody}}</p></div> + <div class="modal-body"> + <ng-container *ngIf="!dialogBodyTemplate"> + <p>{{dialogBody}}</p> + </ng-container> + <ng-container *ngIf="dialogBodyTemplate"> + <ng-container *ngTemplateOutlet="dialogBodyTemplate"></ng-container> + </ng-container> + </div> <div class="modal-footer"> <button type="button" class="btn btn-success" (click)="close(true)" i18n>Confirm</button> diff --git a/Open-ILS/src/eg2/src/app/share/dialog/confirm.component.ts b/Open-ILS/src/eg2/src/app/share/dialog/confirm.component.ts index efcbdeb54e..f195f32094 100644 --- a/Open-ILS/src/eg2/src/app/share/dialog/confirm.component.ts +++ b/Open-ILS/src/eg2/src/app/share/dialog/confirm.component.ts @@ -12,6 +12,7 @@ import {DialogComponent} from '@eg/share/dialog/dialog.component'; export class ConfirmDialogComponent extends DialogComponent { // What question are we asking? @Input() public dialogBody: string; + @Input() public dialogBodyTemplate: TemplateRef<any>; } diff --git a/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.html b/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.html index 4d3f795c1b..4ff0950751 100644 --- a/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.html +++ b/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.html @@ -236,3 +236,16 @@ </div> </form> </div> + +<button (click)="confirmNumber(1)">Confirm 1</button> +<button (click)="confirmNumber(0)">Confirm 0</button> +<button (click)="confirmNumber(20)">Confirm 20</button> + +<eg-confirm-dialog #numConfirmDialog + i18n-dialogTitle + dialogTitle="Confirm Number" + [dialogBodyTemplate]="confirmMsg"> +</eg-confirm-dialog> +<ng-template #confirmMsg> + <span i18n>Are you sure you want to confirm {numThings, plural, =1 {this thing} other {these {{numThings}} things}}?</span> +</ng-template> diff --git a/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.ts b/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.ts index 52931a04e4..d2d4ead1d9 100644 --- a/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.ts +++ b/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.ts @@ -16,6 +16,7 @@ import {ComboboxEntry} from '@eg/share/combobox/combobox.component'; import {FormatService} from '@eg/core/format.service'; import {FmRecordEditorComponent} from '@eg/share/fm-editor/fm-editor.component'; import {FormGroup, FormControl} from '@angular/forms'; +import {ConfirmDialogComponent} from '@eg/share/dialog/confirm.component'; @Component({ templateUrl: 'sandbox.component.html' @@ -34,6 +35,11 @@ export class SandboxComponent implements OnInit { @ViewChild('fmRecordEditor') private fmRecordEditor: FmRecordEditorComponent; + @ViewChild('numConfirmDialog') + private numConfirmDialog: ConfirmDialogComponent; + + public numThings = 0; + // @ViewChild('helloStr') private helloStr: StringComponent; gridDataSource: GridDataSource = new GridDataSource(); @@ -265,6 +271,13 @@ export class SandboxComponent implements OnInit { .then(txt => this.toast.success(txt)); }, 4000); } + + confirmNumber(num: number): void { + this.numThings = num; + console.log(this.numThings); + this.numConfirmDialog.open(); + } + } -- 2.11.0