<?php

@include 'config.php';

session_start();

$user_id = $_SESSION['user_id'];

if(!isset($user_id)){
   header('location:login.php');
   exit;
}

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

    $name = mysqli_real_escape_string($conn, $_POST['name']);
    $email = mysqli_real_escape_string($conn, $_POST['email']);
    $number = mysqli_real_escape_string($conn, $_POST['number']);
    $msg = mysqli_real_escape_string($conn, $_POST['message']);

    // Cek apakah pesan yang sama sudah pernah dikirim
    $select_message = mysqli_query($conn, "SELECT * FROM `message` WHERE name = '$name' AND email = '$email' AND number = '$number' AND message = '$msg'") or die('Query failed');

    if(mysqli_num_rows($select_message) > 0){
        $message[] = 'Pesan sudah pernah dikirim!';
    }else{
        mysqli_query($conn, "INSERT INTO `message`(user_id, name, email, number, message) VALUES('$user_id', '$name', '$email', '$number', '$msg')") or die('Query gagal');
        $message[] = 'Pesan berhasil dikirim!';
    }
}

?>
<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>DISKUSI</title>

   <!-- Font Awesome CDN -->
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">

   <!-- Custom CSS -->
   <link rel="stylesheet" href="css/style.css">
</head>
<body>
   
<?php @include 'header.php'; ?>

<section class="heading">
    <h3>DISKUSI</h3>
    <p><a href="home.php">Beranda</a> / DISKUSI</p>
</section>

<section class="contact" style="padding: 2rem;">
   <div class="box" style="
      display: flex;
      flex-direction: column;
      gap: 2rem;
      padding: 2rem;
      background: #fff;
      border-radius: 15px;
      box-shadow: 0 4px 16px rgba(0,0,0,0.1);
      max-width: 900px;
      margin: 0 auto;
   ">

      <!-- FORM KIRIM PESAN -->
      <form action="" method="POST" style="width: 100%;">
         <h3 style="font-size: 2rem; margin-bottom: 1rem;">Kirim Pesan</h3>

         <?php if(isset($message) && is_array($message)): ?>
            <?php foreach($message as $msg): ?>
               <div class="message"><?php echo $msg; ?></div>
            <?php endforeach; ?>
         <?php endif; ?>

         <input type="text" name="name" placeholder="Masukkan nama anda" class="box" required style="margin-bottom: 1rem;">
         <input type="email" name="email" placeholder="Masukkan email anda" class="box" required style="margin-bottom: 1rem;">
         <input type="number" name="number" placeholder="Masukkan nomor anda" class="box" required style="margin-bottom: 1rem;">
         <textarea name="message" class="box" placeholder="Tulis pesan anda" required cols="30" rows="6" style="margin-bottom: 1rem;"></textarea>
         <input type="submit" value="Kirim Pesan" name="send" class="btn">
      </form>

      <!-- PESAN & BALASAN -->
      <div>
         <h3 style="font-size: 2rem; margin-bottom: 1rem;">Pesan dan Balasan Anda</h3>

         <?php
         $select_message = mysqli_query($conn, "SELECT * FROM `message` WHERE user_id = '$user_id' ORDER BY id DESC") or die('Query gagal');

         if(mysqli_num_rows($select_message) > 0){
             while($row = mysqli_fetch_assoc($select_message)){
                 echo "<div class='message-box' style='margin-bottom: 1.5rem; padding: 1.5rem; background: #f9f9f9; border-left: 5px solid #ff6b81; border-radius: 10px;'>";
                 echo "<p style='font-size: 1.2rem; margin-bottom: 0.5rem;'><strong>Pesan:</strong> " . htmlspecialchars($row['message']) . "</p>";
                 if(!empty($row['reply'])){
                     echo "<p style='font-size: 1.1rem; color: #333;'><strong>Balasan Admin:</strong> " . htmlspecialchars($row['reply']) . "</p>";
                 } else {
                     echo "<p style='font-size: 1.1rem; font-style: italic; color: #999;'>Belum dibalas oleh admin</p>";
                 }
                 echo "</div>";
             }
         } else {
             echo "<p style='font-size: 1.2rem;'>Belum ada pesan yang dikirim.</p>";
         }
         ?>
      </div>

   </div>
</section>

<!-- BOX INFO KONTAK DITENGAH (lebih rapat ke atas) -->
<div style="
   display: flex;
   justify-content: center;
   margin-top: 1.5rem;
   margin-bottom: 5rem; /* Tambahkan ini agar tidak menindih footer */
">

   <div class="box" style="
      width: 100%;
      max-width: 600px;
      padding: 2rem;
      border-radius: 15px;
      background-color: #f7f7f7;
      box-shadow: 0 4px 16px rgba(0,0,0,0.1);
   ">
      <h3 style="font-size: 2.5rem; margin-bottom: 1.5rem; color: #333; text-align: center;">INFO KONTAK</h3>

      <p style="display: flex; align-items: center; gap: 15px; font-size: 2rem; margin-bottom: 1rem;">
         <i class="fas fa-phone" style="color: #C13584; font-size: 2rem;"></i>
         <a href="https://wa.me/62881024201534" target="_blank" style="color: #333; text-decoration: none;">
            0881-0242-01534
         </a>
      </p>

      <p style="display: flex; align-items: center; gap: 15px; font-size: 2rem; margin-bottom: 1rem;">
         <i class="fas fa-envelope" style="color: #C13584; font-size: 2rem;"></i>
         <a href="mailto:candybracee@gmail.com" style="color: #333; text-decoration: none;">
            candybracee@gmail.com
         </a>
      </p>

      <p style="display: flex; align-items: center; gap: 15px; font-size: 2rem; margin-bottom: 1rem;">
         <i class="fab fa-instagram" style="color: #C13584; font-size: 2rem;"></i>
         <a href="https://www.instagram.com/candybrace.co?igsh=MXU3amc1a3p1Mm05cw==" target="_blank" style="color: #333; text-decoration: none;">
            Instagram: @candybracee.co
         </a>
      </p>

      <p style="display: flex; align-items: center; gap: 15px; font-size: 2rem;">
         <i class="fas fa-map-marker-alt" style="color: #C13584; font-size: 2rem;"></i>
         <span>Bekasi</span>
      </p>
   </div>
</div>


</section>

<?php @include 'footer.php'; ?>

<script src="js/script.js"></script>

</body>
</html>
