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) + } }