82 lines
3.5 KiB
HTML
82 lines
3.5 KiB
HTML
<div class="row">
|
|
<div class="col-12 col-md-6 col-lg-4">
|
|
<div class="btn-group btn-group-sm mb-3">
|
|
<button disabled class="btn btn-secondary">Add credential</button>
|
|
<button class="btn btn-secondary" (click)="onAddKey()">Key</button>
|
|
<button class="btn btn-secondary" (click)="onAddPassword()">Password</button>
|
|
</div>
|
|
<table class="table table-hover">
|
|
<thead>
|
|
<tr>
|
|
<th>Description</th>
|
|
<th>Type</th>
|
|
<th></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr *ngFor="let credential of credentialList">
|
|
<td>{{ credential.description }}</td>
|
|
<td>{{ credential.type }}</td>
|
|
<td>
|
|
<app-fa-icon class="mx-1 cursor-pointer" icon="edit" (click)="onEditClick(credential.id)"></app-fa-icon>
|
|
<app-fa-icon class="mx-1 cursor-pointer" icon="trash" (click)="onRemoveCredential(credential)"></app-fa-icon>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<div class="col-12 col-md-8 col-lg-4 offset-lg-1">
|
|
<form *ngIf="editType === 'key'" [formGroup]="keyForm" (submit)="onSubmit()">
|
|
<div class="form-group">
|
|
<label>Description</label>
|
|
<input type="text" class="form-control auto-invalid" formControlName="description" appFocus />
|
|
<div class="invalid-feedback">
|
|
Description can not be empty.
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label>Key</label>
|
|
<textarea class="form-control auto-invalid" rows=10 formControlName="key"></textarea>
|
|
<div class="invalid-feedback">
|
|
Key is required.
|
|
</div>
|
|
</div>
|
|
|
|
<app-alert *ngIf="keyInvalid">
|
|
<app-alert-message>The key is invalid.</app-alert-message>
|
|
</app-alert>
|
|
|
|
<button type="submit" class="btn btn-primary float-right" [disabled]="!keyForm.valid">Save</button>
|
|
</form>
|
|
<form *ngIf="editType === 'password'" [formGroup]="passwordForm" (submit)="onSubmit()">
|
|
<div class="form-group">
|
|
<label>Description</label>
|
|
<input type="text" class="form-control auto-invalid" formControlName="description" appFocus />
|
|
<div class="invalid-feedback">
|
|
Description can not be empty.
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label>Password</label>
|
|
<input type="password" class="form-control auto-validstate" formControlName="password" [placeholder]="editId !== 0 ? '(unchanged)': ''"
|
|
/>
|
|
<div class="invalid-feedback">
|
|
Password is required.
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label>Repeat password</label>
|
|
<input type="password" class="form-control auto-validstate" formControlName="password2" [placeholder]="editId !== 0 ? '(unchanged)': ''"
|
|
/>
|
|
<div class="invalid-feedback">
|
|
Passwords do not match.
|
|
</div>
|
|
</div>
|
|
|
|
<button type="submit" class="btn btn-primary float-right" [disabled]="!passwordForm.valid">Save</button>
|
|
</form>
|
|
</div>
|
|
</div> |