<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Laporkan Masalah - SI-INAL Asset IT</title>
    <!-- Inter Font -->
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
    <!-- Bootstrap CSS -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
    <!-- Bootstrap Icons -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css">
    <!-- Custom CSS -->
    <link rel="stylesheet" href="assets/css/style.css">
    <style>
        body {
            display: flex;
            align-items: center;
            justify-content: center;
            min-height: 100vh;
            background-color: #eef1f5;
            padding: 1rem;
        }
        .card {
            border-radius: 1rem;
            border: none;
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
        }
    </style>
</head>
<body>
    <div class="container">
        <div class="row justify-content-center">
            <div class="col-md-8 col-lg-6">
                <div class="card p-4">
                    <div class="card-body">
                        <h3 class="card-title text-center mb-4 fw-bold">Laporkan Masalah</h3>
                        <p class="text-center text-muted mb-4">Mohon isi formulir di bawah untuk melaporkan masalah.</p>

                        <?php if (isset($_GET['message']) && $_GET['message'] == 'report_success'): ?>
                            <div class="alert alert-success">Laporan masalah berhasil dikirim! Terima kasih.</div>
                        <?php endif; ?>
                        <?php if (isset($_GET['error']) && $_GET['error'] === 'empty_fields'): ?>
                            <div class="alert alert-danger">
                                Gagal mengirim laporan. Pastikan semua kolom yang wajib sudah terisi.
                            </div>
                        <?php endif; ?>
                        <?php if (isset($_GET['error']) && $_GET['error'] === 'invalid_email'): ?>
                            <div class="alert alert-danger">
                                Gagal mengirim laporan. Mohon masukkan alamat email yang valid.
                            </div>
                        <?php endif; ?>
                        <?php if (isset($_GET['error']) && $_GET['error'] === 'submit_failed'): ?>
                            <div class="alert alert-danger">
                                Gagal mengirim laporan karena kesalahan sistem. Silakan coba lagi.
                            </div>
                        <?php endif; ?>

                        <form action="?page=helpdesk_submit_report" method="POST">
                            <div class="mb-3">
                                <label for="category" class="form-label fw-bold">Kategori Masalah</label>
                                <select class="form-select" id="category" name="category" required>
                                    <option value="">Pilih Kategori</option>
                                    <option value="Hardware">Hardware</option>
                                    <option value="Software">Software</option>
                                    <option value="Jaringan">Jaringan</option>
                                    <option value="SIMRS">SIMRS</option>
                                    <option value="Lainnya">Lainnya</option>
                                </select>
                            </div>
                            <div class="mb-3">
                                <label for="reporter_name" class="form-label fw-bold">Nama Anda:</label>
                                <input type="text" class="form-control" id="reporter_name" name="reporter_name" required>
                            </div>
                             <div class="mb-3">
                                <label for="unit" class="form-label fw-bold">Unit/Departemen Anda:</label>
                                <input type="text" class="form-control" id="unit" name="unit" required>
                            </div>
                             <div class="mb-3">
                                <label for="reporter_contact" class="form-label fw-bold">Alamat Email Anda:</label>
                                <input type="email" class="form-control" id="reporter_contact" name="reporter_contact" required placeholder="nama@email.com">
                                <div class="form-text">Kami akan mengirimkan notifikasi status tiket ke email ini.</div>
                            </div>
                            <div class="mb-3">
                                <label for="problem_description" class="form-label fw-bold">Deskripsi Masalah:</label>
                                <textarea class="form-control" id="problem_description" name="problem_description" rows="4" required></textarea>
                            </div>
                            <div class="mb-3">
                                <label for="priority" class="form-label fw-bold">Prioritas:</label>
                                <select class="form-select" id="priority" name="priority">
                                    <option value="Low">Rendah</option>
                                    <option value="Medium" selected>Sedang</option>
                                    <option value="High">Tinggi</option>
                                    <option value="Critical">Kritis</option>
                                </select>
                            </div>
                            <div class="d-grid gap-2">
                                <button type="submit" class="btn btn-primary py-2 fw-bold">Kirim Laporan</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Bootstrap JS Bundle -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>