FileMaster

Edit File: gambar.php

<?php
include('config.php');
$aktif = "productlist";
function slugify($text) {
    // Hapus karakter non huruf/angka
    $text = preg_replace('~[^\pL\d]+~u', '-', $text);
    $text = iconv('utf-8', 'us-ascii//TRANSLIT', $text);
    $text = preg_replace('~[^-\w]+~', '', $text);
    $text = trim($text, '-');
    $text = preg_replace('~-+~', '-', $text);
    $text = strtolower($text);

return empty($text) ? 'produk' : $text;
}

if (!isset($_GET['id'])) {
    echo "ID sesi produk tidak ditemukan.";
    exit;
}

$sesi_produk = $_GET['id'];

$stmt = $pdo->prepare("SELECT * FROM gambar WHERE sesi_produk = ?");
$stmt->execute([$sesi_produk]);
$gambarList = $stmt->fetchAll(PDO::FETCH_ASSOC);
?>
<!doctype html>
<html lang="en">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Daftar Produk</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.18/summernote.min.css" rel="stylesheet">

<div class="row">
              <div class="col-sm-6"><h3 class="mb-0">Daftar Gambar</h3></div>
              <div class="col-sm-6">
                <ol class="breadcrumb float-sm-end">
                  <li class="breadcrumb-item"><a href="daftar-produk">Daftar Produk</a></li>
                  <li class="breadcrumb-item active" aria-current="page">Daftar Gambar</li>
                </ol>
              </div>

</div>
          </div>
        </div>
        <div class="app-content">
          <div class="container-fluid">
            <div class="row">
            <?php
            if (isset($_POST['set_cover'])) {
    $id_cover = $_POST['set_cover'];
    $sesi_produk = $_GET['id'];

// Reset semua gambar menjadi bukan cover
    $pdo->prepare("UPDATE gambar SET set_cover = '0' WHERE sesi_produk = :sesi_produk")
        ->execute(['sesi_produk' => $sesi_produk]);

// Set cover untuk gambar yang dipilih
    $pdo->prepare("UPDATE gambar SET set_cover = '1' WHERE id_picture = :id")
        ->execute(['id' => $id_cover]);

echo "<div class='alert alert-success'>File berhasil dijadikan cover.</div>";
}

if (isset($_POST['gambar'])) {
 $gambar = $_POST['gambar'];
    $path = __DIR__ . "/uploads/" . $gambar;

if (file_exists($path)) {
        if (unlink($path)) {
        echo "<div class='alert alert-success'>File berhasil dihapus.</div>";
        } else {
        echo "<div class='alert alert-danger'>Gagal menghapus file meskipun ada</div>";
        }
    } else {
        echo "<div class='alert alert-danger'>File tidak ditemukan: " . $path ."</div>";
    }

// (Opsional) hapus dari database
    $stmt = $pdo->prepare("DELETE FROM gambar WHERE nama_gambar = ?");
    $stmt->execute([$gambar]);  
   ?>
<center>
  <a href="?id=<?php echo $sesi_produk; ?>" class="btn btn-info">Daftar Gambar</a>
<a href="daftar-produk" class="btn btn-success">Daftar Produk</a>

</center>
   <?php
} else {
            ?>
      
              <div class="col-12 col-sm-12 col-md-12">
          <table id="tabelProduk" class="table table-bordered table-striped">
     <thead class="table-light">
        <tr>
            <th>#</th>
            <th>Gambar</th>
            <th>Nama File</th>
            <th>Sesi Gambar</th>
            <th>Aksi</th>
        </tr>
    </thead>
    <tbody>
        <?php if (count($gambarList) > 0): ?>
            <?php $no = 1; foreach ($gambarList as $gambar): ?>
                <tr>
                    <td><?= $no++ ?></td>
                    <td>
                        <img src="<?= htmlspecialchars($gambar['url_gambar']) ?>" alt="gambar" width="100">
                    </td>
                    <td><?= htmlspecialchars($gambar['nama_gambar']) ?></td>
                    <td><?= htmlspecialchars($gambar['sesi_gambar']) ?></td>
                    <td>
                        <?php if ($gambar['set_cover'] == '1'): ?>
                        <span class="badge bg-success">Cover</span>
                    <?php else: ?>
                        <form method="post" style="display:inline-block">
                            <input type="hidden" name="set_cover" value="<?= $gambar['id_picture'] ?>">
                            <button class="btn btn-primary btn-sm">Set Cover</button>
                        </form>
                    <?php endif; ?>
                        <form method="post" action="?id=<?= $sesi_produk ?>" onsubmit="return confirm('Yakin hapus?')">
                            <input type="hidden" name="gambar" value="<?= htmlspecialchars($gambar['nama_gambar']) ?>">
                            <button type="submit" class="btn btn-danger btn-sm">
                                <i class="fa fa-trash"></i> Hapus
                            </button>
                        </form>
                    </td>
                </tr>
            <?php endforeach; ?>
        <?php else: ?>
      
        <?php endif; ?>
    </tbody>
    </table>
<?php } ?>

