1 <div *ngIf="col.isFilterable" class="eg-grid-filter-control">
2 <div [ngSwitch]="col.datatype">
3 <div *ngSwitchCase="'link'">
4 <div class="input-group">
5 <div ngbDropdown class="d-inline-block" autoClose="outside" placement="bottom-left" [ngClass]="{'eg-grid-col-is-filtered' : col.isFiltered}">
6 <button ngbDropdownToggle class="form-control btn btn-sm btn-outline-dark text-button"><span class="material-icons mat-icon-in-button">filter_list</span></button>
7 <div ngbDropdownMenu class="eg-grid-filter-menu">
8 <div class="dropdown-item">
9 <div style="padding-top: 2px;">
10 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); applyFilter(col)" i18n>Apply filter</button>
11 <span style="padding-left: 2px;"></span>
12 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); clearFilter(col)" i18n>Clear filter</button>
17 <eg-combobox [idlClass]="col.idlFieldDef.class" (onChange)="applyLinkFilter($event, col)"
18 i18n-placeholder placeholder="Enter value to filter by"></eg-combobox>
21 <div *ngSwitchCase="'bool'">
22 <div class="input-group">
23 <div ngbDropdown class="d-inline-block" autoClose="outside" placement="bottom-left" [ngClass]="{'eg-grid-col-is-filtered' : col.isFiltered}">
24 <button ngbDropdownToggle class="form-control btn btn-sm btn-outline-dark text-button"><span class="material-icons mat-icon-in-button">filter_list</span></button>
25 <div ngbDropdownMenu class="eg-grid-filter-menu">
26 <div class="dropdown-item">
27 <div style="padding-top: 2px;">
28 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); applyBooleanFilter(col)" i18n>Apply filter</button>
29 <span style="padding-left: 2px;"></span>
30 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); clearFilter(col)" i18n>Clear filter</button>
35 <select class="custom-select" [(ngModel)]="col.filterValue" (change)="applyBooleanFilter(col)">
36 <option value="" i18n>Any</option>
37 <option value="t" i18n>True</option>
38 <option value="f" i18n>False</option>
42 <div *ngSwitchCase="'text'">
43 <div class="input-group">
44 <div ngbDropdown class="d-inline-block" autoClose="outside" placement="bottom-left" [ngClass]="{'eg-grid-col-is-filtered' : col.isFiltered}">
45 <button ngbDropdownToggle class="form-control btn btn-sm btn-outline-dark text-button"><span class="material-icons mat-icon-in-button">filter_list</span></button>
46 <div ngbDropdownMenu class="eg-grid-filter-menu">
47 <div class="dropdown-item">
48 <label for="eg-filter-op-select-{{col.name}}" i18n>Operator</label>
49 <select id="eg-filter-op-select-{{col.name}}" class="form-control" [(ngModel)]="col.filterOperator" (change)="operatorChanged(col)">
50 <option value="=" i18n>Is exactly</option>
51 <option value="!=" i18n>Is not</option>
52 <option value="like" i18n>Contains</option>
53 <option value="not like" i18n>Does not contain</option>
54 <option value="startswith" i18n>Starts with</option>
55 <option value="endswith" i18n>Ends with</option>
56 <option value="not null" i18n>Exists</option>
57 <option value="null" i18n>Does not exist</option>
58 <option value="<" i18n>Is less than</option>
59 <option value=">" i18n>Is greater than</option>
60 <option value="<=" i18n>Is less than or equal to</option>
61 <option value=">=" i18n>Is greater than or equal to</option>
63 <div style="padding-top: 2px;">
64 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); applyFilter(col)" i18n>Apply filter</button>
65 <span style="padding-left: 2px;"></span>
66 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); clearFilter(col)" i18n>Clear filter</button>
71 <input type="text" class="form-control" [(ngModel)]="col.filterValue" (keyup.enter)="applyFilter(col)"
72 [disabled]="col.filterInputDisabled" i18n-placeholder placeholder="Enter value to filter by">
75 <div *ngSwitchCase="'int'">
76 <div class="input-group">
77 <div ngbDropdown class="d-inline-block" autoClose="outside" placement="bottom-left" [ngClass]="{'eg-grid-col-is-filtered' : col.isFiltered}">
78 <button ngbDropdownToggle class="form-control btn btn-sm btn-outline-dark text-button"><span class="material-icons mat-icon-in-button">filter_list</span></button>
79 <div ngbDropdownMenu class="eg-grid-filter-menu">
80 <div class="dropdown-item">
81 <label for="eg-filter-op-select-{{col.name}}" i18n>Operator</label>
82 <select id="eg-filter-op-select-{{col.name}}" class="form-control" [(ngModel)]="col.filterOperator" (change)="operatorChanged(col)">
83 <option value="=" i18n>Is exactly</option>
84 <option value="!=" i18n>Is not</option>
85 <option value="not null" i18n>Exists</option>
86 <option value="null" i18n>Does not exist</option>
87 <option value="<" i18n>Is less than</option>
88 <option value=">" i18n>Is greater than</option>
89 <option value="<=" i18n>Is less than or equal to</option>
90 <option value=">=" i18n>Is greater than or equal to</option>
92 <div style="padding-top: 2px;">
93 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); applyFilter(col)" i18n>Apply filter</button>
94 <span style="padding-left: 2px;"></span>
95 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); clearFilter(col)" i18n>Clear filter</button>
100 <input type="number" min="0" step="1" class="form-control" [(ngModel)]="col.filterValue" (keyup.enter)="applyFilter(col)" [disabled]="col.filterInputDisabled">
103 <div *ngSwitchCase="'id'">
104 <div class="input-group">
105 <div ngbDropdown class="d-inline-block" autoClose="outside" placement="bottom-left" [ngClass]="{'eg-grid-col-is-filtered' : col.isFiltered}">
106 <button ngbDropdownToggle class="form-control btn btn-sm btn-outline-dark text-button"><span class="material-icons mat-icon-in-button">filter_list</span></button>
107 <div ngbDropdownMenu class="eg-grid-filter-menu">
108 <div class="dropdown-item">
109 <label for="eg-filter-op-select-{{col.name}}" i18n>Operator</label>
110 <select id="eg-filter-op-select-{{col.name}}" class="form-control" [(ngModel)]="col.filterOperator" (change)="operatorChanged(col)">
111 <option value="=" i18n>Is exactly</option>
112 <option value="!=" i18n>Is not</option>
113 <option value="not null" i18n>Exists</option>
114 <option value="null" i18n>Does not exist</option>
115 <option value="<" i18n>Is less than</option>
116 <option value=">" i18n>Is greater than</option>
117 <option value="<=" i18n>Is less than or equal to</option>
118 <option value=">=" i18n>Is greater than or equal to</option>
120 <div style="padding-top: 2px;">
121 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); applyFilter(col)" i18n>Apply filter</button>
122 <span style="padding-left: 2px;"></span>
123 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); clearFilter(col)" i18n>Clear filter</button>
128 <input type="number" min="0" step="1" class="form-control" [(ngModel)]="col.filterValue" (keyup.enter)="applyFilter(col)" [disabled]="col.filterInputDisabled">
131 <div *ngSwitchCase="'float'">
132 <div class="input-group">
133 <div ngbDropdown class="d-inline-block" autoClose="outside" placement="bottom-left" [ngClass]="{'eg-grid-col-is-filtered' : col.isFiltered}">
134 <button ngbDropdownToggle class="form-control btn btn-sm btn-outline-dark text-button"><span class="material-icons mat-icon-in-button">filter_list</span></button>
135 <div ngbDropdownMenu class="eg-grid-filter-menu">
136 <div class="dropdown-item">
137 <label for="eg-filter-op-select-{{col.name}}" i18n>Operator</label>
138 <select id="eg-filter-op-select-{{col.name}}" class="form-control" [(ngModel)]="col.filterOperator" (change)="operatorChanged(col)">
139 <option value="=" i18n>Is exactly</option>
140 <option value="!=" i18n>Is not</option>
141 <option value="not null" i18n>Exists</option>
142 <option value="null" i18n>Does not exist</option>
143 <option value="<" i18n>Is less than</option>
144 <option value=">" i18n>Is greater than</option>
145 <option value="<=" i18n>Is less than or equal to</option>
146 <option value=">=" i18n>Is greater than or equal to</option>
148 <div style="padding-top: 2px;">
149 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); applyFilter(col)" i18n>Apply filter</button>
150 <span style="padding-left: 2px;"></span>
151 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); clearFilter(col)" i18n>Clear filter</button>
156 <input type="number" class="form-control" [(ngModel)]="col.filterValue" (keyup.enter)="applyFilter(col)" [disabled]="col.filterInputDisabled">
159 <div *ngSwitchCase="'money'">
160 <div class="input-group">
161 <div ngbDropdown class="d-inline-block" autoClose="outside" placement="bottom-left" [ngClass]="{'eg-grid-col-is-filtered' : col.isFiltered}">
162 <button ngbDropdownToggle class="form-control btn btn-sm btn-outline-dark text-button"><span class="material-icons mat-icon-in-button">filter_list</span></button>
163 <div ngbDropdownMenu class="eg-grid-filter-menu">
164 <div class="dropdown-item">
165 <label for="eg-filter-op-select-{{col.name}}" i18n>Operator</label>
166 <select id="eg-filter-op-select-{{col.name}}" class="form-control" [(ngModel)]="col.filterOperator" (change)="operatorChanged(col)">
167 <option value="=" i18n>Is exactly</option>
168 <option value="!=" i18n>Is not</option>
169 <option value="not null" i18n>Exists</option>
170 <option value="null" i18n>Does not exist</option>
171 <option value="<" i18n>Is less than</option>
172 <option value=">" i18n>Is greater than</option>
173 <option value="<=" i18n>Is less than or equal to</option>
174 <option value=">=" i18n>Is greater than or equal to</option>
176 <div style="padding-top: 2px;">
177 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); applyFilter(col)" i18n>Apply filter</button>
178 <span style="padding-left: 2px;"></span>
179 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); clearFilter(col)" i18n>Clear filter</button>
184 <input type="number" step="0.01" class="form-control" [(ngModel)]="col.filterValue" (keyup.enter)="applyFilter(col)" [disabled]="col.filterInputDisabled">
187 <div *ngSwitchCase="'timestamp'">
188 <div class="input-group">
189 <div ngbDropdown class="d-inline-block" autoClose="outside" placement="bottom-left" [ngClass]="{'eg-grid-col-is-filtered' : col.isFiltered}">
190 <button ngbDropdownToggle class="form-control btn btn-sm btn-outline-dark text-button"><span class="material-icons mat-icon-in-button">filter_list</span></button>
191 <div ngbDropdownMenu class="eg-grid-filter-menu">
192 <div class="dropdown-item">
193 <label for="eg-filter-op-select-{{col.name}}" i18n>Operator</label>
194 <select id="eg-filter-op-select-{{col.name}}" class="form-control" [(ngModel)]="col.filterOperator" (change)="operatorChanged(col)">
195 <option value="=" i18n>Is exactly</option>
196 <option value="!=" i18n>Is not</option>
197 <option value="not null" i18n>Exists</option>
198 <option value="null" i18n>Does not exist</option>
199 <option value="<" i18n>Is less than</option>
200 <option value=">" i18n>Is greater than</option>
201 <option value="<=" i18n>Is less than or equal to</option>
202 <option value=">=" i18n>Is greater than or equal to</option>
203 <option value="between" i18n>Between</option>
205 <div style="padding-top: 2px;">
206 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); applyDateFilter(datesel.currentAsYmd(), col, dateendsel.currentAsYmd())" i18n>Apply filter</button>
207 <span style="padding-left: 2px;"></span>
208 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); clearFilter(col)" i18n>Clear filter</button>
213 <eg-date-select [initialYmd]="col.filterValue" (onChangeAsYmd)="applyDateFilter($event, col, dateendsel.currentAsYmd())" (onCleared)="clearDateFilter(col)"
214 [disabled]="col.filterInputDisabled" #datesel></eg-date-select>
215 <div [hidden]="col.filterOperator !== 'between'" class="form-inline form-group">
216 <label for="eg-filter-end-date-select-{{col.name}}" style="width: 3em;" i18n>and</label>
217 <eg-date-select [hidden]="col.filterOperator !== 'between'" (onChangeAsYmd)="applyDateFilter(datesel.currentAsYmd(), col, $event)"
218 [required]="col.filterOperator == 'between'" #dateendsel></eg-date-select>
222 <div *ngSwitchCase="'org_unit'">
223 <div class="input-group">
224 <div ngbDropdown class="d-inline-block" autoClose="outside" placement="bottom-left" [ngClass]="{'eg-grid-col-is-filtered' : col.isFiltered}">
225 <button ngbDropdownToggle class="form-control btn btn-sm btn-outline-dark text-button"><span class="material-icons mat-icon-in-button">filter_list</span></button>
226 <div ngbDropdownMenu class="eg-grid-filter-menu">
227 <div class="dropdown-item">
228 <label for="eg-filter-op-select-{{col.name}}" i18n>Operator</label>
229 <select id="eg-filter-op-select-{{col.name}}" class="form-control" [(ngModel)]="col.filterOperator" (change)="operatorChanged(col)">
230 <option value="=" i18n>Is (or includes)</option>
231 <option value="!=" i18n>Is not (or excludes)</option>
234 <div class="dropdown-item">
235 <div class="form-check">
236 <input type="checkbox"
237 [(ngModel)]="col.filterIncludeOrgAncestors"
238 class="form-check-input" id="include-ancestors">
239 <label class="form-check-label" for="include-ancestors" i18n>+ Ancestors</label>
241 <div class="form-check">
242 <input type="checkbox"
243 [(ngModel)]="col.filterIncludeOrgDescendants"
244 class="form-check-input" id="include-descendants">
245 <label class="form-check-label" for="include-descendants" i18n>+ Descendants</label>
247 <div style="padding-top: 2px;">
248 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); applyOrgFilter(ousel.selectedOrg(), col)" i18n>Apply filter</button>
249 <span style="padding-left: 2px;"></span>
250 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); clearFilter(col)" i18n>Clear filter</button>
255 <eg-org-select [applyOrgId]="col.filterValue" (onChange)="applyOrgFilter($event, col)"
256 i18n-placeholder placeholder="Enter library to filter by" #ousel></eg-org-select>
259 <div *ngSwitchDefault>I don't know how to filter {{col.name}} - {{col.datatype}}</div>
261 <span *ngIf="col.datatype !== 'org_unit'" i18n class="eg-grid-filter-operator">Operator:
262 <span [ngSwitch]="col.filterOperator">
263 <span *ngSwitchCase="'='" i18n>Is exactly</span>
264 <span *ngSwitchCase="'!='" i18n>Is not</span>
265 <span *ngSwitchCase="'>'" i18n>Is greater than</span>
266 <span *ngSwitchCase="'>='" i18n>Is greater than or equal to</span>
267 <span *ngSwitchCase="'<'" i18n>Is less than</span>
268 <span *ngSwitchCase="'<='" i18n>Is less than or equal to</span>
269 <span *ngSwitchCase="'like'" i18n>Contains</span>
270 <span *ngSwitchCase="'not like'" i18n>Does not contain</span>
271 <span *ngSwitchCase="'startswith'" i18n>Starts with</span>
272 <span *ngSwitchCase="'endswith'" i18n>Ends with</span>
273 <span *ngSwitchCase="'null'" i18n>Does not exist</span>
274 <span *ngSwitchCase="'not null'" i18n>Exists</span>
275 <span *ngSwitchCase="'between'" i18n>Between</span>
278 <span *ngIf="col.datatype == 'org_unit'" i18n class="eg-grid-filter-operator">Operator:
279 <span [ngSwitch]="col.filterOperator">
280 <span *ngSwitchCase="'='" i18n>Is (or includes)</span>
281 <span *ngSwitchCase="'!='" i18n>Is not (or excludes)</span>