<?php
require "config.php";



/* ===== MODE EDIT ===== */
$mode = 'insert';
$data = null;

if(isset($_GET['kode'])){
    $kode = $_GET['kode'];
    $mode = 'edit';
    $data = $conn->query("SELECT * FROM pengajuan WHERE kode_tiket='$kode'")->fetch_assoc();
}

if (file_exists("visitor.php")) {
    include "visitor.php";
}
/* ===== FUNCTION WHATSAPP ===== */
function kirimWA($target, $pesan){

    $token = "Khh5TsTudPJ8FgesH2FV";

    $curl = curl_init();

    curl_setopt_array($curl, array(
        CURLOPT_URL => 'https://api.fonnte.com/send',
        CURLOPT_RETURNTRANSFER => true,
        CURLOPT_POST => true,
        CURLOPT_TIMEOUT => 30,
        CURLOPT_POSTFIELDS => array(
            'target'  => $target,
            'message' => $pesan
        ),
        CURLOPT_HTTPHEADER => array(
            "Authorization: $token"
        ),
    ));

    $response = curl_exec($curl);

    if(curl_errno($curl)){
        $response = curl_error($curl);
    }

    curl_close($curl);

    return $response;
}
/* ===== PROSES FORM ===== */
if(isset($_POST['kirim'])){

$kode_post = $_POST['kode'] ?? '';

$nama     = $_POST['nama'];
$hp       = $_POST['no_hp'];
$pendidikan    = $_POST['pendidikan'];
$email    = $_POST['email'];
$instansi = $_POST['instansi'];
$pekerjaan= $_POST['pekerjaan'];
$alamat   = $_POST['alamat'];
$kota     = $_POST['kota'];
$jenis_kelamin = $_POST['jenis_kelamin'];
$nik      = $_POST['nik'];
$tujuan   = $_POST['tujuan'];
$tgl      = $_POST['tanggal_permohonan'];
$no_surat_permohonan    = $_POST['no_surat_permohonan'];

/* ===== AMBIL FILE LAMA ===== */
if($kode_post){
    $old = $conn->query("SELECT file_surat,file_identitas FROM pengajuan WHERE kode_tiket='$kode_post'")->fetch_assoc();
    $file_surat = $old['file_surat'];
    $file_identitas = $old['file_identitas'];
}else{
    $file_surat="";
    $file_identitas="";
}

/* ===== VALIDASI FILE WAJIB ===== */
if(empty($kode_post)){ // hanya saat pengajuan baru

    if(empty($_FILES['file_surat']['name'])){
        die("File Surat Permohonan wajib diupload.");
    }

    if(empty($_FILES['file_identitas']['name'])){
        die("File Identitas wajib diupload.");
    }
}

/* ===== VALIDASI & UPLOAD FILE SURAT ===== */
if(!empty($_FILES['file_surat']['name'])){

    $ext = strtolower(pathinfo($_FILES['file_surat']['name'], PATHINFO_EXTENSION));
    $size = $_FILES['file_surat']['size'];

    if($ext != 'pdf'){
        die("File surat harus PDF");
    }

    if($size > 10 * 1024 * 1024){
        die("Ukuran file surat maksimal 10MB");
    }

    $file_surat = time()."_surat_".preg_replace(
        "/[^a-zA-Z0-9._-]/",
        "",
        $_FILES['file_surat']['name']
    );

    move_uploaded_file(
        $_FILES['file_surat']['tmp_name'],
        "uploads/".$file_surat
    );
}

/* ===== VALIDASI & UPLOAD FILE IDENTITAS ===== */
if(!empty($_FILES['file_identitas']['name'])){

    $ext = strtolower(pathinfo($_FILES['file_identitas']['name'], PATHINFO_EXTENSION));
    $size = $_FILES['file_identitas']['size'];

    if($ext != 'pdf'){
        die("File identitas harus PDF");
    }

    if($size > 10 * 1024 * 1024){
        die("Ukuran file identitas maksimal 10MB");
    }

    $file_identitas = time()."_identitas_".preg_replace(
        "/[^a-zA-Z0-9._-]/",
        "",
        $_FILES['file_identitas']['name']
    );

    move_uploaded_file(
        $_FILES['file_identitas']['tmp_name'],
        "uploads/".$file_identitas
    );
}

/* ===== UPDATE ===== */
if(!empty($kode_post)){

$conn->query("
UPDATE pengajuan SET
nama='$nama',
no_hp='$hp',
pendidikan='$pendidikan',
email='$email',
instansi='$instansi',
pekerjaan='$pekerjaan',
alamat='$alamat',
kota='$kota',
jenis_kelamin='$jenis_kelamin',
nik='$nik',
no_surat_permohonan='$no_surat_permohonan',
tujuan='$tujuan',
tanggal_permohonan='$tgl',
file_surat='$file_surat',
file_identitas='$file_identitas',
status='Menunggu'
WHERE kode_tiket='$kode_post'
");
$conn->query("
INSERT INTO log_status
(kode_tiket,status,tanggal)
VALUES
('$kode_post','Menunggu',NOW())
");

header("Location: cek.php?kode=".$kode_post."&status=update");
exit;

}

/* ===== INSERT ===== */
else{

function generateKode($length = 6){
    $chars = 'ABCDEFGHJKLMNPQRSTUVWXYZ23456789';
    return substr(str_shuffle($chars), 0, $length);
}

$tahun = date("Y");

do {
    $random = generateKode(6);
    $kode = "BWS/".$tahun."/".$random;

    $cek = $conn->query("SELECT id FROM pengajuan WHERE kode_tiket='$kode'");
} while($cek->num_rows > 0);

$conn->query("
INSERT INTO pengajuan SET
kode_tiket='$kode',
nama='$nama',
no_hp='$hp',
pendidikan='$pendidikan',
email='$email',
instansi='$instansi',
pekerjaan='$pekerjaan',
alamat='$alamat',
kota='$kota',
jenis_kelamin='$jenis_kelamin',
nik='$nik',
no_surat_permohonan='$no_surat_permohonan',
tujuan='$tujuan',
tanggal_permohonan='$tgl',
file_surat='$file_surat',
file_identitas='$file_identitas',
status='Menunggu',
status_surat='Menunggu'
");
/* SIMPAN LOG PERTAMA */
$conn->query("
INSERT INTO log_status
(kode_tiket,status,tanggal)
VALUES
('$kode','Menunggu',NOW())
");

$success_kode = $kode;

/* ===== WA KE ADMIN ===== */

$pesanAdmin = "Pengajuan Baru PETESA\n\n";

$pesanAdmin .= "Kode Tiket:\n".$kode."\n\n";
$pesanAdmin .= "Nama:\n".$nama."\n\n";
$pesanAdmin .= "Nomor WhatsApp:\n".$hp."\n\n";
$pesanAdmin .= "Instansi:\n".$instansi."\n\n";
$pesanAdmin .= "Pekerjaan:\n".$pekerjaan."\n\n";
$pesanAdmin .= "Tujuan:\n".$tujuan."\n\n";
$pesanAdmin .= "Tanggal:\n".date('d-m-Y H:i')."\n\n";

$pesanAdmin .= "Untuk membalas pengajuan ini, silakan klik link di bawah ini:\n";
$pesanAdmin .= "https://petesa.bwskalimantan4.web.id/login";
kirimWA("6289674293652", $pesanAdmin);
kirimWA("6281251801650", $pesanAdmin);
/* ===== WA KE PEMOHON ===== */

$hpUser = preg_replace('/[^0-9]/', '', $hp);

if(substr($hpUser,0,1) == '0'){
    $hpUser = '62'.substr($hpUser,1);
}

if(strlen($hpUser) >= 10){

    $linkCek = "https://petesa.bwskalimantan4.web.id/cek.php?kode=".urlencode($kode);

    $pesanUser = "PENGAJUAN PETESA BERHASIL\n\n";

    $pesanUser .= "Yth. ".$nama.",\n\n";

    $pesanUser .= "Permohonan layanan SDA telah berhasil diterima.\n\n";

    $pesanUser .= "Kode Tiket:\n".$kode."\n\n";

    $pesanUser .= "Status:\nMenunggu Verifikasi\n\n";

    $pesanUser .= "Cek status pengajuan melalui link berikut:\n";
    $pesanUser .= $linkCek."\n\n";

    $pesanUser .= "Estimasi proses maksimal 14 hari kerja.\n\n";

    $pesanUser .= "Mohon simpan kode tiket tersebut karena digunakan untuk pelacakan status permohonan.\n\n";

    $pesanUser .= "Jika ada pertanyaan atau hal yang ingin disampaikan, silakan langsung membalas pesan ini.\n\n";

    $pesanUser .= "Terima kasih.\n";
    $pesanUser .= "Balai Wilayah Sungai Kalimantan IV Samarinda";

    $resUser = kirimWA($hpUser, $pesanUser);

}
}
}
/* ===== STATISTIK ===== */
$today = date('Y-m-d');
$yesterday = date('Y-m-d', strtotime('-1 day'));

$todayCount = $conn->query("SELECT COUNT(DISTINCT session_id) t FROM visitors WHERE visit_date='$today'")->fetch_assoc()['t'] ?? 0;
$yesterdayCount = $conn->query("SELECT COUNT(DISTINCT session_id) t FROM visitors WHERE visit_date='$yesterday'")->fetch_assoc()['t'] ?? 0;
$totalVisitor = $conn->query("SELECT COUNT(DISTINCT session_id) t FROM visitors")->fetch_assoc()['t'] ?? 0;

$online = $conn->query("
SELECT COUNT(DISTINCT session_id) t 
FROM visitors 
WHERE created_at >= NOW() - INTERVAL 5 MINUTE
")->fetch_assoc()['t'] ?? 0;
?>

<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>PETESA</title>

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">

<style>
body{font-family:'Segoe UI',sans-serif;background:#f6f8fb;}
.navbar{background:#003b7a;padding:14px 0;}
.navbar .nav-link{color:white!important;font-weight:600;}

.footer-bws {
    background: linear-gradient(135deg, #003b7a, #1b4f72);
    color: #fff;
}
.footer-bws .row{
    margin-left:0;
    margin-right:0;
}
.footer-title{
    font-weight:800;
    border-left:4px solid #00c6ff;
    padding-left:12px;
    font-size: clamp(16px, 1.5vw, 18px);
}

.footer-bws{
    width:100%;
    margin:0;
}

.footer-bws .container-fluid{
    padding-left:40px;
    padding-right:40px;
}

.footer-bws .row{
    margin-left:0 !important;
    margin-right:0 !important;
}
.sosmed {
    display: flex;
    gap: 15px;
    margin-top: 10px;
}

.sosmed a {
    color: white;
    font-size: 22px;
    text-decoration: none;
    transition: 0.3s;
}

.sosmed a:hover {
    transform: scale(1.2);
    color: #00c6ff;
}

.visitor-box {
    background: rgba(255,255,255,0.1);
    padding: 10px;
    border-radius: 8px;
    font-size: 13px;
}

/* ===== POPUP ===== */
.popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.6);
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.popup-box {
    background: #fff;
    padding: 30px;
    width: 420px;
    border-radius: 12px;
    text-align: center;
    box-shadow: 0 15px 40px rgba(0,0,0,0.3);
    animation: popupFade 0.3s ease;
}

@keyframes popupFade {
    from {transform: scale(0.7); opacity:0;}
    to {transform: scale(1); opacity:1;}
}

.kode-box {
    margin: 15px 0;
    display: flex;
    justify-content: center;
    gap: 10px;
}

.kode-box span {
    font-size: 24px;
    font-weight: bold;
}

.note {
    color: red;
    font-size: 18px;
    font-weight: bold;
}

#btnCopy {
    padding: 6px 12px;
    border: none;
    background: #eee;
    border-radius: 5px;
}

.btn-ok {
    margin-top: 20px;
    padding: 10px 25px;
    background: #007bff;
    color: white;
    border: none;
    border-radius: 5px;
}
.note2{
    background: #ffffff;
    color: #0b3d91;
    padding: 10px 18px;
    border: 2px solid #0b3d91;
    border-radius: 8px;
    font-size: 12px;
    font-weight: bold; /* tulisan bold */
    text-align: justify;
    width: 100%;
    max-width: 600px;
    box-sizing: border-box;
}
</style>
</head>

<body>

<!-- NAVBAR -->
<nav class="navbar navbar-expand-lg">
<div class="container">

<a class="navbar-brand text-white fw-bold d-flex align-items-center" href="index">
    <img src="assets/bws1.png" style="height:60px; margin-right:10px;">
    <div style="font-size:14px;">
        Balai Wilayah Sungai Kalimantan IV Samarinda<br>
        Kementerian Pekerjaan Umum
    </div>
</a>

<button class="navbar-toggler bg-light" data-bs-toggle="collapse" data-bs-target="#nav">☰</button>

<div class="collapse navbar-collapse" id="nav">
<ul class="navbar-nav ms-auto">

<li class="nav-item">
<a class="nav-link" href="index">Beranda</a>
</li>


<li class="nav-item">
<a class="nav-link" href="cek">Cek Pengajuan</a>
</li>

</ul>
</div>
</div>
</nav>

<!-- FORM -->
<div class="container mt-5 mb-5">
<div class="card shadow">
<div class="card-header bg-primary text-white">
<h4>Form Pengajuan Layanan SDA</h4>
</div>

<div class="card-body">

<form method="POST" enctype="multipart/form-data" class="needs-validation" novalidate>
<input type="hidden" name="kode" value="<?= $data['kode_tiket'] ?? '' ?>">
<div class="row">

<div class="col-md-6 mb-3">
<label>Nama Lengkap <span class="text-danger">*</span></label>
<input type="text" name="nama" class="form-control" required 
value="<?= $data['nama'] ?? '' ?>">
<div class="invalid-feedback">
    Masukkan nama lengkap anda.
</div>
</div>

<div class="col-md-6 mb-3">
<label>NIK <span class="text-danger">*</span></label>
<input type="text"
       name="nik"
       class="form-control"
       pattern="[0-9]{16}"
       maxlength="16"
       required>

<div class="invalid-feedback">
    NIK harus terdiri dari 16 digit angka.
</div>
</div>

<div class="col-md-6 mb-3">
<label>Jenis Kelamin <span class="text-danger">*</span></label>
<select name="jenis_kelamin" class="form-control" required>

<option value="" disabled <?= empty($data['jenis_kelamin']) ? 'selected' : '' ?>>
    -- Pilih Jenis Kelamin --
</option>

<option value="Laki-laki" <?= (trim($data['jenis_kelamin'] ?? '') === 'Laki-laki') ? 'selected' : '' ?>>
    Laki-laki
</option>

<option value="Perempuan" <?= (trim($data['jenis_kelamin'] ?? '') === 'Perempuan') ? 'selected' : '' ?>>
    Perempuan
</option>

</select>
<div class="invalid-feedback">
    Silahkan pilih jenis kelamin.
</div>
</div>

<div class="col-md-6 mb-3">
<label>Pendidikan Terakhir <span class="text-danger">*</span></label>
<?php $pendidikan = strtolower(trim($data['pendidikan'] ?? '')); ?>

<select name="pendidikan" class="form-control" required>

<option value="" disabled <?= empty($pendidikan) ? 'selected' : '' ?>>
    -- Pilih Pendidikan Terakhir --
</option>

<option value="SD/Sederajat" <?= $pendidikan == 'sd/sederajat' ? 'selected' : '' ?>>SD/Sederajat</option>

<option value="SLTP/Sederajat" <?= $pendidikan == 'sltp/sederajat' ? 'selected' : '' ?>>SLTP/Sederajat</option>

<option value="SLTA/Sederajat" <?= $pendidikan == 'slta/sederajat' ? 'selected' : '' ?>>SLTA/Sederajat</option>

<option value="DI/Sederajat" <?= $pendidikan == 'di/sederajat' ? 'selected' : '' ?>>DI/Sederajat</option>

<option value="DII/Sederajat" <?= $pendidikan == 'dii/sederajat' ? 'selected' : '' ?>>DII/Sederajat</option>

<option value="DIII/Sederajat" <?= $pendidikan == 'diii/sederajat' ? 'selected' : '' ?>>DIII/Sederajat</option>

<option value="DIV/Sarjana" <?= $pendidikan == 'div/sarjana' ? 'selected' : '' ?>>DIV/Sarjana</option>

<option value="S2/Magister" <?= $pendidikan == 's2/magister' ? 'selected' : '' ?>>S2/Magister</option>

<option value="S3/Doktor" <?= $pendidikan == 's3/doktor' ? 'selected' : '' ?>>S3/Doktor</option>

</select>
<div class="invalid-feedback">
    Silahkan pilih pendidikan terakhir.
</div>
</div>

<div class="col-md-6 mb-3">
<label>Nomor WhatsApp <span class="text-danger">*</span></label>
<input type="text"
       name="no_hp"
       class="form-control"
       pattern="08[0-9]{8,13}"
       placeholder="08xxxxxxxxxx"
       value="<?= $data['no_hp'] ?? '' ?>"
       required>
<div class="invalid-feedback">
    Nomor WhatsApp harus diawali 08 dan hanya angka.
</div>
</div>


<div class="col-md-6 mb-3">
<label>Email <span class="text-danger">*</span></label>
<input type="email" name="email" class="form-control" required 
value="<?= $data['email'] ?? '' ?>">
<div class="invalid-feedback">
    Masukkan email dengan format test@gmail.com
</div>
</div>

<div class="col-md-6 mb-3">
<label>Instansi/Perusahaan<span class="text-danger">*</span></label>
<input type="text" name="instansi" class="form-control" required 
value="<?= $data['instansi'] ?? '' ?>">
<div class="invalid-feedback">
    Masukkan nama instansi/perusahaan.
</div>
</div>

<div class="col-md-6 mb-3">
<label>Pekerjaan <span class="text-danger">*</span></label>
<select name="pekerjaan" class="form-control" required>

<option value="" disabled <?= empty($data['pekerjaan']) ? 'selected' : '' ?>>
    -- Pilih Pekerjaan --
</option>

<option value="ASN" <?= (trim($data['pekerjaan'] ?? '') === 'ASN') ? 'selected' : '' ?>>ASN</option>

<option value="BUMN" <?= (trim($data['pekerjaan'] ?? '') === 'BUMN') ? 'selected' : '' ?>>BUMN</option>

<option value="BUMD" <?= (trim($data['pekerjaan'] ?? '') === 'BUMD') ? 'selected' : '' ?>>BUMD</option>

<option value="Konsultan" <?= (trim($data['pekerjaan'] ?? '') === 'Konsultan') ? 'selected' : '' ?>>Konsultan</option>

<option value="Kontraktor" <?= (trim($data['pekerjaan'] ?? '') === 'Kontraktor') ? 'selected' : '' ?>>Kontraktor</option>

<option value="Swasta" <?= (trim($data['pekerjaan'] ?? '') === 'Swasta') ? 'selected' : '' ?>>Swasta</option>

<option value="Mahasiswa" <?= (trim($data['pekerjaan'] ?? '') === 'Mahasiswa') ? 'selected' : '' ?>>Mahasiswa</option>

<option value="Lainnya" <?= (trim($data['pekerjaan'] ?? '') === 'Lainnya') ? 'selected' : '' ?>>Lainnya</option>

</select>
<div class="invalid-feedback">
    Pilih pekerjaan yang sesuai.
</div>
</div>

<div class="col-md-6 mb-3">
<label>Kota/Kabupaten <span class="text-danger">*</span></label>
<input type="text" name="kota" class="form-control" required 
value="<?= $data['kota'] ?? '' ?>">
<div class="invalid-feedback">
    Masukkan nama kota/kabupatena.
</div>
</div>

<div class="col-md-6 mb-3">
<label>Alamat <span class="text-danger">*</span></label>
<textarea name="alamat" class="form-control" required><?= $data['alamat'] ?? '' ?></textarea>
<div class="invalid-feedback">
    Masukkan alamat anda.
</div>
</div>

<div class="col-md-6 mb-3">
<label>Nomer Surat Permohonan <span class="text-danger">*</span></label>
<input type="no_surat_permohonan" name="no_surat_permohonan" class="form-control" required 
value="<?= $data['no_surat_permohonan'] ?? '' ?>">
<div class="invalid-feedback">
    Masukkan nomer surat permohonan.
</div>
</div>

<div class="col-md-6 mb-3">
<label>Tanggal Permohonan <span class="text-danger">*</span></label>
<input type="date" name="tanggal_permohonan" class="form-control" required 
value="<?= $data['tanggal_permohonan'] ?? '' ?>">
<div class="invalid-feedback">
    Masukkan tanggal permohonan.
</div>
</div>

<div class="col-md-12 mb-3">
    <label>Tujuan Permohonan (Sebutkan Secara Detail Terkait Permohonan Yang Diinginkan) <span class="text-danger">*</span></label>
    <textarea 
        name="tujuan" 
        class="form-control" 
        required
        placeholder="Contoh: permintaan data pemetaan jaringan sungai dari tahun 2010-2025 untuk tugas akhir skripsi"
    ><?= $data['tujuan'] ?? '' ?></textarea>
<div class="invalid-feedback">
    Masukkan tujuan permohonan anda.
</div>
</div>

<div class="col-md-6 mb-3">
<label>Upload Surat Permohonan <span class="text-danger">*</span></label>

<input type="file"
name="file_surat"
class="form-control"
accept=".pdf,application/pdf"
<?= !empty($data['file_surat']) ? '' : 'required' ?>>

<?php if(!empty($data['file_surat'])): ?>
    <small>File lama: <?= $data['file_surat'] ?></small>
<?php endif; ?>
<small class="text-danger">
Format PDF, ukuran maksimal 10 MB.
</small>
</div>

<div class="col-md-6 mb-3">
    <label>Upload Identitas (KTP/SIM/Paspor) <span class="text-danger">*</span></label>

<input type="file"
name="file_identitas"
class="form-control"
accept=".pdf,application/pdf"
<?= !empty($data['file_identitas']) ? '' : 'required' ?>>

<?php if(!empty($data['file_identitas'])): ?>
    <small>File lama: <?= $data['file_identitas'] ?></small>
<?php endif; ?>
<small class="text-danger">
Format PDF, ukuran maksimal 10 MB.
</small>
</div>

</div>

<button name="kirim" class="btn btn-success w-100">
Kirim Permohonan
</button>

</form>

</div>
</div>
</div>

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">
<!-- FOOTER -->
<footer class="footer-bws">
<div class="container-fluid py-5">
<div class="row text-white">

    <!-- PROFIL (LEBIH LEBAR) -->
    <div class="col-md-4">
        <h6 class="footer-title">Profil</h6>
        <p class="small mt-2">
            Balai Wilayah Sungai Kalimantan IV Samarinda<br>
            Jl. MT Haryono No. 36, Kota Samarinda,<br>
            Kalimantan Timur - Indonesia - 75123
            </p>
    </div>

    <!-- KONTAK -->
    <div class="col-md-3">
        <h6 class="footer-title">Kontak</h6>
        <p class="small mt-2">
            📞 (0541) 2088390<br>
            ✉️ bws.kalimantan.iv.samarinda@pu.go.id
        </p>
    </div>

    <!-- SOSIAL MEDIA -->
    <div class="col-md-2">
        <h6 class="footer-title">Sosial Media</h6>
        <div class="sosmed">
    <a href="https://www.facebook.com/profile.php?id=100078698323903" target="_blank" rel="noopener noreferrer">
    <i class="fab fa-facebook"></i>
    </a>
             <!-- Instagram -->
    <a href="https://www.instagram.com/pu_sda_kalimantan4" target="_blank" rel="noopener noreferrer">
        <i class="fab fa-instagram"></i>
    </a>

    <!-- YouTube -->
    <a href="https://www.youtube.com/@pusdakalimantan4samarinda" target="_blank" rel="noopener noreferrer">
        <i class="fab fa-youtube"></i>
    </a>

    <!-- X -->
    <a href="https://x.com/pu_sda_bwsk4/" target="_blank" rel="noopener noreferrer">
        <i class="fab fa-x-twitter"></i>
    </a>

    <!-- TikTok -->
    <a href="https://www.tiktok.com/@pu_sda_kalimantan5" target="_blank" rel="noopener noreferrer">
        <i class="fab fa-tiktok"></i>
    </a>
        </div>
    </div>

    <!-- STATISTIK -->
    <div class="col-md-3">
        <h6 class="footer-title">Statistik Pengunjung</h6>
        <div class="visitor-box mt-2">
            <div>Hari ini : <strong><?= $todayCount ?></strong></div>
            <div>Kemarin : <?= $yesterdayCount ?></div>
            <div>Total : <?= $totalVisitor ?></div>
            <div>Online : <span id="online"><?= $online ?></span></div>
        </div>
    </div>

</div>
<hr>

<div class="text-center small">
Hak Cipta ©2024 Balai Wilayah Sungai Kalimantan IV Samarinda Direktorat Jenderal Sumber Daya Air Kementerian Pekerjaan Umum Republik Indonesia,. All Rights Reserved
</div>

</div>
</footer>

<!-- POPUP -->
<div id="popupSukses" class="popup-overlay">
    <div class="popup-box">
        <h4>Permohonan Berhasil</h4>
        <p>Kode Tiket Anda:</p>

        <div class="kode-box">
            <span id="kodeTiket"></span>
            <button id="btnCopy">Copy</button>
        </div>

        <p class="note">
            Simpan Kode Tiket Untuk Cek Status Pengajuan
        </p>
        <p class="note2">
            Pengajuan Data Akan Di Proses Maksimal 14 Hari Kerja
        </p>

        <button class="btn-ok" onclick="tutupPopup()">OK</button>
    </div>
</div>

<!-- JS -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>

<script>
(() => {

'use strict';

const forms = document.querySelectorAll('.needs-validation');

Array.from(forms).forEach(form => {

    form.addEventListener('submit', event => {

        if (!form.checkValidity()) {

            event.preventDefault();
            event.stopPropagation();

        }

        form.classList.add('was-validated');

    }, false);

});

})();
</script>
<script>
/* ===== POPUP JS ===== */
function tampilPopup(kode) {
    document.getElementById("kodeTiket").innerText = kode;
    document.getElementById("popupSukses").style.display = "flex";

    let btn = document.getElementById("btnCopy");
    btn.innerText = "Copy";

    btn.onclick = function(){
        navigator.clipboard.writeText(kode).then(() => {
            btn.innerText = "Copied ✅";
        });
    }
}

function tutupPopup() {
    window.location = "cek.php?jenis=sda";
}
document.querySelector('[name="file_surat"]').addEventListener('change', function() {

    if(this.files.length > 0){

        let size = this.files[0].size;

        if(size > 10 * 1024 * 1024){

            alert('Ukuran Surat Permohonan maksimal 10 MB');

            this.value = '';
        }
    }
});

document.querySelector('[name="file_identitas"]').addEventListener('change', function() {

    if(this.files.length > 0){

        let size = this.files[0].size;

        if(size > 10 * 1024 * 1024){

            alert('Ukuran File Identitas maksimal 10 MB');

            this.value = '';
        }
    }
});
</script>

<?php if(isset($success_kode)): ?>
<script>
window.onload = function(){
    tampilPopup("<?= $success_kode ?>");
}

</script>
<?php endif; ?>

</body>
</html>