Skip to content

Commit

Permalink
fix table overflow on mobile view
Browse files Browse the repository at this point in the history
  • Loading branch information
@ikhsan3adi
ikhsan3adi committed Jul 8, 2024
1 parent 347de8f commit 7b8f857
Show file tree
Hide file tree
Showing 13 changed files with 764 additions and 735 deletions.
116 changes: 59 additions & 57 deletions app/Views/books/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -47,65 +47,67 @@
</div>
</div>
</div>
<table class="table table-hover table-striped">
<thead class="table-light">
<tr>
<th scope="col">#</th>
<th scope="col">Sampul</th>
<th scope="col">Judul</th>
<th scope="col">Kategori</th>
<th scope="col">Rak</th>
<th scope="col">Jumlah</th>
<th scope="col" class="text-center">Aksi</th>
</tr>
</thead>
<tbody class="table-group-divider">
<?php $i = 1 + ($itemPerPage * ($currentPage - 1)) ?>
<?php if (empty($books)) : ?>
<div class="overflow-x-scroll">
<table class="table table-hover table-striped">
<thead class="table-light">
<tr>
<td class="text-center" colspan="7"><b>Tidak ada data</b></td>
<th scope="col">#</th>
<th scope="col">Sampul</th>
<th scope="col">Judul</th>
<th scope="col">Kategori</th>
<th scope="col">Rak</th>
<th scope="col">Jumlah</th>
<th scope="col" class="text-center">Aksi</th>
</tr>
<?php endif; ?>
<?php foreach ($books as $book) : ?>
<tr>
<th scope="row"><?= $i++; ?></th>
<td>
<a href="<?= base_url("admin/books/{$book['slug']}"); ?>">
<div class="d-flex justify-content-center" style="max-width: 150px; height: 120px;">
<?php
$coverImageFilePath = BOOK_COVER_URI . $book['book_cover'];
?>
<img class="mx-auto mh-100" src="<?= base_url((!empty($book['book_cover']) && file_exists($coverImageFilePath)) ? $coverImageFilePath : BOOK_COVER_URI . DEFAULT_BOOK_COVER); ?>" alt="<?= $book['title']; ?>">
</div>
</a>
</td>
<td>
<a href="<?= base_url("admin/books/{$book['slug']}"); ?>">
<p class="text-primary-emphasis text-decoration-underline"><b><?= "{$book['title']} ({$book['year']})"; ?></b></p>
<p class="text-body"><?= "Author: {$book['author']}"; ?></p>
</a>
</td>
<td><?= $book['category']; ?></td>
<td><?= $book['rack']; ?></td>
<td><?= $book['quantity']; ?></td>
<td>
<a href="<?= base_url("admin/books/{$book['slug']}/edit"); ?>" class="d-block btn btn-primary w-100 mb-2">
<i class="ti ti-edit"></i>
Edit
</a>
<form action="<?= base_url("admin/books/{$book['slug']}"); ?>" method="post">
<?= csrf_field(); ?>
<input type="hidden" name="_method" value="DELETE">
<button type="submit" class="btn btn-danger w-100" onclick="return confirm('Are you sure?');">
<i class="ti ti-trash"></i>
Delete
</button>
</form>
</td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
</thead>
<tbody class="table-group-divider">
<?php $i = 1 + ($itemPerPage * ($currentPage - 1)) ?>
<?php if (empty($books)) : ?>
<tr>
<td class="text-center" colspan="7"><b>Tidak ada data</b></td>
</tr>
<?php endif; ?>
<?php foreach ($books as $book) : ?>
<tr>
<th scope="row"><?= $i++; ?></th>
<td>
<a href="<?= base_url("admin/books/{$book['slug']}"); ?>">
<div class="d-flex justify-content-center" style="max-width: 150px; height: 120px;">
<?php
$coverImageFilePath = BOOK_COVER_URI . $book['book_cover'];
?>
<img class="mx-auto mh-100" src="<?= base_url((!empty($book['book_cover']) && file_exists($coverImageFilePath)) ? $coverImageFilePath : BOOK_COVER_URI . DEFAULT_BOOK_COVER); ?>" alt="<?= $book['title']; ?>">
</div>
</a>
</td>
<td>
<a href="<?= base_url("admin/books/{$book['slug']}"); ?>">
<p class="text-primary-emphasis text-decoration-underline"><b><?= "{$book['title']} ({$book['year']})"; ?></b></p>
<p class="text-body"><?= "Author: {$book['author']}"; ?></p>
</a>
</td>
<td><?= $book['category']; ?></td>
<td><?= $book['rack']; ?></td>
<td><?= $book['quantity']; ?></td>
<td>
<a href="<?= base_url("admin/books/{$book['slug']}/edit"); ?>" class="d-block btn btn-primary w-100 mb-2">
<i class="ti ti-edit"></i>
Edit
</a>
<form action="<?= base_url("admin/books/{$book['slug']}"); ?>" method="post">
<?= csrf_field(); ?>
<input type="hidden" name="_method" value="DELETE">
<button type="submit" class="btn btn-danger w-100" onclick="return confirm('Are you sure?');">
<i class="ti ti-trash"></i>
Delete
</button>
</form>
</td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
</div>
<?= $pager->links('books', 'my_pager'); ?>
</div>
</div>
Expand Down
78 changes: 40 additions & 38 deletions app/Views/categories/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,46 +25,48 @@
</a>
</div>
</div>
<table class="table table-hover table-striped">
<thead class="table-light">
<tr>
<th scope="col">#</th>
<th scope="col">Kategori</th>
<th scope="col" class="text-center">Jumlah buku</th>
<th scope="col" class="text-center">Aksi</th>
</tr>
</thead>
<tbody class="table-group-divider">
<?php $i = 1 + ($itemPerPage * ($currentPage - 1)) ?>
<?php foreach ($categories as $key => $category) : ?>
<div class="overflow-x-scroll">
<table class="table table-hover table-striped">
<thead class="table-light">
<tr>
<th scope="row"><?= $i++; ?></th>
<td>
<a href="<?= base_url("admin/categories/{$category['id']}"); ?>" class="text-primary-emphasis text-decoration-underline">
<b><?= $category['name']; ?></b>
</a>
</td>
<td class="text-center"><?= $bookCountInCategories[$key]; ?></td>
<td>
<div class="d-flex justify-content-center gap-2">
<a href="<?= base_url("admin/categories/{$category['id']}/edit"); ?>" class="btn btn-primary mb-2">
<i class="ti ti-edit"></i>
Edit
</a>
<form action="<?= base_url("admin/categories/{$category['id']}"); ?>" method="post">
<?= csrf_field(); ?>
<input type="hidden" name="_method" value="DELETE">
<button type="submit" class="btn btn-danger" onclick="return confirm('Are you sure?');">
<i class="ti ti-trash"></i>
Delete
</button>
</form>
</div>
</td>
<th scope="col">#</th>
<th scope="col">Kategori</th>
<th scope="col" class="text-center">Jumlah buku</th>
<th scope="col" class="text-center">Aksi</th>
</tr>
<?php endforeach; ?>
</tbody>
</table>
</thead>
<tbody class="table-group-divider">
<?php $i = 1 + ($itemPerPage * ($currentPage - 1)) ?>
<?php foreach ($categories as $key => $category) : ?>
<tr>
<th scope="row"><?= $i++; ?></th>
<td>
<a href="<?= base_url("admin/categories/{$category['id']}"); ?>" class="text-primary-emphasis text-decoration-underline">
<b><?= $category['name']; ?></b>
</a>
</td>
<td class="text-center"><?= $bookCountInCategories[$key]; ?></td>
<td>
<div class="d-flex justify-content-center gap-2">
<a href="<?= base_url("admin/categories/{$category['id']}/edit"); ?>" class="btn btn-primary mb-2">
<i class="ti ti-edit"></i>
Edit
</a>
<form action="<?= base_url("admin/categories/{$category['id']}"); ?>" method="post">
<?= csrf_field(); ?>
<input type="hidden" name="_method" value="DELETE">
<button type="submit" class="btn btn-danger" onclick="return confirm('Are you sure?');">
<i class="ti ti-trash"></i>
Delete
</button>
</form>
</div>
</td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
</div>
<?= $pager->links('categories', 'my_pager'); ?>
</div>
</div>
Expand Down
132 changes: 67 additions & 65 deletions app/Views/fines/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -59,74 +59,76 @@
</div>
</div>
</div>
<table class="table table-hover table-striped">
<thead class="table-light">
<tr>
<th scope="col">#</th>
<th scope="col">Nama peminjam</th>
<th scope="col">Judul buku</th>
<th scope="col">Tgl pengembalian</th>
<th scope="col">Denda dibayar</th>
<th scope="col">Jumlah denda</th>
<th scope="col" class="text-center">Aksi</th>
</tr>
</thead>
<tbody class="table-group-divider">
<?php
$i = 1 + ($itemPerPage * ($currentPage - 1));

