LP1816475: Add a read-only version of datetime component
authorJane Sandberg <sandbej@linnbenton.edu>
Sat, 30 Mar 2019 05:15:20 +0000 (22:15 -0700)
committerJane Sandberg <sandbej@linnbenton.edu>
Wed, 17 Apr 2019 20:22:00 +0000 (13:22 -0700)
Signed-off-by: Jane Sandberg <sandbej@linnbenton.edu>
Open-ILS/src/eg2/src/app/share/datetime-select/datetime-select.component.html
Open-ILS/src/eg2/src/app/share/datetime-select/datetime-select.component.ts
Open-ILS/src/eg2/src/app/share/fm-editor/fm-editor.component.html
Open-ILS/src/eg2/src/app/staff/booking/reservations-grid.component.html
Open-ILS/src/eg2/src/app/staff/booking/reservations-grid.component.ts

index 08ff81d..4848ded 100644 (file)
@@ -9,6 +9,7 @@
     #dtPicker="ngbPopover"
     [ngbPopover]="dt"
     placement="bottom"
+    [attr.disabled]="readOnly ? true : null"
     [autoClose]="'outside'"
     popoverTitle="Select date and time"
     i18n-popoverTitle
 </div>
 
 <ng-template #dt>
-  <ngb-datepicker
-    [(ngModel)]="dateModel"
-    (ngModelChange)="modelChanged()"
-    [footerTemplate]="time">
-  </ngb-datepicker>
+  <div i18n *ngIf="readOnly">
+    Cannot edit this date or time.
+  </div>
+  <div *ngIf="!readOnly">
+    <ngb-datepicker
+      [(ngModel)]="dateModel"
+      (ngModelChange)="modelChanged()"
+      [footerTemplate]="time">
+    </ngb-datepicker>
+  </div>
 </ng-template>
 <ng-template #time>
   <ngb-timepicker name="time"
index d46aed8..2cdef97 100644 (file)
@@ -17,6 +17,7 @@ export class DateTimeSelectComponent implements OnInit {
     @Input() minuteStep: number;
     @Input() showTZ = true;
     @Input() timezone: string;
+    @Input() readOnly = false;
 
     @Input() initialIso: string;
 
index beaf6a7..747ac14 100644 (file)
@@ -51,6 +51,7 @@
                 [timezone]="timezone"
                 domId="{{idPrefix}}-{{field.name}}"
                 (onChangeAsIso)="record[field.name]($event)"
+                [readOnly]="field.readOnly"
                 initialIso="{{record[field.name]()}}">
               </eg-datetime-select>
             </ng-container>
index 5d4aebf..f2ed3ba 100644 (file)
@@ -39,7 +39,7 @@
   idlClass="bresv"
   datetimeFields="start_time,end_time"
   hiddenFields="xact_finish,cancel_time,booking_interval"
-  readonlyFields="usr,xact_start,request_time,capture_time,pickup_time,return_time,capture_staff,target_resource_type,current_resource,target_resource,unrecovered,request_library,pickup_library,fine_interval,fine_amount,max_fine">
+  [readonlyFields]="listReadOnlyFields()">
 </eg-fm-record-editor>
 <eg-confirm-dialog #confirmCancelReservationDialog
   i18n-dialogTitle i18n-dialogBody
index af5b88e..6b25b96 100644 (file)
@@ -50,6 +50,7 @@ export class ReservationsGridComponent implements OnInit {
     viewByResource: (rows: IdlObject[]) => void;
     filterByCurrentPatronBarcode: () => void;
     filterByCurrentResourceBarcode: () => void;
+    listReadOnlyFields: () => string;
 
     reloadGrid: () => void;
 
@@ -187,6 +188,12 @@ export class ReservationsGridComponent implements OnInit {
                    (error) => { console.debug(error); }
                ));
         };
+        this.listReadOnlyFields = () => {
+            let list = "usr,xact_start,request_time,capture_time,pickup_time,return_time,capture_staff,target_resource_type,current_resource,target_resource,unrecovered,request_library,pickup_library,fine_interval,fine_amount,max_fine";
+            if (this.status) { list = list + ",start_time"; }
+            if ('returnedToday' === this.status) { list = list + ",end_time"; }
+            return list;
+        }
     }
 
     showEditDialog(idlThing: IdlObject) {