From 2dc89561422afd503661bb3900a480da2a7aebe3 Mon Sep 17 00:00:00 2001
From: Jan Klattenhoff <jan@kjan.de>
Date: Wed, 15 Jan 2025 12:57:13 +0100
Subject: [PATCH 1/4] feat(mitarbeiter-erstellen): add new component files

---
 .../mitarbeiter-erstellen.component.css       |  0
 .../mitarbeiter-erstellen.component.html      |  1 +
 .../mitarbeiter-erstellen.component.spec.ts   | 23 +++++++++++++++++++
 .../mitarbeiter-erstellen.component.ts        | 12 ++++++++++
 4 files changed, 36 insertions(+)
 create mode 100644 src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.css
 create mode 100644 src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.html
 create mode 100644 src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.spec.ts
 create mode 100644 src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.ts

diff --git a/src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.css b/src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.css
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.html b/src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.html
new file mode 100644
index 0000000..6b8b806
--- /dev/null
+++ b/src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.html
@@ -0,0 +1 @@
+<p>mitarbeiter-erstellen works!</p>
diff --git a/src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.spec.ts b/src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.spec.ts
new file mode 100644
index 0000000..e2fa924
--- /dev/null
+++ b/src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.spec.ts
@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { MitarbeiterErstellenComponent } from './mitarbeiter-erstellen.component';
+
+describe('MitarbeiterErstellenComponent', () => {
+  let component: MitarbeiterErstellenComponent;
+  let fixture: ComponentFixture<MitarbeiterErstellenComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [MitarbeiterErstellenComponent]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(MitarbeiterErstellenComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.ts b/src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.ts
new file mode 100644
index 0000000..d2de8cd
--- /dev/null
+++ b/src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.ts
@@ -0,0 +1,12 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-mitarbeiter-erstellen',
+  standalone: true,
+  imports: [],
+  templateUrl: './mitarbeiter-erstellen.component.html',
+  styleUrl: './mitarbeiter-erstellen.component.css'
+})
+export class MitarbeiterErstellenComponent {
+
+}

From b6919107da2810bc14f4e270012f93991f5ff862 Mon Sep 17 00:00:00 2001
From: Jan Klattenhoff <jan@kjan.de>
Date: Wed, 15 Jan 2025 13:47:56 +0100
Subject: [PATCH 2/4] feat(mitarbeiter-erstellen): implement employee form
 functionality

---
 .../mitarbeiter-erstellen.component.html      |  2 +-
 .../mitarbeiter-erstellen.component.ts        | 30 +++++++++++++++++++
 src/app/service/employee.service.ts           |  4 +++
 3 files changed, 35 insertions(+), 1 deletion(-)

diff --git a/src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.html b/src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.html
index 6b8b806..682a986 100644
--- a/src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.html
+++ b/src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.html
@@ -1 +1 @@
-<p>mitarbeiter-erstellen works!</p>
+<app-mitarbeiter-form [(mitarbeiter)]="mitarbeiter" (mitarbeiterChange)="submitted($event)"></app-mitarbeiter-form>
diff --git a/src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.ts b/src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.ts
index d2de8cd..7391188 100644
--- a/src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.ts
+++ b/src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.ts
@@ -1,4 +1,7 @@
 import { Component } from '@angular/core';
+import { EmployeeResponseDTO } from '../models/mitarbeiter';
+import { EmployeeService } from '../service/employee.service';
+import { ActivatedRoute, Router } from '@angular/router';
 
 @Component({
   selector: 'app-mitarbeiter-erstellen',
@@ -8,5 +11,32 @@ import { Component } from '@angular/core';
   styleUrl: './mitarbeiter-erstellen.component.css'
 })
 export class MitarbeiterErstellenComponent {
+  public mitarbeiter!: EmployeeResponseDTO;
 
+  constructor(private employeeService: EmployeeService, private route: ActivatedRoute, private router: Router) { }
+
+  submitted(mitarbeiter: EmployeeResponseDTO) {
+    this.employeeService.updateEmployee(mitarbeiter);
+    this.returnToEmployeeOverview();
+  }
+
+  returnToEmployeeOverview() {
+    this.router.navigate(["mitarbeiter"]);
+  }
+
+  ngOnInit(): void {
+    this.mitarbeiter = {
+      id: 0,
+      firstName: '',
+      lastName: '',
+      street: '',
+      phone: '',
+      skillSet: [],
+      postcode: '',
+      city: '',
+    }
+    this.employeeService.getEmployeeById(this.route.snapshot.params['id']).subscribe(employee => {
+      this.mitarbeiter = employee;
+    });
+  }
 }
diff --git a/src/app/service/employee.service.ts b/src/app/service/employee.service.ts
index e87bcf5..1db2e61 100644
--- a/src/app/service/employee.service.ts
+++ b/src/app/service/employee.service.ts
@@ -23,6 +23,10 @@ export class EmployeeService {
     }
   }
 
