Changes

resources/views/admin/dashboard.blade.php

@@ -323,6 +323,7 @@
         overflow-x: auto;
         width: 100%;
         -webkit-overflow-scrolling: touch;
+        
     }
 
     .table {
@@ -337,6 +338,7 @@
     .table thead tr {
         background: linear-gradient(135deg, #2c3e50, #34495e) !important;
         border-bottom: 2px solid #1a252f;
+        border-radius:16px 16px 0 0 !important;
     }
 
     .table thead th {
@@ -353,6 +355,7 @@
         font-family: 'Inter', sans-serif;
         font-size: 13px;
         min-width: 100px;
+       
     }
 
     /* Curve the first and last header cells */
@@ -515,9 +518,9 @@
 
     /* Default fallback badge classes */
     .badge.bg-secondary {
-        background: linear-gradient(135deg, #f8f9fa, #e9ecef) !important;
-        color: #495057 !important;
-        border-color: #dee2e6 !important;
+        background: linear-gradient(135deg, #d1fae5, #a7f3d0) !important;
+        color: #065f46 !important;
+        border-color: #10b981 !important;
     }
 
     .badge.bg-info {

resources/views/admin/shipments.blade.php

@@ -1827,32 +1827,8 @@
                                         <th>Amount (₹)</th>
                                     </tr>
                                 </thead>
-                                <tbody>
-
-                                    @forelse($availableOrders as $order)
-                                    <tr>
-                                        <td>
-                                            <input type="checkbox" name="order_ids[]" value="{{ $order->id }}">
-                                        </td>
-                                        <td>
-                                            <a href="#" class="text-primary fw-bold">{{ $order->order_id }}</a>
-                                        </td>
-                                        <td>{{ $order->origin }}</td>
-                                        <td>{{ $order->destination }}</td>
-                                        <td>{{ $order->ctn }}</td>
-                                        <td>{{ $order->qty }}</td>
-                                        <td>{{ $order->ttl_qty }}</td>
-                                        <td>{{ $order->cbm }}</td>
-                                        <td>{{ $order->ttl_cbm }}</td>
-                                        <td>{{ $order->kg }}</td>
-                                        <td>{{ $order->ttl_kg }}</td>
-                                        <td class="fw-bold text-success">₹{{ number_format($order->ttl_amount, 2) }}</td>
-                                    </tr>
-                                    @empty
-                                    <tr>
-                                        <td colspan="12" class="text-muted text-center py-4">No available orders to add to shipment</td>
-                                    </tr>
-                                    @endforelse
+                                <tbody id="modalOrdersTableBody">
+                                    <!-- Orders will be loaded here via JavaScript -->
                                 </tbody>
                             </table>
                         </div>
@@ -2063,46 +2039,51 @@
 </div>
 
 <script>
-// Pagination state
+// Pagination state for main table
 let currentPage = 1;
 const itemsPerPage = 10;
 let allShipments = @json($shipments);
 let filteredShipments = [...allShipments];
 
+// ==================== CREATE SHIPMENT MODAL PAGINATION ====================
 // Modal pagination state
 let modalCurrentPage = 1;
 const modalItemsPerPage = 10;
 
 // IMPORTANT: सर्व orders एकाच decending order मध्ये
-// प्रथम सर्व orders ला एकत्रित decending order मध्ये sort करा
+// Order ID च्या क्रमाने sort करा (KNT-25-00000041, KNT-25-00000040, etc.)
 let allAvailableOrders = @json($availableOrders);
 
-// Sort all orders in descending order by order_id (newest first)
-// Order ID च्या क्रमाने sort करा (KNT-25-00000041, KNT-25-00000040, etc.)
-allAvailableOrders.sort((a, b) => {
-    // Extract the number from order_id (e.g., "KNT-25-00000041" -> 41)
-    const extractNumber = (orderId) => {
-        const match = orderId.match(/\d+$/);
-        return match ? parseInt(match[0]) : 0;
-    };
+// Sort all orders in descending order by order_id (newest/highest number first)
+// This function extracts the numeric part from order_id for proper sorting
+function sortOrdersInDescending(orders) {
+    return orders.sort((a, b) => {
+        // Extract the number from order_id (e.g., "KNT-25-00000041" -> 41)
+        const extractNumber = (orderId) => {
+            if (!orderId) return 0;
+            const match = orderId.match(/\d+$/);
+            return match ? parseInt(match[0]) : 0;
+        };
         
-    const numA = extractNumber(a.order_id);
-    const numB = extractNumber(b.order_id);
+        const numA = extractNumber(a.order_id);
+        const numB = extractNumber(b.order_id);
         
-    // Descending order (highest number first)
-    return numB - numA;
-});
+        // Descending order (highest number first)
+        return numB - numA;
+    });
+}
 
-// Initialize pagination on page load
+// Initialize modal pagination when DOM is loaded
 document.addEventListener('DOMContentLoaded', function() {
+    // Initialize main table pagination
     renderTable();
     updatePaginationControls();
     
-    // Bind pagination events
+    // Bind main pagination events
     document.getElementById('prevPageBtn').addEventListener('click', goToPreviousPage);
     document.getElementById('nextPageBtn').addEventListener('click', goToNextPage);
 
-    // Status Filter Functionality
+    // Status Filter Functionality for main table
     const statusFilter = document.getElementById('statusFilter');
     const searchInput = document.getElementById('searchInput');
     const carrierFilter = document.getElementById('carrierFilter');
@@ -2130,7 +2111,7 @@ document.addEventListener('DOMContentLoaded', function() {
                 if (!matchesSearch) include = false;
             }
 
-            // Carrier filter (you can add carrier data attribute if needed)
+            // Carrier filter
             if (selectedCarrier !== 'all') {
                 // Add carrier filtering logic here if you have carrier data
             }
@@ -2148,9 +2129,8 @@ document.addEventListener('DOMContentLoaded', function() {
     searchInput.addEventListener('input', filterShipments);
     carrierFilter.addEventListener('change', filterShipments);
 
-    // Update status filter appearance based on selection
+    // Update status filter appearance
     statusFilter.addEventListener('change', function() {
-        // Update data-status attribute for CSS styling
         if (this.value === 'all') {
             this.removeAttribute('data-status');
         } else {
@@ -2161,35 +2141,69 @@ document.addEventListener('DOMContentLoaded', function() {
     // Initialize filter on page load
     filterShipments();
 
-    // Modal pagination initialization
-    initModalPagination();
+    // Initialize modal when create shipment modal is shown
+    const createShipmentModal = document.getElementById('createShipmentModal');
+    if (createShipmentModal) {
+        createShipmentModal.addEventListener('show.bs.modal', function() {
+            // Sort orders in descending order
+            allAvailableOrders = sortOrdersInDescending(@json($availableOrders));
+            
+            // Reset to first page
+            modalCurrentPage = 1;
+            renderModalTable();
+            updateModalPaginationControls();
+        });
+    }
 });
 
-// Modal Pagination Functions
-function initModalPagination() {
-    renderModalTable();
-    updateModalPaginationControls();
+// ==================== MODAL PAGINATION FUNCTIONS ====================
+function renderModalTable() {
+    const tbody = document.getElementById('modalOrdersTableBody');
     
-    // Bind modal pagination events
-    document.getElementById('modalPrevPageBtn').addEventListener('click', goToModalPreviousPage);
-    document.getElementById('modalNextPageBtn').addEventListener('click', goToModalNextPage);
-}
-
-function goToModalPreviousPage() {
-    if (modalCurrentPage > 1) {
-        modalCurrentPage--;
-        renderModalTable();
-        updateModalPaginationControls();
+    if (allAvailableOrders.length === 0) {
+        tbody.innerHTML = `
+            <tr>
+                <td colspan="12" class="text-muted text-center py-4">
+                    <i class="bi bi-search display-6 d-block mb-3"></i>
+                    No available orders to add to shipment
+                </td>
+            </tr>
+        `;
+        return;
     }
-}
     
-function goToModalNextPage() {
-    const totalPages = Math.ceil(allAvailableOrders.length / modalItemsPerPage);
-    if (modalCurrentPage < totalPages) {
-        modalCurrentPage++;
-        renderModalTable();
-        updateModalPaginationControls();
-    }
+    // Calculate pagination
+    const startIndex = (modalCurrentPage - 1) * modalItemsPerPage;
+    const endIndex = startIndex + modalItemsPerPage;
+    
+    // Get orders for current page
+    const paginatedItems = allAvailableOrders.slice(startIndex, endIndex);
+    
+    // Render table rows
+    tbody.innerHTML = '';
+    paginatedItems.forEach((order, index) => {
+        const row = document.createElement('tr');
+        
+        row.innerHTML = `
+            <td>
+                <input type="checkbox" name="order_ids[]" value="${order.id}">
+            </td>
+            <td>
+                <a href="#" class="text-primary fw-bold">${order.order_id}</a>
+            </td>
+            <td>${order.origin}</td>
+            <td>${order.destination}</td>
+            <td>${order.ctn}</td>
+            <td>${order.qty}</td>
+            <td>${order.ttl_qty}</td>
+            <td>${order.cbm}</td>
+            <td>${order.ttl_cbm}</td>
+            <td>${order.kg}</td>
+            <td>${order.ttl_kg}</td>
+            <td class="fw-bold text-success">₹${parseFloat(order.ttl_amount).toLocaleString('en-IN', {minimumFractionDigits: 2, maximumFractionDigits: 2})}</td>
+        `;
+        tbody.appendChild(row);
+    });
 }
 
 function updateModalPaginationControls() {
@@ -2202,7 +2216,7 @@ function updateModalPaginationControls() {
     prevBtn.disabled = modalCurrentPage === 1;
     nextBtn.disabled = modalCurrentPage === totalPages || totalPages === 0;
     
-    // Update page info text
+    // Update page info text - Showing 1 to 10 of 14 entries
     const startIndex = (modalCurrentPage - 1) * modalItemsPerPage + 1;
     const endIndex = Math.min(modalCurrentPage * modalItemsPerPage, allAvailableOrders.length);
     pageInfo.textContent = `Showing ${startIndex} to ${endIndex} of ${allAvailableOrders.length} entries`;
@@ -2253,58 +2267,24 @@ function addModalPageButton(pageNumber, container) {
     container.appendChild(button);
 }
 
-function renderModalTable() {
-    const tbody = document.getElementById('modalOrdersTableBody');
-    
-    if (allAvailableOrders.length === 0) {
-        tbody.innerHTML = `
-            <tr>
-                <td colspan="12" class="text-muted text-center py-4">
-                    <i class="bi bi-search display-6 d-block mb-3"></i>
-                    No available orders to add to shipment
-                </td>
-            </tr>
-        `;
-        return;
+function goToModalPreviousPage() {
+    if (modalCurrentPage > 1) {
+        modalCurrentPage--;
+        renderModalTable();
+        updateModalPaginationControls();
     }
-    
-    // Calculate pagination - पेजवर दाखवायचे orders
-    const startIndex = (modalCurrentPage - 1) * modalItemsPerPage;
-    const endIndex = startIndex + modalItemsPerPage;
-    
-    // IMPORTANT: सर्व orders आधीच sorted आहेत (descending order मध्ये)
-    // फक्त current page चे orders घ्या
-    const paginatedItems = allAvailableOrders.slice(startIndex, endIndex);
-    
-    // Render table rows
-    tbody.innerHTML = '';
-    paginatedItems.forEach((order, index) => {
-        const globalIndex = startIndex + index + 1;
-        const row = document.createElement('tr');
-        
-        row.innerHTML = `
-            <td>
-                <input type="checkbox" name="order_ids[]" value="${order.id}">
-            </td>
-            <td>
-                <a href="#" class="text-primary fw-bold">${order.order_id}</a>
-            </td>
-            <td>${order.origin}</td>
-            <td>${order.destination}</td>
-            <td>${order.ctn}</td>
-            <td>${order.qty}</td>
-            <td>${order.ttl_qty}</td>
-            <td>${order.cbm}</td>
-            <td>${order.ttl_cbm}</td>
-            <td>${order.kg}</td>
-            <td>${order.ttl_kg}</td>
-            <td class="fw-bold text-success">₹${parseFloat(order.ttl_amount).toLocaleString('en-IN', {minimumFractionDigits: 2, maximumFractionDigits: 2})}</td>
-        `;
-        tbody.appendChild(row);
-    });
 }
 
-// Main Pagination Functions
+function goToModalNextPage() {
+    const totalPages = Math.ceil(allAvailableOrders.length / modalItemsPerPage);
+    if (modalCurrentPage < totalPages) {
+        modalCurrentPage++;
+        renderModalTable();
+        updateModalPaginationControls();
+    }
+}
+
+// ==================== MAIN TABLE PAGINATION FUNCTIONS ====================
 function goToPreviousPage() {
     if (currentPage > 1) {
         currentPage--;
@@ -2542,7 +2522,6 @@ function openShipmentDetails(id) {
         .then(data => {
             // Format date properly
             const shipmentDate = new Date(data.shipment.shipment_date);
-           // <div class="shipment-info-value">${data.shipment.shipment_id}</div>
 
             const formattedDate = shipmentDate.toLocaleDateString('en-GB', {
                 day: '2-digit',
@@ -2743,19 +2722,6 @@ function openShipmentOrderDetails(orderId) {
         });
 }
 
-// Reset modal pagination when modal is shown
-document.addEventListener('DOMContentLoaded', function() {
-    const createShipmentModal = document.getElementById('createShipmentModal');
-    if (createShipmentModal) {
-        createShipmentModal.addEventListener('show.bs.modal', function() {
-            // Reset to first page
-            modalCurrentPage = 1;
-            renderModalTable();
-            updateModalPaginationControls();
-        });
-    }
-});
-
 </script>
 
 <!-- SHIPMENT ORDER DETAILS MODAL - UPDATED TO EDGE-TO-EDGE -->