#57 added custom validations to the trigger form

This commit is contained in:
Fabio Formosa
2022-11-05 17:04:08 +01:00
parent a44d041e93
commit 014c348a89
3 changed files with 54 additions and 25 deletions

View File

@@ -29,7 +29,7 @@
>
<mat-label>Job Class *</mat-label>
<mat-select id="jobClass" name="jobClass" formControlName="jobClass" [disabled]="!enabledTriggerForm">
<mat-option *ngFor="let job of jobs" [value]="job">
<mat-option *ngFor="let job of jobs" [value]="job" style="font-size: 0.8em">
{{job}}
</mat-option>
</mat-select>
@@ -46,7 +46,7 @@
>
<mat-label>Misfire Instruction *</mat-label>
<mat-select id="misfireInstruction" name="misfireInstruction" formControlName="misfireInstruction"
[disabled]="!enabledTriggerForm">
[disabled]="!enabledTriggerForm" style="font-size: 0.8em">
<mat-option value="MISFIRE_INSTRUCTION_FIRE_NOW">FIRE NOW</mat-option>
<mat-option value="MISFIRE_INSTRUCTION_RESCHEDULE_NOW_WITH_EXISTING_REPEAT_COUNT">RESCHEDULE NOW WITH
EXISTING REPEAT COUNT
@@ -110,6 +110,9 @@
<!-- [enableMeridian]="enableMeridian" [disableMinute]="disableMinute" [hideTime]="hideTime">-->
</ngx-mat-datetime-picker>
</mat-form-field>
<mat-error *ngIf="simpleTriggerReactiveForm.controls.triggerPeriod.errors?.invalidTriggerPeriod" style="font-size: small">
the end date cannot be <strong>before</strong> the start date
</mat-error>
</div>
</div>
@@ -125,9 +128,14 @@
matInput placeholder="Repeat Interval [in mills]" type="number"
formControlName="repeatInterval" name="repeatInterval"
>
<mat-error *ngIf="simpleTriggerReactiveForm.controls.triggerRecurrence.errors?.invalidTriggerRecurrence">
repeatCount and repeatInterval must be <strong>both</strong> set or unset
</mat-error>
</mat-form-field>
<!-- <mat-error *ngIf="simpleTriggerReactiveForm.controls.triggerRecurrence.errors?.invalidTriggerRecurrence" style="font-size: small">-->
<!-- repeatCount and repeatInterval must be <strong>both</strong> set or unset-->
<!-- </mat-error>-->
</div>
<div>
<mat-form-field
[appearance]="enabledTriggerForm ? 'standard': 'none'"
@@ -139,10 +147,16 @@
matInput placeholder="Repeat Count (-1 REPEAT INDEFINITELY)" type="number"
formControlName="repeatCount" name="repeatCount"
>
<mat-error *ngIf="simpleTriggerReactiveForm.controls.triggerRecurrence.errors?.invalidTriggerRecurrence">
repeatCount and repeatInterval must be <strong>both</strong> set or unset
</mat-error>
</mat-form-field>
</div>
</div>
<br/>
<button mat-raised-button
type="button"
*ngIf="enabledTriggerForm"

View File

