diff --git a/src/app/create-qualification/create-qualification.component.html b/src/app/create-qualification/create-qualification.component.html index 91fa634..d6481a7 100644 --- a/src/app/create-qualification/create-qualification.component.html +++ b/src/app/create-qualification/create-qualification.component.html @@ -1 +1,5 @@ -

create-qualification works!

+
+ + + +
diff --git a/src/app/create-qualification/create-qualification.component.ts b/src/app/create-qualification/create-qualification.component.ts index 6a3a2f8..1eb50f9 100644 --- a/src/app/create-qualification/create-qualification.component.ts +++ b/src/app/create-qualification/create-qualification.component.ts @@ -1,11 +1,41 @@ -import { Component } from '@angular/core'; +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: [], + 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.ts b/src/app/qualifications/qualifications.component.ts index 1fc11fa..12c2108 100644 --- a/src/app/qualifications/qualifications.component.ts +++ b/src/app/qualifications/qualifications.component.ts @@ -2,7 +2,15 @@ import {Component, inject} from '@angular/core'; import {Observable} from "rxjs"; import {Qualification} from "../Qualification"; import {AsyncPipe} from "@angular/common"; -import {MatCell, MatColumnDef, MatHeaderCell, MatHeaderRow, MatRow, MatTable} from "@angular/material/table"; +import { + MatCell, MatCellDef, + MatColumnDef, + MatHeaderCell, + MatHeaderCellDef, + MatHeaderRow, MatHeaderRowDef, + MatRow, MatRowDef, + MatTable +} from "@angular/material/table"; import QualificationService from "../services/qualification.service"; import {MatDialog} from "@angular/material/dialog"; import {CreateQualificationComponent} from "../create-qualification/create-qualification.component"; @@ -16,22 +24,36 @@ import {CreateQualificationComponent} from "../create-qualification/create-quali MatColumnDef, MatCell, MatHeaderRow, - MatRow + MatRow, + MatHeaderCellDef, + MatCellDef, + MatHeaderRowDef, + MatRowDef ], templateUrl: './qualifications.component.html', styleUrl: './qualifications.component.css' }) export class QualificationsComponent { - public qualifications$: Observable; + public qualifications$!: Observable; public readonly displayedColumns: string[] = ['skill', 'actions']; private readonly dialog: MatDialog = inject(MatDialog); constructor(private readonly qualificationService: QualificationService) { + this.loadQualifications(); + } + + private loadQualifications() { this.qualifications$ = this.qualificationService.getAll(); } openCreateModal() { - const createQualificationModal = this.dialog.open(CreateQualificationComponent); + 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) + } }