refactor: restructure employee-related components and services
This commit is contained in:
		
					parent
					
						
							
								5d90b71ba5
							
						
					
				
			
			
				commit
				
					
						9219b92049
					
				
			
		
					 11 changed files with 33 additions and 140 deletions
				
			
		| 
						 | 
				
			
			@ -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>
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Reference in a new issue