@@ -107,6 +107,12 @@ describe('SimpleTriggerConfig', () => {
expect(submitButton.nativeElement.getAttribute('disabled')).toEqual('');
setMatSelectValueByIndex(componentDe, '#jobClass', 0);
expect(submitButton.nativeElement.getAttribute('disabled')).toEqual(null);
setInputValue(componentDe, '#repeatCount', '1000');
expect(submitButton.nativeElement.getAttribute('disabled')).toEqual('');
setInputValue(componentDe, '#repeatInterval', '2000');
expect(submitButton.nativeElement.getAttribute('disabled')).toEqual(null);
}
it('should enabled the submit only when the form is valid', () => {

View File

@@ -8,7 +8,7 @@ import * as moment from 'moment';
import {TriggerKey} from '../../model/triggerKey.model';
import JobService from '../../services/job.service';
import {MisfireInstruction, MisfireInstructionCaption} from '../../model/misfire-instruction.model';
import {FormBuilder, FormControl, FormGroup, Validators} from '@angular/forms';
import {AbstractControl, FormBuilder, FormControl, FormGroup, ValidationErrors, ValidatorFn, Validators} from '@angular/forms';
@Component({
selector: 'qrzmng-simple-trigger-config',
@@ -25,17 +25,14 @@ export class SimpleTriggerConfigComponent implements OnInit {
triggerPeriod: this.formBuilder.group({
startDate: [this.trigger?.startTime && moment(this.trigger?.startTime)],
endDate: [this.trigger?.endTime && moment(this.trigger?.endTime)]
}),
}, {validators: this._triggerPeriodValidator}),
triggerRecurrence: this.formBuilder.group({
repeatCount: [this.trigger?.repeatCount],
repeatInterval: [this.trigger?.repeatInterval]
}),
}, {validators: this._triggerRepetitionValidator}),
misfireInstruction: [MisfireInstruction[this.trigger?.misfireInstruction], Validators.required]
});
// simpleTriggerForm: SimpleTriggerForm = new SimpleTriggerForm();
// formBackup: SimpleTriggerForm = new SimpleTriggerForm();
scheduler: Scheduler;
triggerLoading = true;
@@ -88,8 +85,6 @@ export class SimpleTriggerConfigComponent implements OnInit {
.subscribe((retTrigger: SimpleTrigger) => {
this.trigger = retTrigger;
this.simpleTriggerReactiveForm.setValue(this._fromTriggerToReactiveForm(retTrigger))
// this.formBackup = this.simpleTriggerForm;
// this.simpleTriggerForm = this._fromTriggerToForm(retTrigger);
this.triggerLoading = false;
this.triggerInProgress = this.trigger.mayFireAgain;
})
@@ -129,6 +124,30 @@ export class SimpleTriggerConfigComponent implements OnInit {
}
private _triggerPeriodValidator(control: AbstractControl): ValidationErrors | null {
const startDate = control.get('startDate');
const endDate = control.get('endDate');
if (startDate.value && endDate.value) {
return endDate.value.isBefore(startDate.value) ?
<ValidationErrors>{invalidTriggerPeriod: true} : null;
}
return null;
}
private _triggerRepetitionValidator(control: AbstractControl): ValidationErrors | null {
const repeatInterval = control.get('repeatInterval');
const repeatCount = control.get('repeatCount');
if ((repeatCount.value && repeatInterval.value) || (!repeatCount.value && !repeatInterval.value)) {
repeatInterval.setErrors(null);
repeatCount.setErrors(null);
return null;
}
const errors = <ValidationErrors>{invalidTriggerRecurrence: true};
repeatInterval.setErrors(errors);
repeatCount.setErrors(errors);
return errors;
}
private _fromTriggerToReactiveForm = (simpleTrigger: SimpleTrigger): SimpleTriggerReactiveForm => {
const simpleTriggerReactiveForm = new SimpleTriggerReactiveForm();
simpleTriggerReactiveForm.triggerName = simpleTrigger.triggerKeyDTO.name;
@@ -137,22 +156,11 @@ export class SimpleTriggerConfigComponent implements OnInit {
simpleTriggerReactiveForm.triggerRecurrence.repeatInterval = simpleTrigger.repeatInterval || null;
simpleTriggerReactiveForm.triggerPeriod.startDate = (simpleTrigger.startTime && moment(simpleTrigger.startTime)) || null;
simpleTriggerReactiveForm.triggerPeriod.endDate = (simpleTrigger.endTime && moment(simpleTrigger.endTime)) || null;
simpleTriggerReactiveForm.misfireInstruction = (simpleTrigger.misfireInstruction && MisfireInstruction[simpleTrigger.misfireInstruction]) || null;
simpleTriggerReactiveForm.misfireInstruction = (simpleTrigger.misfireInstruction
&& MisfireInstruction[simpleTrigger.misfireInstruction]) || null;
return simpleTriggerReactiveForm;
};
private _fromTriggerToForm = (simpleTrigger: SimpleTrigger): SimpleTriggerForm => {
const command = new SimpleTriggerForm();
command.triggerName = simpleTrigger.triggerKeyDTO.name;
command.jobClass = simpleTrigger.jobDetailDTO.jobClassName;
command.repeatCount = simpleTrigger.repeatCount;
command.repeatInterval = simpleTrigger.repeatInterval;
command.startDate = moment(simpleTrigger.startTime);
command.endDate = moment(simpleTrigger.endTime);
command.misfireInstruction = MisfireInstruction[simpleTrigger.misfireInstruction];
return command;
}
private _fromReactiveFormToCommand = (): SimpleTriggerCommand => {
const reactiveFormValue = this.simpleTriggerReactiveForm.value;
const simpleTriggerCommand = new SimpleTriggerCommand();
@@ -167,7 +175,8 @@ export class SimpleTriggerConfigComponent implements OnInit {
}
getMisfireInstructionCaption(): string {
const misfireInstructionKey = this.simpleTriggerReactiveForm.controls.misfireInstruction.value as unknown as keyof typeof MisfireInstruction;
const misfireInstructionKey = this.simpleTriggerReactiveForm.controls
.misfireInstruction.value as unknown as keyof typeof MisfireInstruction;
return MisfireInstructionCaption.get(MisfireInstruction[misfireInstructionKey]);
}
}