<?php
$ambil = $con->query("SELECT * FROM v_ganerate_voucher WHERE id = '$page[1]'");
  $data = $ambil->fetch_assoc();
$nama = $data['voucher'];

$_SESSION['pay'] = 'false';
?>
<nav class="navbar fixed-top">
    <div id="specificCard" class="card col-12" style="border-radius: 20px; background: none; border: none; margin-top: 10px;">
        <div class="row">
            <div class="col-6 icon-container">
                <a href="index.php" class="fa fa-arrow-left text-light"></a>
            </div>
            <div class="col-6 text-right">
                <h6 class="text-light mt-2 mb-2">Detail Voucher</h6>
            </div>
        </div>
    </div>
</nav>
<div class="card" style="border-radius: 0px; background: none; border: none; margin-top: 100px;">
  <div class="card-body">
  </div>
</div>
<div class="card" id="2" style="border-top-right-radius: 40px; border-top-left-radius: 40px; min-height: 800px; border: none; z-index: 1;">
  <div class="card-body">
    <center>
      <img src="images/tick.gif" width="35%">
      <?php if(!empty($data['active_time'])) { ?>
        <h5 class="text-danger">Voucher Sudah di Gunakan</h5>
      <?php } else { ?>
        <h4>Berhasil..!!</h4>
      <?php } ?>
    </center><hr>
    <div class="text-center">
      <h4><u>Kode Voucher</u></h4><br>
      <h1><b><?php echo $nama ?></b></h1>
    </div>
    <br>
    <table class="table table-block" style="zoom: 90%;">
        <tr>
            <td>Paket Voucher</td>
            <td class="text-right"><?php echo $data['nama_paket']; ?></td>
        </tr>
        <tr>
            <td>Tanggal Pembelian</td>
            <td class="text-right"><?php echo $data['create_time']; ?></td>
        </tr>
        <?php if(!empty($data['active_time'])) { ?>
        <tr>
            <td>Tanggal Aktif</td>
            <td class="text-right"><?php echo $data['active_time']; ?></td>
        </tr>
        <tr>
            <td>Tanggal Expired</td>
            <td class="text-right"><?php echo $data['expaired_time']; ?></td>
        </tr>
          <?php } ?>
        <tr>
            <td>Harga</td>
            <td class="text-right"><h3><b>Rp. <?php echo number_format($data['harga']);?></b></h3></td>
        </tr>
    </table>
    <div class="text-center">
    <a href="whatsapp://send?text=*Pembelian Voucher*%0A%0ATanggal : <?php echo $data['create_time']; ?>%0APaket Voucher : <?php echo $data['nama_paket']; ?>%0AKode Voucher : *<?php echo $nama; ?>*%0A%0AVoucher hanya bisa digunakan pada 1 perangkat / device" class="btn btn-success btn-md btn-block mb-4 mt-4" style="border-radius: 20px;">
      <i class="fab fa-whatsapp mr-2"></i>Kirim Whatsapp
    </a>
    <button onclick="initiatePrint()" class="btn btn-block btn-primary" style="border-radius: 20px;"><i class="fas fa-print mr-2"></i>Cetak Voucher</button>
<script>
let logMessages = [];
let currentIndex = 0;

function getPrintData() {
    return "[C]<u><?php echo $pcmem['nama_server']; ?></u>\n" +
           "[C]<?php echo $data['create_time']; ?>\n" +
           "[C]================================\n" +
           "[C]Kode Voucher\n" +
           "[C]<font size='big'><?php echo $nama; ?></font>\n" +
           "[C]================================\n" +
           "[L]Paket  :[R]<?php echo $data['nama_paket']; ?>\n" +
           "[L]HARGA  :[R]<?php echo number_format($data['harga']); ?>\n" +
           "[C]================================\n";
}

function initiatePrint() {
    const printData = getPrintData();

    // Call the Kotlin interface method
    if (typeof Android !== 'undefined' && Android.printToBluetooth) {
        Android.printToBluetooth(printData);

    } else {
        logMessage("Print Gagal..! Apk belum update");
    }
}

function updatePrintHistory() {
    const printDetails = {
        kodeVoucher: "<?php echo $nama; ?>",  // Ganti dengan data yang sesuai
        createTime: "<?php echo $data['create_time']; ?>"
    };

    fetch('list_data/log_cetak.php', {
    method: 'POST',
    headers: {
        'Content-Type': 'application/json'
    },
    body: JSON.stringify(printDetails)
    });

}

function logMessage(message) {
    logMessages.push(message); // Simpan log dalam array
    updateLog(); // Perbarui tampilan log
    showModal(); // Tampilkan modal
}

function updateLog() {
    const logArea = document.getElementById('log');
    const retryButtonContainer = document.getElementById('retryButtonContainer'); // Ambil elemen untuk tombol "Ulangi"
    currentIndex = 0; // Reset index
    logArea.innerHTML = ''; // Kosongkan area log
    retryButtonContainer.innerHTML = ''; // Kosongkan isi tombol "Ulangi"

    const interval = setInterval(() => {
        if (currentIndex < logMessages.length) {
            logArea.innerHTML = logMessages[currentIndex]; // Tampilkan log saat ini
            currentIndex++;
            if (logMessages[logMessages.length - 1] === "Pencetakan berhasil.") {
                // Setelah cetak berhasil, update riwayat cetak
                updatePrintHistory();
            }
        } else {
            clearInterval(interval); // Hentikan interval setelah semua log ditampilkan

            // Cek log terakhir
            if (logMessages[logMessages.length - 1] === "Tidak ada printer Bluetooth yang terhubung.") {
                retryButtonContainer.innerHTML = `<button onclick="initiatePrint()" class="btn btn-sm btn-primary">
                                                      <i class="fas fa-print mr-2"></i>Ulangi
                                                  </button>`;
            }
            
        }
    }, 1000); // Delay 1 detik
}

function showModal() {
    const myModal = new bootstrap.Modal(document.getElementById('myModal'));
    myModal.show();
}
</script>


    <!-- <a href="cetak.php?vcr2=<?php echo $nama; ?>" style="border-radius: 20px;" class="btn btn-secondary btn-lg btn-block mb-4 mt-4">
      <i class="fa fa-print mr-2"></i>Cetak
    </a> -->
  </div>
  </div>
</div>

<div class="modal fade" id="myModal" tabindex="-1" aria-labelledby="modalLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content">
            <div class="modal-header justify-content-center"> <!-- Pusatkan header -->
                <h5 class="modal-title" id="modalLabel">Proses Status</h5>
            </div>
            <div class="modal-body text-center"> <!-- Pusatkan body -->
                <div id="log" style="white-space: pre-wrap;"></div>
            </div>
            <div class="modal-footer justify-content-center"> <!-- Pusatkan footer -->
                <button type="button" class="btn btn-secondary btn-sm" data-dismiss="modal">Tutup</button>
                <div id="retryButtonContainer"></div>
            </div>
        </div>
    </div>
</div>

