94 lines
5.2 KiB
TypeScript
94 lines
5.2 KiB
TypeScript
import { Component, Inject } from '@angular/core';
|
|
import { AbstractControl, FormArray, FormControl, FormGroup } from '@angular/forms';
|
|
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
|
|
import { TranslateService } from '@ngx-translate/core';
|
|
|
|
@Component({
|
|
selector: 'app-form-validation-errors-dialog',
|
|
templateUrl: './form-validation-errors-dialog.component.html',
|
|
styleUrls: ['./form-validation-errors-dialog.component.scss']
|
|
})
|
|
export class FormValidationErrorsDialogComponent {
|
|
|
|
formGroup: FormGroup;
|
|
errorMessages: string[] = [];
|
|
|
|
constructor(public dialogRef: MatDialogRef<FormValidationErrorsDialogComponent>,
|
|
@Inject(MAT_DIALOG_DATA) public data: any,
|
|
private language: TranslateService
|
|
) {
|
|
if (data.formGroup !== undefined && data.formGroup !== null) {
|
|
this.formGroup = data.formGroup;
|
|
this.errorMessages = this.getErrors(this.formGroup);
|
|
} else if (data.errorMessages !== undefined && data.errorMessages !== null) {
|
|
this.errorMessages = data.errorMessages;
|
|
}
|
|
}
|
|
|
|
onClose(): void {
|
|
this.dialogRef.close();
|
|
}
|
|
|
|
public getErrors(formControl: AbstractControl, key?: string): string[] {
|
|
const errors: string[] = [];
|
|
if (formControl instanceof FormControl) {
|
|
if (formControl.errors !== null) {
|
|
let name: string;
|
|
if ((<any>formControl).nativeElement !== undefined && (<any>formControl).nativeElement !== null) {
|
|
name = this.getPlaceHolder(formControl);
|
|
} else {
|
|
name = key;
|
|
}
|
|
errors.push(...this.getErrorMessage(formControl, name));
|
|
}
|
|
} else if (formControl instanceof FormGroup) {
|
|
if (formControl.errors) { (errors.push(...Object.values(formControl.errors).map(x => x.message) as string[])); }
|
|
Object.keys(formControl.controls).forEach(key => {
|
|
const control = formControl.get(key);
|
|
errors.push(...this.getErrors(control, key));
|
|
});
|
|
} else if (formControl instanceof FormArray) {
|
|
if (formControl.errors) { (errors.push(...Object.values(formControl.errors).map(x => x.message) as string[])); }
|
|
formControl.controls.forEach(item => {
|
|
errors.push(...this.getErrors(item));
|
|
});
|
|
}
|
|
return errors;
|
|
}
|
|
|
|
getErrorMessage(formControl: FormControl, name: string): string[] {
|
|
const errors: string[] = [];
|
|
Object.keys(formControl.errors).forEach(key => {
|
|
if (key === 'required') { errors.push(this.language.instant(name + ": " + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.REQUIRED'))); }
|
|
// if (key === 'required') { errors.push(this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.THIS-FIELD') + ' "' + this.getPlaceHolder(formControl) + '" ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.HAS-ERROR') + ', ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.REQUIRED')); }
|
|
else if (key === 'email') { errors.push(this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.THIS-FIELD') + ' "' + name + '" ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.HAS-ERROR') + ', ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.EMAIL')); }
|
|
else if (key === 'min') { errors.push(this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.THIS-FIELD') + ' "' + name + '" ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.HAS-ERROR') + ', ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.MIN-VALUE', { 'min': formControl.getError('min').min })); }
|
|
else if (key === 'max') { errors.push(this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.THIS-FIELD') + ' "' + name + '" ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.HAS-ERROR') + ', ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.MAX-VALUE', { 'max': formControl.getError('max').max })); }
|
|
else { errors.push(this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.THIS-FIELD') + ' "' + name + '" ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.HAS-ERROR') + ', ' + formControl.errors[key].message); }
|
|
});
|
|
return errors;
|
|
}
|
|
|
|
getPlaceHolder(formControl: any): string {
|
|
if (formControl.nativeElement.localName === 'input' || formControl.nativeElement.localName === 'textarea'
|
|
|| formControl.nativeElement.localName === 'richTextarea') {
|
|
return formControl.nativeElement.getAttribute('placeholder');
|
|
} else if (formControl.nativeElement.localName === 'mat-select') {
|
|
return formControl.nativeElement.getAttribute('placeholder');
|
|
} else if (formControl.nativeElement.localName === 'app-single-auto-complete') {
|
|
return (Array.from(formControl.nativeElement.firstChild.children).filter((x: any) => x.localName === 'input')[0] as any).getAttribute('placeholder');
|
|
} else if (formControl.nativeElement.localName === 'app-multiple-auto-complete') {
|
|
return (Array.from(formControl.nativeElement.firstChild.firstChild.firstChild.children).filter((x: any) => x.localName === 'input')[0] as any).getAttribute('placeholder');
|
|
}
|
|
|
|
// Needs to have <mat-label> in <mat-form-field> in html in order to fill results
|
|
// let result = '';
|
|
// try {
|
|
// result = (Array.from(formControl.nativeElement.parentElement.children).filter((x: any) => Array.from(x.classList).includes('mat-form-field-label-wrapper'))[0] as any).innerText;
|
|
// result = result.replace(' *', '');
|
|
// } catch (error) { }
|
|
|
|
// return result;
|
|
}
|
|
}
|