angular/ems-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add employee details

Browse Source 
Reviewed-on: #27
Reviewed-by: Get in my car i have candy <huydw@proton.me>
This commit is contained in:
Constantin Simonis
2025-01-09 12:14:55 +00:00
parent a2bc06aee0
commit f33082343c
7 changed files with 86 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
src/app/employee/table/table.component.html
View File

@ -14,30 +14,35 @@
<div class="!overflow-x-auto !rounded-lg !bg-gray-50 !p-4">
<table mat-table [dataSource]="employees" matSort class="!w-full">
<ng-container matColumnDef="name">
<th mat-header-cell *matHeaderCellDef class="!text-left"> Name </th>
<th mat-header-cell *matHeaderCellDef class="!text-left"> Name</th>
<td mat-cell *matCellDef="let employee" class="!py-4">
<div class="!flex !items-center">
<div class="!h-10 !w-10 !rounded-full !bg-blue-100 !flex !items-center !justify-center !mr-3">
<span class="!text-blue-600 !font-medium">
{{employee.firstName[0]}}{{employee.lastName[0]}}
{{ employee.firstName[0] }}{{ employee.lastName[0] }}
</span>
</div>
<div>
<div class="!font-medium !text-gray-900">
{{employee.lastName}}, {{employee.firstName}}
</div>
<a
class="!text-blue-600 hover:!underline cursor-pointer"
[matTooltip]="'Click to view Employee details'"
(click)="openDetailModal(employee)">
{{ employee.lastName }}, {{ employee.firstName }}
</a>
</div>
</div>
</td>
</ng-container>
<ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="!text-right"> Actions </th>
<th mat-header-cell *matHeaderCellDef class="!text-right"> Actions</th>
<td mat-cell *matCellDef="let employee" class="!text-right !py-4">
<button mat-icon-button color="primary" [matTooltip]="'Edit employee'" class="!mr-2" (click)="showEditEmployeeModal(employee)">
<button mat-icon-button color="primary" [matTooltip]="'Edit employee'" class="!mr-2"
(click)="showEditEmployeeModal(employee)">
<mat-icon>edit</mat-icon>
</button>
<button mat-icon-button color="warn" [matTooltip]="'Delete employee'" (click)="openDeleteDialogue(employee)">
<button mat-icon-button color="warn" [matTooltip]="'Delete employee'"
(click)="openDeleteDialogue(employee)">
<mat-icon>delete</mat-icon>
</button>
</td>
@ -67,7 +72,7 @@
<div class="!bg-gray-50 !p-4 !rounded-lg">
<div class="!space-y-4">
<div class="!h-10 !bg-gray-200 !rounded"></div>
@for(i of [1,2,3]; track i) {
@for (i of [1, 2, 3]; track i) {
<div class="!h-16 !bg-white !rounded-lg !shadow-sm"></div>
}
</div>