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 { 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;
|
||||||
|
|
Loading…
Reference in New Issue