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) public function userdata(Request $request)
{ {
// Ambil data dropdown
$jenisMakananList = JenisMakanan::all(); $jenisMakananList = JenisMakanan::all();
$kategoriList = Kategori::all(); $kategoriList = Kategori::all();
$makanans = Makanan::query(); // Query awal
$makananQuery = Makanan::query();
// Filter berdasarkan jenis makanan
if ($request->has('jenis_id') && $request->jenis_id != '') { 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 != '') { 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')); return view('user.userdata', compact('makanans', 'jenisMakananList', 'kategoriList'));
} }
public function userresult() public function userresult()
{ {
$rekomendasi = Rekomendasi::with('makanan') $rekomendasi = Rekomendasi::with('makanan')

View File

@ -4,6 +4,7 @@
<!-- Data Makanan Start --> <!-- Data Makanan Start -->
<div class="container-xxl py-5 bg-light"> <div class="container-xxl py-5 bg-light">
<div class="container"> <div class="container">
<!-- Judul dan Deskripsi --> <!-- Judul dan Deskripsi -->
<div class="text-center mb-5"> <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> <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. Informasi kandungan gizi makanan yang tersedia dalam sistem untuk membantu Anda memilih menu yang tepat bagi penderita penyakit jantung.
</p> </p>
</div> </div>
<!-- Catatan Penting --> <!-- Catatan Penting -->
<div class="alert alert-info mt-4 rounded-4 shadow-sm" role="alert"> <div class="alert alert-info mt-4 rounded-4 shadow-sm" role="alert">
<i class="fas fa-info-circle me-2"></i> <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%. <strong>Catatan:</strong> Komposisi gizi pangan dihitung per 100 gram, dengan Berat Dapat Dimakan (BDD) 100%.
</div> </div>
<!-- Filter Jenis & Kategori -->
<!-- Filter Section --> <form method="GET" action="{{ route('userdata') }}" class="row g-3 align-items-end mb-4">
<div class="row mb-4"> <div class="col-md-5">
<div class="col-md-6"> <label for="jenis_id" class="form-label fw-semibold">Jenis Makanan</label>
<form method="GET" action="{{ route('userdata') }}"> <div class="input-group">
<div class="input-group"> <span class="input-group-text bg-primary text-white"><i class="fas fa-utensils"></i></span>
<label class="input-group-text bg-primary text-white" for="jenis_id">Jenis Makanan</label> <select class="form-select" id="jenis_id" name="jenis_id">
<select class="form-select text-dark bg-white" id="jenis_id" name="jenis_id"> <option value="">Semua</option>
<option value="">Semua</option> @foreach ($jenisMakananList as $jenis)
@foreach ($jenisMakananList as $jenis) <option value="{{ $jenis->id }}" {{ request('jenis_id') == $jenis->id ? 'selected' : '' }}>
<option value="{{ $jenis->id }}" {{ request('jenis_id') == $jenis->id ? 'selected' : '' }}> {{ ucfirst($jenis->name) }}
{{ ucfirst($jenis->name) }} </option>
</option> @endforeach
@endforeach </select>
</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>
</div> </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 --> <!-- Tabel Data -->
<div class="table-responsive shadow-sm rounded-4 overflow-hidden"> <div class="table-responsive shadow-sm rounded-4 overflow-hidden">
<table class="table table-hover table-bordered align-middle text-center bg-white"> <table class="table table-hover table-bordered align-middle text-center bg-white">
<thead class="table-primary text-dark"> <thead class="table-primary text-dark">
<tr> <tr>
<th scope="col">#</th> <th scope="col">#</th>
<th scope="col">🍽️ Nama Makanan</th> <th scope="col">🍽️ Nama Makanan</th>
<th scope="col">🥑 Lemak (g)</th> <th scope="col">🥑 Lemak (g)</th>
<th scope="col">🧂 Natrium (mg)</th> <th scope="col">🧂 Natrium (mg)</th>
<th scope="col">🔥 Energi (kkal)</th> <th scope="col">🔥 Energi (kkal)</th>
<th scope="col">🍞 Karbohidrat (g)</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> <!-- Pagination -->
</thead> <div class="d-flex justify-content-between mt-3">
<tbody> <div>
@foreach ($makanans as $index => $makanan) <p>Menampilkan {{ $makanans->count() }} dari {{ $makanans->total() }} makanan</p>
<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>
</div> </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 --> <!-- Data Makanan End -->
@endsection @endsection