diff --git a/utils/rangeFilter/rangeFilter.component.html b/utils/rangeFilter/rangeFilter.component.html index e7efdc35..49f2e350 100644 --- a/utils/rangeFilter/rangeFilter.component.html +++ b/utils/rangeFilter/rangeFilter.component.html @@ -10,52 +10,43 @@
-
- + +
- - +
- -
-
+
+
Year must be between {{yearMin}} and {{yearMax}}.
-
+
Starting year must be greater than or equal to ending year.
-
+
Both starting and ending year are required
- -
- - -
+
+
  • @@ -107,7 +98,7 @@
- +
diff --git a/utils/rangeFilter/rangeFilter.component.ts b/utils/rangeFilter/rangeFilter.component.ts index dfd6f7e6..a89d5c55 100644 --- a/utils/rangeFilter/rangeFilter.component.ts +++ b/utils/rangeFilter/rangeFilter.component.ts @@ -1,9 +1,9 @@ -import {Component, Input, Output, EventEmitter} from '@angular/core'; -import { RangeFilter } from './rangeFilterHelperClasses.class'; -import { Dates } from "../string-utils.class"; +import {Component, EventEmitter, Input, Output} from '@angular/core'; +import {RangeFilter} from './rangeFilterHelperClasses.class'; +import {Dates, StringUtils} from "../string-utils.class"; import {ActivatedRoute, Router} from "@angular/router"; -import {Filter, Value} from "../../searchPages/searchUtils/searchHelperClasses.class"; import {properties} from "../../../../environments/environment"; +import {FormBuilder} from "@angular/forms"; @Component({ selector: 'range-filter', @@ -21,13 +21,23 @@ export class RangeFilterComponent { @Input() yearMax: number = Dates.yearMax; @Input() mandatoryRange:boolean = false; public currentYear: number = Dates.currentYear; + public yearValidators = [StringUtils.inValidYearValidator(this.yearMin, this.yearMax)]; + public formValidators = [StringUtils.fromYearAfterToYearValidator]; + public rangeForm; @Output() onFilterChange = new EventEmitter(); @Input() actionRoute:boolean = false; queryParams = {}; - constructor(private _router: Router, private route: ActivatedRoute) {} + constructor(private _router: Router, private route: ActivatedRoute, private _fb: FormBuilder) {} ngOnInit() { + if(this.mandatoryRange) { + this.formValidators.push(StringUtils.rangeRequired(this.mandatoryRange)); + } + this.rangeForm = this._fb.group({ + yearFrom: [this.filter.selectedFromValue, this.yearValidators], + yearTo: [this.filter.selectedToValue, this.yearValidators] + }, {validators: this.formValidators}); this.route.queryParams.subscribe(params => { this.queryParams = Object.assign({}, params); }); diff --git a/utils/rangeFilter/rangeFilter.module.ts b/utils/rangeFilter/rangeFilter.module.ts index cb0266fd..95069b5f 100644 --- a/utils/rangeFilter/rangeFilter.module.ts +++ b/utils/rangeFilter/rangeFilter.module.ts @@ -1,16 +1,17 @@ -import { NgModule} from '@angular/core'; -import { CommonModule } from '@angular/common'; -import { FormsModule } from '@angular/forms'; -import { RouterModule } from '@angular/router'; +import {NgModule} from '@angular/core'; +import {CommonModule} from '@angular/common'; +import {ReactiveFormsModule} from '@angular/forms'; +import {RouterModule} from '@angular/router'; import {RangeFilterComponent} from './rangeFilter.component'; import {InValidYearValidatorDirective} from "./inValidYear.directive"; import {FromYearAfterToYearValidatorDirective} from "./fromYearAfterToYear.directive"; import {RangeYearsRequiredDirective} from "./rangeYearsRequired.directive"; +import {InputModule} from "../../sharedComponents/input/input.module"; @NgModule({ imports: [ - CommonModule, FormsModule, RouterModule + CommonModule, RouterModule, InputModule, ReactiveFormsModule ], declarations: [ RangeFilterComponent, InValidYearValidatorDirective, FromYearAfterToYearValidatorDirective, RangeYearsRequiredDirective diff --git a/utils/string-utils.class.ts b/utils/string-utils.class.ts index e597a3a7..bf517bbc 100644 --- a/utils/string-utils.class.ts +++ b/utils/string-utils.class.ts @@ -1,5 +1,5 @@ import {UrlSegment} from '@angular/router'; -import {AbstractControl, ValidationErrors, ValidatorFn, Validators} from "@angular/forms"; +import {AbstractControl, FormGroup, ValidationErrors, ValidatorFn, Validators} from "@angular/forms"; import {Stakeholder} from "../monitor/entities/stakeholder"; import {CommunityInfo} from "../connect/community/communityInfo"; import {properties} from "../../../environments/environment"; @@ -417,4 +417,24 @@ export class StringUtils { } return html; } + + public static inValidYearValidator(minYear, maxYear): ValidatorFn { + return (control: AbstractControl): {[key: string]: any} | null => { + return ((control.value && !Dates.isValidYear(control.value, minYear, maxYear)) ? {'inValidYear': {value: control.value}} : null); + }; + } + + public static fromYearAfterToYearValidator: ValidatorFn = (control: FormGroup): ValidationErrors | null => { + const yearFrom = control.get('yearFrom'); + const yearTo = control.get('yearTo'); + return ((yearFrom && yearTo && (parseInt(yearFrom.value, 10) > parseInt(yearTo.value, 10))) ? { 'fromYearAfterToYear': true } : null); + } + + public static rangeRequired( enabled:boolean): ValidatorFn { + return (control: AbstractControl): ValidationErrors | null => { + const yearFrom = control.get('yearFrom'); + const yearTo = control.get('yearTo'); + return ((yearFrom && yearTo && enabled && (yearFrom.value == "" || yearTo.value == "")) ? { 'rangeRequired': true } : null); + }; + } }