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

feat(navigation): add navigation bar to employee views
All checks were successful
Playwright Tests / test (pull_request) Successful in 2m16s
Details

Browse source
This commit is contained in:
Jan Gleytenhoover 2025-01-22 10:16:08 +01:00
parent f3738ff631
commit 5cc396f552
Signed by: jank
GPG key ID: 50620ADD22CD330B
6 changed files with 117 additions and 108 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
src/app/components/mitarbeiterverwaltung-view/mitarbeiterverwaltung-view.component.html
View file

@ -1,3 +1,5 @@
<div class="d-flex flex-row">
<app-navigation-bar [route]="'employee'" class="row" style="height: 100vh;"></app-navigation-bar>
<div class="container"> <div class="container">
<div class="header"> <div class="header">
<div class="dropdown position-absolute top-0 end-0 m-3"> <div class="dropdown position-absolute top-0 end-0 m-3">
@ -47,3 +49,4 @@
</tbody> </tbody>
</table> </table>
</div> </div>
</div>

3
src/app/components/mitarbeiterverwaltung-view/mitarbeiterverwaltung-view.component.ts
View file

@ -5,13 +5,14 @@ import { EmployeeResponseDTO } from '../../models/mitarbeiter';
import { EmployeeService } from '../../service/employee.service'; import { EmployeeService } from '../../service/employee.service';
import { FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms'; import { FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
import { Router } from '@angular/router'; import { Router } from '@angular/router';
import { NavigationBarComponent } from '../navigation-bar/navigation-bar.component';
@Component({ @Component({
selector: 'app-mitarbeiterverwaltung-view', selector: 'app-mitarbeiterverwaltung-view',
templateUrl: './mitarbeiterverwaltung-view.component.html', templateUrl: './mitarbeiterverwaltung-view.component.html',
styleUrls: ['./mitarbeiterverwaltung-view.component.css'], styleUrls: ['./mitarbeiterverwaltung-view.component.css'],
standalone: true, standalone: true,
imports: [CommonModule, ReactiveFormsModule] imports: [CommonModule, ReactiveFormsModule, NavigationBarComponent]
}) })
export class MitarbeiterverwaltungViewComponent implements OnInit { export class MitarbeiterverwaltungViewComponent implements OnInit {
employees: Array<EmployeeResponseDTO> = []; employees: Array<EmployeeResponseDTO> = [];

9
src/app/components/navigation-bar/navigation-bar.component.html
View file

@ -5,18 +5,13 @@
</a> </a>
<hr> <hr>
<ul class="nav nav-pills flex-column mb-auto"> <ul class="nav nav-pills flex-column mb-auto">
<li class="nav-item">
<a href="#" class="nav-link active text-black" aria-current="page">
Dashboard
</a>
</li>
<li> <li>
<a href="#" class="nav-link text-black"> <a [routerLink]="['/mitarbeiter']" (click)="employees()" [class.active]="route == 'employee'" class="nav-link text-black" aria-current="page">
Mitarbeiterverwaltung Mitarbeiterverwaltung
</a> </a>
</li> </li>
<li> <li>
<a href="#" class="nav-link text-black"> <a [routerLink]="['/qualifikationsverwaltung']" [class.active]="route == 'skill'" class="nav-link text-black">
Qualifikationsverwaltung Qualifikationsverwaltung
</a> </a>
</li> </li>

10
src/app/components/navigation-bar/navigation-bar.component.ts
View file

@ -1,12 +1,18 @@
import { Component } from '@angular/core'; import { Component, Input } from '@angular/core';
import { ActivatedRoute, Router, RouterLink } from '@angular/router';
@Component({ @Component({
selector: 'app-navigation-bar', selector: 'app-navigation-bar',
standalone: true, standalone: true,
imports: [], imports: [RouterLink],
templateUrl: './navigation-bar.component.html', templateUrl: './navigation-bar.component.html',
styleUrl: './navigation-bar.component.css' styleUrl: './navigation-bar.component.css'
}) })
export class NavigationBarComponent { export class NavigationBarComponent {
constructor(private router: Router) { }
@Input() route: string = "";
employees() {
this.router.navigate(['mitarbeiter']);
}
} }

3
src/app/components/qualifikationsverwaltung/qualifikationsverwaltung.component.html
View file

@ -1,3 +1,5 @@
<div class="d-flex flex-row">
<app-navigation-bar [route]="'skill'" class="row" style="height: 100vh;"></app-navigation-bar>
<div class="container"> <div class="container">
<div class="header"> <div class="header">
<div class="dropdown position-absolute top-0 end-0 m-3"> <div class="dropdown position-absolute top-0 end-0 m-3">
@ -55,3 +57,4 @@
</tbody> </tbody>
</table> </table>
</div> </div>
</div>

3
src/app/components/qualifikationsverwaltung/qualifikationsverwaltung.component.ts
View file

@ -3,11 +3,12 @@ import { QualificationGetDTO } from '../../models/skill';
import { FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms'; import { FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms';
import { SkillService } from '../../service/skill.service'; import { SkillService } from '../../service/skill.service';
import { Router } from '@angular/router'; import { Router } from '@angular/router';
import { NavigationBarComponent } from '../navigation-bar/navigation-bar.component';
@Component({ @Component({
selector: 'app-qualifikationsverwaltung', selector: 'app-qualifikationsverwaltung',
standalone: true, standalone: true,
imports: [ReactiveFormsModule], imports: [ReactiveFormsModule, NavigationBarComponent],
templateUrl: './qualifikationsverwaltung.component.html', templateUrl: './qualifikationsverwaltung.component.html',
styleUrl: './qualifikationsverwaltung.component.css' styleUrl: './qualifikationsverwaltung.component.css'
}) })