2019-12-11 15:51:03 +01:00
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
) {
2020-09-22 10:27:10 +02:00
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 ;
}
2019-12-11 15:51:03 +01:00
}
onClose ( ) : void {
this . dialogRef . close ( ) ;
}
2020-10-13 11:55:11 +02:00
public getErrors ( formControl : AbstractControl , key? : string ) : string [ ] {
2019-12-11 15:51:03 +01:00
const errors : string [ ] = [ ] ;
if ( formControl instanceof FormControl ) {
2020-10-13 11:55:11 +02:00
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 ) ) ;
}
2019-12-11 15:51:03 +01:00
} else if ( formControl instanceof FormGroup ) {
if ( formControl . errors ) { ( errors . push ( . . . Object . values ( formControl . errors ) . map ( x = > x . message ) as string [ ] ) ) ; }
2020-10-13 11:55:11 +02:00
Object . keys ( formControl . controls ) . forEach ( key = > {
const control = formControl . get ( key ) ;
errors . push ( . . . this . getErrors ( control , key ) ) ;
2019-12-11 15:51:03 +01:00
} ) ;
} 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 ;
}
2020-10-13 11:55:11 +02:00
getErrorMessage ( formControl : FormControl , name : string ) : string [ ] {
2019-12-11 15:51:03 +01:00
const errors : string [ ] = [ ] ;
Object . keys ( formControl . errors ) . forEach ( key = > {
2020-10-13 11:55:11 +02:00
if ( key === 'required' ) { errors . push ( this . language . instant ( name + ": " + this . language . instant ( 'GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.REQUIRED' ) ) ) ; }
2020-09-25 13:03:04 +02:00
// 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')); }
2020-10-13 11:55:11 +02:00
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 ) ; }
2019-12-11 15:51:03 +01:00
} ) ;
return errors ;
}
getPlaceHolder ( formControl : any ) : string {
2020-10-13 11:55:11 +02:00
if ( formControl . nativeElement . localName === 'input' || formControl . nativeElement . localName === 'textarea' ) {
2020-09-25 13:03:04 +02:00
return formControl . nativeElement . getAttribute ( 'placeholder' ) ;
} else if ( formControl . nativeElement . localName === 'mat-select' ) {
return formControl . nativeElement . getAttribute ( 'aria-label' ) ;
} 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 . children ) . filter ( ( x : any ) = > x . localName === 'input' ) [ 0 ] as any ) . getAttribute ( 'placeholder' ) ;
}
2019-12-11 15:51:03 +01:00
2020-09-25 13:03:04 +02:00
// 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) { }
2019-12-11 15:51:03 +01:00
2020-09-25 13:03:04 +02:00
// return result;
2019-12-11 15:51:03 +01:00
}
}