TIF_Nganjuk_E41212313/resources/views/kurir/order.blade.php

203 lines
8.3 KiB
PHP

<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SIMAS KURIR</title>
<!-- Google Fonts: Poppins -->
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&display=swap" rel="stylesheet">
<!-- Bootstrap CSS -->
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" rel="stylesheet">
<!-- Font Awesome -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" crossorigin="anonymous" />
<style>
/* Menggunakan font Poppins */
body {
font-family: 'Poppins', sans-serif;
padding-top: 50px; /* Memberikan ruang untuk navbar fixed */
}
/* Navbar Fixed */
.navbar {
position: fixed;
top: 0;
width: 100%;
z-index: 1030;
}
/* Table */
.table-responsive {
max-height: 400px;
overflow-y: auto;
}
/* Card */
.bg-light-soft {
background-color: #f9f9f9; /* Soft light gray */
}
</style>
</head>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
<body>
<nav class="navbar navbar-expand-lg navbar-light bg-light fixed-top">
<div class="container">
<a class="navbar-brand" href="#">Kurir Dashboard</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('kurir.dashboard') }}">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="{{ route('kurir.order') }}">Order</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">
<h4 class="mt-4">Daftar Pesanan - {{ \Carbon\Carbon::now()->translatedFormat('l, d F Y') }}</h4>
@if($orders->where('status', 'Assigned')->isEmpty())
<div class="alert alert-warning text-center">Tidak ada pesanan yang ditugaskan.</div>
@else
<div class="row">
@foreach($orders as $order)
@if($order->status != 'Delivered')
<div class="col-md-4">
<div class="card">
<div class="card-body">
<h4 class="card-header bg
@if($order->status == 'Delivered')
bg-success
@elseif($order->status == 'Assigned')
bg-warning
@else
bg-secondary
@endif">{{ $order->status }}
</h4>
<h5 class="card-title mt-3">{{ $order->recipient_name }}</h5>
<p class="card-text">
<strong>Alamat:</strong> {{ $order->address }}<br>
<strong>Deskripsi Pesanan:</strong> {{ $order->description }}<br>
<strong>Tanggal:</strong> {{ $order->created_at->format('d-m-Y, H:i:s') }}<br>
@if ($order->status == 'Assigned')
<!-- Tombol Selesaikan Pesanan -->
<form action="{{ route('kurir.updateStatus', ['id' => $order->id]) }}" method="POST" class="d-inline">
@csrf
@method('PUT')
<button type="submit" id="btn-selesaikan-{{ $order->id }}" class="btn btn-sm btn-success">
Selesaikan Pesanan
</button>
</form>
@endif
</p>
</div>
</div>
</div>
@endif
@endforeach
</div>
@endif
</div>
<div class="container mt-4">
<div class="card mt-5 mb-4">
<h4 class="card-header">
Pesanan Selesai
</h4>
<form method="GET" class="mt-4 ml-4" action="{{ route('kurir.order') }}">
<label for="filter_date">Filter Tanggal:</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"> <thead>
<tr>
<th>No</th>
<th>Nama Penerima</th>
<th>Alamat</th>
<th>Deskripsi</th>
<th>Status</th>
<th>Tanggal Selesai</th>
</tr>
</thead>
<tbody>
@foreach($orders as $index => $order)
@if($order->status == 'Delivered')
<tr>
<td>{{ $index + 1 }}</td>
<td>{{ $order->recipient_name }}</td>
<td>{{ $order->address }}</td>
<td>{{ $order->description}}</td>
<td><span class="badge badge-success">{{ $order->status }}</span></td>
<td>{{ $order->updated_at->format('d-m-Y, H:i:s') }}</td>
</tr>
@endif
@endforeach
</tbody>
</table>
</div>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
<script>
function uploadLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(
function(position) {
const latitude = position.coords.latitude.toString();
const longitude = position.coords.longitude.toString();
axios.post('/location/store', {
latitude: latitude,
longitude: longitude,
_token: '{{ csrf_token() }}'
})
.then(function(response) {
console.log('Lokasi terkirim');
})
.catch(function(error) {
console.error('Gagal mengirim lokasi', error);
});
},
function(error) {
console.error('Gagal mengambil lokasi', error);
}
);
} else {
console.error('Browser tidak mendukung Geolocation.');
}
}
// Saat halaman selesai dimuat
window.onload = function () {
uploadLocation();
setInterval(uploadLocation, 10000); // Kirim ulang setiap 10 detik
};
// Paksa halaman reload setiap 60 detik
setInterval(function () {
window.location.reload();
}, 30000);
</script>
</body>
</html>