add description save validation error dialog

This commit is contained in:
amentis 2024-04-23 14:51:52 +03:00
parent 7cb559bf31
commit 5bfe76f5c6
1 changed files with 119 additions and 101 deletions

View File

@ -48,6 +48,7 @@ import { DescriptionTemplate, DescriptionTemplateField, DescriptionTemplateField
import { DmpDescriptionTemplate } from '@app/core/model/dmp/dmp'; import { DmpDescriptionTemplate } from '@app/core/model/dmp/dmp';
import { FileTransformerEntityType } from '@app/core/common/enum/file-transformer-entity-type'; import { FileTransformerEntityType } from '@app/core/common/enum/file-transformer-entity-type';
import { nameof } from 'ts-simple-nameof'; import { nameof } from 'ts-simple-nameof';
import { AbstractControl, UntypedFormArray, UntypedFormGroup } from '@angular/forms';
@Component({ @Component({
selector: 'app-description-editor-component', selector: 'app-description-editor-component',
@ -661,8 +662,11 @@ export class DescriptionEditorComponent extends BaseEditor<DescriptionEditorMode
this.formService.removeAllBackEndErrors(this.formGroup); this.formService.removeAllBackEndErrors(this.formGroup);
this.formService.touchAllFormFields(this.formGroup); this.formService.touchAllFormFields(this.formGroup);
if (this.formGroup.get('label').valid && this.formGroup.get('dmpId').valid && this.formGroup.get('dmpDescriptionTemplateId').valid 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); 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]); 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 // 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 { // private _getPlaceHolder(formControl: any): string {
// if (formControl.nativeElement.localName === 'input' || formControl.nativeElement.localName === 'textarea' // if (formControl.nativeElement.localName === 'input' || formControl.nativeElement.localName === 'textarea'
// || formControl.nativeElement.localName === 'richTextarea') { // || 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) { // save(saveType?: SaveType) {
// this.saving = true; // this.saving = true;
// Object.keys(this.formGroup.controls).forEach(controlName => { // Object.keys(this.formGroup.controls).forEach(controlName => {
@ -1964,32 +2008,6 @@ export class DescriptionEditorComponent extends BaseEditor<DescriptionEditorMode
// this.submit(saveType); // 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() { // saveFinalize() {
// // this.formService.touchAllFormFields(this.formGroup); // // this.formService.touchAllFormFields(this.formGroup);
// this.saving = true; // this.saving = true;