Savema_Aureliandaru
/
MIF_E31230690
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix pagination

This commit is contained in:
Sveemaaa 2026-05-07 20:29:06 +07:00
parent 2b9bbfa7b0
commit 6c4e46b542
7 changed files with 224 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
project/app/Providers/AppServiceProvider.php
View File

@ -1,6 +1,7 @@
<?php <?php
namespace App\Providers; namespace App\Providers;
use Illuminate\Pagination\Paginator;
use Illuminate\Support\ServiceProvider; use Illuminate\Support\ServiceProvider;
@ -19,6 +20,6 @@ public function register(): void
*/ */
public function boot(): void public function boot(): void
{ {
// Paginator::useBootstrapFive();
} }
} }

40
project/resources/views/balita/data-balita.blade.php
View File

@ -107,10 +107,16 @@ class="btn btn-sm btn-edit-custom" title="Edit">
</table> </table>
</div> </div>
<div class="d-flex justify-content-between align-items-center mt-4"> <div class="d-flex flex-column flex-md-row justify-content-between align-items-center mt-4 px-2">
<small class="text-muted">Menampilkan {{ $balita->firstItem() ?? 0 }} sampai {{ $balita->lastItem() ?? 0 }} dari {{ $balita->total() }} data</small> <div class="mb-3 mb-md-0">
<div> <p class="text-muted small mb-0">
{{ $balita->withQueryString()->links() }} Menampilkan <span class="fw-bold text-dark">{{ $balita->firstItem() ?? 0 }}</span>
sampai <span class="fw-bold text-dark">{{ $balita->lastItem() ?? 0 }}</span>
dari <span class="fw-bold text-dark">{{ $balita->total() }}</span> data
</p>
</div>
<div class="pagination-orange">
{{ $balita->links() }}
</div> </div>
</div> </div>
@ -198,6 +204,32 @@ class="btn btn-sm btn-edit-custom" title="Edit">
opacity: 0.8; opacity: 0.8;
cursor: default; cursor: default;
} }
.pagination-orange .pagination {
gap: 5px;
}
.pagination-orange .page-link {
border-radius: 8px !important;
color: #FF782D !important;
border: 1px solid #eee !important;
}
.pagination-orange .page-item.active .page-link {
background-color: #FF782D !important;
border-color: #FF782D !important;
color: white !important;
}
.pagination-orange nav .flex.items-center.justify-between .hidden.sm-flex-1 {
display: none !important;
}
/* Jika masih ada teks 'Showing' di versi mobile */
.pagination-orange nav div:first-child p {
display: none !important;
}
/* Memastikan tombol angka tetap rapi */
.pagination-orange .pagination {
margin-bottom: 0;
}
</style> </style>
<script> <script>

62
project/resources/views/edukasi/edukasi.blade.php
View File

