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" [disabled]="context.dataSource.requestingData">
7 <span class="material-icons mat-icon-in-button">filter_list</span>
9 <div ngbDropdownMenu class="eg-grid-filter-menu">
10 <div class="dropdown-item">
11 <div style="padding-top: 2px;">
12 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); applyFilter(col)" i18n>Apply filter</button>
13 <span style="padding-left: 2px;"></span>
14 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); clearFilter(col)" i18n>Clear filter</button>
19 <eg-combobox [asyncSupportsEmptyTermClick]="col.asyncSupportsEmptyTermClick" [idlClass]="col.idlFieldDef.class" (onChange)="applyLinkFilter($event, col)"
20 [disabled]="col.filterInputDisabled || context.dataSource.requestingData"
21 i18n-placeholder placeholder="Enter value to filter by"></eg-combobox>
24 <div *ngSwitchCase="'bool'">
25 <div class="input-group">
26 <div ngbDropdown class="d-inline-block" autoClose="outside" placement="bottom-left" [ngClass]="{'eg-grid-col-is-filtered' : col.isFiltered}">
27 <button ngbDropdownToggle class="form-control btn btn-sm btn-outline-dark text-button" [disabled]="context.dataSource.requestingData">
28 <span class="material-icons mat-icon-in-button">filter_list</span>
30 <div ngbDropdownMenu class="eg-grid-filter-menu">
31 <div class="dropdown-item">
32 <div style="padding-top: 2px;">
33 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); applyBooleanFilter(col)" i18n>Apply filter</button>
34 <span style="padding-left: 2px;"></span>
35 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); clearFilter(col)" i18n>Clear filter</button>
40 <select class="custom-select" [(ngModel)]="col.filterValue" (change)="applyBooleanFilter(col)"
41 [disabled]="col.filterInputDisabled || context.dataSource.requestingData">
42 <option value="" i18n>Any</option>
43 <option value="t" i18n>True</option>
44 <option value="f" i18n>False</option>
48 <div *ngSwitchCase="'text'">
49 <div class="input-group">
50 <div ngbDropdown class="d-inline-block" autoClose="outside" placement="bottom-left" [ngClass]="{'eg-grid-col-is-filtered' : col.isFiltered}">
51 <button ngbDropdownToggle class="form-control btn btn-sm btn-outline-dark text-button" [disabled]="context.dataSource.requestingData">
52 <span class="material-icons mat-icon-in-button">filter_list</span>
54 <div ngbDropdownMenu class="eg-grid-filter-menu">
55 <div class="dropdown-item">
56 <label for="eg-filter-op-select-{{col.name}}" i18n>Operator</label>
57 <select id="eg-filter-op-select-{{col.name}}" class="form-control" [(ngModel)]="col.filterOperator" (change)="operatorChanged(col)">
58 <option value="=" i18n>Is exactly</option>
59 <option value="!=" i18n>Is not</option>
60 <option value="like" i18n>Contains</option>
61 <option value="not like" i18n>Does not contain</option>
62 <option value="startswith" i18n>Starts with</option>
63 <option value="endswith" i18n>Ends with</option>
64 <option value="not null" i18n>Exists</option>
65 <option value="null" i18n>Does not exist</option>
66 <option value="<" i18n>Is less than</option>
67 <option value=">" i18n>Is greater than</option>
68 <option value="<=" i18n>Is less than or equal to</option>
69 <option value=">=" i18n>Is greater than or equal to</option>
71 <div style="padding-top: 2px;">
72 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); applyFilter(col)" i18n>Apply filter</button>
73 <span style="padding-left: 2px;"></span>
74 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); clearFilter(col)" i18n>Clear filter</button>
79 <input type="text" class="form-control" [(ngModel)]="col.filterValue" (keyup.enter)="applyFilter(col)"
80 [disabled]="col.filterInputDisabled || context.dataSource.requestingData" i18n-placeholder placeholder="Enter value to filter by">
83 <div *ngSwitchCase="'int'">
84 <div class="input-group">
85 <div ngbDropdown class="d-inline-block" autoClose="outside" placement="bottom-left" [ngClass]="{'eg-grid-col-is-filtered' : col.isFiltered}">
86 <button ngbDropdownToggle class="form-control btn btn-sm btn-outline-dark text-button" [disabled]="context.dataSource.requestingData">
87 <span class="material-icons mat-icon-in-button">filter_list</span>
89 <div ngbDropdownMenu class="eg-grid-filter-menu">
90 <div class="dropdown-item">
91 <label for="eg-filter-op-select-{{col.name}}" i18n>Operator</label>
92 <select id="eg-filter-op-select-{{col.name}}" class="form-control" [(ngModel)]="col.filterOperator" (change)="operatorChanged(col)">
93 <option value="=" i18n>Is exactly</option>
94 <option value="!=" i18n>Is not</option>
95 <option value="not null" i18n>Exists</option>
96 <option value="null" i18n>Does not exist</option>
97 <option value="<" i18n>Is less than</option>
98 <option value=">" i18n>Is greater than</option>
99 <option value="<=" i18n>Is less than or equal to</option>
100 <option value=">=" i18n>Is greater than or equal to</option>
102 <div style="padding-top: 2px;">
103 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); applyFilter(col)" i18n>Apply filter</button>
104 <span style="padding-left: 2px;"></span>
105 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); clearFilter(col)" i18n>Clear filter</button>
110 <input type="number" min="0" step="1" class="form-control" [(ngModel)]="col.filterValue" (keyup.enter)="applyFilter(col)" [disabled]="col.filterInputDisabled || context.dataSource.requestingData">
113 <div *ngSwitchCase="'id'">
114 <div class="input-group">
115 <div ngbDropdown class="d-inline-block" autoClose="outside" placement="bottom-left" [ngClass]="{'eg-grid-col-is-filtered' : col.isFiltered}">
116 <button ngbDropdownToggle class="form-control btn btn-sm btn-outline-dark text-button" [disabled]="context.dataSource.requestingData">
117 <span class="material-icons mat-icon-in-button">filter_list</span>
119 <div ngbDropdownMenu class="eg-grid-filter-menu">
120 <div class="dropdown-item">
121 <label for="eg-filter-op-select-{{col.name}}" i18n>Operator</label>
122 <select id="eg-filter-op-select-{{col.name}}" class="form-control" [(ngModel)]="col.filterOperator" (change)="operatorChanged(col)">
123 <option value="=" i18n>Is exactly</option>
124 <option value="!=" i18n>Is not</option>
125 <option value="not null" i18n>Exists</option>
126 <option value="null" i18n>Does not exist</option>
127 <option value="<" i18n>Is less than</option>
128 <option value=">" i18n>Is greater than</option>
129 <option value="<=" i18n>Is less than or equal to</option>
130 <option value=">=" i18n>Is greater than or equal to</option>
132 <div style="padding-top: 2px;">
133 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); applyFilter(col)" i18n>Apply filter</button>
134 <span style="padding-left: 2px;"></span>
135 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); clearFilter(col)" i18n>Clear filter</button>
140 <input type="number" min="0" step="1" class="form-control" [(ngModel)]="col.filterValue" (keyup.enter)="applyFilter(col)" [disabled]="col.filterInputDisabled || context.dataSource.requestingData">
143 <div *ngSwitchCase="'float'">
144 <div class="input-group">
145 <div ngbDropdown class="d-inline-block" autoClose="outside" placement="bottom-left" [ngClass]="{'eg-grid-col-is-filtered' : col.isFiltered}">
146 <button ngbDropdownToggle class="form-control btn btn-sm btn-outline-dark text-button" [disabled]="context.dataSource.requestingData">
147 <span class="material-icons mat-icon-in-button">filter_list</span>
149 <div ngbDropdownMenu class="eg-grid-filter-menu">
150 <div class="dropdown-item">
151 <label for="eg-filter-op-select-{{col.name}}" i18n>Operator</label>
152 <select id="eg-filter-op-select-{{col.name}}" class="form-control" [(ngModel)]="col.filterOperator" (change)="operatorChanged(col)">
153 <option value="=" i18n>Is exactly</option>
154 <option value="!=" i18n>Is not</option>
155 <option value="not null" i18n>Exists</option>
156 <option value="null" i18n>Does not exist</option>
157 <option value="<" i18n>Is less than</option>
158 <option value=">" i18n>Is greater than</option>
159 <option value="<=" i18n>Is less than or equal to</option>
160 <option value=">=" i18n>Is greater than or equal to</option>
162 <div style="padding-top: 2px;">
163 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); applyFilter(col)" i18n>Apply filter</button>
164 <span style="padding-left: 2px;"></span>
165 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); clearFilter(col)" i18n>Clear filter</button>
170 <input type="number" class="form-control" [(ngModel)]="col.filterValue" (keyup.enter)="applyFilter(col)" [disabled]="col.filterInputDisabled || context.dataSource.requestingData">
173 <div *ngSwitchCase="'money'">
174 <div class="input-group">
175 <div ngbDropdown class="d-inline-block" autoClose="outside" placement="bottom-left" [ngClass]="{'eg-grid-col-is-filtered' : col.isFiltered}">
176 <button ngbDropdownToggle class="form-control btn btn-sm btn-outline-dark text-button" [disabled]="context.dataSource.requestingData">
177 <span class="material-icons mat-icon-in-button">filter_list</span>
179 <div ngbDropdownMenu class="eg-grid-filter-menu">
180 <div class="dropdown-item">
181 <label for="eg-filter-op-select-{{col.name}}" i18n>Operator</label>
182 <select id="eg-filter-op-select-{{col.name}}" class="form-control" [(ngModel)]="col.filterOperator" (change)="operatorChanged(col)">
183 <option value="=" i18n>Is exactly</option>
184 <option value="!=" i18n>Is not</option>
185 <option value="not null" i18n>Exists</option>
186 <option value="null" i18n>Does not exist</option>
187 <option value="<" i18n>Is less than</option>
188 <option value=">" i18n>Is greater than</option>
189 <option value="<=" i18n>Is less than or equal to</option>
190 <option value=">=" i18n>Is greater than or equal to</option>
192 <div style="padding-top: 2px;">
193 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); applyFilter(col)" i18n>Apply filter</button>
194 <span style="padding-left: 2px;"></span>
195 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); clearFilter(col)" i18n>Clear filter</button>
200 <input type="number" step="0.01" class="form-control" [(ngModel)]="col.filterValue" (keyup.enter)="applyFilter(col)" [disabled]="col.filterInputDisabled || context.dataSource.requestingData">
203 <div *ngSwitchCase="'timestamp'">
204 <div class="input-group">
205 <div ngbDropdown class="d-inline-block" autoClose="outside" placement="bottom-left" [ngClass]="{'eg-grid-col-is-filtered' : col.isFiltered}">
206 <div ngbDropdownMenu class="eg-grid-filter-menu">
207 <button ngbDropdownToggle class="form-control btn btn-sm btn-outline-dark text-button" [disabled]="context.dataSource.requestingData">
208 <span class="material-icons mat-icon-in-button">filter_list</span>
210 <div class="dropdown-item">
211 <label for="eg-filter-op-select-{{col.name}}" i18n>Operator</label>
212 <select id="eg-filter-op-select-{{col.name}}" class="form-control" [(ngModel)]="col.filterOperator" (change)="operatorChanged(col)">
213 <option value="=" i18n>Is exactly</option>
214 <option value="!=" i18n>Is not</option>
215 <option value="not null" i18n>Exists</option>
216 <option value="null" i18n>Does not exist</option>
217 <option value="<" i18n>Is less than</option>
218 <option value=">" i18n>Is greater than</option>
219 <option value="<=" i18n>Is less than or equal to</option>
220 <option value=">=" i18n>Is greater than or equal to</option>
221 <option value="between" i18n>Between</option>
223 <div style="padding-top: 2px;">
224 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); applyDateFilter(datesel.currentAsYmd(), col, dateendsel.currentAsYmd())" i18n>Apply filter</button>
225 <span style="padding-left: 2px;"></span>
226 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); clearFilter(col)" i18n>Clear filter</button>
231 <eg-date-select [initialYmd]="col.filterValue" (onChangeAsYmd)="applyDateFilter($event, col, dateendsel.currentAsYmd())" (onCleared)="clearDateFilter(col)"
232 [disabled]="col.filterInputDisabled || context.dataSource.requestingData" #datesel></eg-date-select>
233 <div [hidden]="col.filterOperator !== 'between'" class="form-inline form-group">
234 <label for="eg-filter-end-date-select-{{col.name}}" style="width: 3em;" i18n>and</label>
235 <eg-date-select [hidden]="col.filterOperator !== 'between'" (onChangeAsYmd)="applyDateFilter(datesel.currentAsYmd(), col, $event)"
236 [disabled]="col.filterInputDisabled || context.dataSource.requestingData"
237 [required]="col.filterOperator == 'between'" #dateendsel></eg-date-select>
241 <div *ngSwitchCase="'org_unit'">
242 <div class="input-group">
243 <div ngbDropdown class="d-inline-block" autoClose="outside" placement="bottom-left" [ngClass]="{'eg-grid-col-is-filtered' : col.isFiltered}">
244 <button ngbDropdownToggle class="form-control btn btn-sm btn-outline-dark text-button" [disabled]="context.dataSource.requestingData">
245 <span class="material-icons mat-icon-in-button">filter_list</span>
247 <div ngbDropdownMenu class="eg-grid-filter-menu">
248 <div class="dropdown-item">
249 <label for="eg-filter-op-select-{{col.name}}" i18n>Operator</label>
250 <select id="eg-filter-op-select-{{col.name}}" class="form-control" [(ngModel)]="col.filterOperator" (change)="operatorChanged(col)">
251 <option value="=" i18n>Is (or includes)</option>
252 <option value="!=" i18n>Is not (or excludes)</option>
255 <div class="dropdown-item">
256 <div class="form-check">
257 <input type="checkbox"
258 [(ngModel)]="col.filterIncludeOrgAncestors"
259 class="form-check-input" id="include-ancestors">
260 <label class="form-check-label" for="include-ancestors" i18n>+ Ancestors</label>
262 <div class="form-check">
263 <input type="checkbox"
264 [(ngModel)]="col.filterIncludeOrgDescendants"
265 class="form-check-input" id="include-descendants">
266 <label class="form-check-label" for="include-descendants" i18n>+ Descendants</label>
268 <div style="padding-top: 2px;">
269 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); applyOrgFilter(ousel.selectedOrg(), col)" i18n>Apply filter</button>
270 <span style="padding-left: 2px;"></span>
271 <button class="btn btn-sm btn-outline-dark" (click)="closeDropdown(); clearFilter(col)" i18n>Clear filter</button>
276 <eg-org-select [applyOrgId]="col.filterValue" (onChange)="applyOrgFilter($event, col)"
277 [disabled]="col.filterInputDisabled || context.dataSource.requestingData"
278 i18n-placeholder placeholder="Enter library to filter by" #ousel></eg-org-select>
281 <div *ngSwitchDefault>I don't know how to filter {{col.name}} - {{col.datatype}}</div>
283 <span *ngIf="col.datatype !== 'org_unit'" class="eg-grid-filter-operator"><ng-container i18n>Operator:</ng-container>
284 <span [ngSwitch]="col.filterOperator">
285 <span *ngSwitchCase="'='" i18n>Is exactly</span>
286 <span *ngSwitchCase="'!='" i18n>Is not</span>
287 <span *ngSwitchCase="'>'" i18n>Is greater than</span>
288 <span *ngSwitchCase="'>='" i18n>Is greater than or equal to</span>
289 <span *ngSwitchCase="'<'" i18n>Is less than</span>
290 <span *ngSwitchCase="'<='" i18n>Is less than or equal to</span>
291 <span *ngSwitchCase="'like'" i18n>Contains</span>
292 <span *ngSwitchCase="'not like'" i18n>Does not contain</span>
293 <span *ngSwitchCase="'startswith'" i18n>Starts with</span>
294 <span *ngSwitchCase="'endswith'" i18n>Ends with</span>
295 <span *ngSwitchCase="'null'" i18n>Does not exist</span>
296 <span *ngSwitchCase="'not null'" i18n>Exists</span>
297 <span *ngSwitchCase="'between'" i18n>Between</span>
300 <span *ngIf="col.datatype == 'org_unit'" class="eg-grid-filter-operator"><ng-container i18n>Operator:</ng-container>
301 <span [ngSwitch]="col.filterOperator">
302 <span *ngSwitchCase="'='" i18n>Is (or includes)</span>
303 <span *ngSwitchCase="'!='" i18n>Is not (or excludes)</span>