48 lines
2.5 KiB
HTML
48 lines
2.5 KiB
HTML
<div class="flex column fill">
|
|
@if (turnovers && !turnovers.error) {
|
|
<div class="flex wrap filter-container">
|
|
<a mat-icon-button (click)="filterOpen=!filterOpen" title="{{'turnovers.filter' | i18n}}"
|
|
[color]="filterOpen ? 'primary': 'accent'">
|
|
<mat-icon>filter_alt</mat-icon>
|
|
</a>
|
|
|
|
@if (filterOpen) {
|
|
<form class="flex wrap filter">
|
|
<mat-form-field class="margin">
|
|
<mat-label>{{'turnovers.filter.dueDate' | i18n}}</mat-label>
|
|
<mat-date-range-input [rangePicker]="picker">
|
|
<input matStartDate placeholder="{{'turnovers.filter.dueDate.from' | i18n}}"
|
|
[value]="turnovers && turnovers.filter && turnovers.filter.from"
|
|
(dateChange)="setFilter('from', $event.value && $event.value.toISOString() || undefined)">
|
|
<input matEndDate placeholder="{{'turnovers.filter.dueDate.to' | i18n}}"
|
|
[value]="turnovers && turnovers.filter && turnovers.filter.to"
|
|
(dateChange)="setFilter('to', $event.value && $event.value.endOf('day').toISOString() || undefined)">
|
|
</mat-date-range-input>
|
|
<mat-datepicker-toggle matIconSuffix [for]="picker"></mat-datepicker-toggle>
|
|
<mat-date-range-picker #picker></mat-date-range-picker>
|
|
</mat-form-field>
|
|
|
|
<mat-form-field class="margin">
|
|
<mat-label>{{'turnovers.filter.customer' | i18n}}</mat-label>
|
|
<input type="text" matInput [value]="turnovers && turnovers.filter && turnovers.filter.customer || ''"
|
|
(input)="setInputFilter('customer', $event.target)">
|
|
</mat-form-field>
|
|
|
|
<mat-form-field class="margin">
|
|
<mat-label>{{'turnovers.filter.motif' | i18n}}</mat-label>
|
|
<input type="text" matInput [value]="turnovers && turnovers.filter && turnovers.filter.motif || ''"
|
|
(input)="setInputFilter('motif', $event.target)">
|
|
</mat-form-field>
|
|
</form>
|
|
}
|
|
<span class="spacer"></span>
|
|
<a class="margin" mat-icon-button (click)="export()" title="{{'turnovers.export' | i18n}}" color="primary"
|
|
[disabled]="!turnovers.total">
|
|
<mat-icon>file_download</mat-icon>
|
|
</a>
|
|
</div>
|
|
}
|
|
|
|
<ui-turnovers #uiTurnovers class="flex column grow" [turnovers]="turnovers" [overview]="overview"
|
|
(page)="applyPage($event)" (sort)="applySort($event)"></ui-turnovers>
|
|
</div> |