diff --git a/src/app/create-qualification/create-qualification.component.css b/src/app/create-qualification/create-qualification.component.css
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/create-qualification/create-qualification.component.html b/src/app/create-qualification/create-qualification.component.html
new file mode 100644
index 0000000..d6481a7
--- /dev/null
+++ b/src/app/create-qualification/create-qualification.component.html
@@ -0,0 +1,5 @@
+
diff --git a/src/app/create-qualification/create-qualification.component.ts b/src/app/create-qualification/create-qualification.component.ts
new file mode 100644
index 0000000..1eb50f9
--- /dev/null
+++ b/src/app/create-qualification/create-qualification.component.ts
@@ -0,0 +1,41 @@
+import {Component, inject} from '@angular/core';
+import {FormBuilder, ReactiveFormsModule} from "@angular/forms";
+import EmployeeApiService from "../services/employee-api.service";
+import QualificationService from "../services/qualification.service";
+import {Router} from "@angular/router";
+import {MatDialogRef} from "@angular/material/dialog";
+
+@Component({
+ selector: 'app-create-qualification',
+ imports: [
+ ReactiveFormsModule
+ ],
+ templateUrl: './create-qualification.component.html',
+ styleUrl: './create-qualification.component.css'
+})
+export class CreateQualificationComponent {
+ private formBuilder: FormBuilder = inject(FormBuilder);
+ private qualificationService: QualificationService = inject(QualificationService);
+ private dialogRef: MatDialogRef = inject(MatDialogRef);
+
+ qualificationForm = this.formBuilder.group({
+ 'skill': [''],
+ });
+
+ create() {
+ if (this.qualificationForm.valid) {
+ this.qualificationService.create(this.qualificationForm.value).subscribe({
+ next: (createdQualification) => {
+ this.dialogRef.close(createdQualification);
+ },
+ error: (error) => {
+ console.error('Error creating qualification:', error);
+ }
+ });
+ }
+ }
+
+ cancel() {
+ this.dialogRef.close();
+ }
+}
diff --git a/src/app/qualifications/qualifications.component.html b/src/app/qualifications/qualifications.component.html
index 8253ea8..f0f7005 100644
--- a/src/app/qualifications/qualifications.component.html
+++ b/src/app/qualifications/qualifications.component.html
@@ -1,3 +1,6 @@
+Qualifications
+
+
@if (qualifications$ | async; as qualifications) {
@if (qualifications) {
;
- public readonly displayedColumns: string[] = ['skill', 'actions'];
+export class QualificationsComponent implements OnInit{
+ public qualifications$!: Observable;
+ public readonly displayedColumns: string[] = ['skill', 'actions'];
+ private readonly dialog: MatDialog = inject(MatDialog);
+ private readonly qualificationService: QualificationService = inject(QualificationService);
- constructor(private readonly qualificationService: QualificationService) {
- this.qualifications$ = this.qualificationService.getAll();
- }
+ ngOnInit() {
+ this.loadQualifications();
+ }
+
+ private loadQualifications() {
+ this.qualifications$ = this.qualificationService.getAll();
+ }
+
+ openCreateModal() {
+ const dialogRef = this.dialog.open(CreateQualificationComponent);
+
+ dialogRef.afterClosed().subscribe(result => {
+ if (result) {
+ this.loadQualifications();
+ }
+ });
+ }
}
diff --git a/src/app/services/qualification.service.ts b/src/app/services/qualification.service.ts
index c28f421..752c7ec 100644
--- a/src/app/services/qualification.service.ts
+++ b/src/app/services/qualification.service.ts
@@ -16,4 +16,8 @@ export default class QualificationService {
public getAll(): Observable {
return this.http.get(`${QualificationService.BASE_URL}/qualifications`)
}
+
+ public create(data: any) {
+ return this.http.post(`${QualificationService.BASE_URL}/qualifications`, data)
+ }
}