+  createEmployee(employee: EmployeeResponseDTO) {
+
+  }
+
   updateEmployee(employee: EmployeeResponseDTO) {
     this.http.put(`${SkillService.BASE_URL}/employees/${employee.id}`, this.responseDtoToPutDto(employee)).subscribe();
   }

From 582e1152858505175670129e5d0deef393d6b1d7 Mon Sep 17 00:00:00 2001
From: Jan Klattenhoff <jan@kjan.de>
Date: Wed, 15 Jan 2025 14:01:27 +0100
Subject: [PATCH 3/4] feat: add employee creation component and route

---
 src/app/app.routes.ts                             |  6 ++++++
 .../mitarbeiter-erstellen.component.css           |  0
 .../mitarbeiter-erstellen.component.html          |  0
 .../mitarbeiter-erstellen.component.spec.ts       |  0
 .../mitarbeiter-erstellen.component.ts            |  9 +++++----
 src/app/service/employee.service.ts               | 15 +++++++++++++--
 6 files changed, 24 insertions(+), 6 deletions(-)
 rename src/app/{ => components}/mitarbeiter-erstellen/mitarbeiter-erstellen.component.css (100%)
 rename src/app/{ => components}/mitarbeiter-erstellen/mitarbeiter-erstellen.component.html (100%)
 rename src/app/{ => components}/mitarbeiter-erstellen/mitarbeiter-erstellen.component.spec.ts (100%)
 rename src/app/{ => components}/mitarbeiter-erstellen/mitarbeiter-erstellen.component.ts (76%)

diff --git a/src/app/app.routes.ts b/src/app/app.routes.ts
index fff369b..5fcbcba 100644
--- a/src/app/app.routes.ts
+++ b/src/app/app.routes.ts
@@ -5,6 +5,7 @@ import { EmployeeDetailComponent } from "./components/employee-detail/employee-d
 import { QualifikatonBearbeitenViewComponent } from "./components/qualifikaton-bearbeiten-view/qualifikaton-bearbeiten-view.component";
 import { MitarbeiterBearbeitenViewComponent } from "./components/mitarbeiter-bearbeiten-view/mitarbeiter-bearbeiten-view.component";
 import { AuthGuard } from "./service/auth.service";
