jank/employeeService
1
1
Fork 0
Code Issues 2 Pull requests 4 Projects 1 Releases Packages Wiki Activity Actions

refactor(employee-detail): restructure HTML layout with container
All checks were successful
Playwright Tests / test (pull_request) Successful in 2m49s
Details

Browse source
This commit is contained in:
Jan Gleytenhoover 2025-01-22 12:01:44 +01:00
parent fb90c770f6
commit 300520093d
Signed by: jank
GPG key ID: 50620ADD22CD330B
2 changed files with 26 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

45
src/app/components/employee-detail/employee-detail.component.html
View file

@ -1,28 +1,29 @@
<div class="d-flex flex-col" style="height: 100%;"> <div class="container">
<app-navigation-bar></app-navigation-bar> <div class="d-flex flex-col" style="height: 100%;">
<div class="p-3" style="width: 100%;"> <div class="p-3" style="width: 100%;">
<button class="btn btn-primary" (click)="goToEmployeePage()">Zurück</button> <button class="btn btn-primary" (click)="goToEmployeePage()">Zurück</button>
<div class="row align-items-start pt-3"> <div class="row align-items-start pt-3">
<div class="col"> <div class="col">
<h1>{{ employee.firstName }} {{ employee.lastName }} </h1> <h1>{{ employee.firstName }} {{ employee.lastName }} </h1>
<p><strong>Straße: </strong>{{ employee.street }}</p> <p><strong>Straße: </strong>{{ employee.street }}</p>
<p><strong>Postleitzahl: </strong>{{ employee.postcode }}</p> <p><strong>Postleitzahl: </strong>{{ employee.postcode }}</p>
<p><strong>Stadt: </strong>{{ employee.city }}</p> <p><strong>Stadt: </strong>{{ employee.city }}</p>
<p><strong>Telefonnummer: </strong>{{ employee.phone }}s</p> <p><strong>Telefonnummer: </strong>{{ employee.phone }}s</p>
<button class="btn btn-danger" (click)="deleteEmployee(currentId)">Löschen</button> <button class="btn btn-danger" (click)="deleteEmployee(currentId)">Löschen</button>
<button class="ms-3 btn btn-primary" (click)="editEmployee(currentId)">Bearbeiten</button> <button class="ms-3 btn btn-primary" (click)="editEmployee(currentId)">Bearbeiten</button>
</div> </div>
<div class="col"> <div class="col">
<h2>Qualifikationen</h2> <h2>Qualifikationen</h2>
<ul class="list-group" style="width: fit-content;"> <ul class="list-group" style="width: fit-content;">
@for(skill of skillSet; track skill) { @for(skill of skillSet; track skill) {
<li class="list-group-item">{{ skill }}</li> <li class="list-group-item">{{ skill }}</li>
} }
</ul> </ul>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>

6
src/app/components/mitarbeiter-form/mitarbeiter-form.component.ts
View file

@ -3,7 +3,7 @@ import { EmployeeNameAndSkillDataDTO, EmployeeRequestPutDTO, EmployeeResponseDTO
import { AbstractControl, FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms'; import { AbstractControl, FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
import { HttpClient } from '@angular/common/http'; import { HttpClient } from '@angular/common/http';
import { Router } from '@angular/router'; import { Router } from '@angular/router';
import { AsyncPipe, NgFor } from '@angular/common'; import { AsyncPipe, NgFor, Location } from '@angular/common';
import { SkillService } from '../../service/skill.service'; import { SkillService } from '../../service/skill.service';
import { QualificationGetDTO } from '../../models/skill'; import { QualificationGetDTO } from '../../models/skill';
import { Observable, of } from 'rxjs'; import { Observable, of } from 'rxjs';
@ -24,10 +24,10 @@ export class MitarbeiterFormComponent {
public hasAllSkills: boolean = false; public hasAllSkills: boolean = false;
errorMessages: Record<string, string> = {}; errorMessages: Record<string, string> = {};
constructor(public http: HttpClient, public router: Router, private skillService: SkillService) {} constructor(public http: HttpClient, public router: Router, private skillService: SkillService, private location: Location) {}
returnToEmployeeOverview() { returnToEmployeeOverview() {
this.router.navigate(["mitarbeiter"]); this.location.back();
} }
private setupForm() { private setupForm() {