75 lines
3.0 KiB
HTML
75 lines
3.0 KiB
HTML
<div class="page-header">
|
|
<div *ngIf="pageLabel" class="breadcrumb">{{ pageLabel }}</div>
|
|
|
|
<div *ngIf="filters$ | async as filters" class="filters" [iqserHelpMode]="helpModeKey">
|
|
<div *ngIf="filters.length && searchPosition !== searchPositions.beforeFilters" translate="filters.filter-by"></div>
|
|
|
|
<ng-container *ngIf="searchPosition === searchPositions.beforeFilters" [ngTemplateOutlet]="searchBar"></ng-container>
|
|
|
|
<ng-container *ngFor="let config of filters; trackBy: trackByLabel">
|
|
<iqser-popup-filter *ngIf="!config.hide" [primaryFiltersSlug]="config.slug"></iqser-popup-filter>
|
|
</ng-container>
|
|
|
|
<ng-container *ngIf="searchPosition === searchPositions.afterFilters" [ngTemplateOutlet]="searchBar"></ng-container>
|
|
|
|
<div
|
|
(click)="resetFilters()"
|
|
*ngIf="showResetFilters$ | async"
|
|
class="reset-filters"
|
|
translate="reset-filters"
|
|
></div>
|
|
</div>
|
|
|
|
<div *ngIf="showCloseButton || actionConfigs || buttonConfigs || viewModeSelection" class="actions">
|
|
<ng-container [ngTemplateOutlet]="viewModeSelection"></ng-container>
|
|
|
|
<ng-container *ngFor="let config of buttonConfigs; trackBy: trackByLabel">
|
|
<iqser-icon-button
|
|
(action)="config.action($event)"
|
|
*ngIf="!config.hide"
|
|
[icon]="config.icon"
|
|
[id]="config.label.replace('.', '-')"
|
|
[label]="config.label | translate"
|
|
[type]="config.type"
|
|
[iqserHelpMode]="config.helpModeKey"
|
|
></iqser-icon-button>
|
|
</ng-container>
|
|
|
|
<div class="actions">
|
|
<ng-container *ngFor="let config of actionConfigs; trackBy: trackByLabel">
|
|
<iqser-circle-button
|
|
(action)="config.action($event)"
|
|
*ngIf="!config.hide"
|
|
[disabled]="config.disabled$ && (config.disabled$ | async)"
|
|
[icon]="config.icon"
|
|
[tooltip]="config.label"
|
|
tooltipPosition="below"
|
|
></iqser-circle-button>
|
|
</ng-container>
|
|
|
|
<!-- Extra custom actions here -->
|
|
<ng-content></ng-content>
|
|
|
|
<iqser-circle-button
|
|
(action)="closeAction.emit()"
|
|
*ngIf="showCloseButton"
|
|
[class.ml-6]="actionConfigs"
|
|
[tooltip]="'common.close' | translate"
|
|
icon="iqser:close"
|
|
tooltipPosition="below"
|
|
></iqser-circle-button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<ng-template #searchBar>
|
|
<iqser-input-with-action
|
|
(valueChange)="searchService.searchValue = $event"
|
|
*ngIf="searchPlaceholder && searchService"
|
|
[class.mr-8]="searchPosition === searchPositions.beforeFilters"
|
|
[placeholder]="searchPlaceholder"
|
|
[value]="searchService.valueChanges$ | async"
|
|
[width]="searchWidth"
|
|
></iqser-input-with-action>
|
|
</ng-template>
|