blockchain/src/gui/qt-daemon/html_source/src/app/assign-alias/assign-alias.component.html
2019-03-26 13:11:17 +02:00

70 lines
3.3 KiB
HTML

<div class="content">
<div class="head">
<div class="breadcrumbs">
<span [routerLink]="['/wallet/' + wallet.wallet_id + '/history']">{{ wallet.name }}</span>
<span>{{ 'BREADCRUMBS.ASSIGN_ALIAS' | translate }}</span>
</div>
<button type="button" class="back-btn" (click)="back()">
<i class="icon back"></i>
<span>{{ 'COMMON.BACK' | translate }}</span>
</button>
</div>
<form class="form-assign" [formGroup]="assignForm">
<div class="input-block alias-name">
<label for="alias-name" tooltip="{{ 'ASSIGN_ALIAS.NAME.TOOLTIP' | translate }}" placement="bottom-left" tooltipClass="table-tooltip assign-alias-tooltip" [delay]="500">
{{ 'ASSIGN_ALIAS.NAME.LABEL' | translate }}
</label>
<input type="text" id="alias-name" formControlName="name" placeholder="{{ 'ASSIGN_ALIAS.NAME.PLACEHOLDER' | translate }}" (contextmenu)="variablesService.onContextMenu($event)">
<div class="error-block" *ngIf="assignForm.controls['name'].invalid && (assignForm.controls['name'].dirty || assignForm.controls['name'].touched)">
<div *ngIf="assignForm.controls['name'].errors['required']">
{{ 'ASSIGN_ALIAS.FORM_ERRORS.NAME_REQUIRED' | translate }}
</div>
<div *ngIf="assignForm.controls['name'].errors['pattern'] && assignForm.get('name').value.length > 6 && assignForm.get('name').value.length <= 25">
{{ 'ASSIGN_ALIAS.FORM_ERRORS.NAME_WRONG' | translate }}
</div>
<div *ngIf="assignForm.get('name').value.length <= 6 || assignForm.get('name').value.length > 25">
{{ 'ASSIGN_ALIAS.FORM_ERRORS.NAME_LENGTH' | translate }}
</div>
</div>
<div class="error-block" *ngIf="alias.exists">
<div>
{{ 'ASSIGN_ALIAS.FORM_ERRORS.NAME_EXISTS' | translate }}
</div>
</div>
<div class="error-block" *ngIf="notEnoughMoney">
<div>
{{ 'ASSIGN_ALIAS.FORM_ERRORS.NO_MONEY' | translate }}
</div>
</div>
</div>
<div class="input-block textarea">
<label for="alias-comment" tooltip="{{ 'ASSIGN_ALIAS.COMMENT.TOOLTIP' | translate }}" placement="bottom-left" tooltipClass="table-tooltip assign-alias-tooltip" [delay]="500">
{{ 'ASSIGN_ALIAS.COMMENT.LABEL' | translate }}
</label>
<textarea id="alias-comment"
class="scrolled-content"
formControlName="comment"
placeholder="{{ 'ASSIGN_ALIAS.COMMENT.PLACEHOLDER' | translate }}"
[maxLength]="variablesService.maxCommentLength"
(contextmenu)="variablesService.onContextMenu($event)">
</textarea>
<div class="error-block" *ngIf="assignForm.get('comment').value.length >= variablesService.maxCommentLength">
{{ 'ASSIGN_ALIAS.FORM_ERRORS.MAX_LENGTH' | translate }}
</div>
</div>
<div class="alias-cost">{{ "ASSIGN_ALIAS.COST" | translate : {value: alias.price | intToMoney, currency: variablesService.defaultCurrency} }}</div>
<div class="wrap-buttons">
<button type="button" class="blue-button" (click)="assignAlias()" [disabled]="!assignForm.valid || !canRegister || notEnoughMoney">{{ 'ASSIGN_ALIAS.BUTTON_ASSIGN' | translate }}</button>
<button type="button" class="blue-button" (click)="back()">{{ 'ASSIGN_ALIAS.BUTTON_CANCEL' | translate }}</button>
</div>
</form>
</div>