pilter data

This commit is contained in:
Alfiansyahp2 2025-05-14 01:11:49 +07:00
parent fb8c926033
commit 49f900cfa9
2 changed files with 175 additions and 64 deletions

View File

@ -30,27 +30,45 @@ public function userfeature(){
public function userdata(Request $request)
{
// Ambil data dropdown
$jenisMakananList = JenisMakanan::all();
$kategoriList = Kategori::all();
$makanans = Makanan::query();
// Query awal
$makananQuery = Makanan::query();
// Filter berdasarkan jenis makanan
if ($request->has('jenis_id') && $request->jenis_id != '') {
$makanans->where('jenis_id', $request->jenis_id);
$makananQuery->where('jenis_id', $request->jenis_id);
}
// Filter berdasarkan kategori
if ($request->has('kategori_id') && $request->kategori_id != '') {
$makanans->where('kategori_id', $request->kategori_id);
$makananQuery->where('kategori_id', $request->kategori_id);
}
$makanans = $makanans->get();
// Filter berdasarkan pencarian nama makanan
if ($request->has('search') && $request->search != '') {
$makananQuery->where('nama', 'like', '%' . $request->search . '%');
}
// Menentukan jumlah data per halaman
$perPage = $request->per_page === 'all'
? $makananQuery->count() // tampilkan semua jika 'all'
: ($request->per_page ?? 25); // default 25
// Ambil data dengan paginasi dan simpan parameter pencarian/filter
$makanans = $makananQuery->paginate($perPage)->appends($request->except('page'));
// Kirim ke view
return view('user.userdata', compact('makanans', 'jenisMakananList', 'kategoriList'));
}
public function userresult()
{
$rekomendasi = Rekomendasi::with('makanan')

View File

@ -4,6 +4,7 @@
<!-- Data Makanan Start -->
<div class="container-xxl py-5 bg-light">
<div class="container">
<!-- Judul dan Deskripsi -->
<div class="text-center mb-5">
<p class="d-inline-block border rounded-pill bg-primary text-light py-1 px-4">Data Aplikasi</p>
@ -12,77 +13,169 @@
Informasi kandungan gizi makanan yang tersedia dalam sistem untuk membantu Anda memilih menu yang tepat bagi penderita penyakit jantung.
</p>
</div>
<!-- Catatan Penting -->
<div class="alert alert-info mt-4 rounded-4 shadow-sm" role="alert">
<i class="fas fa-info-circle me-2"></i>
<strong>Catatan:</strong> Komposisi gizi pangan dihitung per 100 gram, dengan Berat Dapat Dimakan (BDD) 100%.
</div>
<!-- Filter Section -->
<div class="row mb-4">
<div class="col-md-6">
<form method="GET" action="{{ route('userdata') }}">
<div class="input-group">
<label class="input-group-text bg-primary text-white" for="jenis_id">Jenis Makanan</label>
<select class="form-select text-dark bg-white" id="jenis_id" name="jenis_id">
<option value="">Semua</option>
@foreach ($jenisMakananList as $jenis)
<option value="{{ $jenis->id }}" {{ request('jenis_id') == $jenis->id ? 'selected' : '' }}>
{{ ucfirst($jenis->name) }}
</option>
@endforeach
</select>
</div>
</div>
<div class="col-md-6">
<div class="input-group">
<label class="input-group-text bg-primary text-white" for="kategori_id">Kategori</label>
<select class="form-select text-dark bg-white" id="kategori_id" name="kategori_id">
<option value="">Semua</option>
@foreach ($kategoriList as $kategori)
<option value="{{ $kategori->id }}" {{ request('kategori_id') == $kategori->id ? 'selected' : '' }}>
{{ ucfirst($kategori->kategori) }}
</option>
@endforeach
</select>
<button class="btn btn-outline-primary" type="submit">Terapkan</button>
</div>
</form>
</div>
<!-- Filter Jenis & Kategori -->
<form method="GET" action="{{ route('userdata') }}" class="row g-3 align-items-end mb-4">
<div class="col-md-5">
<label for="jenis_id" class="form-label fw-semibold">Jenis Makanan</label>
<div class="input-group">
<span class="input-group-text bg-primary text-white"><i class="fas fa-utensils"></i></span>
<select class="form-select" id="jenis_id" name="jenis_id">
<option value="">Semua</option>
@foreach ($jenisMakananList as $jenis)
<option value="{{ $jenis->id }}" {{ request('jenis_id') == $jenis->id ? 'selected' : '' }}>
{{ ucfirst($jenis->name) }}
</option>
@endforeach
</select>
</div>
</div>
<div class="col-md-5">
<label for="kategori_id" class="form-label fw-semibold">Kategori</label>
<div class="input-group">
<span class="input-group-text bg-primary text-white"><i class="fas fa-tags"></i></span>
<select class="form-select" id="kategori_id" name="kategori_id">
<option value="">Semua</option>
@foreach ($kategoriList as $kategori)
<option value="{{ $kategori->id }}" {{ request('kategori_id') == $kategori->id ? 'selected' : '' }}>
{{ ucfirst($kategori->kategori) }}
</option>
@endforeach
</select>
</div>
</div>
<div class="col-md-2 d-grid">
<button class="btn btn-primary" type="submit">
<i class="fas fa-filter me-1"></i> Terapkan
</button>
</div>
</form>
<!-- Filter Per Page + Search -->
<form method="GET" action="{{ route('userdata') }}" class="row g-3 align-items-end mb-4">
<!-- Kirim parameter filter yang aktif -->
<input type="hidden" name="jenis_id" value="{{ request('jenis_id') }}">
<input type="hidden" name="kategori_id" value="{{ request('kategori_id') }}">
<!-- Pencarian (Kiri) -->
<div class="col-md-4">
<label for="search" class="form-label fw-semibold">Pencarian</label>
<div class="input-group">
<input type="text" name="search" id="search" class="form-control" placeholder="Cari nama makanan..." value="{{ request('search') }}">
<button type="submit" class="btn btn-primary">
<i class="fas fa-search me-1"></i> Cari
</button>
</div>
</div>
<!-- Spacer kosong -->
<div class="col-md-4"></div>
<!-- Jumlah Data per Halaman (Kanan) -->
<div class="col-md-3 ms-auto text-end">
<label for="per_page" class="form-label fw-semibold">Jumlah Data per Halaman</label>
<div class="input-group">
<span class="input-group-text bg-primary text-white"><i class="fas fa-list-ol"></i></span>
<select class="form-select" name="per_page" id="per_page" onchange="this.form.submit()">
@php
$perPageOptions = [25, 50, 100, 'all'];
$currentPerPage = request('per_page', 25);
@endphp
@foreach($perPageOptions as $option)
<option value="{{ $option }}" {{ $currentPerPage == $option ? 'selected' : '' }}>
{{ $option == 'all' ? 'Semua' : $option }}
</option>
@endforeach
</select>
</div>
</div>
</form>
<!-- Tabel Data -->
<div class="table-responsive shadow-sm rounded-4 overflow-hidden">
<table class="table table-hover table-bordered align-middle text-center bg-white">
<thead class="table-primary text-dark">
<tr>
<th scope="col">#</th>
<th scope="col">🍽️ Nama Makanan</th>
<th scope="col">🥑 Lemak (g)</th>
<th scope="col">🧂 Natrium (mg)</th>
<th scope="col">🔥 Energi (kkal)</th>
<th scope="col">🍞 Karbohidrat (g)</th>
<table class="table table-hover table-bordered align-middle text-center bg-white">
<thead class="table-primary text-dark">
<tr>
<th scope="col">#</th>
<th scope="col">🍽️ Nama Makanan</th>
<th scope="col">🥑 Lemak (g)</th>
<th scope="col">🧂 Natrium (mg)</th>
<th scope="col">🔥 Energi (kkal)</th>
<th scope="col">🍞 Karbohidrat (g)</th>
</tr>
</thead>
<tbody>
@foreach ($makanans as $index => $makanan)
<tr>
<td class="fw-bold text-primary">{{ ($makanans->firstItem() ?? 0) + $index }}</td>
<td class="text-start fw-semibold">{{ $makanan->nama }}</td>
<td>{{ number_format($makanan->lemak, 1) }}</td>
<td>{{ number_format($makanan->natrium) }}</td>
<td>{{ number_format($makanan->energi) }}</td>
<td>{{ number_format($makanan->karbohidrat, 1) }}</td>
</tr>
@endforeach
</tbody>
</table>
</tr>
</thead>
<tbody>
@foreach ($makanans as $index => $makanan)
<tr>
<td class="fw-bold text-primary">{{ $index + 1 }}</td>
<td class="text-start fw-semibold">{{ $makanan->nama }}</td>
<td>{{ number_format($makanan->lemak, 1) }}</td>
<td>{{ number_format($makanan->natrium) }}</td>
<td>{{ number_format($makanan->energi) }}</td>
<td>{{ number_format($makanan->karbohidrat, 1) }}</td>
</tr>
@endforeach
</tbody>
</table>
<!-- Pagination -->
<div class="d-flex justify-content-between mt-3">
<div>
<p>Menampilkan {{ $makanans->count() }} dari {{ $makanans->total() }} makanan</p>
</div>
<div>
<!-- Pagination links with Bootstrap classes -->
<nav>
<ul class="pagination justify-content-center">
{{ $makanans->links('pagination::bootstrap-4') }} <!-- Custom pagination style -->
</ul>
</nav>
</div>
</div>
<style>
/* Pastikan pagination menyesuaikan ukuran layar */
.pagination {
display: flex;
justify-content: center;
align-items: center;
list-style: none;
padding-left: 0;
}
.pagination .page-link {
font-size: 1rem; /* Ukuran font untuk pagination */
padding: 0.5rem 1rem;
text-align: center;
}
.pagination .page-item {
margin: 0 0.25rem;
}
/* Menyesuaikan pagination untuk tampilan mobile */
@media (max-width: 576px) {
.pagination .page-link {
font-size: 0.9rem; /* Ukuran font lebih kecil di layar kecil */
padding: 0.25rem 0.5rem;
}
}
</style>
</div>
</div>
<!-- Data Makanan End -->
@endsection