Open-ILS/src/eg2/src/app/share/datetime-select/datetime-select.component.html

   1 <span class="material-icons" *ngIf="controlDir && !controlDir.control.valid">error</span>
   2 <form
   3   [formGroup]="dateTimeForm"
   4   class="input-group"
   5   ngbDropdown
   6   [autoClose]="'outside'"
   7   #dt="ngbDropdown">
   8   <input type="datetime"
   9     [attr.id]="domId.length ? domId : null"
  10     aria-label="Enter date and time"
  11     i18n-aria-label
  12     name="{{fieldName}}"
  13     class="form-control datetime-input"
  14     formControlName="stringVersion"
  15     (focus)="dt.open()"
  16     [attr.disabled]="readOnly ? true : null"
  17     [required]="required"
  18     (touch)="onTouched()">
  19
  20     <button class="input-group-text" ngbDropdownToggle
  21       type="button"
  22       title="Select date and time" i18n-title
  23       aria-label="Select date and time" i18n-aria-label>
  24       <span class="material-icons mat-icon-in-button" aria-hidden="true">event</span>
  25     </button>
  26   <div ngbDropdownMenu>
  27     <div i18n *ngIf="readOnly">
  28       Cannot edit this date or time.
  29     </div>
  30     <div *ngIf="!readOnly">
  31       <div *ngIf="controlDir && controlDir.control.errors"
  32         role="alert"
  33         class="alert alert-danger">
  34         <span class="material-icons">error</span>
  35         {{firstError(controlDir.control.errors)}}
  36       </div>
  37       <ngb-datepicker #datePicker
  38         [minDate]="minDate"
  39         [maxDate]="maxDate"
  40         formControlName="date"
  41         [footerTemplate]="time"
  42         (touch)="onTouched()">
  43       </ngb-datepicker>
  44     </div>
  45   </div>
  46
  47   <ng-template #time>
  48     <ngb-timepicker name="time"
  49       [meridian]="true"
  50       formControlName="time"
  51       [spinners]="true"
  52       [hourStep]="1"
  53       [minuteStep]="minuteStep || 30"
  54       (touch)="onTouched()">
  55     </ngb-timepicker>
  56     <span *ngIf="showTZ && timezone" class="badge badge-info">{{ timezone }}</span>
  57     <span *ngIf="showTZ && !timezone" class="badge badge-warning" i18n>Timezone not set</span>
  58     <button type="button" i18n class="btn btn-success" (click)="dt.close()">Choose time</button>
  59   </ng-template>
  60
  61 </form>