$now = Time::now(locale: 'id');
?>
<?php if (empty($fines)) : ?>
<div class="overflow-x-scroll">
<table class="table table-hover table-striped">
<thead class="table-light">
<tr>
<td class="text-center" colspan="7"><b>Tidak ada data</b></td>
<th scope="col">#</th>
<th scope="col">Nama peminjam</th>
<th scope="col">Judul buku</th>
<th scope="col">Tgl pengembalian</th>
<th scope="col">Denda dibayar</th>
<th scope="col">Jumlah denda</th>
<th scope="col" class="text-center">Aksi</th>
</tr>
<?php endif; ?>
<?php
foreach ($fines as $key => $fine) :
$loanReturnDate = Time::parse($fine['return_date'], locale: 'id');
$loanDueDate = Time::parse($fine['due_date'], locale: 'id');
?>
<tr>
<th scope="row"><?= $i++; ?></th>
<td>
<a href="<?= base_url("admin/members/{$fine['member_uid']}"); ?>" class="text-decoration-underline">
<p>
<b><?= "{$fine['first_name']} {$fine['last_name']}"; ?></b>
</p>
</a>
</td>
<td>
<p><b><?= "{$fine['title']} ({$fine['year']})"; ?></b></p>
<p class="text-body"><?= "Jumlah: {$fine['quantity']}"; ?></p>
</td>
<td class="text-danger-emphasis">
<p><b><?= $loanReturnDate->toLocalizedString('dd/MM/y'); ?></b></p>
<p class="text-body"><?= "Terlambat: " . abs($loanReturnDate->difference($loanDueDate)->getDays()) . " Hari"; ?></p>
</td>
<td>
<h5>Rp<?= $fine['amount_paid'] ?? 0; ?></h5>
<?php if ($paidOffFilter || $fine['amount_paid'] >= $fine['fine_amount']) : ?>
<span class="badge bg-success rounded-3 fw-semibold">Lunas</span>
<?php endif; ?>
</td>
<td>
<h5>Rp<?= $fine['fine_amount']; ?></h5>
</td>
<td>
<?php if (!$paidOffFilter && $fine['amount_paid'] < $fine['fine_amount']) : ?>
<a href="<?= base_url("admin/fines/pay/{$fine['uid']}"); ?>" class="d-block btn btn-warning w-100 mb-2">
Bayar
</thead>
<tbody class="table-group-divider">
<?php
$i = 1 + ($itemPerPage * ($currentPage - 1));

