TKK_E32210736/user data.php

148 lines
4.3 KiB
PHP

<?php
include 'database.php';
$pdo = Database::connect();
$sql = 'SELECT * FROM table_nodemcu_rfidrc522_mysql ORDER BY name ASC';
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="utf-8">
<link href="css/bootstrap.min.css" rel="stylesheet">
<script src="js/bootstrap.min.js"></script>
<style>
body {
font-family: Arial, sans-serif;
display: flex;
flex-direction: column;
align-items: center;
margin: 0;
padding: 20px;
}
.container {
width: 90%;
max-width: 1200px;
}
ul.topnav {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #4CAF50;
width: 100%;
}
ul.topnav li {float: left;}
ul.topnav li a {
display: block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
ul.topnav li a:hover:not(.active) {background-color: #3e8e41;}
ul.topnav li a.active {background-color: #333;}
ul.topnav li.right {float: right;}
@media screen and (max-width: 600px) {
ul.topnav li.right,
ul.topnav li {float: none;}
}
.table-responsive {
overflow-x: auto;
}
.search-container {
text-align: right;
margin-bottom: 10px;
}
#searchInput {
padding: 5px;
margin-top: 10px;
}
</style>
<title>Data Pasien</title>
</head>
<body>
<div class="container">
<ul class="topnav">
<li><a href="rekapdata.php">Rekap Data</a></li>
<li><a class="active" href="user data.php">Data Pasien</a></li>
<li><a href="homepage.php">Registrasi</a></li>
<li><a href="read tag.php">Baca Tag ID</a></li>
<li><a href="grafik.php">Grafik</a></li>
</ul>
<br>
<h3>Tabel Data Pasien</h3>
<div class="search-container">
<input type="text" id="searchInput" onkeyup="searchTable()" placeholder="Cari nama...">
</div>
<div class="table-responsive">
<table id="dataTable" class="table table-striped table-bordered">
<thead>
<tr style="background-color: #10a0c5; color: white;">
<th>Nama</th>
<th>ID</th>
<th>Jenis Kelamin</th>
<th>Umur</th>
<th>No Handphone</th>
<th>Aksi</th>
</tr>
</thead>
<tbody>
<?php
foreach ($pdo->query($sql) as $row) {
echo '<tr>';
echo '<td>'. $row['name'] . '</td>';
echo '<td>'. $row['id'] . '</td>';
echo '<td>'. $row['gender'] . '</td>';
echo '<td>'. $row['umur'] . '</td>';
echo '<td>'. $row['mobile'] . '</td>';
echo '<td>';
echo '<a class="btn btn-success btn-sm" href="user data edit page.php?id='.$row['id'].'">Edit</a>';
echo ' ';
echo '<a class="btn btn-danger btn-sm" href="user data delete page.php?id='.$row['id'].'">Hapus</a>';
echo ' ';
echo '<a class="btn btn-warning btn-sm" href="grafik.php?id='.$row['id'].'">Cek Kesehatan</a>';
echo '</td>';
echo '</tr>';
}
?>
</tbody>
</table>
</div>
</div>
<script>
function searchTable() {
var input, filter, table, tr, td, i, txtValue;
input = document.getElementById("searchInput");
filter = input.value.toUpperCase();
table = document.getElementById("dataTable");
tr = table.getElementsByTagName("tr");
for (i = 0; i < tr.length; i++) {
td = tr[i].getElementsByTagName("td")[0];
if (td) {
txtValue = td.textContent || td.innerText;
if (txtValue.toUpperCase().indexOf(filter) > -1) {
tr[i].style.display = "";
} else {
tr[i].style.display = "none";
}
}
}
}
</script>
</body>
</html>