]>
Commit | Line | Data |
---|---|---|
11fdf7f2 TL |
1 | <ng-template #popTemplate> |
2 | <form name="form" | |
3 | #formDir="ngForm" | |
4 | [formGroup]="form" | |
5 | novalidate> | |
9f95a23c | 6 | <div> |
11fdf7f2 TL |
7 | <input type="text" |
8 | formControlName="filter" | |
9 | i18n-placeholder | |
10 | [placeholder]="messages.filter" | |
11 | (keyup)="$event.keyCode == 13 ? selectOption() : updateFilter()" | |
12 | class="form-control text-center" /> | |
13 | <ng-container *ngFor="let error of Object.keys(messages.customValidations)"> | |
9f95a23c | 14 | <span class="invalid-feedback text-center" |
11fdf7f2 TL |
15 | *ngIf="form.showError('filter', formDir) && filter.hasError(error)"> |
16 | {{ messages.customValidations[error] }} | |
17 | </span> | |
18 | </ng-container> | |
19 | </div> | |
20 | </form> | |
21 | <div *ngFor="let option of filteredOptions" | |
22 | class="select-menu-item" | |
81eedcae | 23 | [ngClass]="{'help-block disabled': (data.length === selectionLimit || !option.enabled) && !option.selected}" |
11fdf7f2 TL |
24 | (click)="triggerSelection(option)"> |
25 | <div class="select-menu-item-icon"> | |
9f95a23c | 26 | <i [ngClass]="[icons.check]" |
11fdf7f2 TL |
27 | aria-hidden="true" |
28 | *ngIf="option.selected"></i> | |
29 | | |
30 | </div> | |
31 | <div class="select-menu-item-content"> | |
32 | {{ option.name }} | |
33 | <ng-container *ngIf="option.description"> | |
34 | <br> | |
9f95a23c | 35 | <small class="form-text text-muted"> |
11fdf7f2 TL |
36 | {{ option.description }} |
37 | </small> | |
38 | </ng-container> | |
39 | </div> | |
40 | </div> | |
41 | <div *ngIf="isCreatable()" | |
42 | class="select-menu-item" | |
9f95a23c | 43 | (click)="addCustomOption()"> |
11fdf7f2 | 44 | <div class="select-menu-item-icon"> |
9f95a23c | 45 | <i [ngClass]="[icons.tag]" |
11fdf7f2 TL |
46 | aria-hidden="true"></i> |
47 | | |
48 | </div> | |
49 | <div class="select-menu-item-content"> | |
50 | {{ messages.add }} '{{ filter.value }}' | |
51 | </div> | |
52 | </div> | |
9f95a23c | 53 | <div class="is-invalid" |
11fdf7f2 | 54 | *ngIf="data.length === selectionLimit"> |
9f95a23c | 55 | <span class="form-text text-muted text-center text-warning" |
11fdf7f2 TL |
56 | [tooltip]="messages.selectionLimit.tooltip" |
57 | *ngIf="data.length === selectionLimit"> | |
58 | {{ messages.selectionLimit.text }} | |
59 | </span> | |
60 | </div> | |
61 | </ng-template> | |
62 | ||
9f95a23c | 63 | <a class="select-menu-edit float-left" |
11fdf7f2 TL |
64 | [ngClass]="elemClass" |
65 | [popover]="popTemplate" | |
66 | placement="bottom" | |
67 | container="body" | |
68 | outsideClick="true" | |
f6b5b4d7 | 69 | *ngIf="customBadges || options.length > 0"> |
11fdf7f2 TL |
70 | <ng-content></ng-content> |
71 | </a> | |
9f95a23c TL |
72 | |
73 | <span class="form-text text-muted float-left" | |
f6b5b4d7 | 74 | *ngIf="data.length === 0 && !(!customBadges && options.length === 0)"> |
11fdf7f2 TL |
75 | {{ messages.empty }} |
76 | </span> | |
9f95a23c TL |
77 | |
78 | <span class="form-text text-muted float-left" | |
f6b5b4d7 | 79 | *ngIf="!customBadges && options.length === 0"> |
11fdf7f2 TL |
80 | {{ messages.noOptions }} |
81 | </span> |