diff --git a/src/app/components/mitarbeiter-form/mitarbeiter-form.component.html b/src/app/components/mitarbeiter-form/mitarbeiter-form.component.html
index b797a2e..5fe664d 100644
--- a/src/app/components/mitarbeiter-form/mitarbeiter-form.component.html
+++ b/src/app/components/mitarbeiter-form/mitarbeiter-form.component.html
@@ -4,26 +4,44 @@
diff --git a/src/app/components/mitarbeiter-form/mitarbeiter-form.component.ts b/src/app/components/mitarbeiter-form/mitarbeiter-form.component.ts
index 343e285..7dfaaef 100644
--- a/src/app/components/mitarbeiter-form/mitarbeiter-form.component.ts
+++ b/src/app/components/mitarbeiter-form/mitarbeiter-form.component.ts
@@ -7,7 +7,6 @@ import { AsyncPipe, NgFor } from '@angular/common';
import { SkillService } from '../../service/skill.service';
import { QualificationGetDTO } from '../../models/skill';
import { Observable, of } from 'rxjs';
-import { EmployeeService } from '../../service/employee.service';
@Component({
selector: 'app-mitarbeiter-form',
@@ -23,8 +22,9 @@ export class MitarbeiterFormComponent {
public mitarbeiterForm!: FormGroup;
public allSkills: Observable
> = of([]);
public hasAllSkills: boolean = false;
+ errorMessages: Record = {};
- constructor(public http: HttpClient, public router: Router, private employeeService: EmployeeService, private skillService: SkillService) {
+ constructor(public http: HttpClient, public router: Router, private skillService: SkillService) {
}
@@ -33,14 +33,13 @@ export class MitarbeiterFormComponent {
}
private setupForm() {
-
this.mitarbeiterForm = new FormGroup({
- lastName: new FormControl(this.mitarbeiter.lastName),
- firstName: new FormControl(this.mitarbeiter.firstName),
- street: new FormControl(this.mitarbeiter.street),
- postcode: new FormControl(this.mitarbeiter.postcode),
- city: new FormControl(this.mitarbeiter.city),
- phone: new FormControl(this.mitarbeiter.phone),
+ lastName: new FormControl(this.mitarbeiter.lastName, Validators.required),
+ firstName: new FormControl(this.mitarbeiter.firstName, Validators.required),
+ street: new FormControl(this.mitarbeiter.street, Validators.required),
+ postcode: new FormControl(this.mitarbeiter.postcode, [Validators.required, Validators.minLength(5), Validators.maxLength(5)]),
+ city: new FormControl(this.mitarbeiter.city, Validators.required),
+ phone: new FormControl(this.mitarbeiter.phone, [Validators.required, Validators.pattern('^[- +()0-9]+$')]),
newSkill: new FormControl(),
});
}
@@ -92,7 +91,38 @@ export class MitarbeiterFormComponent {
});
}
+ private validationErrorMessages: Record = {
+ required: "This field is required",
+ minlength: "The value is too short",
+ maxlength: "The value is too long",
+ pattern: "This field must be a valid phone number",
+ };
+
+ updateErrorMessages(): void {
+ console.log("updateErrorMessages");
+ this.errorMessages = {};
+
+ Object.keys(this.mitarbeiterForm.controls).forEach(field => {
+ const control = this.mitarbeiterForm.get(field);
+
+ if (control && control.errors && control.touched) {
+ this.errorMessages[field] = Object.keys(control.errors)
+ .map(errorKey => this.validationErrorMessages[errorKey] || `Unknown error: ${errorKey}`)
+ .join(' ');
+ }
+ });
+
+ console.log(this.errorMessages);
+ }
+
+
submit() {
+ this.updateErrorMessages();
+ if (!this.mitarbeiterForm.valid) {
+ console.log(this.mitarbeiterForm.valid);
+ return;
+ }
+
this.mitarbeiter.firstName = this.mitarbeiterForm.get("firstName")?.value;
this.mitarbeiter.lastName = this.mitarbeiterForm.get("lastName")?.value;
this.mitarbeiter.street = this.mitarbeiterForm.get("street")?.value;