EAS-PWEB--MEMBUAT APLIKASI SEKOLAH



1. Definisikan fitur dari aplikasi yang akan dibangun
2. Rancang aplikasi menggunakan Figma
3. Implementasikan aplikasi. Boleh dikerjakan secara kelompok, didokumentasikan, dan dibuat video demo/ presentasinya di youtube. Semua hasil pekerjaan disatukan di blognya masing-masing.

Jawaban :

1. - Admin 
    a. Admin dapat membuat, melihat, mengupdate dan menghapus data siswa.
    b. Admin dapat membuat, melihat, mengupdate dan menghapus data orang tua
    c. Admin dapat membuat, melihat, mengupdate dan menghapus data Guru
    d. Admin dapat menampilkan dashboard jumlah siswa dan orang tua yang aktif.
    e. Admin dapat membuat, melihat, mengupdate dan menghapus slip pembayaran
    f.  Admin dapat login sebagai adminitrator
    - Guru
    a. Guru dapat membuat, melihat, mengupdate dan menghapus materi pembelajaran
    b. Guru dapat membuat, melihat, mengupdate dan menghapus Pekerjaan Rumah
    c. Guru dapat membuat, melihat, mengupdate dan menghapus Kehadiran siswa
    d. Guru dapat membuat, melihat, mengupdate dan menghapus ujian
    e. Guru dapat login sebagai Guru
    - Siswa
    a. Siswa dapat melihat jadwal pembelajaran
    b. Siswa dapat melihat nilai mata pelajaran
    c. Siswa dapat mengupload Pekerjaan Rumah
    d. Siswa dapat melihat materi
    e. Siswa dapat mengisi daftar kehadiran
    f. Siswa dapat mengerjakan ujian
    g. Siswa dapat login sebagai siswa
2. Berikut rancangan fitur-fitur yang akan dibuat

      a. Fitur Login (untuk orang tua)
        

   b. Manajemen Pembayaran (untuk orang tua)
                
            
  c. Melihat Invoide
            
3. Menyusul akan dikerjakan berkelompok
    Anggota:
    Junaedi Akbar - 05111940000041
    Muhammad Akmal Joedhiawan - 05111940000125
    Muhammad Nur Abdurrauf - 05111940000140
    Syamil Difaul Haq Sukur - 051119400001 
    
    Kami telah membuat 4 fitur:
    - Login Admin 
    - Dashboard Admin 
    - Mengolah data siswa 
    - Mengolah data orang tua
    
    Berikut adalah codingannya
