Open-ILS/src/eg2/src/app/staff/login.component.html

   1 <div class="container">
   2   <div class="col-lg-6 offset-lg-3">
   3     <fieldset>
   4       <legend class="mb-0" i18n><h1>Sign In</h1></legend>
   5       <hr class="mt-1"/>
   6       <form (ngSubmit)="handleSubmit()" #loginForm="ngForm" class="form-validated">
   7
   8         <div class="row row-cols-auto">
   9           <label class="form-label col-form-label fw-bold col-4 text-end" for="username" i18n>Username</label>
  10           <div class="col-8">
  11             <input
  12               type="text"
  13               class="form-control"
  14               id="username"
  15               name="username"
  16               required
  17               autocomplete="username"
  18               i18n-placeholder
  19               placeholder="Username"
  20               [(ngModel)]="args.username"/>
  21           </div>
  22         </div>
  23
  24         <div class="row row-cols-auto mt-3">
  25           <label class="form-label col-form-label fw-bold col-4 text-end" for="password" i18n>Password</label>
  26           <div class="col-8">
  27             <input
  28               type="password"
  29               class="form-control"
  30               id="password"
  31               name="password"
  32               required
  33               autocomplete="current-password"
  34               i18n-placeholder
  35               placeholder="Password"
  36               [(ngModel)]="args.password"/>
  37           </div>
  38         </div>
  39
  40         <div class="row row-cols-auto mt-3" *ngIf="workstations && workstations.length">
  41           <label class="form-label col-form-label col-4 text-end fw-bold" for="workstation" i18n>Workstation</label>
  42           <div class="col-8">
  43             <select
  44               class="form-control"
  45               id="workstation"
  46               name="workstation"
  47               required
  48               [(ngModel)]="args.workstation">
  49               <option *ngFor="let ws of workstations" [value]="ws.name">
  50                 {{ws.name}}
  51               </option>
  52             </select>
  53           </div>
  54         </div>
  55
  56         <div class="row row-cols-auto mt-3">
  57           <div class="col-2 offset-4">
  58             <button type="submit" class="btn btn-outline-dark" i18n>Sign In</button>
  59           </div>
  60           <div class="col-4" *ngIf="loginFailed">
  61             <div class="badge rounded-pill bg-warning p-2" i18n>Login Failed</div>
  62           </div>
  63         </div>
  64
  65         <div class="row" *ngIf="pendingXactsDate">
  66           <div class="col-lg-8 offset-lg-4 alert alert-warning mt-2" i18n>
  67             Unprocessed offline transactions waiting for upload.
  68             Last transaction added at {{pendingXactsDate | date:'short'}}.
  69           </div>
  70         </div>
  71       </form>
  72     </fieldset>
  73   </div>
  74 </div>