$now = Time::now(locale: 'id');
?>
<?php if (empty($fines)) : ?>
<tr>
<td class="text-center" colspan="7"><b>Tidak ada data</b></td>
</tr>
<?php endif; ?>
<?php
foreach ($fines as $key => $fine) :
$loanReturnDate = Time::parse($fine['return_date'], locale: 'id');
$loanDueDate = Time::parse($fine['due_date'], locale: 'id');
?>
<tr>
<th scope="row"><?= $i++; ?></th>
<td>
<a href="<?= base_url("admin/members/{$fine['member_uid']}"); ?>" class="text-decoration-underline">
<p>
<b><?= "{$fine['first_name']} {$fine['last_name']}"; ?></b>
</p>
</a>
<?php endif; ?>
<a href="<?= base_url("admin/returns/{$fine['uid']}"); ?>" class="d-block btn btn-primary w-100 mb-2">
Detail
</a>
</td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
</td>
<td>
<p><b><?= "{$fine['title']} ({$fine['year']})"; ?></b></p>
<p class="text-body"><?= "Jumlah: {$fine['quantity']}"; ?></p>
</td>
<td class="text-danger-emphasis">
<p><b><?= $loanReturnDate->toLocalizedString('dd/MM/y'); ?></b></p>
<p class="text-body"><?= "Terlambat: " . abs($loanReturnDate->difference($loanDueDate)->getDays()) . " Hari"; ?></p>
</td>
<td>
<h5>Rp<?= $fine['amount_paid'] ?? 0; ?></h5>
<?php if ($paidOffFilter || $fine['amount_paid'] >= $fine['fine_amount']) : ?>
<span class="badge bg-success rounded-3 fw-semibold">Lunas</span>
<?php endif; ?>
</td>
<td>
<h5>Rp<?= $fine['fine_amount']; ?></h5>
</td>
<td>
<?php if (!$paidOffFilter && $fine['amount_paid'] < $fine['fine_amount']) : ?>
<a href="<?= base_url("admin/fines/pay/{$fine['uid']}"); ?>" class="d-block btn btn-warning w-100 mb-2">
Bayar
</a>
<?php endif; ?>
<a href="<?= base_url("admin/returns/{$fine['uid']}"); ?>" class="d-block btn btn-primary w-100 mb-2">
Detail
</a>
</td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
</div>
<?= $pager->links('fines', 'my_pager'); ?>
</div>
</div>
Expand Down
Loading

0 comments on commit 7b8f857

Please sign in to comment.