web programming full stack developer

Berikut versi aplikasi antrian dengan Bootstrap + PHP + MySQLi.
➡️ Tampilan lebih rapi, tanpa PDO, cukup MySQLi.


📦 Struktur Folder

/antrian/
├── config.php
├── index.php
├── add_ticket.php
├── admin.php
├── call_next.php
├── serve_current.php
├── reset_all.php
└── database.sql


🧩 1. database.sql

CREATE DATABASE antrian_db;

USE antrian_db;

CREATE TABLE tickets (
  id INT AUTO_INCREMENT PRIMARY KEY,
  number INT NOT NULL,
  status ENUM('waiting','called','served') DEFAULT 'waiting',
  created_at DATETIME DEFAULT CURRENT_TIMESTAMP,
  called_at DATETIME NULL,
  served_at DATETIME NULL
);


🧩 2. config.php

<?php
$host = "localhost";
$user = "root";
$pass = "";
$db   = "antrian_db";

$conn = mysqli_connect($host, $user, $pass, $db);

if(!$conn){
    die("Koneksi gagal: ".mysqli_connect_error());
}
?>


🧩 3. index.php (halaman publik – ambil nomor & lihat status)

<?php include "config.php"; ?>
<!DOCTYPE html>
<html>
<head>
    <title>Sistem Antrian</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css">
</head>
<body class="container mt-4">

    <h2 class="text-center mb-4">Sistem Antrian</h2>

    <div class="card p-4 shadow-sm">
        <h4>Ambil Nomor Antrian</h4>
        <form action="add_ticket.php" method="post">
            <button class="btn btn-primary mt-2" type="submit">Ambil Nomor</button>
        </form>
    </div>

    <div class="mt-4 card p-4 shadow-sm">
        <h4>Sedang Dipanggil</h4>
        <?php
        $q = mysqli_query($conn, "SELECT number FROM tickets WHERE status='called' ORDER BY called_at DESC LIMIT 1");
        $d = mysqli_fetch_assoc($q);
        echo $d ? "<h1 class='text-success'>".$d['number']."</h1>" : "<span>Belum ada</span>";
        ?>
    </div>

    <div class="mt-4 card p-4 shadow-sm">
        <h4>Daftar Menunggu</h4>
        <ul class="list-group">
        <?php
        $q = mysqli_query($conn, "SELECT number FROM tickets WHERE status='waiting' ORDER BY created_at ASC");
        if(mysqli_num_rows($q)==0){
            echo "<li class='list-group-item'>Tidak ada antrian</li>";
        } else {
            while($row=mysqli_fetch_assoc($q)){
                echo "<li class='list-group-item'>Nomor ".$row['number']."</li>";
            }
        }
        ?>
        </ul>
    </div>

</body>
</html>


🧩 4. add_ticket.php

<?php
include "config.php";

$q = mysqli_query($conn, "SELECT MAX(number) as mx FROM tickets");
$mx = mysqli_fetch_assoc($q)['mx'];
$next = $mx + 1;

mysqli_query($conn, "INSERT INTO tickets(number) VALUES ($next)");

echo "<link rel='stylesheet' href='https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css'>";
echo "<div class='container mt-4'>";
echo "<h2>Nomor Antrian Anda:</h2>";
echo "<h1 class='text-primary'>$next</h1>";
echo "<a class='btn btn-success' href='index.php'>Kembali</a>";
echo "</div>";


🧩 5. admin.php (panel petugas)

<?php include "config.php"; ?>
<!DOCTYPE html>
<html>
<head>
    <title>Admin Antrian</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css">
</head>
<body class="container mt-4">

    <h2>Panel Admin Antrian</h2>

    <div class="d-flex gap-2 mt-3">
        <form action="call_next.php" method="post">
            <button type="submit" class="btn btn-primary">Panggil Berikutnya</button>
        </form>

        <form action="serve_current.php" method="post">
            <button type="submit" class="btn btn-warning">Selesai</button>
        </form>

        <form action="reset_all.php" method="post">
            <button type="submit" onclick="return confirm('Reset semua data?')" class="btn btn-danger">Reset</button>
        </form>
    </div>

    <div class="card p-4 mt-4 shadow-sm">
        <h4>Nomor Saat Ini:</h4>
        <?php
        $q = mysqli_query($conn, "SELECT number FROM tickets WHERE status='called' ORDER BY called_at DESC LIMIT 1");
        $d = mysqli_fetch_assoc($q);
        echo $d ? "<h1 class='text-success'>".$d['number']."</h1>" : "<span>Belum ada</span>";
        ?>
    </div>

    <div class="card p-4 mt-4 shadow-sm">
        <h4>Menunggu</h4>
        <ul class="list-group">
        <?php
        $q2 = mysqli_query($conn, "SELECT number FROM tickets WHERE status='waiting'");
        while($r=mysqli_fetch_assoc($q2)){
            echo "<li class='list-group-item'>".$r['number']."</li>";
        }
        ?>
        </ul>
    </div>

</body>
</html>


🧩 6. call_next.php

<?php
include "config.php";

$q = mysqli_query($conn, "SELECT id FROM tickets WHERE status='waiting' ORDER BY created_at ASC LIMIT 1");
$d = mysqli_fetch_assoc($q);

if(!$d){
    echo "Tidak ada antrian.";
    exit;
}

$id = $d['id'];
mysqli_query($conn, "UPDATE tickets SET status='called', called_at=NOW() WHERE id=$id");

header("Location: admin.php");


🧩 7. serve_current.php

<?php
include "config.php";

$q = mysqli_query($conn, "SELECT id FROM tickets WHERE status='called' ORDER BY called_at DESC LIMIT 1");
$d = mysqli_fetch_assoc($q);

if(!$d){
    echo "Belum ada nomor aktif";
    exit;
}

$id = $d['id'];
mysqli_query($conn, "UPDATE tickets SET status='served', served_at=NOW() WHERE id=$id");

header("Location: admin.php");


🧩 8. reset_all.php

<?php
include "config.php";
mysqli_query($conn, "TRUNCATE TABLE tickets");
header("Location: admin.php");

Leave a Reply

Your email address will not be published. Required fields are marked *