LP1816475: Booking module refresh
[working/Evergreen.git] / Open-ILS / src / eg2 / src / app / staff / booking / create-reservation-dialog.component.html
1 <ng-template #dialogContent>
2   <div class="modal-header bg-info">
3     <h3 class="modal-title" i18n>Confirm Reservation Details</h3>
4     <button type="button" class="close"
5       i18n-aria-label aria-label="Close"
6       (click)="dismiss('cross_click')">
7       <span aria-hidden="true">&times;</span>
8     </button>
9   </div>
10   <form class="modal-body form-common" [formGroup]="create">
11     <div class="form-group row">
12       <label class="col-lg-4 text-right font-weight-bold"
13         i18n for="create-patron-barcode">Patron barcode</label>
14       <input type="text" id="create-patron-barcode"
15         class="form-control col-lg-7" formControlName="patronBarcode">
16       <span class="col-lg-7 offset-lg-4" i18n>
17         {{ (patron$ | async)?.first_given_name}}
18         {{ (patron$ | async)?.second_given_name}}
19         {{ (patron$ | async)?.family_name}}
20       </span>
21     </div>
22     <div class="form-group row">
23       <label class="col-lg-4 text-right font-weight-bold"
24         i18n for="create-end-time">Start time</label>
25       <eg-datetime-select
26         formControlName="startTime"
27         [timezone]="timezone">
28       </eg-datetime-select>
29     </div>
30     <div class="form-group row">
31       <label class="col-lg-4 text-right font-weight-bold"
32         i18n for="create-end-time">End time</label>
33       <eg-datetime-select
34         formControlName="endTime"
35         [timezone]="timezone">
36       </eg-datetime-select>
37       <div role="alert" class="alert alert-danger" *ngIf="create.errors && create.errors.startTimeNotBeforeEndTime">
38         <span class="material-icons" aria-hidden="true">error</span>
39         <span i18n>Start time must be before end time</span>
40       </div>
41     </div>
42     <div class="form-group row">
43       <label class="col-lg-4 text-right font-weight-bold"
44         i18n for="create-pickup-library">Pickup library</label>
45       <eg-org-select domId="create-pickup-library" [applyDefault]="true"
46         [disableOrgs]="disableOrgs()" [hideOrgs]="disableOrgs()"
47         (onChange)="handlePickupLibChange($event)">
48       </eg-org-select>
49     </div>
50     <div *ngIf="pickupLibraryUsesDifferentTz"
51       role="alert"
52       class="alert alert-info">
53       <span class="material-icons" aria-hidden="true">access_time</span>
54       <span i18n>Pickup Library is in the {{timezone}} timezone</span>
55     </div>
56     <div class="form-group row">
57       <label class="col-lg-4 text-right font-weight-bold"
58         i18n for="create-resource">Resource</label>
59       <input *ngIf="targetResource && targetResourceBarcode" id="create-resource" value="{{targetResourceBarcode}}" disabled>
60       <eg-combobox
61         formControlName="resourceList"
62         *ngIf="!(targetResource && targetResourceBarcode)"
63         startId="any">
64         <eg-combobox-entry entryId="any" entryLabel="Any resource"
65           i18n-entryLabel></eg-combobox-entry>
66         <eg-combobox-entry *ngFor="let r of resources" entryId="{{r.id()}}" entryLabel="{{r.barcode()}}">
67         </eg-combobox-entry>
68       </eg-combobox>
69     </div>
70     <div class="form-group row">
71       <label class="col-lg-4 text-right font-weight-bold"
72         i18n for="create-email-notify">Notify by email?</label>
73       <input type="checkbox" formControlName="emailNotify">
74     </div>
75   </form>
76   <div class="modal-footer">
77     <button (click)="addBresv$().subscribe()" [disabled]="!create.valid" class="btn btn-info" i18n>Confirm reservation</button>
78     <button (click)="addBresvAndOpenPatronReservations()" [disabled]="!create.valid" class="btn btn-info" i18n>
79       Confirm and show patron reservations
80     </button>
81     <button (click)="close()" class="btn btn-warning ml-2" i18n>Cancel</button>
82   </div>
83 </ng-template>
84 <eg-alert-dialog #fail i18n-dialogBody
85   dialogBody="Could not create this reservation">
86 </eg-alert-dialog>