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

account changes

Browse Source
This commit is contained in:
Utkarsh Khedkar
2025-11-12 19:56:06 +05:30
parent 47711478a6
commit e760b1c45f
2 changed files with 678 additions and 126 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -3,126 +3,254 @@
@section('page-title', 'Orders')
@section('content')
<div class="container-fluid py-4">
<style>
body, .container-fluid { background: #f4f7fc; }
.dash-top-titlebox {
margin-bottom: 2px; background: transparent;
padding-left: 3px; padding-top: 2px;
}
.dash-title-main {
font-size: 1.54rem;
font-weight: 800;
letter-spacing: .018em;
color: #18213e;
margin-bottom: 2px;
}
.dash-title-desc {
font-size: 1rem;
color: #6577a3;
margin-bottom: 5px;
font-weight: 500;
letter-spacing: .01em;
}
.stats-row-wrap { margin-bottom: 33px; }
.stats-row {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 18px;
margin-bottom: 14px;
}
@media (max-width: 992px) { .stats-row { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 630px) { .stats-row { grid-template-columns: 1fr; } }
.stats-card {
background: rgba(255,255,255,0.77);
border-radius: 16px;
box-shadow: 0 7px 32px 0 rgba(19, 39, 78, 0.13), 0 2px 7px 0 rgba(160,180,224,0.14), 0 2px 30px #c5dcf940;
backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
overflow: hidden; position: relative; display: flex; align-items: center; gap: 14px; padding: 18px 16px;
border: 1.2px solid #e8f0fd80;
transition: box-shadow .2s cubic-bezier(.45,.57,.46,.99), transform .15s cubic-bezier(.45,.57,.46,.99);
z-index: 1;
}
.stats-card::after {
content:""; position: absolute; inset: 0; border-radius: 16px; pointer-events:none;
background: linear-gradient(120deg,rgba(74,156,255,.15) 5%,rgba(210,228,255,.06) 54%,rgba(120,150,255,.13) 99%);
z-index:0;
}
.stats-card:hover, .stats-card:focus-within {
box-shadow: 0 18px 48px 0 rgba(62,87,177,0.16), 0 3px 19px 0 #82ccfc3b;
transform: scale(1.031) translateY(-7px);
z-index: 2;
}
.stats-icon {
font-size:1.65rem; width:48px; height:48px; border-radius:13px; display:flex; align-items:center; justify-content:center;
background:#f5f7fd; transition:.22s cubic-bezier(.57,.75,.45,.97);
box-shadow:0 1.7px 13px #edf1fd38;
}
.stats-card-blue .stats-icon {background:linear-gradient(135deg,#3492f8 55%,#1256cc 110%);color:#fff;}
.stats-card-green .stats-icon {background:linear-gradient(135deg,#18ce77 60%,#08ac52 110%);color:#fff;}
.stats-card-red .stats-icon {background:linear-gradient(135deg,#ff5a4e 65%,#d90010 110%);color:#fff;}
.stats-card-orng .stats-icon {background:linear-gradient(135deg,#ffb23c 53%,#e17800 110%);color:#fff;}
.stats-label { font-size:13px; color:#63709b; font-weight:600; letter-spacing:.28px;}
.stats-value { font-size:1.25rem; font-weight:700; color:#194073;}
.stats-card:hover .stats-icon {
transform: scale(1.09) rotate(7deg);
box-shadow:0 0 13px #2396f33b;
}
/* Table header box-round style */
.table thead tr {
background: #feebbe !important;
border-radius: 17px 17px 0 0;
box-shadow: 0 2px 19px #f8cf667e;
}
.table thead th {
background: transparent !important;
border: none;
font-weight: 700; color: #343535; letter-spacing: 0.02em; font-size:15px;
padding-top: 12px; padding-bottom: 10px;
}
.table thead th:first-child { border-radius: 17px 0 0 0;}
.table thead th:last-child { border-radius: 0 17px 0 0;}
/* ------- */
{{-- Header --}}
<div class="d-flex justify-content-between align-items-center mb-4">
<h4 class="mb-0">Order Management</h4>
<button class="btn btn-primary" data-bs-toggle="collapse" data-bs-target="#createOrderForm">
<i class="bi bi-plus-circle"></i> Create Order
</button>
.order-mgmt-box {
background: #fff; border-radius:17px; box-shadow:0 7px 38px #dde3fa77, 0 2px 9px #e5e7ff80;
margin-bottom: 33px; margin-top: 10px; padding-bottom: 0;
}
.order-mgmt-bar {
display:flex; justify-content:space-between; align-items:center;
border-radius:17px 17px 0 0; background: #fffbe9;
min-height: 54px; padding: 15px 26px 10px 22px; border-bottom: 1.4px solid #e8e2cf;
box-shadow:0 1px 13px #ffe2a888;
}
.order-mgmt-title {
font-size:1.32rem; font-weight:800; color:#2451af; letter-spacing:.08em;
display: flex; align-items: center; gap: 11px;
}
.order-mgmt-title i { font-size: 1.12em; color: #336ad3; }
.create-order-btn {
background: linear-gradient(90deg,#226ad6,#46b4fd 123%);
padding:9px 26px; font-weight:600; border:none; border-radius:9px; color:#fff;
font-size:16.2px; box-shadow: 0 2px 13px #dde7fa42;
transition: background 0.16s, box-shadow .17s;
display: flex; align-items: center; gap: 8px; font-family: inherit;
}
.create-order-btn:hover {
background: linear-gradient(90deg,#3264f8,#3acfff 140%);
box-shadow:0 4px 25px #5ab8f880;
}
.card-body, .order-mgmt-main { background: #fff; border-radius: 0 0 17px 17px; padding:25px; }
.card { border-radius:17px; box-shadow:0 7px 29px #e7eefd8c; border:none; margin-bottom:23px!important;}
.table { background:#fff; border-radius:9px; box-shadow:0 2px 12px #e2ebf941;}
.table-striped tbody tr:nth-of-type(odd) { background:#f9fafc; }
.table-responsive { border-radius:10px; }
.badge { font-size:13px; font-weight:600; padding:7px 17px; border-radius:12px;}
.bg-info { background-color:#22cbfa!important; color:#fff!important;}
.form-label { font-weight:600; color:#1d3159; font-size:15px;}
.form-control, .form-select {
border-radius:8px!important; font-size:15.8px; background: #f7f9fe;
border:1.2px solid #c7dbfa; font-weight:500;
}
.form-control:focus, .form-select:focus {
border-color:#2469d6; box-shadow:0 0 4px #226ad688;
}
.table td a { color:#2469d6; font-weight:600; text-decoration:underline; }
@media (max-width:1200px){.stats-row{grid-template-columns:repeat(2,1fr);}}
@media (max-width:768px){
.order-mgmt-bar{flex-direction:column;align-items:flex-start;gap:7px;padding:14px;}
.create-order-btn{margin-top:8px;}
.table th, .table td{font-size:13.5px;}
}
</style>
<div class="container-fluid py-3">
<!-- DASHBOARD TITLE & DESC -->
<div class="dash-top-titlebox">
<div class="dash-title-main">Admin Dashboard</div>
<div class="dash-title-desc">Monitor operations and manage system</div>
</div>
{{-- Create Order Form --}}
<div id="createOrderForm" class="collapse">
<div class="card shadow-sm mb-4">
<div class="card-header bg-light">
<strong>New Order Form</strong>
</div>
<div class="card-body">
<form action="{{ route('admin.orders.store') }}" method="POST">
@csrf
<div class="row g-3">
{{-- Mark No --}}
<div class="col-md-4">
<label class="form-label">Mark No</label>
<select class="form-select" id="markNoSelect" name="mark_no" required>
<option value="">Select Mark No</option>
@foreach($markList as $mark)
<option value="{{ $mark->mark_no }}"
data-origin="{{ $mark->origin }}"
data-destination="{{ $mark->destination }}">
{{ $mark->mark_no }} - {{ $mark->customer_name }}
</option>
@endforeach
</select>
</div>
<div class="col-md-4">
<label class="form-label">Origin</label>
<input type="text" class="form-control" name="origin" id="originField" readonly>
</div>
<div class="col-md-4">
<label class="form-label">Destination</label>
<input type="text" class="form-control" name="destination" id="destinationField" readonly>
</div>
<div class="col-md-4">
<label class="form-label">Description</label>
<input type="text" class="form-control" name="description" required>
</div>
<div class="col-md-2"><label class="form-label">CTN</label><input type="number" class="form-control" name="ctn"></div>
<div class="col-md-2"><label class="form-label">QTY</label><input type="number" class="form-control" name="qty"></div>
<div class="col-md-2"><label class="form-label">TTL/QTY</label><input type="number" class="form-control" name="ttl_qty"></div>
<div class="col-md-2"><label class="form-label">Unit</label><input type="text" class="form-control" name="unit"></div>
<div class="col-md-2"><label class="form-label">Price</label><input type="number" step="0.01" class="form-control" name="price"></div>
<div class="col-md-2"><label class="form-label">TTL Amount</label><input type="number" step="0.01" class="form-control" name="ttl_amount"></div>
<div class="col-md-2"><label class="form-label">CBM</label><input type="number" step="0.001" class="form-control" name="cbm"></div>
<div class="col-md-2"><label class="form-label">TTL CBM</label><input type="number" step="0.001" class="form-control" name="ttl_cbm"></div>
<div class="col-md-2"><label class="form-label">KG</label><input type="number" step="0.001" class="form-control" name="kg"></div>
<div class="col-md-2"><label class="form-label">TTL KG</label><input type="number" step="0.001" class="form-control" name="ttl_kg"></div>
<div class="col-md-3"><label class="form-label">Shop No</label><input type="text" class="form-control" name="shop_no"></div>
<div class="col-md-12 text-end">
<button type="submit" class="btn btn-success mt-3">
<i class="bi bi-save"></i> Submit Order
</button>
</div>
<!-- STATS CARDS BLOCK: 2 x 4 layout -->
<div class="stats-row-wrap">
<div class="stats-row">
<div class="stats-card stats-card-blue"><span class="stats-icon">📦</span><div style="z-index:2;"><div class="stats-label">Total Shipments</div><div class="stats-value">1,247</div></div></div>
<div class="stats-card stats-card-blue"><span class="stats-icon">👥</span><div style="z-index:2;"><div class="stats-label">Active Customers</div><div class="stats-value">342</div></div></div>
<div class="stats-card stats-card-green"><span class="stats-icon">💰</span><div style="z-index:2;"><div class="stats-label">Total Revenue</div><div class="stats-value">₹123</div></div></div>
<div class="stats-card stats-card-red"><span class="stats-icon">⏳</span><div style="z-index:2;"><div class="stats-label">Pending Order</div><div class="stats-value">23</div></div></div>
</div>
<div class="stats-row">
<div class="stats-card stats-card-blue"><span class="stats-icon">📦</span><div style="z-index:2;"><div class="stats-label">Total Orders</div><div class="stats-value">453</div></div></div>
<div class="stats-card stats-card-blue"><span class="stats-icon">🧑‍💼</span><div style="z-index:2;"><div class="stats-label">Total Staff</div><div class="stats-value">125</div></div></div>
<div class="stats-card stats-card-blue"><span class="stats-icon">📦</span><div style="z-index:2;"><div class="stats-label">Total Items</div><div class="stats-value">321</div></div></div>
<div class="stats-card stats-card-orng"><span class="stats-icon">⛔</span><div style="z-index:2;"><div class="stats-label">Inactive Customers</div><div class="stats-value">10</div></div></div>
</div>
</div>
<!-- ORDER MANAGEMENT BOX (header + main) -->
<div class="order-mgmt-box">
<div class="order-mgmt-bar">
<span class="order-mgmt-title"><i class="bi bi-table"></i> Order Management</span>
<button class="create-order-btn" data-bs-toggle="collapse" data-bs-target="#createOrderForm">
<i class="bi bi-plus-circle"></i> Create Order
</button>
</div>
<div class="order-mgmt-main">
<!-- Create Order Form -->
<div id="createOrderForm" class="collapse mb-3">
<div class="card shadow-sm mb-4" style="margin-bottom:0!important;">
<div class="card-header bg-light" style="border-radius:10px 10px 0 0;"><strong>New Order Form</strong></div>
<div class="card-body">
<form action="{{ route('admin.orders.store') }}" method="POST">
@csrf
<div class="row g-3">
<div class="col-md-4"><label class="form-label">Mark No</label>
<select class="form-select" id="markNoSelect" name="mark_no" required>
<option value="">Select Mark No</option>
@foreach($markList as $mark)
<option value="{{ $mark->mark_no }}"
data-origin="{{ $mark->origin }}"
data-destination="{{ $mark->destination }}">
{{ $mark->mark_no }} - {{ $mark->customer_name }}
</option>
@endforeach
</select>
</div>
<div class="col-md-4"><label class="form-label">Origin</label><input type="text" class="form-control" name="origin" id="originField" readonly></div>
<div class="col-md-4"><label class="form-label">Destination</label><input type="text" class="form-control" name="destination" id="destinationField" readonly></div>
<div class="col-md-4"><label class="form-label">Description</label><input type="text" class="form-control" name="description" required></div>
<div class="col-md-2"><label class="form-label">CTN</label><input type="number" class="form-control" name="ctn"></div>
<div class="col-md-2"><label class="form-label">QTY</label><input type="number" class="form-control" name="qty"></div>
<div class="col-md-2"><label class="form-label">TTL/QTY</label><input type="number" class="form-control" name="ttl_qty"></div>
<div class="col-md-2"><label class="form-label">Unit</label><input type="text" class="form-control" name="unit"></div>
<div class="col-md-2"><label class="form-label">Price</label><input type="number" step="0.01" class="form-control" name="price"></div>
<div class="col-md-2"><label class="form-label">TTL Amount</label><input type="number" step="0.01" class="form-control" name="ttl_amount"></div>
<div class="col-md-2"><label class="form-label">CBM</label><input type="number" step="0.001" class="form-control" name="cbm"></div>
<div class="col-md-2"><label class="form-label">TTL CBM</label><input type="number" step="0.001" class="form-control" name="ttl_cbm"></div>
<div class="col-md-2"><label class="form-label">KG</label><input type="number" step="0.001" class="form-control" name="kg"></div>
<div class="col-md-2"><label class="form-label">TTL KG</label><input type="number" step="0.001" class="form-control" name="ttl_kg"></div>
<div class="col-md-3"><label class="form-label">Shop No</label><input type="text" class="form-control" name="shop_no"></div>
<div class="col-md-12 text-end">
<button type="submit" class="btn btn-success mt-3"><i class="bi bi-save"></i> Submit Order</button>
</div>
</div>
</form>
</div>
</form>
</div>
</div>
<!-- Orders Table -->
<div class="card shadow-sm mb-2" style="box-shadow:none!important;border:none!important;">
<div class="card-header bg-light"><strong>Recent Orders</strong></div>
<div class="card-body table-responsive" style="padding-bottom:0;">
<table class="table table-striped align-middle">
<thead>
<tr>
<th>#</th>
<th>Order ID</th>
<th>Mark No</th>
<th>Description</th>
<th>Origin</th>
<th>Destination</th>
<th>TTL Amount</th>
<th>Status</th>
<th>Date</th>
<th>Action</th>
</tr>
</thead>
<tbody>
@forelse($orders as $index => $order)
<tr>
<td>{{ $index + 1 }}</td>
<td><a href="{{ route('admin.orders.show', $order->id) }}">{{ $order->order_id }}</a></td>
<td>{{ $order->mark_no }}</td>
<td>{{ $order->description }}</td>
<td>{{ $order->origin }}</td>
<td>{{ $order->destination }}</td>
<td>₹{{ number_format($order->ttl_amount, 2) }}</td>
<td><span class="badge bg-info text-dark">{{ ucfirst($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">View</a></td>
</tr>
@empty
<tr><td colspan="10" class="text-center">No orders found</td></tr>
@endforelse
</tbody>
</table>
</div>
</div>
</div>
</div>
{{-- Orders Table --}}
<div class="card shadow-sm">
<div class="card-header bg-light">
<strong>Recent Orders</strong>
</div>
<div class="card-body table-responsive">
<table class="table table-striped align-middle">
<thead>
<tr>
<th>#</th>
<th>Order ID</th>
<th>Mark No</th>
<th>Description</th>
<th>Origin</th>
<th>Destination</th>
<th>TTL Amount</th>
<th>Status</th>
<th>Date</th>
<th>Action</th>
</tr>
</thead>
<tbody>
@forelse($orders as $index => $order)
<tr>
<td>{{ $index + 1 }}</td>
<td><a href="{{ route('admin.orders.show', $order->id) }}">{{ $order->order_id }}</a></td>
<td>{{ $order->mark_no }}</td>
<td>{{ $order->description }}</td>
<td>{{ $order->origin }}</td>
<td>{{ $order->destination }}</td>
<td>₹{{ number_format($order->ttl_amount, 2) }}</td>
<td><span class="badge bg-info text-dark">{{ ucfirst($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">View</a></td>
</tr>
@empty
<tr><td colspan="10" class="text-center">No orders found</td></tr>
@endforelse
</tbody>
</table>
</div>
</div>
</div>
{{-- Autofill JS --}}
<script>
document.getElementById('markNoSelect').addEventListener('change', function() {
const option = this.options[this.selectedIndex];