diff --git a/src/app/employee/create/create.component.html b/src/app/employee/create/create.component.html
index 268bf0a..454b94c 100644
--- a/src/app/employee/create/create.component.html
+++ b/src/app/employee/create/create.component.html
@@ -36,6 +36,15 @@
+
+ Qualifications
+
+
+ {{qualification.skill}}
+
+
+
+
diff --git a/src/app/employee/create/create.component.ts b/src/app/employee/create/create.component.ts
index b377102..6cbc5ed 100644
--- a/src/app/employee/create/create.component.ts
+++ b/src/app/employee/create/create.component.ts
@@ -12,22 +12,29 @@ import {
} from "@angular/material/dialog";
import {Employee} from "../Employee";
import EmployeeApiService from "../../services/employee-api.service";
-import {NgIf} from "@angular/common";
+import {NgForOf, NgIf} from "@angular/common";
+import {MatOption} from "@angular/material/core";
+import {MatSelect} from "@angular/material/select";
+import QualificationService from "../../services/qualification.service";
+import {Qualification} from "../../qualification/Qualification";
@Component({
selector: 'app-create-employee',
- imports: [
- ReactiveFormsModule,
- MatFormField,
- MatInput,
- MatButton,
- MatLabel,
- MatDialogContent,
- MatDialogTitle,
- MatDialogActions,
- MatDialogClose,
- NgIf,
- ],
+ imports: [
+ ReactiveFormsModule,
+ MatFormField,
+ MatInput,
+ MatButton,
+ MatLabel,
+ MatDialogContent,
+ MatDialogTitle,
+ MatDialogActions,
+ MatDialogClose,
+ NgIf,
+ MatOption,
+ MatSelect,
+ NgForOf,
+ ],
templateUrl: './create.component.html',
standalone: true,
styleUrl: './create.component.css'
@@ -37,8 +44,11 @@ export class CreateComponent implements OnInit {
employeeService: EmployeeApiService = inject(EmployeeApiService);
formBuilder: FormBuilder = inject(FormBuilder);
dialogRef: MatDialogRef = inject(MatDialogRef);
+ qualificationService: QualificationService = inject(QualificationService);
+ qualifications: Qualification[] = [];
ngOnInit(): void {
+ this.loadQualifications();
this.employeeForm = this.formBuilder.group({
firstName: ['', Validators.required],
lastName: ['', Validators.required],
@@ -46,16 +56,29 @@ export class CreateComponent implements OnInit {
postcode: ['', [Validators.required, Validators.minLength(5), Validators.maxLength(5)]],
city: ['', Validators.required],
phone: ['', Validators.required],
+ qualifications: [[]]
});
}
+ loadQualifications() {
+ this.qualificationService.getAll().subscribe(
+ qualifications => this.qualifications = qualifications
+ );
+ }
+
submit() {
if (this.employeeForm === null || !this.employeeForm.valid) {
console.error('Form invalid');
return;
}
- this.employeeService.create(this.employeeForm.value as Employee).subscribe();
+ const formValue = this.employeeForm.value;
+ const employeeData = {
+ ...formValue,
+ skillSet: formValue.qualifications
+ };
+
+ this.employeeService.create(employeeData as Employee).subscribe();
this.dialogRef.close(true);
}
}
diff --git a/src/app/employee/edit/edit.component.html b/src/app/employee/edit/edit.component.html
index d782a1a..93dd8ce 100644
--- a/src/app/employee/edit/edit.component.html
+++ b/src/app/employee/edit/edit.component.html
@@ -36,6 +36,15 @@
+
+ Qualifications
+
+
+ {{qualification.skill}}
+
+
+
+
diff --git a/src/app/employee/edit/edit.component.ts b/src/app/employee/edit/edit.component.ts
index 2259918..769a938 100644
--- a/src/app/employee/edit/edit.component.ts
+++ b/src/app/employee/edit/edit.component.ts
@@ -8,12 +8,15 @@ import {
MatDialogRef,
MatDialogTitle
} from "@angular/material/dialog";
-import {NgIf} from "@angular/common";
+import {NgForOf, NgIf} from "@angular/common";
import {MatFormField} from "@angular/material/form-field";
import {MatInput, MatLabel} from "@angular/material/input";
import {MatButton} from "@angular/material/button";
import {Employee} from "../Employee";
import EmployeeApiService from "../../services/employee-api.service";
+import QualificationService from "../../services/qualification.service";
+import {Qualification} from "../../qualification/Qualification";
+import {MatOption, MatSelect} from "@angular/material/select";
@Component({
selector: 'app-edit',
@@ -27,7 +30,10 @@ import EmployeeApiService from "../../services/employee-api.service";
MatDialogActions,
MatButton,
MatDialogClose,
- MatLabel
+ MatLabel,
+ MatSelect,
+ MatOption,
+ NgForOf
],
templateUrl: './edit.component.html',
standalone: true,
@@ -37,10 +43,13 @@ export class EditComponent implements OnInit {
employeeForm: FormGroup | null = null;
formBuilder: FormBuilder = inject(FormBuilder);
employeeService: EmployeeApiService = inject(EmployeeApiService);
+ qualificationService: QualificationService = inject(QualificationService);
dialogRef: MatDialogRef = inject(MatDialogRef);
employee: Employee = inject(MAT_DIALOG_DATA);
+ qualifications: Qualification[] = [];
ngOnInit(): void {
+ this.loadQualifications();
this.employeeForm = this.formBuilder.group({
firstName: [this.employee.firstName, Validators.required],
lastName: [this.employee.lastName, Validators.required],
@@ -48,9 +57,16 @@ export class EditComponent implements OnInit {
postcode: [this.employee.postcode, [Validators.required, Validators.minLength(5), Validators.maxLength(5)]],
city: [this.employee.city, Validators.required],
phone: [this.employee.phone, Validators.required],
+ qualifications: [this.employee.skillSet?.map(skill => skill.id) ?? []]
});
}
+ loadQualifications() {
+ this.qualificationService.getAll().subscribe(
+ qualifications => this.qualifications = qualifications
+ );
+ }
+
submit() {
if (this.employeeForm === null || !this.employeeForm.valid) {
console.error('Form invalid');
@@ -62,7 +78,13 @@ export class EditComponent implements OnInit {
return;
}
- this.employeeService.update(this.employeeForm.value as Employee, this.employee.id).subscribe();
+ const formValue = this.employeeForm.value;
+ const employeeData = {
+ ...formValue,
+ skillSet: formValue.qualifications
+ };
+
+ this.employeeService.update(employeeData as Employee, this.employee.id).subscribe();
this.dialogRef.close(true);
}
}
diff --git a/src/app/services/employee-api.service.ts b/src/app/services/employee-api.service.ts
index c134dad..16aded1 100644
--- a/src/app/services/employee-api.service.ts
+++ b/src/app/services/employee-api.service.ts
@@ -25,6 +25,6 @@ export default class EmployeeApiService {
}
public update(employee: Employee, id: number) {
- return this.http.patch(`${EmployeeApiService.BASE_URL}/employees/${id}`, employee)
+ return this.http.put(`${EmployeeApiService.BASE_URL}/employees/${id}`, employee)
}
}