77 lines
2.9 KiB
HTML
77 lines
2.9 KiB
HTML
|
<h1>Settings</h1>
|
||
|
|
<p-dialog
|
||
|
|
header="{{headerItem}}"
|
||
|
|
[modal]="true"
|
||
|
|
[width]="800"
|
||
|
|
[(visible)]="totpSettingDisplay"
|
||
|
|
[showHeader]="true"
|
||
|
|
[closeOnEscape]="false">
|
||
|
|
|
||
|
|
<div class="ui-g">
|
||
|
|
<div class="ui-g-12">
|
||
|
|
<b>구글 인증기(OTP)</b>는 암호 기능 중 하나입니다. 작동 원리는 SMS 인증 방식과 유사합니다.
|
||
|
|
연동 후 30초 마다 보안 코드가 생성되고, 보안 코드는 로그인, 인출, 보안 설정 변경등의 보안 인증을 하는 곳에 사용됩니다.
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="ui-g">
|
||
|
|
<div class="ui-g-6">
|
||
|
|
<p-card subtitle="IOS 회원">
|
||
|
|
<p>App Store에서 "Authenticator" 검색 후 다운로드 해주세요.<br><br></p>
|
||
|
|
<button type="button" pButton label="App Store" icon="fa-check"></button>
|
||
|
|
</p-card>
|
||
|
|
</div>
|
||
|
|
<div class="ui-g-6">
|
||
|
|
<p-card subtitle="안드로이드 회원">
|
||
|
|
<p>구글 플레이 스토어 또는 핸드폰 브라우저를 통해 "구글 인증기(OTP)" 검색 후 다운로드 해주세요.<br><br></p>
|
||
|
|
<button type="button" pButton label="Google Play" icon="fa-check"></button>
|
||
|
|
</p-card>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="ui-g-12">
|
||
|
|
<h2>Key & Backup Code</h2>
|
||
|
|
<div class="ui-g-3" *ngIf="totp">
|
||
|
|
<qrcode [qrdata]="totp.uri" [size]="150" [level]="'M'"></qrcode>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="ui-g-9">
|
||
|
|
<div style="height: 80px;"></div>
|
||
|
|
<div class="ui-bottom-space-10" *ngIf="totp">{{totp.key}}, {{totp.uri}}</div>
|
||
|
|
<span class="md-inputfield">
|
||
|
|
<input type="text"
|
||
|
|
id="code"
|
||
|
|
autocomplete="off"
|
||
|
|
placeholder="Please enter your code"
|
||
|
|
required
|
||
|
|
class="ui-inputtext ui-corner-all ui-state-default ui-widget"
|
||
|
|
[(ngModel)]="totpCode"
|
||
|
|
(keyup)="totpInput($event)">
|
||
|
|
</span>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!--QR Code print & Key Print-->
|
||
|
|
</div>
|
||
|
|
<div class="ui-g-12" dir="rtl">
|
||
|
|
<button type="button" class="ui-button-width-fit ui-button-secondary" pButton icon="fa-close" (click)="totpSettingDisplay=false" label="No"></button>
|
||
|
|
<button type="button" class="ui-button-width-fit" pButton icon="fa-check" (click)="totpSettingDisplay=false" label="Yes"></button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</p-dialog>
|
||
|
|
|
||
|
|
<p-dataView [value]="lists" [paginator]="false" [rows]="5">
|
||
|
|
<p-header>이중보안</p-header>
|
||
|
|
|
||
|
|
<ng-template let-item pTemplate="listItem">
|
||
|
|
<div class="ui-g ui-bottom-border-1" style="padding: 2em;">
|
||
|
|
<div class="ui-g-2 ui-sm-6">{{item.name }} </div>
|
||
|
|
<div class="ui-g-3 ui-sm-6">{{item.value }}</div>
|
||
|
|
<div class="ui-g-5 ui-sm-6">{{item.description }}</div>
|
||
|
|
|
||
|
|
<div class="ui-g-2 ui-sm-6">
|
||
|
|
<button pButton type="button" label="Add" icon="ui-icon-add" (click)="on2factorConfig($event, item)"></button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</ng-template>
|
||
|
|
</p-dataView>
|
||
|
|
|