[ADF-3459] fix datepicker validation regression (#3697)

* fix datepicker validation regression

* improved validation message

* update libs
This commit is contained in:
Denys Vuika 2018-08-14 14:17:44 +01:00 committed by Eugenio Romano
parent 9ac4dba207
commit d39de25fe9
4 changed files with 2962 additions and 2941 deletions

View File

@ -10,14 +10,8 @@
(focusout)="onChangedHandler($event, from)">
<mat-datepicker-toggle matSuffix [for]="fromDatepicker"></mat-datepicker-toggle>
<mat-datepicker #fromDatepicker></mat-datepicker>
<mat-error *ngIf="from.hasError('required') && !hasParseError(from)">
{{ 'SEARCH.FILTER.VALIDATION.REQUIRED-VALUE' | translate }}
</mat-error>
<mat-error *ngIf="from.hasError('matDatepickerMax')">
{{ 'SEARCH.FILTER.VALIDATION.BEYOND-MAX-DATE' | translate }}
</mat-error>
<mat-error *ngIf="hasParseError(from)">
{{ 'SEARCH.FILTER.VALIDATION.INVALID-DATE' | translate: { requiredFormat: datePickerDateFormat } }}
<mat-error *ngIf="from.invalid">
{{ getFromValidationMessage() | translate: { requiredFormat: datePickerDateFormat } }}
</mat-error>
</mat-form-field>
@ -33,17 +27,8 @@
(focusout)="onChangedHandler($event, to)">
<mat-datepicker-toggle matSuffix [for]="toDatepicker"></mat-datepicker-toggle>
<mat-datepicker #toDatepicker></mat-datepicker>
<mat-error *ngIf="to.hasError('required') && !hasParseError(to)">
{{ 'SEARCH.FILTER.VALIDATION.REQUIRED-VALUE' | translate }}
</mat-error>
<mat-error *ngIf="to.hasError('matDatepickerMin')">
{{ 'SEARCH.FILTER.VALIDATION.NO-DAYS' | translate }}
</mat-error>
<mat-error *ngIf="to.hasError('matDatepickerMax')">
{{ 'SEARCH.FILTER.VALIDATION.BEYOND-MAX-DATE' | translate }}
</mat-error>
<mat-error *ngIf="hasParseError(to)">
{{ 'SEARCH.FILTER.VALIDATION.INVALID-DATE' | translate: { requiredFormat: datePickerDateFormat } }}
<mat-error *ngIf="to.invalid">
{{ getToValidationMessage() | translate: { requiredFormat: datePickerDateFormat } }}
</mat-error>
</mat-form-field>

View File

@ -60,6 +60,21 @@ export class SearchDateRangeComponent implements SearchWidget, OnInit {
private userPreferencesService: UserPreferencesService) {
}
getFromValidationMessage(): string {
return this.from.hasError('matDatepickerParse') ? 'SEARCH.FILTER.VALIDATION.INVALID-DATE' :
this.from.hasError('matDatepickerMax') ? 'SEARCH.FILTER.VALIDATION.BEYOND-MAX-DATE' :
this.from.hasError('required') ? 'SEARCH.FILTER.VALIDATION.REQUIRED-VALUE' :
'';
}
getToValidationMessage(): string {
return this.to.hasError('matDatepickerParse') ? 'SEARCH.FILTER.VALIDATION.INVALID-DATE' :
this.to.hasError('matDatepickerMin') ? 'SEARCH.FILTER.VALIDATION.NO-DAYS' :
this.to.hasError('matDatepickerMax') ? 'SEARCH.FILTER.VALIDATION.BEYOND-MAX-DATE' :
this.to.hasError('required') ? 'SEARCH.FILTER.VALIDATION.REQUIRED-VALUE' :
'';
}
ngOnInit() {
if (this.settings) {
this.datePickerDateFormat = this.settings.dateFormat || DEFAULT_FORMAT_DATE;
@ -107,13 +122,17 @@ export class SearchDateRangeComponent implements SearchWidget, OnInit {
}
}
onChangedHandler(event: any, formControl) {
onChangedHandler(event: any, formControl: FormControl) {
const inputValue = event.srcElement.value;
if (inputValue) {
const formatDate = this.dateAdapter.parse(inputValue, this.datePickerDateFormat);
if (formatDate && formatDate.isValid()) {
formControl.setValue(formatDate);
} else {
formControl.setErrors({
'matDatepickerParse': true
});
}
}
}
@ -123,10 +142,6 @@ export class SearchDateRangeComponent implements SearchWidget, OnInit {
moment.locale(locale);
}
hasParseError(formControl) {
return formControl.hasError('matDatepickerParse') && formControl.getError('matDatepickerParse').text;
}
forcePlaceholder(event: any) {
event.srcElement.click();
}

5823
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -59,19 +59,19 @@
"@alfresco/adf-insights": "2.5.0-e54f9bc5fe08d3963ae86dac9aa60fbdf0bf2a41",
"@alfresco/adf-process-services": "2.5.0-e54f9bc5fe08d3963ae86dac9aa60fbdf0bf2a41",
"@angular-devkit/build-ng-packagr": "^0.7.1",
"@angular/animations": "6.1.0",
"@angular/cdk": "6.4.2",
"@angular/common": "6.1.0",
"@angular/compiler": "6.1.0",
"@angular/core": "6.1.0",
"@angular/animations": "6.1.2",
"@angular/cdk": "6.4.5",
"@angular/common": "6.1.2",
"@angular/compiler": "6.1.2",
"@angular/core": "6.1.2",
"@angular/flex-layout": "6.0.0-beta.16",
"@angular/forms": "6.1.0",
"@angular/http": "6.1.0",
"@angular/material": "6.4.2",
"@angular/material-moment-adapter": "6.4.2",
"@angular/platform-browser": "6.1.0",
"@angular/platform-browser-dynamic": "6.1.0",
"@angular/router": "6.1.0",
"@angular/forms": "6.1.2",
"@angular/http": "6.1.2",
"@angular/material": "6.4.5",
"@angular/material-moment-adapter": "6.4.5",
"@angular/platform-browser": "6.1.2",
"@angular/platform-browser-dynamic": "6.1.2",
"@angular/router": "6.1.2",
"@mat-datetimepicker/core": "2.0.1-beta.1",
"@mat-datetimepicker/moment": "2.0.1-beta.1",
"@ngx-translate/core": "10.0.2",
@ -103,8 +103,8 @@
},
"devDependencies": {
"@angular-devkit/build-angular": "^0.7.2",
"@angular/cli": "^6.2.0-beta.0",
"@angular/compiler-cli": "6.1.0",
"@angular/cli": "^6.1.3",
"@angular/compiler-cli": "6.1.2",
"@types/hammerjs": "2.0.35",
"@types/jasmine": "~2.8.3",
"@types/jasminewd2": "~2.0.2",
@ -160,10 +160,10 @@
"systemjs-builder": "0.15.34",
"traceur": "0.0.111",
"ts-node": "~4.1.0",
"tsickle": "^0.26.0",
"tsickle": "^0.32.1",
"tslint": "5.9.1",
"typedoc": "^0.11.1",
"typescript": "2.8.4",
"typescript": "2.9.2",
"url-join": "^4.0.0",
"webpack-bundle-analyzer": "^2.13.1",
"webpack-cli": "^3.1.0",