mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-05-26 17:24:56 +00:00
46 lines
2.3 KiB
HTML
46 lines
2.3 KiB
HTML
<form [formGroup]="form" novalidate (ngSubmit)="apply(form.value, form.valid)">
|
|
<mat-form-field>
|
|
<input matInput
|
|
(input)="forcePlaceholder($event)"
|
|
[formControl]="from"
|
|
[errorStateMatcher]="matcher"
|
|
placeholder="{{ 'SEARCH.FILTER.RANGE.FROM-DATE' | translate }}"
|
|
[matDatepicker]="fromDatepicker"
|
|
[max]="maxDate"
|
|
(focusout)="onChangedHandler($event, from)"
|
|
data-automation-id="date-range-from-input">
|
|
<mat-datepicker-toggle matSuffix [for]="fromDatepicker" data-automation-id="date-range-from-date-toggle"></mat-datepicker-toggle>
|
|
<mat-datepicker #fromDatepicker></mat-datepicker>
|
|
<mat-error *ngIf="from.invalid" data-automation-id="date-range-from-error">
|
|
{{ getFromValidationMessage() | translate: { requiredFormat: datePickerDateFormat } }}
|
|
</mat-error>
|
|
</mat-form-field>
|
|
|
|
<mat-form-field>
|
|
<input matInput
|
|
(input)="forcePlaceholder($event)"
|
|
[formControl]="to"
|
|
[errorStateMatcher]="matcher"
|
|
placeholder="{{ 'SEARCH.FILTER.RANGE.TO-DATE' | translate }}"
|
|
[matDatepicker]="toDatepicker"
|
|
[min]="from.value"
|
|
[max]="maxDate"
|
|
(focusout)="onChangedHandler($event, to)"
|
|
data-automation-id="date-range-to-input">
|
|
<mat-datepicker-toggle matSuffix [for]="toDatepicker" data-automation-id="date-range-to-date-toggle"></mat-datepicker-toggle>
|
|
<mat-datepicker #toDatepicker></mat-datepicker>
|
|
<mat-error *ngIf="to.invalid" data-automation-id="date-range-to-error">
|
|
{{ getToValidationMessage() | translate: { requiredFormat: datePickerDateFormat } }}
|
|
</mat-error>
|
|
</mat-form-field>
|
|
|
|
<div class="facet-buttons facet-buttons--topSpace">
|
|
<button mat-button color="primary" type="button" (click)="reset()" data-automation-id="date-range-clear-btn">
|
|
{{ 'SEARCH.FILTER.ACTIONS.CLEAR' | translate }}
|
|
</button>
|
|
<button mat-button color="primary" type="submit" [disabled]="!form.valid" data-automation-id="date-range-apply-btn">
|
|
{{ 'SEARCH.FILTER.ACTIONS.APPLY' | translate }}
|
|
</button>
|
|
</div>
|
|
</form>
|