All files / modules/input modal-input.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
2x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
<div class="input-container">
    <ng-container *ngIf="type === 'price'">
        <span class="price">
            <ng-container *ngIf="_kiosk !== true">
                <input #input
                    class="form-control" 
                    type="number" 
                    [name]="name" 
                    [placeholder]="placeholder" 
                    [value]="value" 
                    [readonly]="readonly" 
                    [disabled]="disabled" 
                    [ngClass]="{ 'disabled': disabled }"
                    (input)="onInput($event)" 
                    (keyup)="onKeyUp($event)" 
                    (focus)="onFocus(true)" 
                    (blur)="onFocus(false)" 
                    role="presentation" 
                    [autocomplete]="autocomplete">
                <div class="label" [ngClass]="{ 'placeholder': (!value && !_focus), 'focus': _focus, 'disabled': disabled }">
                    {{Price}}
                </div>
            </ng-container>
            <ng-container *ngIf="_kiosk === true">  
                <input #input 
                    uppNgkiosk 
                    class="form-control" 
                    data-kioskboard-type="price" 
                    type="text" 
                    [name]="name" 
                    [placeholder]="placeholder" 
                    [value]="_price" 
                    [readonly]="readonly" 
                    [disabled]="disabled" 
                    [ngClass]="{ 'disabled': disabled }"
                    (change)="onKiosk($event)" 
                    (focus)="onFocus(true)" 
                    (blur)="onFocus(false)" 
                    role="presentation" 
                    [autocomplete]="autocomplete">
                <div class="label" [ngClass]="{ 'placeholder': (!value && !_focus), 'focus': _focus, 'disabled': disabled  }">
                    {{Price}}
                </div>
            </ng-container>    
        </span>    
    </ng-container>
    <ng-container *ngIf="type !== 'price'">
        <ng-container *ngIf="_kiosk !== true">
            <input #input 
                class="form-control" 
                [type]="_text" 
                [name]="name" 
                [placeholder]="placeholder" 
                [value]="value" 
                [readonly]="readonly" 
                [disabled]="disabled" 
                [ngClass]="{ 'disabled': disabled }"
                (input)="onInput($event)"             
                (keyup)="onKeyUp($event)" 
                (focus)="onFocus(true)" 
                (blur)="onFocus(false)" 
                role="presentation" 
                [autocomplete]="autocomplete">
        </ng-container>
        <ng-container *ngIf="_kiosk === true">
            <input *ngIf="type === 'number'" #input 
                uppNgkiosk
                class="form-control" 
                data-kioskboard-type="num" 
                type="text" 
                [name]="name" 
                [value]="value" 
                [placeholder]="placeholder" 
                [readonly]="readonly" 
                [disabled]="disabled" 
                [ngClass]="{ 'disabled': disabled }"
                (change)="onKiosk($event)" 
                (focus)="onFocus(true)" 
                (blur)="onFocus(false)" 
                role="presentation" 
                [autocomplete]="autocomplete">
            <input *ngIf="type !== 'number'" #input 
                uppNgkiosk
                class="form-control" 
                data-kioskboard-type="all" 
                data-kioskboard-specialcharacters="true" 
                [type]="_text" 
                [name]="name" 
                [value]="value" 
                [placeholder]="placeholder" 
                [readonly]="readonly" 
                [disabled]="disabled" 
                [ngClass]="{ 'disabled': disabled }"
                (change)="onKiosk($event)" 
                (focus)="onFocus(true)" 
                (blur)="onFocus(false)" 
                role="presentation" 
                [autocomplete]="autocomplete">
        </ng-container>  
    </ng-container>    
    
    <div *ngIf="type === 'password'" class="password-toggle" tabindex="0" (click)="OnShowPassword()" (keydown.enter)="OnShowPassword()" (keydown.space)="OnShowPassword()" role="button" aria-label="Toggle password visibility">
        <ion-icon [hidden]="ShowPassword === true" color="medium" name="eye-outline"></ion-icon>
        <ion-icon [hidden]="ShowPassword !== true" color="medium" name="eye-off-outline" x></ion-icon>
    </div>    
</div>