@ -88,13 +88,18 @@ class="btn btn-sm btn-edit-custom" title="Edit">
</table> </table>
</div> </div>
<div class="d-flex justify-content-between align-items-center mt-4"> <div class="d-flex flex-column flex-md-row justify-content-between align-items-center mt-4 px-2">
<small class="text-muted">Menampilkan {{ $t_edukasi->firstItem() ?? 0 }} sampai {{ $t_edukasi->lastItem() ?? 0 }} dari {{ $t_edukasi->total() }} data</small> <div class="mb-3 mb-md-0">
<div> <p class="text-muted small mb-0">
{{ $t_edukasi->withQueryString()->links() }} Menampilkan <span class="fw-bold text-dark">{{ $t_edukasi->firstItem() ?? 0 }}</span>
sampai <span class="fw-bold text-dark">{{ $t_edukasi->lastItem() ?? 0 }}</span>
dari <span class="fw-bold text-dark">{{ $t_edukasi->total() }}</span> data
</p>
</div>
<div class="pagination-orange">
{{ $t_edukasi->links() }}
</div> </div>
</div> </div>
</div> </div>
</div> </div>
@ -112,48 +117,55 @@ class="btn btn-sm btn-edit-custom" title="Edit">
.btn-edit-custom:hover { background-color: #f59f00; color: white; } .btn-edit-custom:hover { background-color: #f59f00; color: white; }
.btn-delete-custom { background-color: #fff5f5; color: #fa5252; border: none; border-radius: 8px; } .btn-delete-custom { background-color: #fff5f5; color: #fa5252; border: none; border-radius: 8px; }
.btn-delete-custom:hover { background-color: #fa5252; color: white; } .btn-delete-custom:hover { background-color: #fa5252; color: white; }
.pagination-orange .pagination {
gap: 5px;
}
.pagination-orange .page-link {
border-radius: 8px !important;
color: #FF782D !important;
border: 1px solid #eee !important;
}
.pagination-orange .page-item.active .page-link {
background-color: #FF782D !important;
border-color: #FF782D !important;
color: white !important;
}
.pagination-orange nav .flex.items-center.justify-between .hidden.sm-flex-1 {
display: none !important;
}
/* Jika masih ada teks 'Showing' di versi mobile */
.pagination-orange nav div:first-child p {
display: none !important;
}
/* Memastikan tombol angka tetap rapi */
.pagination-orange .pagination {
margin-bottom: 0;
}
</style> </style>
<script>
<script>
let delayTimer; let delayTimer;
document.getElementById('search').addEventListener('keyup', function () { document.getElementById('search').addEventListener('keyup', function () {
clearTimeout(delayTimer); clearTimeout(delayTimer);
let query = this.value; let query = this.value;
delayTimer = setTimeout(() => { delayTimer = setTimeout(() => {
fetch(`{{ route('edukasi.index') }}?search=` + query) fetch(`{{ route('edukasi.index') }}?search=` + query)
.then(response => response.text()) .then(response => response.text())
.then(html => { .then(html => {
let parser = new DOMParser(); let parser = new DOMParser();
let doc = parser.parseFromString(html, 'text/html'); let doc = parser.parseFromString(html, 'text/html');
let newTable = doc.querySelector('#edukasi-table').innerHTML; let newTable = doc.querySelector('#edukasi-table').innerHTML;
document.getElementById('edukasi-table').innerHTML = newTable; document.getElementById('edukasi-table').innerHTML = newTable;
}); });
}, 300); }, 300);
}); });
</script> </script>
@endsection @endsection

41
project/resources/views/ibu_hamil/data-ibuhamil.blade.php
View File

@ -40,6 +40,7 @@
<thead> <thead>
<tr> <tr>
<th style="width: 5%">No</th> <th style="width: 5%">No</th>
<th>NIK</th>
<th>Nama</th> <th>Nama</th>
<th>Tanggal Lahir</th> <th>Tanggal Lahir</th>
<th>Alamat</th> <th>Alamat</th>
@ -94,10 +95,16 @@ class="btn btn-sm btn-edit-custom" title="Edit">
</table> </table>
</div> </div>
<div class="d-flex justify-content-between align-items-center mt-4"> <div class="d-flex flex-column flex-md-row justify-content-between align-items-center mt-4 px-2">
<small class="text-muted">Menampilkan {{ $ibu_hamil->firstItem() ?? 0 }} sampai {{ $ibu_hamil->lastItem() ?? 0 }} dari {{ $ibu_hamil->total() }} data</small> <div class="mb-3 mb-md-0">
<div> <p class="text-muted small mb-0">
{{ $ibu_hamil->withQueryString()->links() }} Menampilkan <span class="fw-bold text-dark">{{ $ibu_hamil->firstItem() ?? 0 }}</span>
sampai <span class="fw-bold text-dark">{{ $ibu_hamil->lastItem() ?? 0 }}</span>
dari <span class="fw-bold text-dark">{{ $ibu_hamil->total() }}</span> data
</p>
</div>
<div class="pagination-orange">
{{ $ibu_hamil->links() }}
</div> </div>
</div> </div>
@ -185,6 +192,32 @@ class="btn btn-sm btn-edit-custom" title="Edit">
opacity: 0.8; opacity: 0.8;
cursor: default; cursor: default;
} }
.pagination-orange .pagination {
gap: 5px;
}
.pagination-orange .page-link {
border-radius: 8px !important;
color: #FF782D !important;
border: 1px solid #eee !important;
}
.pagination-orange .page-item.active .page-link {
background-color: #FF782D !important;
border-color: #FF782D !important;
color: white !important;
}
.pagination-orange nav .flex.items-center.justify-between .hidden.sm-flex-1 {
display: none !important;
}
/* Jika masih ada teks 'Showing' di versi mobile */
.pagination-orange nav div:first-child p {
display: none !important;
}
/* Memastikan tombol angka tetap rapi */
.pagination-orange .pagination {
margin-bottom: 0;
}
</style> </style>
<script> <script>

40
project/resources/views/pengukuran_balita/data.blade.php
View File

@ -108,10 +108,16 @@
</table> </table>
</div> </div>
<div class="d-flex justify-content-between align-items-center mt-4"> <div class="d-flex flex-column flex-md-row justify-content-between align-items-center mt-4 px-2">
<small class="text-muted">Menampilkan {{ $p_balita->firstItem() ?? 0 }} sampai {{ $p_balita->lastItem() ?? 0 }} dari {{ $p_balita->total() }} data</small> <div class="mb-3 mb-md-0">
<div> <p class="text-muted small mb-0">
{{ $p_balita->withQueryString()->links() }} Menampilkan <span class="fw-bold text-dark">{{ $p_balita->firstItem() ?? 0 }}</span>
sampai <span class="fw-bold text-dark">{{ $p_balita->lastItem() ?? 0 }}</span>
dari <span class="fw-bold text-dark">{{ $p_balita->total() }}</span> data
</p>
</div>
<div class="pagination-orange">
{{ $p_balita->links() }}
</div> </div>
</div> </div>
@ -133,6 +139,32 @@
.btn-detail-custom:hover { background-color: #007bff; color: white; } .btn-detail-custom:hover { background-color: #007bff; color: white; }
.btn-delete-custom { background-color: #fff5f5; color: #fa5252; border: none; border-radius: 8px; } .btn-delete-custom { background-color: #fff5f5; color: #fa5252; border: none; border-radius: 8px; }
.btn-delete-custom:hover { background-color: #fa5252; color: white; } .btn-delete-custom:hover { background-color: #fa5252; color: white; }
.pagination-orange .pagination {
gap: 5px;
}
.pagination-orange .page-link {
border-radius: 8px !important;
color: #FF782D !important;
border: 1px solid #eee !important;
}
.pagination-orange .page-item.active .page-link {
background-color: #FF782D !important;
border-color: #FF782D !important;
color: white !important;
}
.pagination-orange nav .flex.items-center.justify-between .hidden.sm-flex-1 {
display: none !important;
}
/* Jika masih ada teks 'Showing' di versi mobile */
.pagination-orange nav div:first-child p {
display: none !important;
}
/* Memastikan tombol angka tetap rapi */
.pagination-orange .pagination {
margin-bottom: 0;
}
</style> </style>
<script> <script>

41
project/resources/views/pengukuran_ibuhamil/data.blade.php
View File

@ -111,8 +111,21 @@
</table> </table>
</div> </div>
<div class="d-flex justify-content-center mt-4"> {{-- <div class="d-flex justify-content-center mt-4">
{{ $p_ibuhamil->withQueryString()->links() }} {{ $p_ibuhamil->withQueryString()->links() }}
</div> --}}
<div class="d-flex flex-column flex-md-row justify-content-between align-items-center mt-4 px-2">
<div class="mb-3 mb-md-0">
<p class="text-muted small mb-0">
Menampilkan <span class="fw-bold text-dark">{{ $p_ibuhamil->firstItem() ?? 0 }}</span>
sampai <span class="fw-bold text-dark">{{ $p_ibuhamil->lastItem() ?? 0 }}</span>
dari <span class="fw-bold text-dark">{{ $p_ibuhamil->total() }}</span> data
</p>
</div>
<div class="pagination-orange">
{{ $p_ibuhamil->links() }}
</div>
</div> </div>
</div> </div>
</div> </div>
@ -132,6 +145,32 @@
.btn-detail-custom:hover { background-color: #007bff; color: white; } .btn-detail-custom:hover { background-color: #007bff; color: white; }
.btn-delete-custom { background-color: #fff5f5; color: #fa5252; border: none; border-radius: 8px; } .btn-delete-custom { background-color: #fff5f5; color: #fa5252; border: none; border-radius: 8px; }
.btn-delete-custom:hover { background-color: #fa5252; color: white; } .btn-delete-custom:hover { background-color: #fa5252; color: white; }
.pagination-orange .pagination {
gap: 5px;
}
.pagination-orange .page-link {
border-radius: 8px !important;
color: #FF782D !important;
border: 1px solid #eee !important;
}
.pagination-orange .page-item.active .page-link {
background-color: #FF782D !important;
border-color: #FF782D !important;
color: white !important;
}
.pagination-orange nav .flex.items-center.justify-between .hidden.sm-flex-1 {
display: none !important;
}
/* Jika masih ada teks 'Showing' di versi mobile */
.pagination-orange nav div:first-child p {
display: none !important;
}
/* Memastikan tombol angka tetap rapi */
.pagination-orange .pagination {
margin-bottom: 0;
}
</style> </style>
<script> <script>

42
project/resources/views/users/users.blade.php
View File

@ -96,14 +96,18 @@ class="btn btn-sm btn-edit-custom" title="Edit">
</tbody> </tbody>
</table> </table>
</div> </div>
<div class="d-flex flex-column flex-md-row justify-content-between align-items-center mt-4 px-2">
<div class="d-flex justify-content-between align-items-center mt-4"> <div class="mb-3 mb-md-0">
<small class="text-muted">Menampilkan {{ $user->firstItem() ?? 0 }} sampai {{ $user->lastItem() ?? 0 }} dari {{ $user->total() }} data</small> <p class="text-muted small mb-0">
<div> Menampilkan <span class="fw-bold text-dark">{{ $user->firstItem() ?? 0 }}</span>
{{ $user->withQueryString()->links() }} sampai <span class="fw-bold text-dark">{{ $user->lastItem() ?? 0 }}</span>
dari <span class="fw-bold text-dark">{{ $user->total() }}</span> data
</p>
</div>
<div class="pagination-orange">
{{ $user->links() }}
</div> </div>
</div> </div>
</div> </div>
</div> </div>
@ -163,6 +167,32 @@ class="btn btn-sm btn-edit-custom" title="Edit">
border-color: #FF782D; border-color: #FF782D;
box-shadow: 0 0 0 0.2rem rgba(255, 120, 45, 0.25); box-shadow: 0 0 0 0.2rem rgba(255, 120, 45, 0.25);
} }
.pagination-orange .pagination {
gap: 5px;
}
.pagination-orange .page-link {
border-radius: 8px !important;
color: #FF782D !important;
border: 1px solid #eee !important;
}
.pagination-orange .page-item.active .page-link {
background-color: #FF782D !important;
border-color: #FF782D !important;
color: white !important;
}
.pagination-orange nav .flex.items-center.justify-between .hidden.sm-flex-1 {
display: none !important;
}
/* Jika masih ada teks 'Showing' di versi mobile */
.pagination-orange nav div:first-child p {
display: none !important;
}
/* Memastikan tombol angka tetap rapi */
.pagination-orange .pagination {
margin-bottom: 0;
}
</style> </style>
<script> <script>