shipment
This commit is contained in:
Abhishek Mali
@@ -1,12 +1,320 @@
|
||||
@extends('admin.layouts.app')
|
||||
|
||||
@section('page-title', 'Dashboard')
|
||||
@section('page-title', 'Shipment Management')
|
||||
|
||||
@section('content')
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-body">
|
||||
<h4>Welcome to the Admin shipment</h4>
|
||||
<p>Here you can manage all system modules.</p>
|
||||
</div>
|
||||
|
||||
<div class="container-fluid py-4">
|
||||
|
||||
{{-- SUCCESS / ERROR MESSAGES --}}
|
||||
@if(session('success'))
|
||||
<div class="alert alert-success">{{ session('success') }}</div>
|
||||
@endif
|
||||
|
||||
@if(session('error'))
|
||||
<div class="alert alert-danger">{{ session('error') }}</div>
|
||||
@endif
|
||||
|
||||
|
||||
<!-- ============================= -->
|
||||
<!-- CREATE SHIPMENT BOX -->
|
||||
<!-- ============================= -->
|
||||
<div class="card shadow-sm mb-4">
|
||||
<div class="card-header bg-light">
|
||||
<h5 class="mb-0">
|
||||
<i class="bi bi-truck"></i> Create Shipment
|
||||
</h5>
|
||||
</div>
|
||||
|
||||
<div class="card-body">
|
||||
|
||||
<form action="{{ route('admin.shipments.store') }}" method="POST">
|
||||
@csrf
|
||||
|
||||
<div class="row g-3">
|
||||
|
||||
<div class="col-md-4">
|
||||
<label class="form-label">Origin</label>
|
||||
<input type="text" class="form-control" name="origin" required>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4">
|
||||
<label class="form-label">Destination</label>
|
||||
<input type="text" class="form-control" name="destination" required>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4">
|
||||
<label class="form-label">Shipment Date</label>
|
||||
<input type="date" name="shipment_date" class="form-control"
|
||||
value="{{ date('Y-m-d') }}" required>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<hr class="my-3">
|
||||
|
||||
<h6 class="fw-bold text-primary mb-2">Select Orders for Shipment</h6>
|
||||
|
||||
{{-- Orders Table --}}
|
||||
<div class="table-responsive" style="max-height: 350px; overflow-y:auto;">
|
||||
<table class="table table-bordered table-striped text-center align-middle">
|
||||
<thead class="table-light">
|
||||
<tr>
|
||||
<th>Select</th>
|
||||
<th>Order ID</th>
|
||||
<th>Mark No</th>
|
||||
<th>Origin</th>
|
||||
<th>Destination</th>
|
||||
<th>CTN</th>
|
||||
<th>QTY</th>
|
||||
<th>TTL Qty</th>
|
||||
<th>Amount</th>
|
||||
<th>KG</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@forelse($availableOrders as $order)
|
||||
<tr>
|
||||
<td>
|
||||
<input type="checkbox" name="order_ids[]" value="{{ $order->id }}">
|
||||
</td>
|
||||
<td class="text-primary fw-bold">{{ $order->order_id }}</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->ttl_kg }}</td>
|
||||
</tr>
|
||||
@empty
|
||||
<tr>
|
||||
<td colspan="10" class="text-muted">No available orders</td>
|
||||
</tr>
|
||||
@endforelse
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="text-end mt-3">
|
||||
<button type="submit" class="btn btn-success btn-lg">
|
||||
<i class="bi bi-check-circle"></i> Create Shipment
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
<!-- ============================= -->
|
||||
<!-- SHIPMENT LIST TABLE -->
|
||||
<!-- ============================= -->
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-header bg-light">
|
||||
<h5 class="mb-0"><i class="bi bi-table"></i> Shipments List</h5>
|
||||
</div>
|
||||
|
||||
<div class="card-body table-responsive">
|
||||
<table class="table table-striped table-bordered text-center align-middle">
|
||||
<thead class="table-light">
|
||||
<tr>
|
||||
<th>#</th>
|
||||
<th>Shipment ID</th>
|
||||
<th>Origin</th>
|
||||
<th>Destination</th>
|
||||
|
||||
<th>Total QTY</th>
|
||||
<th>Total KG</th>
|
||||
<th>Total Amount</th>
|
||||
|
||||
<th>Status</th>
|
||||
<th>Date</th>
|
||||
<th>Action</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<tbody>
|
||||
@forelse($shipments as $ship)
|
||||
<tr>
|
||||
<td>{{ $ship->id }}</td>
|
||||
|
||||
<td>
|
||||
<a href="#" class="text-primary fw-bold"
|
||||
onclick="openShipmentDetails({{ $ship->id }})">
|
||||
{{ $ship->shipment_id }}
|
||||
</a>
|
||||
</td>
|
||||
|
||||
<td>{{ $ship->origin }}</td>
|
||||
<td>{{ $ship->destination }}</td>
|
||||
|
||||
<td>{{ $ship->total_qty }}</td>
|
||||
<td>{{ $ship->total_kg }}</td>
|
||||
<td>₹{{ number_format($ship->total_amount, 2) }}</td>
|
||||
|
||||
<td>
|
||||
<span class="badge bg-info text-dark">{{ ucfirst($ship->status) }}</span>
|
||||
</td>
|
||||
|
||||
<td>{{ $ship->shipment_date }}</td>
|
||||
|
||||
<td>
|
||||
<form action="{{ route('admin.shipments.updateStatus') }}" method="POST" class="d-inline">
|
||||
@csrf
|
||||
<input type="hidden" name="shipment_id" value="{{ $ship->id }}">
|
||||
|
||||
<select name="status" class="form-select form-select-sm"
|
||||
onchange="this.form.submit()">
|
||||
<option value="pending" @selected($ship->status=='pending')>Pending</option>
|
||||
<option value="in_transit" @selected($ship->status=='in_transit')>In Transit</option>
|
||||
<option value="dispatched" @selected($ship->status=='dispatched')>Dispatched</option>
|
||||
<option value="delivered" @selected($ship->status=='delivered')>Delivered</option>
|
||||
</select>
|
||||
</form>
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
@empty
|
||||
<tr>
|
||||
<td colspan="10" class="text-muted">No shipments found</td>
|
||||
</tr>
|
||||
@endforelse
|
||||
</tbody>
|
||||
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
<!-- ============================= -->
|
||||
<!-- SHIPMENT DETAILS MODAL -->
|
||||
<!-- ============================= -->
|
||||
<div class="modal fade" id="shipmentDetailsModal" tabindex="-1">
|
||||
<div class="modal-dialog modal-xl modal-dialog-scrollable">
|
||||
<div class="modal-content">
|
||||
|
||||
<div class="modal-header bg-light">
|
||||
<h5 class="modal-title fw-bold">Shipment Details</h5>
|
||||
<button class="btn-close" data-bs-dismiss="modal"></button>
|
||||
</div>
|
||||
|
||||
<div class="modal-body" id="shipmentDetailsContent">
|
||||
<p class="text-center text-muted">Loading...</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<!-- ========================= -->
|
||||
<!-- MODAL LOAD SCRIPT (AJAX) -->
|
||||
<!-- ========================= -->
|
||||
<script>
|
||||
function openShipmentDetails(id) {
|
||||
let modal = new bootstrap.Modal(document.getElementById('shipmentDetailsModal'));
|
||||
document.getElementById('shipmentDetailsContent').innerHTML =
|
||||
"<p class='text-center text-muted'>Loading...</p>";
|
||||
|
||||
fetch(`/admin/shipments/${id}`)
|
||||
.then(res => res.json())
|
||||
.then(data => {
|
||||
|
||||
let html = `
|
||||
<h5 class="text-primary mb-3">Shipment: ${data.shipment.shipment_id}</h5>
|
||||
|
||||
<div class="mb-3">
|
||||
<strong>Origin:</strong> ${data.shipment.origin}
|
||||
<strong>Destination:</strong> ${data.shipment.destination}
|
||||
<strong>Status:</strong> ${data.shipment.status}
|
||||
</div>
|
||||
|
||||
<h6 class="fw-bold mt-4">Orders Inside Shipment</h6>
|
||||
|
||||
<table class="table table-bordered text-center">
|
||||
<thead class="table-light">
|
||||
<tr>
|
||||
<th>Order ID</th>
|
||||
<th>Mark No</th>
|
||||
<th>Origin</th>
|
||||
<th>Destination</th>
|
||||
|
||||
<th>CTN</th>
|
||||
<th>QTY</th>
|
||||
<th>TTL QTY</th>
|
||||
|
||||
<th>TTL Amount</th>
|
||||
|
||||
<th>CBM</th>
|
||||
<th>TTL CBM</th>
|
||||
|
||||
<th>KG</th>
|
||||
<th>TTL KG</th>
|
||||
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
`;
|
||||
|
||||
data.orders.forEach(order => {
|
||||
html += `
|
||||
<tr>
|
||||
<td class="fw-bold text-primary">${order.order_id}</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>₹${order.ttl_amount}</td>
|
||||
|
||||
<td>${order.cbm ?? '-'}</td>
|
||||
<td>${order.ttl_cbm ?? '-'}</td>
|
||||
|
||||
<td>${order.kg}</td>
|
||||
<td>${order.ttl_kg}</td>
|
||||
|
||||
</tr>
|
||||
`;
|
||||
});
|
||||
|
||||
html += `
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<div class="mt-3">
|
||||
<strong>Total CTN:</strong> ${data.shipment.total_ctn} <br>
|
||||
<strong>Total QTY:</strong> ${data.shipment.total_qty} <br>
|
||||
<strong>Total TTL QTY:</strong> ${data.shipment.total_ttl_qty} <br>
|
||||
|
||||
<strong>Total CBM:</strong> ${data.shipment.total_cbm} <br>
|
||||
<strong>Total TTL CBM:</strong> ${data.shipment.total_ttl_cbm} <br>
|
||||
|
||||
<strong>Total KG:</strong> ${data.shipment.total_kg} <br>
|
||||
<strong>Total TTL KG:</strong> ${data.shipment.total_ttl_kg} <br>
|
||||
|
||||
<strong>Total Amount:</strong> ₹${data.shipment.total_amount}
|
||||
</div>
|
||||
`;
|
||||
|
||||
document.getElementById('shipmentDetailsContent').innerHTML = html;
|
||||
});
|
||||
|
||||
modal.show();
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@endsection
|
||||
|
||||
Reference in New Issue
Block a user