<?php

$judul = "Tambah Checklist";
$menu  = "checklist";

include 'layout/header.php';

if(isset($_POST['simpan'])){

    $job_list   = mysqli_real_escape_string($conn,$_POST['job_list']);
    $job_desc   = mysqli_real_escape_string($conn,$_POST['job_desc']);
    $waktu      = $_POST['waktu'];
    $jenis      = $_POST['jenis'];
    $bukti_foto = isset($_POST['bukti_foto']) ? 1 : 0;

    mysqli_query($conn,"
        INSERT INTO checklist_master
        (
            job_list,
            job_desc,
            waktu,
            jenis,
            bukti_foto,
            status
        )
        VALUES
        (
            '$job_list',
            '$job_desc',
            '$waktu',
            '$jenis',
            '$bukti_foto',
            'aktif'
        )
    ");

    $id_checklist = mysqli_insert_id($conn);

    if(isset($_POST['role'])){

        $jabatan_list = implode(',', $_POST['role']);

        mysqli_query($conn,"
            UPDATE checklist_master
            SET jabatan='$jabatan_list'
            WHERE id_checklist='$id_checklist'
        ");

        foreach($_POST['role'] as $role){

            mysqli_query($conn,"
                INSERT INTO checklist_pic
                (
                    id_checklist,
                    jabatan
                )
                VALUES
                (
                    '$id_checklist',
                    '$role'
                )
            ");

        }

    }

    echo "
    <script>
        alert('Checklist berhasil ditambahkan');
        window.location='checklist.php';
    </script>
    ";
}

include 'layout/sidebar.php';
?>

<style>

.form-card{
    background:#fff;
    border:1px solid var(--green-100);
    border-radius:16px;
    padding:28px;
    box-shadow:var(--shadow-sm);
}

.form-title{
    display:flex;
    align-items:center;
    gap:10px;
    font-size:1.2rem;
    font-weight:700;
    color:var(--text-dark);
    margin-bottom:25px;
}

.form-title-icon{
    width:42px;
    height:42px;
    border-radius:12px;
    background:linear-gradient(
        135deg,
        var(--green-600),
        var(--green-400)
    );
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:18px;
}

.form-label{
    color:var(--text-dark);
    font-weight:600;
    margin-bottom:6px;
}

.form-control,
.form-select{
    background:#fff;
    border:1.5px solid var(--green-100);
    color:var(--text-dark);
    border-radius:10px;
    min-height:46px;
}

.form-control:focus,
.form-select:focus{
    border-color:var(--green-400);
    box-shadow:0 0 0 4px rgba(34,197,94,.12);
    outline:none;
}

.role-box{
    background:var(--green-50);
    border:1px solid var(--green-100);
    border-radius:12px;
    padding:16px;
}

.form-check{
    margin-bottom:10px;
}

.form-check:last-child{
    margin-bottom:0;
}

.form-check-input{
    border:1px solid var(--green-200);
}

.form-check-input:checked{
    background-color:var(--green-500);
    border-color:var(--green-500);
}

.form-check-label{
    color:var(--text-dark);
    font-weight:500;
}

.btn-save{
    background: #22c55e;
    color: #fff;
    border: none;
    padding: 12px 24px;
    border-radius: 10px;
    font-weight: 600;
    font-size: 14px;
    cursor: pointer;
    transition: all .2s ease;
}

.btn-save:hover{
    background: #16a34a;
    box-shadow: 0 6px 15px rgba(34,197,94,.30);
    transform: translateY(-1px);
}

.btn-save:active{
    transform: translateY(0);
}

.btn-save:focus{
    outline: none;
    box-shadow: 0 0 0 4px rgba(34,197,94,.15);
}

.foto-box{
    background:var(--green-50);
    border:1px solid var(--green-100);
    border-radius:12px;
    padding:16px;
}

.page-header{
    margin-bottom:24px;
}

</style>

<div class="container-fluid">

<div class="form-card">

    <h4 class="mb-4" style="color: var(--green-700); font-weight:700;">
        📝 Tambah Checklist
    </h4>

    <form method="POST">

        <div class="mb-3">
            <label class="form-label">Job List</label>
            <input
                type="text"
                name="job_list"
                class="form-control"
                placeholder="Masukkan nama job list..."
                required>
        </div>

        <!-- Job Desc: ketik manual -->
        <div class="mb-3">
            <label class="form-label">Job Desc</label>
            <textarea
                name="job_desc"
                class="form-control"
                rows="3"
                placeholder="Masukkan deskripsi pekerjaan..."
                required></textarea>
        </div>

        <div class="row">

            <div class="col-md-6 mb-3">
                <label class="form-label">Waktu</label>
                <select name="waktu" class="form-select" required>
                    <option value="Pagi">Pagi</option>
                    <option value="Siang">Siang</option>
                    <option value="Sore">Sore</option>
                    <option value="Malam">Malam</option>
                </select>
            </div>

            <div class="col-md-6 mb-3">
                <label class="form-label">Jenis</label>
                <select name="jenis" class="form-select" required>
                    <option value="Daily">Daily</option>
                    <option value="Weekly">Weekly</option>
                    <option value="Monthly">Monthly</option>
                </select>
            </div>

        </div>

        <div class="mb-4">
            <label class="form-label">Role</label>
            <div class="role-box">
                <?php
                $q_role = mysqli_query($conn,"
                    SELECT DISTINCT role
                    FROM users
                    WHERE role NOT IN ('admin','direktur')
                    ORDER BY role
                ");
                while($r = mysqli_fetch_assoc($q_role)){
                ?>
                <div class="form-check">
                    <input
                        class="form-check-input"
                        type="checkbox"
                        name="role[]"
                        value="<?= $r['role']; ?>">
                    <label class="form-check-label">
                        <?= ucwords(str_replace('_',' ',$r['role'])); ?>
                    </label>
                </div>
                <?php } ?>
            </div>
        </div>

        <div class="mb-4">
            <label class="form-label">Bukti Foto</label>
            <div class="foto-box">
                <div class="form-check">
                    <input
                        class="form-check-input"
                        type="checkbox"
                        name="bukti_foto"
                        id="bukti_foto"
                        value="1">
                    <label class="form-check-label" for="bukti_foto">
                        Wajibkan bukti foto saat checklist dikerjakan
                    </label>
                </div>
                <div class="mt-3" id="sumber_foto_wrapper" style="display:none;">
                    <label class="form-label">Sumber Foto</label>
                    <select name="sumber_foto" class="form-select">
                        <option value="kamera">Kamera (Ambil Langsung)</option>
                        <option value="upload">Upload dari Galeri/File</option>
                        <option value="both">Kamera atau Upload (Bebas)</option>
                    </select>
                </div>
            </div>
        </div>

        <button type="submit" name="simpan" class="btn-save">
            Simpan Checklist
        </button>

    </form>

</div>

</div>

<script>
document.getElementById('bukti_foto').addEventListener('change', function(){
    document.getElementById('sumber_foto_wrapper').style.display = this.checked ? 'block' : 'none';
});
</script>

<?php include 'layout/footer.php'; ?>