2018-06-27 19:45:11 +02:00
|
|
|
<div class="modal fade">
|
|
|
|
<div class="modal-dialog modal-lg">
|
|
|
|
<div class="modal-content">
|
|
|
|
<div class="modal-header">
|
|
|
|
<h2 class="modal-title">
|
|
|
|
{{'twoStepLogin' | i18n}}
|
2018-06-27 23:50:31 +02:00
|
|
|
<small>YubiKey</small>
|
2018-06-27 19:45:11 +02:00
|
|
|
</h2>
|
|
|
|
<button type="button" class="close" data-dismiss="modal" attr.aria-label="{{'close' | i18n}}">
|
|
|
|
<span aria-hidden="true">×</span>
|
|
|
|
</button>
|
|
|
|
</div>
|
2019-02-21 22:50:37 +01:00
|
|
|
<app-two-factor-verify [organizationId]="organizationId" [type]="type" (onAuthed)="auth($event)"
|
|
|
|
*ngIf="!authed">
|
2018-06-28 05:55:50 +02:00
|
|
|
</app-two-factor-verify>
|
2019-02-21 22:50:37 +01:00
|
|
|
<form #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate *ngIf="authed"
|
|
|
|
autocomplete="off">
|
2018-06-27 19:45:11 +02:00
|
|
|
<div class="modal-body">
|
|
|
|
<app-callout type="success" title="{{'enabled' | i18n}}" icon="fa-check-circle" *ngIf="enabled">
|
|
|
|
{{'twoStepLoginProviderEnabled' | i18n}}
|
|
|
|
</app-callout>
|
|
|
|
<app-callout type="warning">
|
|
|
|
<p>{{'twoFactorYubikeyWarning' | i18n}}</p>
|
|
|
|
<ul class="mb-0">
|
|
|
|
<li>{{'twoFactorYubikeySupportUsb' | i18n}}</li>
|
|
|
|
<li>{{'twoFactorYubikeySupportMobile' | i18n}}</li>
|
|
|
|
</ul>
|
|
|
|
</app-callout>
|
|
|
|
<img src="../../images/two-factor/3.png" class="float-right" alt="">
|
|
|
|
<p>{{'twoFactorYubikeyAdd' | i18n}}:</p>
|
|
|
|
<ol>
|
|
|
|
<li>{{'twoFactorYubikeyPlugIn' | i18n}}</li>
|
|
|
|
<li>{{'twoFactorYubikeySelectKey' | i18n}}</li>
|
|
|
|
<li>{{'twoFactorYubikeyTouchButton' | i18n}}</li>
|
|
|
|
<li>{{'twoFactorYubikeySaveForm' | i18n}}</li>
|
|
|
|
</ol>
|
|
|
|
<hr>
|
|
|
|
<div class="row">
|
|
|
|
<div class="form-group col-6" *ngFor="let k of keys; let i = index">
|
|
|
|
<label for="key{{i + 1}}">{{'yubikeyX' | i18n : i + 1}}</label>
|
2019-02-21 22:50:37 +01:00
|
|
|
<input id="key{{i + 1}}" type="password" name="Key{{i + 1}}" class="form-control"
|
|
|
|
[(ngModel)]="k.key" *ngIf="!k.existingKey" appInputVerbatim autocomplete="new-password">
|
2018-06-27 19:45:11 +02:00
|
|
|
<div class="d-flex" *ngIf="k.existingKey">
|
|
|
|
<span class="mr-2">{{k.existingKey}}</span>
|
2019-02-21 22:50:37 +01:00
|
|
|
<button type="button" class="btn btn-link text-danger ml-auto" (click)="remove(k)"
|
|
|
|
title="{{'remove' | i18n}}">
|
2018-06-27 19:45:11 +02:00
|
|
|
<i class="fa fa-minus-circle fa-lg"></i>
|
|
|
|
</button>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<strong class="d-block mb-2">{{'nfcSupport' | i18n}}</strong>
|
|
|
|
<div class="form-check">
|
2018-07-21 15:50:50 +02:00
|
|
|
<input type="checkbox" class="form-check-input" id="nfc" name="Nfc" [(ngModel)]="nfc">
|
|
|
|
<label class="form-check-label" for="nfc">{{'twoFactorYubikeySupportsNfc' | i18n}}</label>
|
2018-06-27 19:45:11 +02:00
|
|
|
</div>
|
|
|
|
<small class="form-text text-muted">{{'twoFactorYubikeySupportsNfcDesc' | i18n}}</small>
|
|
|
|
</div>
|
|
|
|
<div class="modal-footer">
|
2018-07-18 05:21:23 +02:00
|
|
|
<button type="submit" class="btn btn-primary btn-submit" [disabled]="form.loading">
|
2018-07-18 05:15:15 +02:00
|
|
|
<i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>
|
2018-06-27 19:45:11 +02:00
|
|
|
<span>{{'save' | i18n}}</span>
|
|
|
|
</button>
|
2019-02-21 22:50:37 +01:00
|
|
|
<button #disableBtn type="button" class="btn btn-outline-secondary btn-submit"
|
|
|
|
[appApiAction]="disablePromise" [disabled]="disableBtn.loading" (click)="disable()"
|
|
|
|
*ngIf="enabled">
|
2018-07-18 05:15:15 +02:00
|
|
|
<i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>
|
2018-06-27 19:45:11 +02:00
|
|
|
<span>{{'disableAllKeys' | i18n}}</span>
|
|
|
|
</button>
|
2019-02-21 22:50:37 +01:00
|
|
|
<button type="button" class="btn btn-outline-secondary"
|
|
|
|
data-dismiss="modal">{{'close' | i18n}}</button>
|
2018-06-27 19:45:11 +02:00
|
|
|
</div>
|
|
|
|
</form>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|