256 lines
9.7 KiB
PHP
256 lines
9.7 KiB
PHP
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Daftar Pesanan</title>
|
|
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" rel="stylesheet">
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"
|
|
integrity="..." crossorigin="anonymous" referrerpolicy="no-referrer" />
|
|
<style>
|
|
body {
|
|
font-family: 'Poppins', sans-serif;
|
|
background-color: #ffffff; /* Warna latar belakang lembut */
|
|
padding-top: 50px;
|
|
}
|
|
|
|
.card {
|
|
border: none;
|
|
box-shadow: 0 4px 8px rgba(0,0,0,0.1); /* Efek bayangan */
|
|
border-radius: 10px; /* Sudut membulat */
|
|
}
|
|
|
|
.card-header {
|
|
background-color: #e9ecef; /* Warna header lembut */
|
|
color: #343a40;
|
|
border-top-left-radius: 10px;
|
|
border-top-right-radius: 10px;
|
|
}
|
|
|
|
.card-title {
|
|
color: #343a40;
|
|
}
|
|
|
|
.badge {
|
|
border-radius: 5px;
|
|
padding: 0.3rem 0.6rem;
|
|
}
|
|
|
|
.table-responsive {
|
|
max-height: 500px;
|
|
overflow-y: auto;
|
|
}
|
|
|
|
/* Warna-warna lembut */
|
|
.bg-primary-soft { background-color: #cfe2ff; color: #007bff; }
|
|
.bg-success-soft { background-color: #d4edda; color: #28a745; }
|
|
.bg-warning-soft { background-color: #fff3cd; color: #ffc107; }
|
|
.bg-danger-soft { background-color: #f8d7da; color: #dc3545; }
|
|
.bg-info-soft { background-color: #d1ecf1; color: #17a2b8; }
|
|
|
|
.bg-light-soft {
|
|
background-color: #f9f9f9; /* Soft light gray */
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<nav class="navbar navbar-expand-lg navbar-light bg-light fixed-top">
|
|
<div class="container">
|
|
<a class="navbar-brand" href="#">Dashboard Pesanan</a>
|
|
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
|
|
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
|
<span class="navbar-toggler-icon"></span>
|
|
</button>
|
|
<div class="collapse navbar-collapse" id="navbarNav">
|
|
<ul class="navbar-nav ml-auto">
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="{{ route('home') }}">Home</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="{{ route('orders.index') }}">Order</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="{{ route('salary.index') }}">Salary</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="{{ route('report.index') }}">Report</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<form action="{{ route('logout') }}" method="POST" class="d-flex mt-1">
|
|
@csrf
|
|
<button type="submit" class="btn btn-sm btn-danger">Logout</button>
|
|
</form>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<div class="container mt-3">
|
|
@if(session('success'))
|
|
<div class="alert alert-success">
|
|
{{ session('success') }}
|
|
</div>
|
|
@endif
|
|
|
|
<div class="card border-0 mt-5 shadow">
|
|
<div class="card-body">
|
|
<div class="row">
|
|
|
|
<div class="col-md-4 mb-4 mb-md-0">
|
|
<div class="card border-1 bg-light-soft">
|
|
<div class="card-body text-center">
|
|
<h5 class="card-title"><i class="fas fa-list-ol text-muted mr-2"></i> Total Pesanan</h5>
|
|
<h1 class="fw-bold text-primary">{{ $totalOrders }}</h1>
|
|
<p class="text-muted mb-0">Pesanan yang telah dibuat</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-4 mb-4 mb-md-0">
|
|
<div class="card border-1 bg-light-soft">
|
|
<div class="card-body text-center">
|
|
<h5 class="card-title"><i class="fas fa-tasks text-muted mr-2"></i> Pesanan Diproses</h5>
|
|
<h1 class="fw-bold text-warning">{{ $ordersProcessing }}</h1>
|
|
<p class="text-muted mb-0">Sedang dalam pengiriman</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-4 mb-4 mb-md-0">
|
|
<div class="card border-1 bg-light-soft">
|
|
<div class="card-body text-center">
|
|
<h5 class="card-title"><i class="fas fa-check-circle text-muted mr-2"></i> Pesanan Selesai</h5>
|
|
<h1 class="fw-bold text-success">{{ $ordersCompleted }}</h1>
|
|
<p class="text-muted mb-0">Pesanan berhasil dikirim</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card shadow p-2 mt-5">
|
|
<h4 class="card-header bg-primary-soft text-center p-2">
|
|
<i class="fas fa-plus-circle text-primary mr-2"></i> Tambah Pesanan
|
|
</h4>
|
|
<div class="card-body">
|
|
<form action="{{ route('orders.store') }}" method="POST">
|
|
@csrf
|
|
<div class="form-group">
|
|
<label for="recipient_name"><i class="fas fa-user mr-2"></i> Nama Penerima:</label>
|
|
<input type="text" class="form-control" id="recipient_name" name="recipient_name" required>
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="address"><i class="fas fa-map-marker-alt mr-2"></i> Alamat:</label>
|
|
<input type="text" class="form-control" id="address" name="address" required>
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="description"><i class="fas fa-info-circle mr-2"></i> Deskripsi Pesanan:</label>
|
|
<input type="text" class="form-control" id="description" name="description" required>
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="kurir_id"><i class="fas fa-motorcycle mr-2"></i> Pilih Kurir:</label>
|
|
<select class="form-control" id="kurir_id" name="kurir_id" required>
|
|
@foreach($kurirs as $kurir)
|
|
<option value="{{ $kurir->id }}">{{ $kurir->name }}</option>
|
|
@endforeach
|
|
</select>
|
|
</div>
|
|
<button type="submit" class="btn btn-primary mt-3">
|
|
<i class="fas fa-save mr-2"></i> Simpan Order
|
|
</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card mt-5 mb-4">
|
|
<h4 class="card-header bg-info-soft">
|
|
<i class="fas fa-table mr-2"></i> Daftar Pesanan
|
|
</h4>
|
|
<form method="GET" class="mt-4 ml-4" action="{{ route('orders.index') }}">
|
|
<p>Pilih tanggal dan klik filter</p>
|
|
<label for="filter_date"><i class="fas fa-calendar-alt mr-2"></i></label>
|
|
<input type="date" id="filter_date" name="filter_date" value="{{ request('filter_date', now()->toDateString()) }}">
|
|
<button type="submit" class="btn btn-primary btn-sm mb-1">Filter</button>
|
|
</form>
|
|
<div class="card-body">
|
|
<div class="table-responsive">
|
|
<table class="table table-bordered table-hover" id="ordersTable">
|
|
<thead>
|
|
<tr>
|
|
<th>No</th>
|
|
<th>Nama Penerima</th>
|
|
<th>Alamat</th>
|
|
<th>Deskripsi</th>
|
|
<th>Status</th>
|
|
<th>Kurir</th>
|
|
<th>Waktu Order</th>
|
|
<th>Selesai</th>
|
|
<!-- <th>Bukti Pengiriman</th> -->
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
@foreach($orders as $order)
|
|
<tr>
|
|
<td>{{ $loop->iteration }}</td>
|
|
<td>{{ $order->recipient_name }}</td>
|
|
<td>{{ $order->address }}</td>
|
|
<td>{{ $order->description }}</td>
|
|
<td>
|
|
<span class="badge
|
|
@if($order->status == 'Delivered') badge-success
|
|
@elseif($order->status == 'Assigned') badge-warning
|
|
@else badge-secondary
|
|
@endif">
|
|
{{ ucfirst($order->status) }}
|
|
</span>
|
|
</td>
|
|
<td>{{ $order->kurir->name ?? 'Belum ditugaskan' }}</td>
|
|
<td>{{ $order->created_at->format('H:i:s') }} WIB</td>
|
|
<td>{{ $order->updated_at->format('H:i:s') }} WIB</td>
|
|
<!-- <td>
|
|
@if($order->image)
|
|
<a href="{{ asset('storage/' . $order->image) }}" target="_blank">
|
|
<img src="{{ asset('storage/' . $order->image) }}" width="100px" height="auto">
|
|
</a>
|
|
@else
|
|
<span class="text-muted">Belum ada</span>
|
|
@endif
|
|
</td> -->
|
|
</tr>
|
|
@endforeach
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
document.addEventListener("DOMContentLoaded", function() {
|
|
document.querySelectorAll(".track-location").forEach(button => {
|
|
button.addEventListener("click", function() {
|
|
const kurirId = this.getAttribute("data-kurir-id");
|
|
|
|
fetch(`/get-latest-location/${kurirId}`)
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
if (data.latitude && data.longitude) {
|
|
const url = `http://maps.google.com/maps?q=${data.latitude},${data.longitude}`;
|
|
window.open(url, "_blank");
|
|
} else {
|
|
alert("Lokasi belum tersedia.");
|
|
}
|
|
})
|
|
.catch(error => {
|
|
console.error("Error:", error);
|
|
});
|
|
});
|
|
});
|
|
});
|
|
</script>
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
|
|
</body>
|
|
</html> |