<main id="main" class="main">

  <div class="pagetitle">
    <h1>Hadiah</h1>
    <nav>
      <ol class="breadcrumb">
        <li class="breadcrumb-item"><a href="index.php">Home</a></li>
        <li class="breadcrumb-item">Hadiah</li>
      </ol>
    </nav>
  </div><!-- End Page Title -->

  <section class="section dashboard">
    <div class="card recent-sales overflow-auto">

      <div class="filter">
        <!-- Modal Dialog Scrollable -->
        <a href="#" class="icon" data-bs-toggle="modal" data-bs-target="#tambah_data">
          <i class="bi bi-plus-lg"></i>
        </a>
        <div class="modal fade" id="tambah_data" tabindex="-1">
          <div class="modal-dialog">
            <div class="modal-content">
              <form action="prs_tambah_hadiah.php" method="post">
                <div class="modal-header">
                  <h5 class="modal-title">Tambah Data</h5>
                  <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                  <div class="form-floating mb-3">
                    <input type="text" class="form-control" id="nama_hadiah" name="nama_hadiah"
                      placeholder="Nama Hadiah">
                    <label for="nama_hadiah">Nama Hadiah</label>
                  </div>
                  <div class="row g-2">
                    <div class="col-md-4">
                      <div class="form-floating mb-3">
                        <input type="color" class="form-control form-control-color w-100" id="background_hadiah"
                          name="background_hadiah" value="#333333" title="Pilih Warna Background Hadiah">
                        <label for="background_hadiah">Background Hadiah</label>
                      </div>
                    </div>
                    <div class="col-md-4">
                      <div class="form-floating mb-3">
                        <input type="color" class="form-control form-control-color w-100" id="border_hadiah"
                          name="border_hadiah" value="#333333" title="Pilih Warna Border Hadiah">
                        <label for="border_hadiah">Border Hadiah</label>
                      </div>
                    </div>
                    <div class="col-md-4">
                      <div class="form-floating mb-3">
                        <input type="color" class="form-control form-control-color w-100" id="text_hadiah"
                          name="text_hadiah" value="#333333" title="Pilih Warna Text Hadiah">
                        <label for="text_hadiah">Text Hadiah</label>
                      </div>
                    </div>
                  </div>
                  <div class="input-group mb-3">
                    <div class="form-floating">
                      <input type="text" class="form-control" id="persen_hadiah" name="persen_hadiah"
                        placeholder="Kemunculan Hadiah">
                      <label for="persen_hadiah">Kemunculan Hadiah</label>
                    </div>
                    <span class="input-group-text">%</span>
                  </div>
                  <div class="form-floating">
                    <select class="form-select" id="status_hadiah" name="status_hadiah" aria-label="status_hadiah">
                      <option selected>Status Hadiah</option>
                      <option value="Aktif">Aktif</option>
                      <option value="Tidak Aktif">Tidak Aktif</option>
                    </select>
                    <label for="status_hadiah">Status Hadiah</label>
                  </div>
                </div>
                <div class="modal-footer">
                  <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Batal</button>
                  <button type="submit" class="btn btn-primary">Tambah Data</button>
                </div>
              </form>
            </div>
          </div>
        </div><!-- End Modal Dialog Scrollable-->
      </div>

      <div class="card-body">
        <h5 class="card-title">Hadiah</h5>
        <?php
        if (isset($_GET['notif'])) {
          if ($_GET['notif'] == "berhasil_tambah_data") {
            echo '
                    <div class="alert alert-success" role="alert">
                        Berhasil menambahkan data.
                    </div>
                ';
          } else if ($_GET['notif'] == "berhasil_ubah_data") {
            echo '
                    <div class="alert alert-success" role="alert">
                        Berhasil mengubah data.
                    </div>
                ';
          } else if ($_GET['notif'] == "berhasil_hapus_data") {
            echo '
                    <div class="alert alert-success" role="alert">
                        Berhasil menghapus data.
                    </div>
                ';
          }
        }
        ?>

        <table class="table table-borderless datatable">
          <thead>
            <tr>
              <th scope="col">#</th>
              <th scope="col">Nama</th>
              <th scope="col">Background</th>
              <th scope="col">Border</th>
              <th scope="col">Tulisan</th>
              <th scope="col">Peluang</th>
              <th scope="col">Status</th>
              <th scope="col">Aksi</th>
            </tr>
          </thead>
          <tbody>
            <?php
            $no = 1;
            $qry_hadiah = mysqli_query($koneksi, "SELECT * FROM hadiah");
            while ($dt_hadiah = mysqli_fetch_array($qry_hadiah)) {
              $id_hadiah = $dt_hadiah['id_hadiah'];
              $nama_hadiah = $dt_hadiah['nama_hadiah'];
              $background_hadiah = $dt_hadiah['background_hadiah'];
              $border_hadiah = $dt_hadiah['border_hadiah'];
              $text_hadiah = $dt_hadiah['text_hadiah'];
              $persen_hadiah = $dt_hadiah['persen_hadiah'];
              $status_hadiah = $dt_hadiah['status_hadiah'];
              ?>
              <tr>
                <th><?php echo $no++; ?></th>
                <td><?php echo $nama_hadiah; ?></td>
                <td>
                  <?php echo '<i class="bi bi-circle-fill" style="color:' . $background_hadiah . ';"></i> ' . $background_hadiah; ?>
                </td>
                <td><?php echo '<i class="bi bi-circle-fill" style="color:' . $border_hadiah . ';"></i> ' . $border_hadiah; ?>
                </td>
                <td><?php echo '<i class="bi bi-circle-fill" style="color:' . $text_hadiah . ';"></i> ' . $text_hadiah; ?></td>
                <td><?php echo $persen_hadiah; ?></td>
                <td>
                  <?php
                  if ($status_hadiah == "Aktif") {
                    echo '<span class="badge bg-success">Aktif</span>';
                  } else {
                    echo '<span class="badge bg-danger">Tidak Aktif</span>';
                  }
                  ?>
                </td>
                <td>
                  <button type="button" class="btn btn-sm btn-primary" data-bs-toggle="modal"
                    data-bs-target="#ubah_<?php echo $id_hadiah; ?>"><i class="bi bi-pencil-square"></i></button>
                  <button type="button" class="btn btn-sm btn-danger" data-bs-toggle="modal"
                    data-bs-target="#hapus_<?php echo $id_hadiah; ?>"><i class="bi bi-trash"></i></button>

                  <div class="modal fade" id="ubah_<?php echo $id_hadiah; ?>" tabindex="-1">
                    <div class="modal-dialog">
                      <div class="modal-content">
                        <form action="prs_ubah_hadiah.php" method="post">
                          <div class="modal-header">
                            <h5 class="modal-title">Ubah Data</h5>
                            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                          </div>
                          <div class="modal-body">
                            <input type="hidden" name="id_hadiah" value="<?php echo $id_hadiah; ?>">
                            <div class="form-floating mb-3">
                              <input type="text" class="form-control" id="nama_hadiah" name="nama_hadiah"
                                value="<?php echo $nama_hadiah; ?>">
                              <label for="nama_hadiah">Nama Hadiah</label>
                            </div>
                            <div class="row g-2">
                              <div class="col-md-4">
                                <div class="form-floating mb-3">
                                  <input type="color" class="form-control form-control-color w-100" id="background_hadiah"
                                    name="background_hadiah" value="<?php echo $background_hadiah; ?>"
                                    title="Pilih Warna Background Hadiah">
                                  <label for="background_hadiah">Background Hadiah</label>
                                </div>
                              </div>
                              <div class="col-md-4">
                                <div class="form-floating mb-3">
                                  <input type="color" class="form-control form-control-color w-100" id="border_hadiah"
                                    name="border_hadiah" value="<?php echo $border_hadiah; ?>"
                                    title="Pilih Warna Border Hadiah">
                                  <label for="border_hadiah">Border Hadiah</label>
                                </div>
                              </div>
                              <div class="col-md-4">
                                <div class="form-floating mb-3">
                                  <input type="color" class="form-control form-control-color w-100" id="text_hadiah"
                                    name="text_hadiah" value="<?php echo $text_hadiah; ?>"
                                    title="Pilih Warna Text Hadiah">
                                  <label for="text_hadiah">Text Hadiah</label>
                                </div>
                              </div>
                            </div>
                            <div class="input-group mb-3">
                              <div class="form-floating">
                                <input type="text" class="form-control" id="persen_hadiah" name="persen_hadiah"
                                  value="<?php echo $persen_hadiah; ?>">
                                <label for="persen_hadiah">Kemunculan Hadiah</label>
                              </div>
                              <span class="input-group-text">%</span>
                            </div>
                            <div class="form-floating">
                              <select class="form-select" id="status_hadiah" name="status_hadiah"
                                aria-label="status_hadiah">
                                <option value="<?php echo $status_hadiah; ?>"><?php echo $status_hadiah; ?></option>
                                <?php
                                if ($status_hadiah == "Aktif") {
                                  echo '
                                      <option value="Tidak Aktif">Tidak Aktif</option>
                                    ';
                                } else {
                                  echo '
                                      <option value="Aktif">Aktif</option>
                                    ';
                                }
                                ?>
                              </select>
                              <label for="status_hadiah">Status Hadiah</label>
                            </div>
                          </div>
                          <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Batal</button>
                            <button type="submit" class="btn btn-primary">Ubah Data</button>
                          </div>
                        </form>
                      </div>
                    </div>
                  </div><!-- End Modal Dialog Scrollable-->
                  <div class="modal fade" id="hapus_<?php echo $id_hadiah; ?>" tabindex="-1">
                    <div class="modal-dialog modal-dialog-centered">
                      <div class="modal-content">
                        <div class="modal-header">
                          <h5 class="modal-title">Hapus Data</h5>
                          <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                        </div>
                        <div class="modal-body">
                          Yakin ingin menghapus hadiah <strong><?php echo $nama_hadiah; ?></strong> ?
                        </div>
                        <div class="modal-footer">
                          <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Batal</button>
                          <a href="prs_hapus_hadiah.php?id_hadiah=<?php echo $id_hadiah; ?>" class="btn btn-primary">Hapus
                            Data</a>
                        </div>
                      </div>
                    </div>
                  </div><!-- End Vertically centered Modal-->
                </td>
              </tr>
            <?php } ?>
          </tbody>
        </table>

      </div>

    </div>
  </section>

</main><!-- End #main -->