From 2d28e7c1d51d98170e91b7d67ba30baa489c9b7464517314930b8a964abe9549 Mon Sep 17 00:00:00 2001
From: Utkarsh Khedkar <utkarshkhedkar2003@gmail.com>
Date: Tue, 23 Dec 2025 13:08:26 +0530
Subject: [PATCH] changes

---
 resources/views/admin/dashboard.blade.php | 281 +++++++++++++---------
 1 file changed, 172 insertions(+), 109 deletions(-)

diff --git a/resources/views/admin/dashboard.blade.php b/resources/views/admin/dashboard.blade.php
index 260c7f0..3d413e3 100644
--- a/resources/views/admin/dashboard.blade.php
+++ b/resources/views/admin/dashboard.blade.php
@@ -25,6 +25,7 @@
 
     $orders = Order::latest()->get();
 @endphp
+
 @section('content')
 <style>
 /* ===== GLOBAL RESPONSIVE STYLES ===== */
@@ -43,6 +44,26 @@ body, .container-fluid {
   padding-right: 15px;
 }
 
+/* === SIDEBAR GAP FIX (IMPORTANT) === */
+/* Zoom-out / 1200px खाली गेले की sidebar hide करून main-content full-width करा */
+@media (max-width: 1200px) {
+  .sidebar {
+    display: none !important;
+  }
+
+  .main-content {
+    margin-left: 0 !important;
+    width: 100vw !important;
+  }
+
+  .content-wrapper,
+  .container-fluid {
+    padding-left: 10px;
+    padding-right: 10px;
+    max-width: 100% !important;
+  }
+}
+
 /* ===== DASHBOARD TITLE ===== */
 .dash-top-titlebox {
   margin-bottom: 2px; 
@@ -219,7 +240,6 @@ body, .container-fluid {
   display: flex; 
   align-items: center; 
   gap: 8px; 
-  font-family: inherit;
   font-family: 'Inter', sans-serif;
 }
 
@@ -261,6 +281,7 @@ body, .container-fluid {
   font-family: 'Inter', sans-serif;
   border-bottom: 2px solid #e9ecef;
 }
+
 .table thead th:first-child  { border-radius: 9px 0 0 0;}
 .table thead th:last-child   { border-radius: 0 9px 0 0;}
 
@@ -348,7 +369,7 @@ body, .container-fluid {
   justify-content: center;
 }
 
-/* Pending Status - SAME SIZE WITH CLOCK ICON */
+/* Pending Status */
 .badge-pending {
   background: linear-gradient(135deg, #fef3c7, #fde68a) !important;
   color: #d97706 !important;
@@ -362,28 +383,28 @@ body, .container-fluid {
   width: 110px;
 }
 
-/* In Transit Status - SAME SIZE WITH TRUCK ICON */
+/* In Transit Status */
 .badge-in_transit {
   background: linear-gradient(135deg, #dbeafe, #93c5fd) !important;
   color: #1e40af !important;
   border-color: #3b82f6 !important;
 }
 
-/* Dispatched Status - SAME SIZE WITH BOX ICON */
+/* Dispatched Status */
 .badge-dispatched {
   background: linear-gradient(135deg, #e9d5ff, #c4b5fd) !important;
   color: #6b21a8 !important;
   border-color: #8b5cf6 !important;
 }
 
-/* Delivered Status - SAME SIZE WITH CHECK ICON */
+/* Delivered Status */
 .badge-delivered {
   background: linear-gradient(135deg, #d1fae5, #a7f3d0) !important;
   color: #065f46 !important;
   border-color: #10b981 !important;
 }
 
-/* Default badge styles - SAME SIZE */
+/* Default badges */
 .badge.bg-info {
   background: linear-gradient(135deg, #4cc9f0, #4361ee) !important;
   color: white !important;
@@ -465,31 +486,30 @@ body, .container-fluid {
   min-width: 2000px;
   border-radius: 10px;
 }
+
 /* ===== CREATE ORDER MODAL STYLES ===== */
 .create-order-modal {
   position: fixed;
   top: 0;
   left: 0;
-  width: 100vw;           /* full screen */
-  height: 100vh;          /* full screen */
-  background: #f8fafc;    /* backdrop काढून direct page सारखा bg */
+  width: 100vw;
+  height: 100vh;
+  background: #f8fafc;
   display: none;
-  justify-content: flex-start; /* top पासून सुरू कर */
-  align-items: stretch;        /* full height */
+  justify-content: flex-start;
+  align-items: stretch;
   z-index: 9999;
-  overflow-y: auto;           /* content scroll */
+  overflow-y: auto;
 }
 
-/* JS madhun modal.classList.add('show') already aahe */
 .create-order-modal.show {
-  display: block;            /* flex ऐवजी block => full page section सारखा */
+  display: block;
 }
 
-/* Card ला full-width/height सारखं कर */
 .create-order-modal .modal-card {
   background: #fff;
-  border-radius: 0;          /* corner radius काढला => normal page feel */
-  box-shadow: none;          /* popup सारखा shadow काढला */
+  border-radius: 0;
+  box-shadow: none;
   width: 100%;
   max-width: 100%;
   min-height: 100vh;
@@ -506,6 +526,7 @@ body, .container-fluid {
   justify-content: space-between;
   align-items: center;
 }
+
 .create-order-modal .modal-title {
   font-size: 1.4rem;
   font-weight: 700;
@@ -982,7 +1003,6 @@ body, .container-fluid {
     font-size: 0.75rem;
   }
   
-  /* Modal adjustments for mobile */
   .create-order-modal .modal-card {
     width: 98%;
     margin: 10px;
@@ -1094,7 +1114,6 @@ body, .container-fluid {
     padding: 12px;
   }
   
-  /* Stack form columns on mobile */
   .create-order-modal .row.g-3 > [class*="col-"] {
     margin-bottom: 10px;
   }
@@ -1173,30 +1192,81 @@ body, .container-fluid {
   <!-- STATS CARDS -->
   <div class="stats-row-wrap">
     <div class="stats-row">
-      <div class="stats-card stats-card-blue"><span class="stats-icon">📦</span><div class="stats-label">Total Shipments</div><div class="stats-value">{{ $totalShipments }}</div></div>
-      <div class="stats-card stats-card-blue"><span class="stats-icon">👥</span><div class="stats-label">Active Customers</div><div class="stats-value">{{ $activeCustomers }}</div></div>
-      <div class="stats-card stats-card-green"><span class="stats-icon">💰</span><div class="stats-label">Total Revenue</div><div class="stats-value">₹{{ number_format($totalRevenue, 2) }}</div></div>
-      <div class="stats-card stats-card-red"><span class="stats-icon">⏳</span><div class="stats-label">Pending Order</div><div class="stats-value">{{ $pendingOrders }}</div></div>
+      <div class="stats-card stats-card-blue">
+        <span class="stats-icon">📦</span>
+        <div>
+          <div class="stats-label">Total Shipments</div>
+          <div class="stats-value">{{ $totalShipments }}</div>
+        </div>
+      </div>
+      <div class="stats-card stats-card-blue">
+        <span class="stats-icon">👥</span>
+        <div>
+          <div class="stats-label">Active Customers</div>
+          <div class="stats-value">{{ $activeCustomers }}</div>
+        </div>
+      </div>
+      <div class="stats-card stats-card-green">
+        <span class="stats-icon">💰</span>
+        <div>
+          <div class="stats-label">Total Revenue</div>
+          <div class="stats-value">₹{{ number_format($totalRevenue, 2) }}</div>
+        </div>
+      </div>
+      <div class="stats-card stats-card-red">
+        <span class="stats-icon">⏳</span>
+        <div>
+          <div class="stats-label">Pending Order</div>
+          <div class="stats-value">{{ $pendingOrders }}</div>
+        </div>
+      </div>
     </div>
+
     <div class="stats-row">
-      <div class="stats-card stats-card-blue"><span class="stats-icon">📦</span><div class="stats-label">Total Orders</div><div class="stats-value">{{ $totalOrders }}</div></div>
-      <div class="stats-card stats-card-blue"><span class="stats-icon">🧑‍💼</span><div class="stats-label">Total Staff</div><div class="stats-value">{{ $totalStaff }}</div></div>
-      <div class="stats-card stats-card-blue"><span class="stats-icon">📦</span><div class="stats-label">Total Items</div><div class="stats-value">{{ $totalItems }}</div></div>
-      <div class="stats-card stats-card-orng"><span class="stats-icon">⛔</span><div class="stats-label">Inactive Customers</div><div class="stats-value">{{ $inactiveCustomers }}</div></div>
+      <div class="stats-card stats-card-blue">
+        <span class="stats-icon">📦</span>
+        <div>
+          <div class="stats-label">Total Orders</div>
+          <div class="stats-value">{{ $totalOrders }}</div>
+        </div>
+      </div>
+      <div class="stats-card stats-card-blue">
+        <span class="stats-icon">🧑‍💼</span>
+        <div>
+          <div class="stats-label">Total Staff</div>
+          <div class="stats-value">{{ $totalStaff }}</div>
+        </div>
+      </div>
+      <div class="stats-card stats-card-blue">
+        <span class="stats-icon">📦</span>
+        <div>
+          <div class="stats-label">Total Items</div>
+          <div class="stats-value">{{ $totalItems }}</div>
+        </div>
+      </div>
+      <div class="stats-card stats-card-orng">
+        <span class="stats-icon">⛔</span>
+        <div>
+          <div class="stats-label">Inactive Customers</div>
+          <div class="stats-value">{{ $inactiveCustomers }}</div>
+        </div>
+      </div>
     </div>
   </div>
 
   <!-- ORDER MANAGEMENT -->
   <div class="order-mgmt-box">
     <div class="order-mgmt-bar">
-      <span class="order-mgmt-title"><i class="bi bi-table"></i> Order Management</span>
+      <span class="order-mgmt-title">
+        <i class="bi bi-table"></i> Order Management
+      </span>
       @can('order.create')
         <button class="create-order-btn" id="openCreateOrderModal">
           <i class="bi bi-plus-circle"></i> Create Order
         </button>
       @endcan
-
     </div>
+
     <div class="order-mgmt-main">
       <!-- RECENT ORDERS TABLE -->
       <div class="card shadow-sm">
@@ -1240,70 +1310,79 @@ body, .container-fluid {
                       {{ $order->order_id }}
                     </a>
                   </td>
+                  <td>{{ $order->mark_no }}</td>
+                  <td>{{ $order->origin }}</td>
+                  <td>{{ $order->destination }}</td>
+                  <td>{{ $order->ctn }}</td>
+                  <td>{{ $order->qty }}</td>
+                  <td>{{ $order->ttl_qty }}</td>
+                  <td>₹{{ number_format($order->ttl_amount, 2) }}</td>
+                  <td>{{ $order->cbm }}</td>
+                  <td>{{ $order->ttl_cbm }}</td>
+                  <td>{{ $order->kg }}</td>
+                  <td>{{ $order->ttl_kg }}</td>
+                  <td>
+                    <span class="badge badge-{{ $order->status }}">
+                      @if($order->status == 'pending')
+                        <i class="bi bi-clock-fill status-icon"></i>
+                      @elseif($order->status == 'in_transit')
+                        <i class="bi bi-truck status-icon"></i>
+                      @elseif($order->status == 'dispatched')
+                        <i class="bi bi-box-seam status-icon"></i>
+                      @elseif($order->status == 'delivered')
+                        <i class="bi bi-check-circle-fill status-icon"></i>
+                      @endif
+                      {{ ucfirst(str_replace('_', ' ', $order->status)) }}
+                    </span>
+                  </td>
+                  <td>{{ $order->created_at->format('d-m-Y') }}</td>
+                  <td>
+                    <a href="{{ route('admin.orders.show', $order->id) }}" class="btn btn-sm btn-outline-primary">
+                      <i class="bi bi-eye"></i> View
+                    </a>
+                  </td>
+                </tr>
+                @empty
+                <tr>
+                  <td colspan="16" class="text-muted">No orders found</td>
+                </tr>
+                @endforelse
+              </tbody>
+            </table>
+          </div>
 
-                    <td>{{ $order->mark_no }}</td>
-                    <td>{{ $order->origin }}</td>
-                    <td>{{ $order->destination }}</td>
-                    <td>{{ $order->ctn }}</td>
-                    <td>{{ $order->qty }}</td>
-                    <td>{{ $order->ttl_qty }}</td>
-                    <td>₹{{ number_format($order->ttl_amount, 2) }}</td>
-                    <td>{{ $order->cbm }}</td>
-                    <td>{{ $order->ttl_cbm }}</td>
-                    <td>{{ $order->kg }}</td>
-                    <td>{{ $order->ttl_kg }}</td>
-                    <td>
-                      <span class="badge badge-{{ $order->status }}">
-                        @if($order->status == 'pending')
-                          <i class="bi bi-clock-fill status-icon"></i>
-                        @elseif($order->status == 'in_transit')
-                          <i class="bi bi-truck status-icon"></i>
-                        @elseif($order->status == 'dispatched')
-                          <i class="bi bi-box-seam status-icon"></i>
-                        @elseif($order->status == 'delivered')
-                          <i class="bi bi-check-circle-fill status-icon"></i>
-                        @endif
-                        {{ ucfirst(str_replace('_', ' ', $order->status)) }}
-                      </span>
-                    </td>
-                    <td>{{ $order->created_at->format('d-m-Y') }}</td>
-                    <td>
-                      <a href="{{ route('admin.orders.show', $order->id) }}" class="btn btn-sm btn-outline-primary">
-                        <i class="bi bi-eye"></i> View
-                      </a>
-                    </td>
-                  </tr>
-                  @empty
-                  <tr>
-                    <td colspan="16" class="text-muted">No orders found</td>
-                  </tr>
-                  @endforelse
-                </tbody>
-              </table>
+          <!-- Pagination Controls -->
+          <div class="pagination-container">
+            <div class="pagination-info" id="pageInfo">
+              Showing 1 to 10 of {{ $orders->count() }} entries
             </div>
-
-            <!-- Pagination Controls -->
-            <div class="pagination-container">
-                <div class="pagination-info" id="pageInfo">Showing 1 to 10 of {{ $orders->count() }} entries</div>
-                <div class="pagination-controls">
-                    <button class="pagination-img-btn" id="prevPageBtn" title="Previous page">
-                        <!-- Left arrow SVG -->
-                        <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
-                            <path d="M10 12L6 8L10 4" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-                        </svg>
-                    </button>
-                    <div class="pagination-pages" id="paginationPages">
-                        <!-- Page numbers will be inserted here -->
-                    </div>
-                    <button class="pagination-img-btn" id="nextPageBtn" title="Next page">
-                        <!-- Right arrow SVG -->
-                        <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
-                            <path d="M6 4L10 8L6 12" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-                        </svg>
-                    </button>
-                </div>
+            <div class="pagination-controls">
+              <button class="pagination-img-btn" id="prevPageBtn" title="Previous page">
+                <svg width="16" height="16" viewBox="0 0 16 16" fill="none"
+                     xmlns="http://www.w3.org/2000/svg">
+                  <path d="M10 12L6 8L10 4"
+                        stroke="currentColor"
+                        stroke-width="2"
+                        stroke-linecap="round"
+                        stroke-linejoin="round"/>
+                </svg>
+              </button>
+              <div class="pagination-pages" id="paginationPages">
+                <!-- Page numbers will be inserted here -->
+              </div>
+              <button class="pagination-img-btn" id="nextPageBtn" title="Next page">
+                <svg width="16" height="16" viewBox="0 0 16 16" fill="none"
+                     xmlns="http://www.w3.org/2000/svg">
+                  <path d="M6 4L10 8L6 12"
+                        stroke="currentColor"
+                        stroke-width="2"
+                        stroke-linecap="round"
+                        stroke-linejoin="round"/>
+                </svg>
+              </button>
             </div>
           </div>
+
         </div>
       </div>
     </div>
@@ -1376,7 +1455,7 @@ body, .container-fluid {
         {{-- ITEM INPUTS --}}
         <h6 class="text-primary">Add Item</h6>
 
-        {{-- NEW ITEMS TABLE (INSTEAD OF SINGLE-ROW INPUTS) --}}
+        {{-- NEW ITEMS TABLE --}}
         <div class="table-wrapper mb-3">
           <table class="table table-bordered table-sm align-middle text-center" id="itemsTable">
             <thead class="table-light">
@@ -1520,13 +1599,10 @@ document.addEventListener('DOMContentLoaded', function() {
     const closeBtn = document.getElementById('closeCreateOrderModal');
     const clearFormBtn = document.getElementById('clearForm');
 
-    // Pagination state
     let currentPage = 1;
     const ordersPerPage = 10;
     let allOrders = @json($orders->values());
 
-    // ------- ITEMS TABLE LOGIC (NEW) -------
-
     const itemsTableBody = document.getElementById('itemsTableBody');
 
     function addRow(index) {
@@ -1578,10 +1654,8 @@ document.addEventListener('DOMContentLoaded', function() {
         if (first) first.focus();
     }
 
-    // ------- EXISTING PAGINATION INITIALIZE -------
     initializePagination();
 
-    // Reset temp data function
     const resetTempData = () => {
         fetch('{{ route("admin.orders.temp.reset") }}', {
             method: 'POST',
@@ -1592,7 +1666,6 @@ document.addEventListener('DOMContentLoaded', function() {
         });
     };
 
-    // Modal functions
     const openModal = () => {
         modal.classList.add('show');
         document.body.style.overflow = 'hidden';
@@ -1611,20 +1684,17 @@ document.addEventListener('DOMContentLoaded', function() {
         @endif
     };
 
-    // Clear form -> clear items table
     const clearForm = () => {
         generateDefaultRows();
     };
 
-    // Event listeners
-    openBtn.addEventListener('click', openModal);
-    closeBtn.addEventListener('click', closeModal);
-    clearFormBtn.addEventListener('click', clearForm);
+    if (openBtn) openBtn.addEventListener('click', openModal);
+    if (closeBtn) closeBtn.addEventListener('click', closeModal);
+    if (clearFormBtn) clearFormBtn.addEventListener('click', clearForm);
 
     modal.addEventListener('click', (e) => e.target === modal && closeModal());
     document.addEventListener('keydown', (e) => e.key === 'Escape' && modal.classList.contains('show') && closeModal());
 
-    // Mark No functionality (unchanged)
     const markNoSelect = document.getElementById('markNoSelect');
     if (markNoSelect) {
         markNoSelect.addEventListener('change', function() {
@@ -1640,14 +1710,12 @@ document.addEventListener('DOMContentLoaded', function() {
         });
     }
 
-    // Auto open modal if temp items exist
     @if(session('temp_order_items') && count(session('temp_order_items')) > 0)
         modal.classList.add('show');
         document.body.style.overflow = 'hidden';
         generateDefaultRows();
     @endif
 
-    // Reset confirmation
     document.querySelectorAll('form[action="{{ route("admin.orders.temp.reset") }}"]')
         .forEach(form => form.addEventListener('submit', e => {
             if (!confirm('Are you sure you want to reset the current order? All temporary items will be lost.')) {
@@ -1655,7 +1723,6 @@ document.addEventListener('DOMContentLoaded', function() {
             }
         }));
 
-    // Order details modal functionality (unchanged)
     document.querySelectorAll('.open-order-modal').forEach(button => {
         button.addEventListener('click', function() {
             let id = this.dataset.id;
@@ -1678,11 +1745,9 @@ document.addEventListener('DOMContentLoaded', function() {
         });
     });
 
-    /* ---------- Pagination Functions (unchanged) ---------- */
     function initializePagination() {
         renderOrdersTable(allOrders);
         updatePaginationControls();
-        
         document.getElementById('prevPageBtn').addEventListener('click', goToPreviousPage);
         document.getElementById('nextPageBtn').addEventListener('click', goToNextPage);
     }
@@ -1839,7 +1904,6 @@ document.addEventListener('DOMContentLoaded', function() {
         });
     }
 
-    // Enter key behavior for items/table
     itemsTableBody.addEventListener('keydown', function(e) {
         if (e.key !== 'Enter' || e.target.tagName !== 'INPUT') return;
         e.preventDefault();
@@ -1877,7 +1941,6 @@ document.addEventListener('DOMContentLoaded', function() {
         }
     });
 
-    // Remove row
     itemsTableBody.addEventListener('click', function(e) {
         if (!e.target.classList.contains('remove-row-btn')) return;
         const rows = itemsTableBody.querySelectorAll('tr');