-<div class="input-group has-feedback has-clear">
- <div *ngIf="hasFilters()" class="input-group-prepend c-hand" ngbDropdown placement="bottom-left auto" container="body">
- <div class="input-group-text" ngbDropdownToggle>
+<div class="input-group has-clear" ngbDropdown placement="bottom-left auto" container="body">
+
+ <ng-container *ngIf="hasFilters()">
+ <div class="input-group-text c-hand" ngbDropdownToggle>
<span class="caret" aria-haspopup="menu" role="button"></span>
</div>
<div role="menu" ngbDropdownMenu>
- <h6 class="dropdown-header" i18n>Advanced filters</h6>
+ <ng-container *ngFor="let group of filters">
+ <h6 class="dropdown-header">{{ group.title }}</h6>
+
+ <button *ngFor="let filter of group.children" (click)="onFilterClick(filter)" class="dropdown-item">
+ <my-global-icon [ngClass]="{ 'no-visible': !isFilterEnabled(filter) }" iconName="tick"></my-global-icon>
- <a *ngFor="let filter of filters" [routerLink]="[ '.' ]" [queryParams]="filter.queryParams" class="dropdown-item">
- {{ filter.label }}
- </a>
+ {{ filter.label }}
+ </button>
+ </ng-container>
</div>
- </div>
+ </ng-container>
<input
type="text" name="table-filter" id="table-filter" i18n-placeholder placeholder="Filter..."
+ class="last-in-group"
[(ngModel)]="searchValue"
(keyup)="onInputSearch($event)"
>
- <a class="glyphicon glyphicon-remove-sign form-control-feedback form-control-clear" (click)="onResetTableFilter()"></a>
- <span class="sr-only" i18n>Clear filters</span>
+ <my-global-icon iconName="cross" role="button" class="form-control-clear" title="Clear filter" i18n-title (click)="onResetTableFilter()"></my-global-icon>
</div>