refactor: restructure employee-related components and services

This commit is contained in:
Jan K9f 2025-01-15 12:53:31 +01:00
parent 5d90b71ba5
commit 9219b92049
Signed by: jank
GPG key ID: 50620ADD22CD330B
11 changed files with 33 additions and 140 deletions

View file

@ -1,7 +1,8 @@
<div class="container">
<div class="header">
<div class="dropdown position-absolute top-0 end-0 m-3">
<button class="btn align-items-center d-flex" type="button" id="userDropdown" data-bs-toggle="dropdown" aria-expanded="false">
<button class="btn align-items-center d-flex" type="button" id="userDropdown" data-bs-toggle="dropdown"
aria-expanded="false">
<img src="user.svg" alt="User Icon" class="rounded-circle" style="width: 30px; height: 30px;">
</button>
<ul class="dropdown-menu dropdown-menu-end" aria-labelledby="userDropdown">
@ -12,7 +13,7 @@
</div>
<div class="header-actions">
<div class="search-bar">a
<div class="search-bar">
<input type="text" placeholder="Search employee">
<button>Search</button>
</div>
@ -21,29 +22,31 @@
<table class="employee-table">
<thead>
<tr>
<th><span class="sortable">First Name</span></th>
<th><span class="sortable">Last Name</span></th>
<th>Street</th>
<th>Postcode</th>
<th>City</th>
<th>Phone</th>
<th>Actions</th>
</tr>
<tr>
<th><span class="sortable">First Name</span></th>
<th><span class="sortable">Last Name</span></th>
<th>Street</th>
<th>Postcode</th>
<th>City</th>
<th>Phone</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let employee of employees">
<td>{{ employee.firstName }}</td>
<td>{{ employee.lastName }}</td>
<td>{{ employee.street }}</td>
<td>{{ employee.postcode }}</td>
<td>{{ employee.city }}</td>
<td>{{ employee.phone }}</td>
<td>
<button>Edit</button>
<button>Delete</button>
</td>
</tr>
@for (employee of employees | async; track employee) {
<tr>
<td>{{ employee.firstName }}</td>
<td>{{ employee.lastName }}</td>
<td>{{ employee.street }}</td>
<td>{{ employee.postcode }}</td>
<td>{{ employee.city }}</td>
<td>{{ employee.phone }}</td>
<td>
<button>Edit</button>
<button>Delete</button>
</td>
</tr>
}
</tbody>
</table>
</div>