add description save validation error dialog
This commit is contained in:
parent
7cb559bf31
commit
5bfe76f5c6
|
@ -48,6 +48,7 @@ import { DescriptionTemplate, DescriptionTemplateField, DescriptionTemplateField
|
|||
import { DmpDescriptionTemplate } from '@app/core/model/dmp/dmp';
|
||||
import { FileTransformerEntityType } from '@app/core/common/enum/file-transformer-entity-type';
|
||||
import { nameof } from 'ts-simple-nameof';
|
||||
import { AbstractControl, UntypedFormArray, UntypedFormGroup } from '@angular/forms';
|
||||
|
||||
@Component({
|
||||
selector: 'app-description-editor-component',
|
||||
|
@ -661,8 +662,11 @@ export class DescriptionEditorComponent extends BaseEditor<DescriptionEditorMode
|
|||
this.formService.removeAllBackEndErrors(this.formGroup);
|
||||
this.formService.touchAllFormFields(this.formGroup);
|
||||
if (this.formGroup.get('label').valid && this.formGroup.get('dmpId').valid && this.formGroup.get('dmpDescriptionTemplateId').valid
|
||||
&& this.formGroup.get('dmpDescriptionTemplateId').valid && this.formGroup.get('status').valid) {
|
||||
&& this.formGroup.get('descriptionTemplateId').valid && this.formGroup.get('status').valid) {
|
||||
this.persistEntity(onSuccess);
|
||||
} else{
|
||||
const errorMessages = this._buildSemiFormErrorMessages();
|
||||
this.showSaveStateValidationErrorsDialog(undefined, errorMessages);
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -753,6 +757,120 @@ export class DescriptionEditorComponent extends BaseEditor<DescriptionEditorMode
|
|||
this.router.navigate(['/plans', 'edit', this.formGroup.get('dmpId').value]);
|
||||
}
|
||||
|
||||
private showSaveStateValidationErrorsDialog(projectOnly?: boolean, errmess?: string[]) {
|
||||
if (errmess) {
|
||||
const dialogRef = this.dialog.open(FormValidationErrorsDialogComponent, {
|
||||
disableClose: true,
|
||||
autoFocus: false,
|
||||
restoreFocus: false,
|
||||
data: {
|
||||
errorMessages: errmess,
|
||||
projectOnly: projectOnly
|
||||
},
|
||||
});
|
||||
} else {
|
||||
|
||||
const dialogRef = this.dialog.open(FormValidationErrorsDialogComponent, {
|
||||
disableClose: true,
|
||||
autoFocus: false,
|
||||
restoreFocus: false,
|
||||
data: {
|
||||
formGroup: this.formGroup,
|
||||
projectOnly: projectOnly
|
||||
},
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
private _buildSemiFormErrorMessages(): string[] {
|
||||
const errmess: string[] = [];
|
||||
Object.keys(this.formGroup.controls).forEach(controlName => {
|
||||
if (controlName != 'properties' && this.formGroup.get(controlName).invalid) {
|
||||
errmess.push(...this._buildErrorMessagesForAbstractControl(this.formGroup.get(controlName), controlName));
|
||||
}
|
||||
})
|
||||
|
||||
return errmess;
|
||||
}
|
||||
|
||||
// takes as an input an abstract control and gets its error messages[]
|
||||
private _buildErrorMessagesForAbstractControl(aControl: AbstractControl, controlName: string): string[] {
|
||||
const errmess: string[] = [];
|
||||
|
||||
if (aControl.invalid) {
|
||||
|
||||
if (aControl.errors) {
|
||||
//check if has placeholder
|
||||
if ((<any>aControl).nativeElement !== undefined && (<any>aControl).nativeElement !== null) {
|
||||
const placeholder = this._getPlaceHolder(aControl);
|
||||
if (placeholder) {
|
||||
controlName = placeholder;
|
||||
}
|
||||
}
|
||||
const errorMessage = this._getErrorMessage(aControl, controlName);
|
||||
|
||||
errmess.push(...errorMessage);
|
||||
}
|
||||
|
||||
/*in case the aControl is FormControl then the it should have provided its error messages above.
|
||||
No need to check case of FormControl below*/
|
||||
|
||||
if (aControl instanceof UntypedFormGroup) {
|
||||
|
||||
const fg = aControl as UntypedFormGroup;
|
||||
//check children
|
||||
Object.keys(fg.controls).forEach(controlName => {
|
||||
errmess.push(...this._buildErrorMessagesForAbstractControl(fg.get(controlName), controlName));
|
||||
});
|
||||
} else if (aControl instanceof UntypedFormArray) {
|
||||
|
||||
const fa = aControl as UntypedFormArray;
|
||||
|
||||
fa.controls.forEach((control, index) => {
|
||||
errmess.push(...this._buildErrorMessagesForAbstractControl(control, `${controlName} --> ${index + 1}`));
|
||||
});
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
return errmess;
|
||||
}
|
||||
|
||||
private _getErrorMessage(formControl: AbstractControl, 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(name == 'label') errors.push(this.language.instant(this.language.instant('DESCRIPTION-EDITOR.BASE-INFO.FIELDS.DESCRIPTION') + ": " + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.REQUIRED')));
|
||||
else if(name == 'descriptionTemplateId') errors.push(this.language.instant(this.language.instant('DESCRIPTION-EDITOR.BASE-INFO.FIELDS.DESCRIPTION-TEMPLATE') + ": " + 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;
|
||||
}
|
||||
|
||||
private _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');
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
//
|
||||
// Misc
|
||||
|
@ -1854,26 +1972,6 @@ export class DescriptionEditorComponent extends BaseEditor<DescriptionEditorMode
|
|||
// }
|
||||
|
||||
|
||||
// private _getErrorMessage(formControl: AbstractControl, 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;
|
||||
// }
|
||||
|
||||
// private _getPlaceHolder(formControl: any): string {
|
||||
// if (formControl.nativeElement.localName === 'input' || formControl.nativeElement.localName === 'textarea'
|
||||
// || formControl.nativeElement.localName === 'richTextarea') {
|
||||
|
@ -1888,60 +1986,6 @@ export class DescriptionEditorComponent extends BaseEditor<DescriptionEditorMode
|
|||
// }
|
||||
|
||||
|
||||
// private _buildSemiFormErrorMessages(): string[] {//not including descriptionProfileDefinition
|
||||
// const errmess: string[] = [];
|
||||
// Object.keys(this.formGroup.controls).forEach(controlName => {
|
||||
// if (controlName != 'descriptionProfileDefinition' && this.formGroup.get(controlName).invalid) {
|
||||
// errmess.push(...this._buildErrorMessagesForAbstractControl(this.formGroup.get(controlName), controlName));
|
||||
// }
|
||||
// })
|
||||
|
||||
// return errmess;
|
||||
// }
|
||||
|
||||
// // takes as an input an abstract control and gets its error messages[]
|
||||
// private _buildErrorMessagesForAbstractControl(aControl: AbstractControl, controlName: string): string[] {
|
||||
// const errmess: string[] = [];
|
||||
|
||||
// if (aControl.invalid) {
|
||||
|
||||
// if (aControl.errors) {
|
||||
// //check if has placeholder
|
||||
// if ((<any>aControl).nativeElement !== undefined && (<any>aControl).nativeElement !== null) {
|
||||
// const placeholder = this._getPlaceHolder(aControl);
|
||||
// if (placeholder) {
|
||||
// controlName = placeholder;
|
||||
// }
|
||||
// }
|
||||
// const errorMessage = this._getErrorMessage(aControl, controlName);
|
||||
|
||||
// errmess.push(...errorMessage);
|
||||
// }
|
||||
|
||||
// /*in case the aControl is FormControl then the it should have provided its error messages above.
|
||||
// No need to check case of FormControl below*/
|
||||
|
||||
// if (aControl instanceof UntypedFormGroup) {
|
||||
|
||||
// const fg = aControl as UntypedFormGroup;
|
||||
// //check children
|
||||
// Object.keys(fg.controls).forEach(controlName => {
|
||||
// errmess.push(...this._buildErrorMessagesForAbstractControl(fg.get(controlName), controlName));
|
||||
// });
|
||||
// } else if (aControl instanceof UntypedFormArray) {
|
||||
|
||||
// const fa = aControl as UntypedFormArray;
|
||||
|
||||
// fa.controls.forEach((control, index) => {
|
||||
// errmess.push(...this._buildErrorMessagesForAbstractControl(control, `${controlName} --> ${index + 1}`));
|
||||
// });
|
||||
|
||||
// }
|
||||
// }
|
||||
|
||||
// return errmess;
|
||||
// }
|
||||
|
||||
// save(saveType?: SaveType) {
|
||||
// this.saving = true;
|
||||
// Object.keys(this.formGroup.controls).forEach(controlName => {
|
||||
|
@ -1964,32 +2008,6 @@ export class DescriptionEditorComponent extends BaseEditor<DescriptionEditorMode
|
|||
// this.submit(saveType);
|
||||
// }
|
||||
|
||||
// private showValidationErrorsDialog(projectOnly?: boolean, errmess?: string[]) {
|
||||
// if (errmess) {
|
||||
// const dialogRef = this.dialog.open(FormValidationErrorsDialogComponent, {
|
||||
// disableClose: true,
|
||||
// autoFocus: false,
|
||||
// restoreFocus: false,
|
||||
// data: {
|
||||
// errorMessages: errmess,
|
||||
// projectOnly: projectOnly
|
||||
// },
|
||||
// });
|
||||
// } else {
|
||||
|
||||
// const dialogRef = this.dialog.open(FormValidationErrorsDialogComponent, {
|
||||
// disableClose: true,
|
||||
// autoFocus: false,
|
||||
// restoreFocus: false,
|
||||
// data: {
|
||||
// formGroup: this.formGroup,
|
||||
// projectOnly: projectOnly
|
||||
// },
|
||||
// });
|
||||
// }
|
||||
|
||||
// }
|
||||
|
||||
// saveFinalize() {
|
||||
// // this.formService.touchAllFormFields(this.formGroup);
|
||||
// this.saving = true;
|
||||
|
|
Loading…
Reference in New Issue