Index: src/app/manager/manager-deliveries/manager-deliveries.component.css
===================================================================
--- src/app/manager/manager-deliveries/manager-deliveries.component.css	(revision e679d7ed2d3b992708cf916d98c0bc4f78c2f51c)
+++ src/app/manager/manager-deliveries/manager-deliveries.component.css	(revision 7741044218910104a4956a80e00ddb21648650c8)
@@ -0,0 +1,19 @@
+.modal-backdrop {
+  position: fixed;
+  top: 0; left: 0; right: 0; bottom: 0;
+  background: rgba(0,0,0,0.5);
+  z-index: 1050;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.modal-content {
+  background: #fff;
+  padding: 2rem;
+  border-radius: 8px;
+  min-width: 400px;
+  max-width: 90vw;
+  max-height: 90vh;
+  overflow-y: auto;
+  position: relative;
+}
Index: src/app/manager/manager-deliveries/manager-deliveries.component.html
===================================================================
--- src/app/manager/manager-deliveries/manager-deliveries.component.html	(revision e679d7ed2d3b992708cf916d98c0bc4f78c2f51c)
+++ src/app/manager/manager-deliveries/manager-deliveries.component.html	(revision 7741044218910104a4956a80e00ddb21648650c8)
@@ -1,1 +1,65 @@
-<p>manager-deliveries works!</p>
+<app-navbar></app-navbar>
+<h2>All Deliveries</h2>
+<table class="table">
+  <thead>
+    <tr>
+      <th (click)="sortTable('date')">Date</th>
+      <th (click)="sortTable('driver')">Driver</th>
+      <th (click)="sortTable('city')">Cities</th>
+      <th>Status</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr *ngFor="let delivery of deliveries" (click)="openDeliveryDetails(delivery)" style="cursor:pointer;">
+      <td>{{ delivery.delDate | date:'short' }}</td>
+      <td>
+        <a (click)="goToDriver(delivery.driverId); $event.stopPropagation();" style="text-decoration:underline; cursor:pointer;">
+          {{ delivery.driverName }}
+        </a>
+      </td>
+      <td>{{ delivery.cities.join(', ') }}</td>
+      <td>{{ delivery.delStatus }}</td>
+    </tr>
+  </tbody>
+</table>
+
+<div *ngIf="selectedDelivery" class="modal-backdrop">
+  <div class="modal-content">
+    <h3>Delivery Details</h3>
+    <button class="btn btn-sm btn-danger float-end" (click)="closeModal()">Close</button>
+    <p><strong>Date:</strong> {{ selectedDelivery.delDate | date:'short' }}</p>
+    <p>
+      <strong>Driver:</strong>
+      <a (click)="goToDriver(selectedDelivery?.driverId)" style="text-decoration:underline; cursor:pointer;">
+        {{ selectedDelivery.driverName }}
+      </a>
+    </p>
+    <p><strong>Status:</strong> {{ selectedDelivery.delStatus }}</p>
+    <p><strong>Cities:</strong> {{ selectedDelivery.cities.join(', ') }}</p>
+    <h4>Orders</h4>
+    <table class="table">
+      <thead>
+        <tr>
+          <th>Order #</th>
+          <th>Customer</th>
+          <th>City/Address</th>
+          <th>Sum</th>
+          <th>Pro-forma</th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr *ngFor="let order of selectedDelivery.orders">
+          <td>
+            <a (click)="goToOrder(order.id)" style="text-decoration:underline; cursor:pointer;">
+              {{ order.id }}
+            </a>
+          </td>
+          <td>{{ order.customerName }}</td>
+          <td>{{ order.city }}, {{ order.address }}</td>
+          <td>{{ order.sum | currency }}</td>
+          <td>{{ order.proforma }}</td>
+        </tr>
+      </tbody>
+    </table>
+  </div>
+</div>
Index: src/app/manager/manager-deliveries/manager-deliveries.component.ts
===================================================================
--- src/app/manager/manager-deliveries/manager-deliveries.component.ts	(revision e679d7ed2d3b992708cf916d98c0bc4f78c2f51c)
+++ src/app/manager/manager-deliveries/manager-deliveries.component.ts	(revision 7741044218910104a4956a80e00ddb21648650c8)
@@ -5,8 +5,9 @@
 import { DeliveryService } from '../../services/delivery.service';
 import { Router } from '@angular/router';
+import { CommonModule, CurrencyPipe, DatePipe } from '@angular/common';
 
 @Component({
   selector: 'app-manager-deliveries',
-  imports: [NavbarComponent],
+  imports: [NavbarComponent, DatePipe, CurrencyPipe, CommonModule],
   templateUrl: './manager-deliveries.component.html',
   styleUrl: './manager-deliveries.component.css',
@@ -46,8 +47,27 @@
         valB = b.driverName.toLowerCase();
       } else if (by === 'city') {
-        valA = a.delCity.toLowerCase();
-        valB = b.delCity.toLowerCase();
+        valA = a.delCities.join(',').toLowerCase();
+        valB = b.delCities.join(',').toLowerCase();
       }
+
+      return this.sortAsc ? (valA > valB ? 1 : -1) : (valA < valB ? 1 : -1);
     });
   }
+
+  openDeliveryDetails(delivery: Delivery){
+    this.selectedDelivery = delivery;
+  }
+
+  closeModal(){
+    this.selectedDelivery = null;
+  }
+
+  goToDriver(driverId: number){
+    this.router.navigate(['/manager/drivers', driverId]);
+  }
+
+  goToOrder(orderId: number){
+    this.router.navigate(['/manager/orders', orderId]);
+  }
+
 }
