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

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

View file

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

View file

@ -3,7 +3,7 @@ import { EmployeeNameAndSkillDataDTO, EmployeeRequestPutDTO, EmployeeResponseDTO
import { AbstractControl, FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
import { HttpClient } from '@angular/common/http';
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 { QualificationGetDTO } from '../../models/skill';
import { Observable, of } from 'rxjs';
@ -24,10 +24,10 @@ export class MitarbeiterFormComponent {
public hasAllSkills: boolean = false;
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() {
this.router.navigate(["mitarbeiter"]);
this.location.back();
}
private setupForm() {