<div class="modal fade" id="modalUploadGambar" tabindex="-1" aria-labelledby="judulModal" aria-hidden="true">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <form action="upload_gambar.php" class="dropzone" id="formDropzone">
        <input type="hidden" name="sesi_produk" id="sesi_produk">
        <div class="modal-header">
          <h5 class="modal-title">Upload Gambar Produk</h5>
          <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Tutup"></button>
        </div>
        <div class="modal-body">
          <div class="dz-message">Drop gambar di sini atau klik untuk mengunggah</div>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Tutup</button>
        </div>
      </form>
    </div>
  </div>
</div>
              </div>

</div>

</div>
        </div>
      </main>
      <?php include('footer.php'); ?>
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<script src="https://cdn.datatables.net/1.13.6/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.13.6/js/dataTables.bootstrap5.min.js"></script>
<script>
  $(document).ready(function () {
    $('#tabelProduk').DataTable({
      responsive: true,
      autoWidth: false,
      lengthChange: true,
      pageLength: 10,
      language: {
        url: '//cdn.datatables.net/plug-ins/1.13.6/i18n/id.json'
      }
    });
  });
</script>
<script>
  $(document).ready(function () {
    $('.btn-hapus').on('click', function () {
      const id = $(this).data('id');
      const row = $(this).closest('tr');

if (confirm('Yakin ingin menghapus data ini?')) {
        $.ajax({
          url: 'hapus_produk.php',
          method: 'POST',
          data: { id: id },
          success: function (res) {
            if (res === 'sukses') {
              row.fadeOut(300, function () {
                $(this).remove();
              });
            } else {
              alert('Gagal menghapus data!');
            }
          },
          error: function () {
            alert('Terjadi kesalahan saat menghapus.');
          }
        });
      }
    });
  });
</script>

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.9.3/min/dropzone.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.9.3/min/dropzone.min.js"></script>

Dropzone.autoDiscover = false;

var myDropzone = new Dropzone("#formDropzone", {
  url: "upload_gambar.php",
  paramName: "file",
  maxFilesize: 3, 
  acceptedFiles: "image/*",
  addRemoveLinks: true,

success: function(file, response) {
    // Simpan nama file yang berhasil diupload
    file.uploadedName = response.trim(); // Pastikan response dari server adalah nama file
  },

removedfile: function(file) {
    var fileName = file.uploadedName || file.name; // fallback jika tidak ada uploadedName
    if (!fileName) return;

// Hapus file dari server lewat AJAX
    $.ajax({
      url: 'hapus_gambar.php',
      type: 'POST',
      data: { gambar: fileName },
      success: function(file, response) {
  file.uploadedName = response.trim(); // Ini akan jadi "foto123.jpg"
},

success: function(response) {
        console.log("Gambar dihapus:", response);
      },
      error: function() {
        console.log("Gagal menghapus di server");
      }
    });

// Hapus preview thumbnail dari Dropzone
    var previewElement = file.previewElement;
    if (previewElement != null) {
      previewElement.parentNode.removeChild(previewElement);
    }
  }
});

</script>

</html>

Back