kent-logistics/Kent-logistics-Laravel
SHA256
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

changes

Browse Source
This commit is contained in:
Utkarsh Khedkar
2025-12-23 13:08:26 +05:30
parent 1885d3beef
commit 2d28e7c1d5
1 changed files with 172 additions and 109 deletions
Download Patch File Download Diff File Expand all files Collapse all files

179
resources/views/admin/dashboard.blade.php
View File

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