1 <div class="container">
2 <div class="col-lg-6 offset-lg-3">
4 <legend class="mb-0" i18n><h1>Sign In</h1></legend>
6 <form (ngSubmit)="handleSubmit()" #loginForm="ngForm" class="form-validated">
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>
12 class="form-control col-lg-8"
16 autocomplete="username"
18 placeholder="Username"
19 [(ngModel)]="args.username"/>
22 <div class="row row-cols-auto">
23 <label class="col-lg-4 text-right font-weight-bold" for="password" i18n>Password</label>
24 <div class="input-group col-lg-8 p-0">
26 [type]="passwordVisible ? 'text' : 'password'"
32 autocomplete="current-password"
34 placeholder="Password"
36 [attr.aria-description]="ariaDescription"
37 [(ngModel)]="args.password"/>
38 <button id="show_password" class="input-group-text pointer"
39 type="button" aria-label="password visibility" aria-checked="false"
40 (click)="togglePasswordVisibility()" >
41 <span class="material-icons">{{ passwordVisible ? 'visibility' : 'visibility_off' }}</span>
46 <div class="row row-cols-auto mt-3" *ngIf="workstations && workstations.length">
47 <label class="form-label col-form-label col-4 text-end fw-bold" for="workstation" i18n>Workstation</label>
49 class="form-control col-lg-8"
53 [(ngModel)]="args.workstation">
54 <option *ngFor="let ws of workstations" [value]="ws.name">
60 <div class="row row-cols-auto mt-3">
61 <div class="col-2 offset-4">
62 <button type="submit" class="btn btn-outline-dark" i18n>Sign In</button>
64 <div class="col-4" *ngIf="loginFailed">
65 <div class="badge rounded-pill bg-warning p-2" i18n>Login Failed</div>
69 <div class="row" *ngIf="pendingXactsDate">
70 <div class="col-lg-8 offset-lg-4 alert alert-warning mt-2" i18n>
71 Unprocessed offline transactions waiting for upload.
72 Last transaction added at {{pendingXactsDate | date:'short'}}.