+import { MitarbeiterErstellenComponent } from "./components/mitarbeiter-erstellen/mitarbeiter-erstellen.component";
 
 export const routes: Routes = [
   {
@@ -16,6 +17,11 @@ export const routes: Routes = [
     component: MitarbeiterverwaltungViewComponent,
     canActivate: [AuthGuard],
   },
+  {
+    path: "mitarbeitererstellen",
+    component: MitarbeiterErstellenComponent,
+    canActivate: [AuthGuard],
+  },
   {
     path: "mitarbeiterbearbeiten/:id",
     component: MitarbeiterBearbeitenViewComponent,
diff --git a/src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.css b/src/app/components/mitarbeiter-erstellen/mitarbeiter-erstellen.component.css
similarity index 100%
rename from src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.css
rename to src/app/components/mitarbeiter-erstellen/mitarbeiter-erstellen.component.css
diff --git a/src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.html b/src/app/components/mitarbeiter-erstellen/mitarbeiter-erstellen.component.html
similarity index 100%
rename from src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.html
rename to src/app/components/mitarbeiter-erstellen/mitarbeiter-erstellen.component.html
diff --git a/src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.spec.ts b/src/app/components/mitarbeiter-erstellen/mitarbeiter-erstellen.component.spec.ts
similarity index 100%
rename from src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.spec.ts
rename to src/app/components/mitarbeiter-erstellen/mitarbeiter-erstellen.component.spec.ts
diff --git a/src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.ts b/src/app/components/mitarbeiter-erstellen/mitarbeiter-erstellen.component.ts
similarity index 76%
rename from src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.ts
rename to src/app/components/mitarbeiter-erstellen/mitarbeiter-erstellen.component.ts
index 7391188..c21bc4e 100644
--- a/src/app/mitarbeiter-erstellen/mitarbeiter-erstellen.component.ts
+++ b/src/app/components/mitarbeiter-erstellen/mitarbeiter-erstellen.component.ts
@@ -1,12 +1,13 @@
 import { Component } from '@angular/core';
-import { EmployeeResponseDTO } from '../models/mitarbeiter';
-import { EmployeeService } from '../service/employee.service';
 import { ActivatedRoute, Router } from '@angular/router';
+import { EmployeeResponseDTO } from '../../models/mitarbeiter';
+import { EmployeeService } from '../../service/employee.service';
+import { MitarbeiterFormComponent } from '../mitarbeiter-form/mitarbeiter-form.component';
 
 @Component({
   selector: 'app-mitarbeiter-erstellen',
   standalone: true,
-  imports: [],
+  imports: [MitarbeiterFormComponent],
   templateUrl: './mitarbeiter-erstellen.component.html',
   styleUrl: './mitarbeiter-erstellen.component.css'
 })
@@ -16,7 +17,7 @@ export class MitarbeiterErstellenComponent {
   constructor(private employeeService: EmployeeService, private route: ActivatedRoute, private router: Router) { }
 
   submitted(mitarbeiter: EmployeeResponseDTO) {
-    this.employeeService.updateEmployee(mitarbeiter);
+    this.employeeService.createEmployee(mitarbeiter);
     this.returnToEmployeeOverview();
   }
 
diff --git a/src/app/service/employee.service.ts b/src/app/service/employee.service.ts
index 1db2e61..17062f7 100644
--- a/src/app/service/employee.service.ts
+++ b/src/app/service/employee.service.ts
@@ -1,5 +1,5 @@
 import { Injectable } from "@angular/core";
-import { EmployeeRequestPutDTO, EmployeeResponseDTO } from "../models/mitarbeiter";
+import { EmployeeRequestDTO, EmployeeRequestPutDTO, EmployeeResponseDTO } from "../models/mitarbeiter";
 import { HttpClient } from "@angular/common/http";
 import { Observable } from "rxjs";
 import { SkillService } from "./skill.service";
@@ -10,6 +10,17 @@ import { SkillService } from "./skill.service";
 export class EmployeeService {
   constructor(private http: HttpClient) { }
 
+  responseToRequestDto(employee: EmployeeResponseDTO): EmployeeRequestDTO {
+    return {
+      firstName: employee.firstName,
+      lastName: employee.lastName,
+      street: employee.street,
+      postcode: employee.postcode,
+      city: employee.city,
+      phone: employee.phone,
+      skillSet: employee.skillSet?.map(skill => skill.id) || [],
+    }
+  }
 
   responseDtoToPutDto(employee: EmployeeResponseDTO): EmployeeRequestPutDTO {
     return {
@@ -24,7 +35,7 @@ export class EmployeeService {
   }
 
   createEmployee(employee: EmployeeResponseDTO) {
-
+    this.http.post(`${SkillService.BASE_URL}/employees`, this.responseToRequestDto(employee)).subscribe();
   }
 
   updateEmployee(employee: EmployeeResponseDTO) {

From ca26b84cc6b5e671029d4f77656b65b7ee54ca95 Mon Sep 17 00:00:00 2001
From: Jan Klattenhoff <jan@kjan.de>
Date: Wed, 15 Jan 2025 14:05:28 +0100
Subject: [PATCH 4/4] feat: add createEmployee method and button click handler

---
 .../mitarbeiterverwaltung-view.component.html                 | 2 +-
 .../mitarbeiterverwaltung-view.component.ts                   | 4 ++++
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/app/components/mitarbeiterverwaltung-view/mitarbeiterverwaltung-view.component.html b/src/app/components/mitarbeiterverwaltung-view/mitarbeiterverwaltung-view.component.html
index 7823733..467faee 100644
--- a/src/app/components/mitarbeiterverwaltung-view/mitarbeiterverwaltung-view.component.html
+++ b/src/app/components/mitarbeiterverwaltung-view/mitarbeiterverwaltung-view.component.html
@@ -20,7 +20,7 @@
       </div>
       <p class="text-body-tertiary">Search for a propertiy of an Employee. eg. First Name</p>
     </form>
-    <button class="add-button">Add employee</button>
+    <button (click)="createEmployee()" class="add-button">Add employee</button>
   </div>
 
   <table class="employee-table">
diff --git a/src/app/components/mitarbeiterverwaltung-view/mitarbeiterverwaltung-view.component.ts b/src/app/components/mitarbeiterverwaltung-view/mitarbeiterverwaltung-view.component.ts
index afcdff1..8415072 100644
--- a/src/app/components/mitarbeiterverwaltung-view/mitarbeiterverwaltung-view.component.ts
+++ b/src/app/components/mitarbeiterverwaltung-view/mitarbeiterverwaltung-view.component.ts
@@ -46,6 +46,10 @@ export class MitarbeiterverwaltungViewComponent implements OnInit {
     this.router.navigate([`/mitarbeiterbearbeiten/${id}`]);
   }
 
+  createEmployee() {
+    this.router.navigate(['/mitarbeitererstellen']);
+  }
+
   deleteEmployee(id: number) {
     this.employeeService.deleteEmployee(id);
     this.employees = this.employees.filter(employee => employee.id != id);