changes

2025-12-23 13:08:26 +05:30
parent 1885d3beef
commit 2d28e7c1d5
1 changed files with 172 additions and 109 deletions
--- 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');