<?php
session_start();
if (!isset($_SESSION['username']) || !isset($_SESSION['role'])) {
header("Location: ../index.php");
} else if ($_SESSION['role'] != 'admin') {
die("Not authorized");
}
?>
view raw check-login.php hosted with ❤ by GitHub
<?php
require_once "../check-login.php";
require_once "../../config.php";
$id = $_GET["id"];
$sql = "SELECT * FROM parents WHERE id=$id";
$query = mysqli_query($conn, $sql);
if (mysqli_num_rows($query) < 1) {
header(
"Location: list-orang-tua.php?status=gagal&msg=Data%20tidak%20ditemukan"
);
}
$ortu = mysqli_fetch_assoc($query);
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Goes To School</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<link rel="stylesheet" href="../../styles/style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta2/css/all.min.css" integrity="sha512-YWzhKL2whUzgiheMoBFwW8CKV4qpHQAEuvilg9FAn5VJUDwKZZxkJNuGM4XkWuk94WCrrwslk8yWNGmY1EduTA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
</head>
<body class="bg-light text-dark d-flex flex-column">
<header class="text-center mt-4 title p-2 top-left">
<h1>Edit parent</h1>
</header>
<div class="container-fluid content flex-grow-1 d-flex flex-column justify-content-center mt-5">
<section class="mb-4 d-flex flex-column align-items-center justify-content-center">
<article class="col-md-6 text-left">
<form action="proses-edit-orang-tua.php" onsubmit="return submitForm()" method="POST">
<div class="form-group my-2">
<?php
$sqlChild = "SELECT * FROM students where id=$ortu[parent_of]";
$queryChild = mysqli_query($conn, $sqlChild);
if (mysqli_num_rows($queryChild) < 1) {
header(
"Location: list-orang-tua.php?status=gagal&msg=Data%20anak%20tidak%20ditemukan"
);
} else {
$child = mysqli_fetch_array($queryChild);
$childValue = $child["nis"] . " - " . $child["name"];
}
?>
<label for="parent_of_suggestion" class="form-label">Parent Of</label>
<input class="form-control" list="parent_of_options" id="parent_of_suggestion" placeholder="Type to search by NIS or Name" value="<?php echo $childValue; ?>" required>
<datalist id="parent_of_options">
<?php
$sqlSiswa = "SELECT * FROM students";
$querySiswa = mysqli_query($conn, $sqlSiswa);
while ($siswa = mysqli_fetch_array($querySiswa)) {
echo "<option data-value='$siswa[id]'>$siswa[nis] - $siswa[name]</option>";
}
?>
</datalist>
</div>
<input type="hidden" name="parent_of" id="parent_of" value="<?php echo $ortu["parent_of"]; ?>">
<div class="form-group my-2">
<label for="name">Name</label>
<input type="text" name="name" class="form-control rounded" placeholder="Name" value="<?php echo $ortu["name"]; ?>" required />
</div>
<div class="form-group my-2">
<?php $jk = $ortu["gender"]; ?>
<label for="gender">Gender</label>
<div class="form-check">
<input class="form-check-input" type="radio" name="gender" id="gender1" value="laki-laki" <?php echo $jk ==
"laki-laki"
? "checked"
: ""; ?> required>
<label class="form-check-label" for="gender">
Laki-laki
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" name="gender" id="gender2" value="perempuan" <?php echo $jk ==
"perempuan"
? "checked"
: ""; ?> required>
<label class="form-check-label" for="gender">
Perempuan
</label>
</div>
</div>
<div class="form-group my-2">
<label for="date_of_birth">Date of Birth</label>
<input class="form-control" type="date" name="date_of_birth" placeholder="Date of Birth" value="<?php echo $ortu["date_of_birth"]; ?>" required></input>
</div>
<div class="form-group my-2">
<label for="address">Address</label>
<textarea name="address" class="form-control" placeholder="Address" style="width: 100%; height: 150px" required><?php echo $ortu["address"]; ?></textarea>
</div>
<div class="form-group my-2">
<label for="phone_number">Phone Number</label>
<input class="form-control" type="tel" name="phone_number" placeholder="Phone Number" value="<?php echo $ortu["phone_number"]; ?>" required></input>
</div>
<div class="form-group my-3 form-buttons">
<input class="btn btn-success" type="submit" value="Save" name="save" />
<a class="btn btn-danger" href="proses-hapus-orang-tua.php?id=<?php echo $ortu["id"]; ?>" onclick="return confirm('Yakin ingin menghapus?');">Delete</a>
</div>
<input type="hidden" name="id" value="<?php echo $ortu["id"]; ?>" required />
</form>
</article>
</section>
<a class="btn btn-primary btn-bottom-left" href="./list-orang-tua.php"><i class="fas fa-arrow-left"></i>Back</a>
<footer class="mt-5 mb-5 d-flex justify-content-center align-items-center">
<h1>Goes To School</h1>
</footer>
</div>
</body>
<script>
function submitForm() {
const suggestion = document.getElementById('parent_of_options').children;
const picked = document.getElementById('parent_of_suggestion').value;
for (const opt of suggestion) {
if (opt.value === picked) {
document.getElementById('parent_of').value = opt.getAttribute('data-value');
return true;
}
}
alert('Data anak tidak valid');
return false;
}
</script>
</html>
view raw edit-orang-tua.php hosted with ❤ by GitHub
<?php
require_once "../check-login.php";
require_once "../../config.php";
$id = $_GET["id"];
$sql = "SELECT * FROM students WHERE id=$id";
$query = mysqli_query($conn, $sql);
if (mysqli_num_rows($query) < 1) {
header("Location: list-siswa.php?status=gagal&msg=Data%20tidak%20ditemukan");
}
$siswa = mysqli_fetch_assoc($query);
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Goes To School</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<link rel="stylesheet" href="../../styles/style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta2/css/all.min.css" integrity="sha512-YWzhKL2whUzgiheMoBFwW8CKV4qpHQAEuvilg9FAn5VJUDwKZZxkJNuGM4XkWuk94WCrrwslk8yWNGmY1EduTA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
</head>
<body class="bg-light text-dark d-flex flex-column">
<header class="text-center text-primary title p-2 top-left">
<h1>Edit student</h1>
</header>
<div class="container-fluid content flex-grow-1 d-flex flex-column justify-content-center mt-5">
<section class="mb-4 d-flex flex-column align-items-center justify-content-center">
<article class="col-md-6 text-left">
<form class="d-flex justify-content-between" action="proses-edit-siswa.php" onsubmit="return validateForm();" method="POST" enctype="multipart/form-data">
<div class="col-3">
<div class="form-group my-2">
<label for="photo" class="form-label">Photo</label>
<div>
<img id="preview_photo" width="100px" src="<?php echo $siswa["photo"]; ?>" alt="preview" />
<input class="form-control mt-2" type="file" name="photo" id="photo" onchange="PreviewImage();">
</div>
</div>
</div>
<div class="col-8">
<div class="form-group my-2">
<label for="nis">NIS</label>
<input type="text" name="nis" id="nis" class="form-control rounded" placeholder="NIS" value="<?php echo $siswa["nis"]; ?>" required />
</div>
<div class="form-group my-2">
<label for="name">Name</label>
<input type="text" name="name" class="form-control rounded" placeholder="Name" value="<?php echo $siswa["name"]; ?>" required />
</div>
<div class="form-group my-2">
<?php $jk = $siswa["gender"]; ?>
<label for="gender">Gender</label>
<div class="form-check">
<input class="form-check-input" type="radio" name="gender" id="gender1" value="laki-laki" <?php echo $jk ==
"laki-laki"
? "checked"
: ""; ?> required>
<label class="form-check-label" for="gender">
Laki-laki
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" name="gender" id="gender2" value="perempuan" <?php echo $jk ==
"perempuan"
? "checked"
: ""; ?> required>
<label class="form-check-label" for="gender">
Perempuan
</label>
</div>
</div>
<div class="form-group my-2">
<label for="date_of_birth">Date of Birth</label>
<input class="form-control" type="date" name="date_of_birth" placeholder="Date of Birth" value="<?php echo $siswa["date_of_birth"]; ?>" required></input>
</div>
<div class="form-group my-2">
<label for="address">Address</label>
<textarea name="address" class="form-control" placeholder="Address" style="width: 100%; height: 150px" required><?php echo $siswa["address"]; ?></textarea>
</div>
<input type="hidden" name="id" value="<?php echo $siswa["id"]; ?>" required />
<div class="form-group my-3 form-buttons">
<input class="btn btn-success" type="submit" value="Save" name="save" />
<a class="btn btn-danger" href="proses-hapus-siswa.php?id=<?php echo $siswa["id"]; ?>" onclick="return confirm('Yakin ingin menghapus?');">Delete</a>
</div>
</div>
</form>
</article>
</section>
<a class="btn btn-primary btn-bottom-left" href="./list-siswa.php"><i class="fas fa-arrow-left"></i>Back</a>
<footer class="mt-5 mb-5 d-flex justify-content-center align-items-center">
<h1>Goes To School</h1>
</footer>
</div>
</body>
<script>
function PreviewImage() {
const oFReader = new FileReader();
oFReader.readAsDataURL(document.getElementById("photo").files[0]);
oFReader.onload = function(oFREvent) {
document.getElementById("preview_photo").src = oFREvent.target.result;
};
};
function validateForm() {
const nis = document.getElementById("nis").value;
if (isNaN(nis)) {
alert("NIS harus angka");
return false;
}
if (nis.length != 5) {
alert("NIS harus 5 character");
return false;
}
return true;
}
</script>
</html>
view raw edit-siswa.php hosted with ❤ by GitHub
<?php
require_once "check-login.php"; ?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Goes To School</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<link rel="stylesheet" href="../styles/style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta2/css/all.min.css" integrity="sha512-YWzhKL2whUzgiheMoBFwW8CKV4qpHQAEuvilg9FAn5VJUDwKZZxkJNuGM4XkWuk94WCrrwslk8yWNGmY1EduTA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
</head>
<body class="bg-purple text-dark d-flex flex-column">
<div class="container-fluid content flex-grow-1 d-flex flex-column align-items-center justify-content-center">
<header class="text-center mb-3 text-dark title p-2">
<h1>Goes to School 👨‍🎓👩‍🎓</h1>
</header>
<section class="mb-4 d-flex flex-row align-items-center justify-content-center gap-32">
<a href="./siswa/index.php" class="btn btn-primary bg-trans flex px-5 py-4">
<i class="fas fa-graduation-cap btn-icon"></i>
<p class="m-0 mt-3">Students</p>
</a>
<a href="#" class="btn btn-primary bg-trans flex px-5 py-4">
<i class="fas fa-chalkboard-teacher btn-icon"></i>
<p class="m-0 mt-3">Teacher</p>
</a>
<a href="./orang-tua/index.php" class="btn btn-primary bg-trans flex px-5 py-4">
<i class="fas fa-user-friends btn-icon"></i>
<p class="m-0 mt-3">Parent</p>
</a>
</section>
<footer class="mt-5">
</footer>
</div>
</body>
</html>
view raw index-admin.php hosted with ❤ by GitHub
<?php
require_once "../check-login.php"; ?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Goes To School</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<link rel="stylesheet" href="../../styles/style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta2/css/all.min.css" integrity="sha512-YWzhKL2whUzgiheMoBFwW8CKV4qpHQAEuvilg9FAn5VJUDwKZZxkJNuGM4XkWuk94WCrrwslk8yWNGmY1EduTA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
</head>
<body class="bg-light text-dark d-flex flex-column">
<header class="text-center mb-3 title p-2 top-left">
<h1>Parent Page🤱</h1>
</header>
<div class="container-fluid content flex-grow-1 d-flex flex-column justify-content-center">
<section class="mb-4 d-flex flex-row align-items-center justify-content-center gap-32">
<a href="./tambah-orang-tua.php" class="btn btn-primary bg-trans flex px-5 py-4 ">
<i class="fas fa-user-plus btn-icon"></i>
<p class="m-0 mt-3">Add Parent</p>
</a>
<a href="./list-orang-tua.php" class="btn btn-primary bg-trans flex px-5 py-4">
<i class="fas fa-clipboard-list btn-icon"></i>
<p class="m-0 mt-3">Parents List</p>
</a>
</section>
<div class="d-flex align-items-center justify-content-center">
</div>
<div class="d-flex justify-content-center">
<?php if (isset($_GET["status"])) {
if ($_GET["status"] == "gagal" && isset($_GET["msg"])) {
echo "<div class=\"alert w-50 alert-danger px-3 mt-3 text-center\" role=\"alert\">$_GET[msg]</div>";
} elseif ($_GET["status"] == "berhasil") {
echo "<div class=\"alert w-50 alert-success px-3 mt-3 text-center\" role=\"alert\">Succesfully added parent</div>";
}
} ?>
</div>
<a class="btn btn-primary btn-bottom-left" href="../index.php"><i class="fas fa-arrow-left"></i>Back</a>
<footer class="mt-5 mb-5 d-flex justify-content-center align-items-center">
<h1>Goes To School</h1>
</footer>
</div>
</body>
</html>
view raw index-orang-tua.php hosted with ❤ by GitHub
<?php
require_once "../check-login.php"; ?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Goes To School</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<link rel="stylesheet" href="../../styles/style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta2/css/all.min.css" integrity="sha512-YWzhKL2whUzgiheMoBFwW8CKV4qpHQAEuvilg9FAn5VJUDwKZZxkJNuGM4XkWuk94WCrrwslk8yWNGmY1EduTA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
</head>
<body class="bg-light text-dark d-flex flex-column">
<header class="text-center text-primary title p-2 top-left">
<h1>Student Page 🏃‍♂️🏃‍♀️</h1>
</header>
<div class="container-fluid content flex-grow-1 d-flex flex-column justify-content-center ">
<section class="mb-4 d-flex flex-row align-items-center justify-content-center gap-32">
<a href="./tambah-siswa.php" class="btn btn-primary bg-trans flex px-5 py-4">
<i class="fas fa-user-plus btn-icon"></i>
<p class="m-0 mt-3">Add Student</p>
</a>
<a href="./list-siswa.php" class="btn btn-primary bg-trans flex px-5 py-4">
<i class="fas fa-clipboard-list btn-icon"></i>
<p class="m-0 mt-3">Students List</p>
</a>
</section>
<div class="d-flex justify-content-center">
<?php if (isset($_GET["status"])) {
if ($_GET["status"] == "gagal" && isset($_GET["msg"])) {
echo "<div class=\"alert w-50 alert-danger px-3 mt-3 text-center\" role=\"alert\">$_GET[msg]</div>";
} elseif ($_GET["status"] == "berhasil") {
echo "<div class=\"alert w-50 alert-success px-3 mt-3 text-center\" role=\"alert\">Succesfully added student</div>";
}
} ?>
</div>
<a class="btn btn-primary btn-bottom-left" href="../index.php"><i class="fas fa-arrow-left"></i>Back</a>
<footer class="mt-5 mb-5 d-flex justify-content-center align-items-center">
<h1>Goes To School</h1>
</footer>
</div>
</body>
</html>
view raw index-siswa.php hosted with ❤ by GitHub
<?php
require_once "../check-login.php";
require_once "../../config.php";
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Goes To School</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<link rel="stylesheet" href="../../styles/style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta2/css/all.min.css" integrity="sha512-YWzhKL2whUzgiheMoBFwW8CKV4qpHQAEuvilg9FAn5VJUDwKZZxkJNuGM4XkWuk94WCrrwslk8yWNGmY1EduTA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
</head>
<body class="bg-light text-dark d-flex flex-column">
<a class="btn btn-primary top-left" href="./index.php"><i class="fas fa-arrow-left"></i>Back</a>
<div class="container-fluid content flex-grow-1 d-flex flex-column justify-content-center mt-5">
<header class="text-center mt-4">
<h1>Parent Management</h1>
</header>
<section class="mb-4 d-flex flex-column align-items-center justify-content-center">
<article class="col-md-8 text-left">
<div class="input-group">
<div class="form-outline">
<input type="search" id="search" placeholder="Search by Name" class="form-control" />
</div>
<button onclick="search(event);" class="btn btn-primary">
<i class="fas fa-search"></i>
</button>
</div>
<table class="table table-striped table-hover mt-2">
<thead>
<tr class="table-dark">
<th scope="col">No</th>
<th scope="col">Parent Of</th>
<th scope="col">Name</th>
<th scope="col">Gender</th>
<th scope="col">Date of Birth</th>
<th scope="col">Address</th>
<th scope="col">Phone Number</th>
<th scope="col">Action</th>
</tr>
</thead>
<tbody>
<?php
$sql = "SELECT * FROM parents";
if (isset($_GET["search"])) {
$search = $_GET["search"];
$sql .= " WHERE name LIKE '%$search%'";
}
$query = mysqli_query($conn, $sql);
while ($ortu = mysqli_fetch_array($query)) {
echo "<tr>";
echo "<td>" . $ortu["id"] . "</td>";
echo "<td>" . $ortu["parent_of"] . "</td>";
echo "<td>" . $ortu["name"] . "</td>";
echo "<td>" . $ortu["gender"] . "</td>";
echo "<td>" . $ortu["date_of_birth"] . "</td>";
echo "<td>" . $ortu["address"] . "</td>";
echo "<td>" . $ortu["phone_number"] . "</td>";
echo "<td>";
echo "<a class=\"btn btn-sm btn-warning\" href='edit-orang-tua.php?id=" .
$ortu["id"] .
"'><i class=\"fas fa-pencil-alt\"></i></a> ";
echo "</td>";
echo "</tr>";
}
?>
</tbody>
</table>
</article>
</section>
<div class="d-flex justify-content-center">
<?php if (isset($_GET["status"])) {
if ($_GET["status"] == "gagal" && isset($_GET["msg"])) {
echo "<div class=\"alert w-50 alert-danger px-3 text-center\" role=\"alert\">$_GET[msg]</div>";
} elseif ($_GET["status"] == "berhasil") {
if (isset($_GET["msg"])) {
echo "<div class=\"alert w-50 alert-success px-3 text-center\" role=\"alert\">$_GET[msg]</div>";
} else {
echo "<div class=\"alert w-50 alert-success px-3 text-center\" role=\"alert\">Succesfully changed parent</div>";
}
}
} ?>
</div>
<footer class="mt-5 mb-5 d-flex justify-content-center align-items-center">
<h1>Goes To School</h1>
</footer>
</div>
</body>
<script>
function search(e) {
e.preventDefault();
const search = document.getElementById('search').value;
window.location.href = "list-orang-tua.php?search=" + search;
}
</script>
</html>
view raw list-orang-tua.php hosted with ❤ by GitHub
<?php
require_once "../check-login.php"; ?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Goes To School</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<link rel="stylesheet" href="../../styles/style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta2/css/all.min.css" integrity="sha512-YWzhKL2whUzgiheMoBFwW8CKV4qpHQAEuvilg9FAn5VJUDwKZZxkJNuGM4XkWuk94WCrrwslk8yWNGmY1EduTA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
</head>
<body class="bg-light text-dark d-flex flex-column">
<header class="text-center text-primary title p-2 top-left">
<h1>Student Page 🏃‍♂️🏃‍♀️</h1>
</header>
<div class="container-fluid content flex-grow-1 d-flex flex-column justify-content-center ">
<section class="mb-4 d-flex flex-row align-items-center justify-content-center gap-32">
<a href="./tambah-siswa.php" class="btn btn-primary bg-trans flex px-5 py-4">
<i class="fas fa-user-plus btn-icon"></i>
<p class="m-0 mt-3">Add Student</p>
</a>
<a href="./list-siswa.php" class="btn btn-primary bg-trans flex px-5 py-4">
<i class="fas fa-clipboard-list btn-icon"></i>
<p class="m-0 mt-3">Students List</p>
</a>
</section>
<div class="d-flex justify-content-center">
<?php if (isset($_GET["status"])) {
if ($_GET["status"] == "gagal" && isset($_GET["msg"])) {
echo "<div class=\"alert w-50 alert-danger px-3 mt-3 text-center\" role=\"alert\">$_GET[msg]</div>";
} elseif ($_GET["status"] == "berhasil") {
echo "<div class=\"alert w-50 alert-success px-3 mt-3 text-center\" role=\"alert\">Succesfully added student</div>";
}
} ?>
</div>
<a class="btn btn-primary btn-bottom-left" href="../index.php"><i class="fas fa-arrow-left"></i>Back</a>
<footer class="mt-5 mb-5 d-flex justify-content-center align-items-center">
<h1>Goes To School</h1>
</footer>
</div>
</body>
</html>
view raw list-siswa.php hosted with ❤ by GitHub
<?php
include("../../config.php");
if (isset($_POST['save'])) {
$id = $_POST['id'];
$parent_of = $_POST['parent_of'];
$name = $_POST['name'];
$gender = $_POST['gender'];
$date_of_birth = $_POST['date_of_birth'];
$address = $_POST['address'];
$phone_number = $_POST['phone_number'];
$sql = "UPDATE parents SET name='$name', gender='$gender', date_of_birth='$date_of_birth', address='$address', phone_number='$phone_number', parent_of=$parent_of WHERE id=$id";
$query = mysqli_query($conn, $sql);
if ($query) {
header('Location: list-orang-tua.php?status=berhasil');
} else {
header('Location: list-orang-tua.php?status=gagal&msg=Gagal%20mengedit%20data');
}
} else {
die("Forbidden");
}
view raw proses-edit-orang-tua.php hosted with ❤ by GitHub
<?php
include("../../config.php");
if(isset($_POST['save'])){
$id = $_POST['id'];
$nis = $_POST['nis'];
$name = $_POST['name'];
$gender = $_POST['gender'];
$date_of_birth = $_POST['date_of_birth'];
$address = $_POST['address'];
$photo = $_FILES['photo']['name'];
$tmp = $_FILES['photo']['tmp_name'];
if(empty($photo)) {
$sql = "UPDATE students SET nis='$nis', name='$name', gender='$gender', date_of_birth='$date_of_birth', address='$address' WHERE id=$id";
$query = mysqli_query($conn, $sql);
if( $query ) {
header('Location: list-siswa.php?status=berhasil');
} else {
header('Location: list-siswa.php?status=gagal&msg=Gagal%20mengedit%20data');
}
} else {
$newPhoto = bin2hex(random_bytes(5))."_".$photo;
$path = "../../uploaded_images/".$newPhoto;
if(move_uploaded_file($tmp, $path)) {
$selectSql = "SELECT foto FROM calon_siswa WHERE id=$id";
$selectQuery = mysqli_query($conn, $selectSql);
$data = mysqli_fetch_array($selectQuery);
if(is_file($data['photo'])) {
unlink($data['photo']);
}
$sql = "UPDATE students SET nis='$nis', name='$name', gender='$gender', date_of_birth='$date_of_birth', address='$address', photo='$path' WHERE id=$id";
$query = mysqli_query($conn, $sql);
if( $query ) {
header('Location: list-siswa.php?status=berhasil');
} else {
header('Location: list-siswa.php?status=gagal&msg=Gagal%20mengedit%20data');
}
} else {
header('Location: list-siswa.php?status=gagal&msg=Gagal%20mengupload%20foto');
}
}
} else {
die("Forbidden");
}
?>
view raw proses-edit-siswa.php hosted with ❤ by GitHub
<?php
include("../../config.php");
if( isset($_GET['id']) ){
$id = $_GET['id'];
$sql = "DELETE FROM parents WHERE id=$id";
$query = mysqli_query($conn, $sql);
if( $query ){
header('Location: list-orang-tua.php?status=berhasil&msg=Berhasil%20menghapus%20orang%20tua');
} else {
header('Location: list-orang-tua.php?status=gagal&msg=Gagal%20menghapus%20orang%20tua');
}
} else {
die("Forbidden");
}
?>
view raw proses-hapus-orang-tua.php hosted with ❤ by GitHub
<?php
include("../../config.php");
if( isset($_GET['id']) ){
$id = $_GET['id'];
$selectSql = "SELECT photo FROM students WHERE id=$id";
$selectQuery = mysqli_query($conn, $selectSql);
$data = mysqli_fetch_array($selectQuery);
if(is_file($data['photo']) && strcmp($data['photo'], "../../uploaded_images/default.jpg"))
unlink($data['photo']);
$sql = "DELETE FROM students WHERE id=$id";
$query = mysqli_query($conn, $sql);
if( $query ){
header('Location: list-siswa.php?status=berhasil&msg=Berhasil%20menghapus%20siswa');
} else {
header('Location: list-siswa.php?status=gagal&msg=Gagal%20menghapus%20siswa');
}
} else {
die("Forbidden");
}
?>
view raw proses-hapus-siswa.php hosted with ❤ by GitHub
<?php
require_once("../../config.php");
if (isset($_POST['add'])) {
$parent_of = $_POST['parent_of'];
$name = $_POST['name'];
$gender = $_POST['gender'];
$date_of_birth = $_POST['date_of_birth'];
$address = $_POST['address'];
$phone_number = $_POST['phone_number'];
$sql = "INSERT INTO parents (name, gender, date_of_birth, address, phone_number, parent_of) VALUE ('$name', '$gender', '$date_of_birth', '$address', '$phone_number', $parent_of)";
$query = mysqli_query($conn, $sql);
if ($query) {
header('Location: index.php?status=berhasil');
} else {
header('Location: index.php?status=gagal&msg=Gagal%20menambahkan%20data');
}
} else {
die("Forbidden");
}
view raw proses-tambah-orang-tua.php hosted with ❤ by GitHub
<?php
require_once("../../config.php");
if(isset($_POST['add'])){
$nis = $_POST['nis'];
$name = $_POST['name'];
$gender = $_POST['gender'];
$date_of_birth = $_POST['date_of_birth'];
$address = $_POST['address'];
$photo = $_FILES['photo']['name'];
$tmp = $_FILES['photo']['tmp_name'];
$newPhoto = bin2hex(random_bytes(5))."_".$photo;
$path = "../../uploaded_images/".$newPhoto;
if(move_uploaded_file($tmp, $path)) {
$sql = "INSERT INTO students (nis, name, gender, date_of_birth, address, photo) VALUE ('$nis', '$name', '$gender', '$date_of_birth', '$address', '$path')";
$query = mysqli_query($conn, $sql);
if( $query ) {
header('Location: index.php?status=berhasil');
} else {
header('Location: index.php?status=gagal&msg=Gagal%20menambahkan%20data');
}
} else {
header('Location: index.php?status=gagal&msg=Gagal%20upload%20foto');
}
} else {
die("Forbidden");
}
view raw proses-tambah-siswa.php hosted with ❤ by GitHub
<?php
require_once "../check-login.php";
require_once "../../config.php";
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Goes To School</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<link rel="stylesheet" href="../../styles/style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta2/css/all.min.css" integrity="sha512-YWzhKL2whUzgiheMoBFwW8CKV4qpHQAEuvilg9FAn5VJUDwKZZxkJNuGM4XkWuk94WCrrwslk8yWNGmY1EduTA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
</head>
<body class="bg-light text-dark d-flex flex-column">
<header class="text-center mt-4 title p-2 top-left">
<h1>Add parent</h1>
</header>
<div class="container-fluid content flex-grow-1 d-flex flex-column justify-content-center mt-5">
<section class="mb-4 d-flex flex-column align-items-center justify-content-center">
<article class="col-md-6 text-left">
<form action="proses-tambah-orang-tua.php" onsubmit="return submitForm()" method="POST">
<div class="form-group my-2">
<label for="parent_of_suggestion" class="form-label">Parent Of</label>
<input class="form-control" list="parent_of_options" id="parent_of_suggestion" placeholder="Type to search by NIS or Name" required>
<datalist id="parent_of_options">
<?php
$sql = "SELECT * FROM students";
$query = mysqli_query($conn, $sql);
while ($siswa = mysqli_fetch_array($query)) {
echo "<option data-value='$siswa[id]'>$siswa[nis] - $siswa[name]</option>";
}
?>
</datalist>
</div>
<input type="hidden" name="parent_of" id="parent_of">
<div class="form-group my-2">
<label for="name">Name</label>
<input type="text" name="name" class="form-control rounded" placeholder="Name" required />
</div>
<div class="form-group my-2">
<label for="gender">Gender</label>
<div class="form-check">
<input class="form-check-input" type="radio" name="gender" id="gender1" value="laki-laki" required>
<label class="form-check-label" for="gender">
Laki-laki
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" name="gender" id="gender2" value="perempuan" required>
<label class="form-check-label" for="gender">
Perempuan
</label>
</div>
</div>
<div class="form-group my-2">
<label for="date_of_birth">Date of Birth</label>
<input class="form-control" type="date" name="date_of_birth" placeholder="Date of Birth" required></input>
</div>
<div class="form-group my-2">
<label for="address">Address</label>
<textarea name="address" class="form-control" placeholder="Address" style="width: 100%; height: 150px" required></textarea>
</div>
<div class="form-group my-2">
<label for="phone_number">Phone Number</label>
<input class="form-control" type="tel" name="phone_number" placeholder="Phone Number" required></input>
</div>
<div class="form-group my-3 form-buttons">
<input class="btn btn-success" type="submit" value="Add" name="add" />
</div>
</form>
</article>
</section>
<a class="btn btn-primary btn-bottom-left" href="./index.php"><i class="fas fa-arrow-left"></i>Back</a>
<footer class="mt-5 mb-5 d-flex justify-content-center align-items-center">
<h1>Goes To School</h1>
</footer>
</div>
</body>
<script>
function submitForm() {
const suggestion = document.getElementById('parent_of_options').children;
const picked = document.getElementById('parent_of_suggestion').value;
for (const opt of suggestion) {
if (opt.value === picked) {
document.getElementById('parent_of').value = opt.getAttribute('data-value');
return true;
}
}
alert('Data anak tidak valid');
return false;
}
</script>
</html>
view raw tambah-orang-tua.php hosted with ❤ by GitHub
<?php
require_once "../check-login.php"; ?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Goes To School</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<link rel="stylesheet" href="../../styles/style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta2/css/all.min.css" integrity="sha512-YWzhKL2whUzgiheMoBFwW8CKV4qpHQAEuvilg9FAn5VJUDwKZZxkJNuGM4XkWuk94WCrrwslk8yWNGmY1EduTA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
</head>
<body class="bg-light text-dark d-flex flex-column">
<header class="text-center text-primary title p-2 top-left">
<h1>Add student</h1>
</header>
<div class="container-fluid content flex-grow-1 d-flex flex-column justify-content-center mt-5">
<section class="mb-4 d-flex flex-column align-items-center justify-content-center">
<article class="col-md-6 text-left">
<form class="d-flex justify-content-between" action="proses-tambah-siswa.php" onsubmit="return validateForm();" method="POST" enctype="multipart/form-data">
<div class="col-3">
<div class="form-group my-2">
<label for="photo" class="form-label">Photo</label>
<div>
<img id="preview_photo" class="mb-2" width="100px" src="../../uploaded_images/default.jpg" alt="preview" />
<input class="form-control" type="file" name="photo" id="photo" onchange="PreviewImage();" required>
</div>
</div>
</div>
<div class="col-8">
<div class="form-group my-2">
<label for="nis">NIS</label>
<input type="text" name="nis" id="nis" class="form-control rounded" placeholder="NIS" required />
</div>
<div class="form-group my-2">
<label for="name">Name</label>
<input type="text" name="name" class="form-control rounded" placeholder="Name" required />
</div>
<div class="form-group my-2">
<label for="gender">Gender</label>
<div class="form-check">
<input class="form-check-input" type="radio" name="gender" id="gender1" value="laki-laki" required>
<label class="form-check-label" for="gender">
Laki-laki
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" name="gender" id="gender2" value="perempuan" required>
<label class="form-check-label" for="gender">
Perempuan
</label>
</div>
</div>
<div class="form-group my-2">
<label for="date_of_birth">Date of Birth</label>
<input class="form-control" type="date" name="date_of_birth" placeholder="Date of Birth" required></input>
</div>
<div class="form-group my-2">
<label for="address">Address</label>
<textarea name="address" class="form-control" placeholder="Address" style="width: 100%; height: 150px" required></textarea>
</div>
<div class="form-group my-3 form-buttons">
<input class="btn btn-success" type="submit" value="Add" name="add" />
</div>
</div>
</form>
</article>
</section>
<a class="btn btn-primary btn-bottom-left" href="./index.php"><i class="fas fa-arrow-left"></i>Back</a>
<footer class="mt-5 mb-5 d-flex justify-content-center align-items-center">
<h1>Goes To School</h1>
</footer>
</div>
</body>
<script>
function PreviewImage() {
const oFReader = new FileReader();
oFReader.readAsDataURL(document.getElementById("photo").files[0]);
oFReader.onload = function(oFREvent) {
document.getElementById("preview_photo").src = oFREvent.target.result;
};
};
function validateForm() {
const nis = document.getElementById("nis").value;
if (isNaN(nis)) {
alert("NIS harus angka");
return false;
}
if (nis.length != 5) {
alert("NIS harus 5 character");
return false;
}
return true;
}
</script>
</html>
view raw tambah-siswa.php hosted with ❤ by GitHub

    Berkut adalah tampilan dari aplikasi web yang kami buat
    












Untuk lebih jelasnya dapat menonoton video berikut.

Berikut adalah link untuk demo pada webnya link demo
Demikianlah yang dapat kami sampaikan lebih dan kurangnya mohon maaf. Wassalamu'alaikum warahmatullahi wabarakatuh 😉


Comments

Post a Comment

Popular Posts