From: Galen Charlton Date: Thu, 3 Jun 2021 21:08:37 +0000 (-0400) Subject: LP#1904244: fm-editor: add min/max field options X-Git-Url: https://old-git.evergreen-ils.org/?a=commitdiff_plain;h=cf991b9d11966db149adce7f1091fdaf8d1631c7;p=evergreen%2Fpines.git LP#1904244: fm-editor: add min/max field options This currently apply to 'int' type fields. Signed-off-by: Galen Charlton Signed-off-by: Ruth Frasur Signed-off-by: Bill Erickson --- diff --git a/Open-ILS/src/eg2/src/app/share/fm-editor/fm-editor.component.html b/Open-ILS/src/eg2/src/app/share/fm-editor/fm-editor.component.html index 1367040e57..859dc0b6c4 100644 --- a/Open-ILS/src/eg2/src/app/share/fm-editor/fm-editor.component.html +++ b/Open-ILS/src/eg2/src/app/share/fm-editor/fm-editor.component.html @@ -113,6 +113,8 @@ placeholder="{{field.label}}..." i18n-placeholder [required]="field.isRequired()" + egMin="{{field.min}}" + egMax="{{field.max}}" [ngModel]="record[field.name]()" (ngModelChange)="record[field.name]($event)"/> diff --git a/Open-ILS/src/eg2/src/app/share/fm-editor/fm-editor.component.ts b/Open-ILS/src/eg2/src/app/share/fm-editor/fm-editor.component.ts index fd59734693..94b354927f 100644 --- a/Open-ILS/src/eg2/src/app/share/fm-editor/fm-editor.component.ts +++ b/Open-ILS/src/eg2/src/app/share/fm-editor/fm-editor.component.ts @@ -16,6 +16,8 @@ import {FormatService} from '@eg/core/format.service'; import {TranslateComponent} from '@eg/share/translate/translate.component'; import {FmRecordEditorActionComponent} from './fm-editor-action.component'; import {ConfirmDialogComponent} from '@eg/share/dialog/confirm.component'; +import {Directive, HostBinding} from '@angular/core'; +import {AbstractControl, NG_VALIDATORS, ValidationErrors, Validator, Validators} from '@angular/forms'; interface CustomFieldTemplate { template: TemplateRef; @@ -84,6 +86,10 @@ export interface FmFieldOptions { // help text to display via a popover helpText?: StringComponent; + + // minimum and maximum permitted values for int fields + min?: number; + max?: number; } @Component({ @@ -563,6 +569,13 @@ export class FmRecordEditorComponent field.helpText.current().then(help => field.helpTextValue = help); } + if (fieldOptions.min) { + field.min = Number(fieldOptions.min); + } + if (fieldOptions.max) { + field.max = Number(fieldOptions.max); + } + return promise || Promise.resolve(); } @@ -795,3 +808,32 @@ export class FmRecordEditorComponent } } +// https://stackoverflow.com/a/57812865 +@Directive({ + selector: 'input[type=number][egMin][formControlName],input[type=number][egMin][formControl],input[type=number][egMin][ngModel]', + providers: [{ provide: NG_VALIDATORS, useExisting: MinValidatorDirective, multi: true }] +}) +export class MinValidatorDirective implements Validator { + @HostBinding('attr.egMin') @Input() egMin: number; + + constructor() { } + + validate(control: AbstractControl): ValidationErrors | null { + const validator = Validators.min(this.egMin); + return validator(control); + } +} +@Directive({ + selector: 'input[type=number][egMax][formControlName],input[type=number][egMax][formControl],input[type=number][egMax][ngModel]', + providers: [{ provide: NG_VALIDATORS, useExisting: MaxValidatorDirective, multi: true }] +}) +export class MaxValidatorDirective implements Validator { + @HostBinding('attr.egMax') @Input() egMax: number; + + constructor() { } + + validate(control: AbstractControl): ValidationErrors | null { + const validator = Validators.max(this.egMax); + return validator(control); + } +} diff --git a/Open-ILS/src/eg2/src/app/share/fm-editor/fm-editor.module.ts b/Open-ILS/src/eg2/src/app/share/fm-editor/fm-editor.module.ts index 1a955040c8..8bf1c68eb8 100644 --- a/Open-ILS/src/eg2/src/app/share/fm-editor/fm-editor.module.ts +++ b/Open-ILS/src/eg2/src/app/share/fm-editor/fm-editor.module.ts @@ -4,14 +4,16 @@ import {StaffCommonModule} from '@eg/staff/common.module'; import {CommonWidgetsModule} from '@eg/share/common-widgets.module'; import {StringModule} from '@eg/share/string/string.module'; import {TranslateModule} from '@eg/share/translate/translate.module'; -import {FmRecordEditorComponent} from './fm-editor.component'; +import {FmRecordEditorComponent, MinValidatorDirective, MaxValidatorDirective} from './fm-editor.component'; import {FmRecordEditorActionComponent} from './fm-editor-action.component'; @NgModule({ declarations: [ FmRecordEditorComponent, - FmRecordEditorActionComponent + FmRecordEditorActionComponent, + MinValidatorDirective, + MaxValidatorDirective ], imports: [ EgCommonModule,