Tutorial Membuat Aplikasi Catatan Perjalanan UKK RPL 2022 PAKET 1 (Peduli Diri)| Dengan PHP dan MySQLi (Part V)
Membuat Tampilan Catatan Perjalanan
Simpan syntax dibawah ini dengan nama catatan.php di dalam folder catatan, seperti gambar dibawah ini !!
session_start();
if($_SESSION['status']!="login"){
header("location:../index.php?pesan=belum_login");
}
include'../koneksi.php';
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Widianto</title>
<link rel="stylesheet" href="../css/mdi/css/materialdesignicons.min.css">
<link rel="stylesheet" href="../css/feather/feather.css">
<link rel="stylesheet" href="../css/base/vendor.bundle.base.css">
<link rel="stylesheet" href="../css/flag-icon-css/css/flag-icon.min.css"/>
<link rel="stylesheet" href="../css/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" href="../css/jquery-bar-rating/fontawesome-stars-o.css">
<link rel="stylesheet" href="../css/jquery-bar-rating/fontawesome-stars.css">
<link rel="stylesheet" href="../css/style.css">
</head>
<body>
<div class="container-scroller">
<nav class="navbar col-lg-12 col-12 p-0 fixed-top d-flex flex-row">
<div class="text-center navbar-brand-wrapper d-flex align-items-center justify-content-center">
<a class="navbar-brand brand-logo"><font color="white"> Peduli Diri</font></a>
</div>
<div class="navbar-menu-wrapper d-flex align-items-center justify-content-end">
<button class="navbar-toggler navbar-toggler align-self-center" type="button" data-toggle="minimize">
<span class="icon-menu"></span>
</button>
<ul class="navbar-nav mr-lg-2">
<li class="nav-item nav-search d-none d-lg-block">
<div class="input-group">
<div class="input-group-prepend">
</span>
</div>
</div>
</li>
</ul>
<ul class="navbar-nav navbar-nav-right">
<li class="nav-item dropdown d-lg-flex d-none">
</li>
<li class="nav-item dropdown d-flex mr-4 ">
<a class="nav-link count-indicator dropdown-toggle d-flex align-items-center justify-content-center" id="notificationDropdown" href="#" data-toggle="dropdown">
<i class="icon-cog"></i>
</a>
<div class="dropdown-menu dropdown-menu-right navbar-dropdown preview-list" aria-labelledby="notificationDropdown">
<p class="mb-0 font-weight-normal float-left dropdown-header">Keluar</p>
<a class="dropdown-item preview-item"href="../keluar.php">
<i class="icon-inbox"></i> Keluar
</a>
</div>
</li>
</ul>
<button class="navbar-toggler navbar-toggler-right d-lg-none align-self-center" type="button" data-toggle="offcanvas">
<span class="icon-menu"></span>
</button>
</div>
</nav>
<div class="container-fluid page-body-wrapper">
<nav class="sidebar sidebar-offcanvas" id="sidebar">
<div class="user-profile">
<div class="user-image">
<img src="../poto/logo.png">
</div>
<div class="user-name">
SMK
</div>
<div class="user-designation">
Jam'iyyatul Aulad
</div>
</div>
<ul class="nav">
<li class="nav-item">
<a class="nav-link" href="../home.php">
<i class="icon-box menu-icon"></i>
<span class="menu-title">Home</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="catatan.php">
<i class="icon-location menu-icon"></i>
<span class="menu-title">Catatan Perjalanan</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="../tambah_perjalanan/tambah.php">
<i class="icon-circle-plus menu-icon"></i>
<span class="menu-title">Isi Data</span>
</a>
</ul>
</nav> <div class="main-panel">
<div class="content-wrapper">
<div class="row">
<div class="col-sm-12 mb-4 mb-xl-0">
<h4 class="font-weight-bold text-dark">Selamat Datang,<?php echo $_SESSION['nama'];?>
<br>Aplikasi Catatan Perjalanan</h4>
<p class="font-weight-normal mb-2 text-muted"><?php
// cetak waktu sekarang
// kombinasi tanggal
date_default_timezone_set('Asia/Jakarta');
echo 'Pelabuhanratu. ' . date ('d-m-Y, H:i:s');
?></p>
</div>
</div>
<div class="row mt-3">
<div class="row flex-grow">
<h4 class="card-title">
<form class="form-inline" action="catatan.php"method="get">
<label class="sr-only" for="inlineFormInputName2">Name</label>
<label class="sr-only" for="inlineFormInputGroupUsername2"></label>
<div class="input-group mb-2 mr-sm-2">
<div class="input-group-prepend">
<div class="input-group-text">Urutkan Berdasarkan</div>
</div>
<input type="date"name="cari" class="form-control" >
</div>
<input type="submit" class="btn btn-primary mb-2" type="submit"value="Urutkan"> </button>
</form>
<?php
if(isset($_GET['cari'])){
$cari = $_GET['cari'];
echo "<b>Hasil Tanggal Perjalanan : ".$cari."</b>";
}
?>
</h4>
<div class="table-responsive pt-3">
<table class="table table-bordered">
<thead>
<tr class="table-primary">
<th>No</th>
<th>Tanggal</th>
<th>Waktu</th>
<th>Lokasi</th>
<th>Suhu Tubuh</th>
<th>Aksi</th>
</tr>
</thead>
<tbody>
<?php
if(isset($_GET['cari'])){
$cari = $_GET['cari'];
$query = mysqli_query($koneksi,"SELECT * FROM perjalanan where tanggal like '%".$cari."%'");
}else{
$query = mysqli_query($koneksi,"select * from perjalanan");
}
$no = 1;
while ($tampil=mysqli_fetch_array($query)) {
?>
<tr>
<td><?php echo $no; ?></td>
<td><?php echo $tampil['tanggal']; ?></td>
<td><?php echo $tampil['waktu']; ?></td>
<td><?php echo $tampil['lokasi']; ?></td>
<td><?php echo $tampil['suhu']; ?></td>
<td> <a href="../tambah_perjalanan/ubah.php?id=<?php echo $tampil['id']; ?>" class="btn btn-info">Ubah</a>
<a href="hapus.php?id=<?php echo $tampil['id'];?>" class="btn btn-danger" onclick="return confirm('Apakah Anda Yakin Ingin Menghapus')">Hapus</a>
</td>
</tr>
<?php
$no++;
}
?>
</tr>
</tbody>
</table>
</div></div>
<div class="table-responsive pt-3">
<table style = "float:right">
<thead>
<tr>
<th align="right"> <a href="../tambah_perjalanan/tambah.php" class="btn btn-dark"> <i class="icon-circle-plus menu-icon"> Isi Catatan Perjalanan</a></i>
<a href="cetak.php" class="btn btn-secondary"> <i class="icon-printer menu-icon"> Cetak Semua</a></i></th>
</tr></thead></table></div></div></div>
<footer class="footer">
<div class="d-sm-flex justify-content-center justify-content-sm-between">
<span class="text-muted d-block text-center text-sm-left d-sm-inline-block">Aplikasi Catatan Perjalanan</span>
<span class="float-none float-sm-right d-block mt-1 mt-sm-0 text-center"> Smk Jam'iyyatul Aulad</span>
</div>
</footer>
</div>
</div>
</div>
<script src="../css/base/vendor.bundle.base.js"></script>
<script src="../css/template.js"></script>
<script src="../css/chart.js/Chart.min.js"></script>
<script src="../css/jquery-bar-rating/jquery.barrating.min.js"></script>
</body>
</html>
Comments
Post a Comment