WD - Dev
444 lines
18 KiB
PHP
444 lines
18 KiB
PHP
<?php
|
|
|
|
function getIntruksi($data) {
|
|
if (!$data) {
|
|
return "<p>Tidak ada instruksi</p>";
|
|
}
|
|
|
|
$data_get = json_decode($data, true);
|
|
$uniq_code = $data_get['data']['unique_code'] ?? '';
|
|
$expiredTime = $data_get['data']['expired'] ?? '';
|
|
// $expiredTime = date('Y-m-d 18:47:10');
|
|
$service = $data_get['data']['service'] ?? null;
|
|
|
|
if (!$service) {
|
|
return "<p>Data instruksi tidak valid</p>";
|
|
}
|
|
|
|
// 🔹 QRIS
|
|
if ($service == 11) {
|
|
$steps = "";
|
|
if (!empty($data_get['payment_guide'][0]['content'])) {
|
|
foreach ($data_get['payment_guide'][0]['content'] as $value) {
|
|
$steps .= "<li>" . htmlspecialchars($value) . "</li>";
|
|
}
|
|
}
|
|
|
|
return "
|
|
<div class='text-center'>
|
|
<h6><b>QRIS</b></h6>
|
|
<img src='{$data_get['data']['qrcode_url']}' width='300px' alt='QRIS'>
|
|
<p class='mt-2'>Silakan scan QRIS di atas untuk melakukan pembayaran.</p>
|
|
<p class='mt-2 text-secondary fw-bold' id='countDown'></p>
|
|
|
|
<a href='#' class='d-block mt-3 fw-bold text-primary' data-bs-toggle='collapse'
|
|
data-bs-target='#caraBayar' aria-expanded='false'>
|
|
Cara Pembayaran
|
|
</a>
|
|
</div>
|
|
|
|
<div class='collapse mt-2' id='caraBayar'>
|
|
<p><strong>{$data_get['payment_guide'][0]['title']}</strong></p>
|
|
<ol>{$steps}</ol>
|
|
</div>
|
|
|
|
<button class='btn btn-orange w-100' onclick='status()'>Cek Pembayaran</button>
|
|
|
|
<script>
|
|
// Countdown Timer
|
|
(function() {
|
|
var expiredTime = new Date('{$expiredTime}').getTime();
|
|
var countdownEl = document.getElementById('countDown');
|
|
|
|
var timer = setInterval(function() {
|
|
var now = new Date().getTime();
|
|
var distance = expiredTime - now;
|
|
|
|
if (distance <= 0) {
|
|
clearInterval(timer);
|
|
countdownEl.innerText = 'Waktu pembayaran sudah habis';
|
|
status();
|
|
setTimeout(function() {
|
|
window.location.reload();
|
|
}, 2000); // 2000ms = 2 detik
|
|
return;
|
|
}
|
|
|
|
var h = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000*60*60));
|
|
var m = Math.floor((distance % (1000 * 60 * 60)) / (1000*60));
|
|
var s = Math.floor((distance % (1000 * 60)) / 1000);
|
|
|
|
countdownEl.innerText = m + ' menit ' + s + ' detik';
|
|
}, 1000);
|
|
})();
|
|
|
|
function status() {
|
|
let btn = document.querySelector('.btn.btn-orange.w-100');
|
|
btn.disabled = true;
|
|
btn.innerText = 'Memproses...';
|
|
|
|
fetch('/proses.php', {
|
|
method: 'POST',
|
|
headers: {'Content-Type': 'application/x-www-form-urlencoded'},
|
|
body: 'action=status&idTagihan=' + encodeURIComponent('{$uniq_code}')
|
|
})
|
|
.then(res => res.json())
|
|
.then(data => {
|
|
btn.disabled = false;
|
|
btn.innerText = 'Cek Pembayaran';
|
|
if(data.success){
|
|
window.location.reload();
|
|
}
|
|
})
|
|
.catch(err => {
|
|
btn.disabled = false;
|
|
btn.innerText = 'Cek Pembayaran';
|
|
console.error(err);
|
|
alert('Terjadi error saat menghubungi server.');
|
|
});
|
|
}
|
|
</script>
|
|
";
|
|
}
|
|
|
|
// 🔹 Virtual Account
|
|
$bankLogos = [
|
|
2 => "bri.png",
|
|
4 => "bni.png",
|
|
5 => "mandiri.png",
|
|
];
|
|
$img = $bankLogos[$service] ?? "";
|
|
$va = htmlspecialchars($data_get['data']['virtual_account'] ?? '');
|
|
|
|
$steps = "";
|
|
if (!empty($data_get['payment_guide'])) {
|
|
foreach ($data_get['payment_guide'] as $title) {
|
|
$steps .= "<p><strong>" . htmlspecialchars($title['title']) . "</strong></p><ol>";
|
|
foreach ($title['content'] as $value) {
|
|
$steps .= "<li>" . htmlspecialchars($value) . "</li>";
|
|
}
|
|
$steps .= "</ol>";
|
|
}
|
|
}
|
|
|
|
return "
|
|
<div class='text-center'>
|
|
<h6><b>Nomor Virtual Account</b></h6>
|
|
<div class='card p-3' style='border-radius:15px; width:100%'>
|
|
<div class='d-flex justify-content-between align-items-center'>
|
|
<div class='d-flex align-items-center gap-2'>
|
|
<span class='bank-icon-box'>
|
|
<img src='https://manjapro.net/dist/img/{$img}' alt='Bank Logo' width='30'>
|
|
</span>
|
|
<span id='vaNumber' class='fw-bold fs-5 ml-4'>{$va}</span>
|
|
</div>
|
|
<button id='copyBtn' class='btn btn-md p-1 text-secondary' onclick='copyVA()'>
|
|
<i id='iconCopy' class='fa fa-copy'></i>
|
|
<i id='iconCheck' class='fa fa-check d-none'></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<p class='mt-3'>Silakan gunakan Virtual Account untuk melakukan pembayaran.</p>
|
|
<p class='mt-2 text-secondary fw-bold' id='countDown'></p>
|
|
|
|
<a href='#' class='d-block mt-3 fw-bold text-primary' data-bs-toggle='collapse'
|
|
data-bs-target='#caraBayar' aria-expanded='false'>
|
|
Cara Pembayaran
|
|
</a>
|
|
</div>
|
|
|
|
<div class='collapse mt-2 text-start' id='caraBayar'>
|
|
{$steps}
|
|
</div>
|
|
|
|
<button class='btn btn-orange w-100' onclick='status()'>Cek Pembayaran</button>
|
|
|
|
<script>
|
|
// Copy VA
|
|
function copyVA() {
|
|
var va = document.getElementById('vaNumber').innerText;
|
|
navigator.clipboard.writeText(va).then(function() {
|
|
document.getElementById('iconCopy').classList.add('d-none');
|
|
document.getElementById('iconCheck').classList.remove('d-none');
|
|
setTimeout(function() {
|
|
document.getElementById('iconCheck').classList.add('d-none');
|
|
document.getElementById('iconCopy').classList.remove('d-none');
|
|
}, 2000);
|
|
}).catch(function(err) {
|
|
console.error('Gagal menyalin: ', err);
|
|
alert('Gagal menyalin Virtual Account.');
|
|
});
|
|
}
|
|
|
|
// Countdown Timer
|
|
(function() {
|
|
var expiredTime = new Date('{$expiredTime}').getTime();
|
|
var countdownEl = document.getElementById('countDown');
|
|
|
|
var timer = setInterval(function() {
|
|
var now = new Date().getTime();
|
|
var distance = expiredTime - now;
|
|
|
|
if (distance <= 0) {
|
|
clearInterval(timer);
|
|
countdownEl.innerText = 'Waktu pembayaran sudah habis';
|
|
status();
|
|
setTimeout(function() {
|
|
window.location.reload();
|
|
}, 2000); // 2000ms = 2 detik
|
|
return;
|
|
}
|
|
|
|
var h = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000*60*60));
|
|
var m = Math.floor((distance % (1000 * 60 * 60)) / (1000*60));
|
|
var s = Math.floor((distance % (1000 * 60)) / 1000);
|
|
|
|
countdownEl.innerText = m + ' menit ' + s + ' detik';
|
|
}, 1000);
|
|
})();
|
|
|
|
function status() {
|
|
let btn = document.querySelector('.btn.btn-orange.w-100');
|
|
btn.disabled = true;
|
|
btn.innerText = 'Memproses...';
|
|
|
|
fetch('/proses.php', {
|
|
method: 'POST',
|
|
headers: {'Content-Type': 'application/x-www-form-urlencoded'},
|
|
body: 'action=status&idTagihan=' + encodeURIComponent('{$uniq_code}')
|
|
})
|
|
.then(res => res.json())
|
|
.then(data => {
|
|
btn.disabled = false;
|
|
btn.innerText = 'Cek Pembayaran';
|
|
})
|
|
.catch(err => {
|
|
btn.disabled = false;
|
|
btn.innerText = 'Cek Pembayaran';
|
|
console.error(err);
|
|
alert('Terjadi error saat menghubungi server.');
|
|
});
|
|
}
|
|
</script>
|
|
";
|
|
}
|
|
|
|
|
|
function getListPembayaran($idTagihan) {
|
|
return '
|
|
<!-- Pilihan Metode -->
|
|
<div id="pilihanMetode">
|
|
<h6 class="mb-3">Metode Pembayaran</h6>
|
|
|
|
<div class="accordion" id="accordionMetode">
|
|
<!-- Virtual Account -->
|
|
<div class="accordion-item">
|
|
<h2 class="accordion-header" id="headingVA">
|
|
<a class="accordion-button collapsed" type="button"
|
|
data-bs-toggle="collapse" data-bs-target="#collapseVA"
|
|
aria-expanded="false" aria-controls="collapseVA">
|
|
<span class="accordion-left">
|
|
<span class="fw-semibold">Virtual Account</span>
|
|
<span class="accordion-icons">
|
|
<span class="bank-icon-box"><img src="https://manjapro.net/dist/img/bri.png" alt="BRI"></span>
|
|
<span class="bank-icon-box"><img src="https://manjapro.net/dist/img/bni.png" alt="BNI"></span>
|
|
<span class="bank-icon-box"><img src="https://manjapro.net/dist/img/mandiri.png" alt="Mandiri"></span>
|
|
</span>
|
|
</span>
|
|
</a>
|
|
</h2>
|
|
<div id="collapseVA" class="accordion-collapse collapse"
|
|
aria-labelledby="headingVA" data-bs-parent="#accordionMetode">
|
|
<div class="accordion-body p-0">
|
|
<ul class="list-group list-group-flush bank-list">
|
|
<li class="list-group-item">
|
|
<a class="list-btn pay-method" onclick="pilihMetode(\'Virtual Account\', \'BRI\', \'https://manjapro.net/dist/img/bri.png\')">
|
|
<div class="bank-logo-box"><img src="https://manjapro.net/dist/img/bri.png" alt="BRI"></div>
|
|
<span class="bank-name">BRI VA</span>
|
|
</a>
|
|
</li>
|
|
<li class="list-group-item">
|
|
<a class="list-btn pay-method" onclick="pilihMetode(\'Virtual Account\', \'BNI\', \'https://manjapro.net/dist/img/bni.png\')">
|
|
<div class="bank-logo-box"><img src="https://manjapro.net/dist/img/bni.png" alt="BNI"></div>
|
|
<span class="bank-name">BNI VA</span>
|
|
</a>
|
|
</li>
|
|
<li class="list-group-item">
|
|
<a class="list-btn pay-method" onclick="pilihMetode(\'Virtual Account\', \'Mandiri\', \'https://manjapro.net/dist/img/mandiri.png\')">
|
|
<div class="bank-logo-box"><img src="https://manjapro.net/dist/img/mandiri.png" alt="Mandiri"></div>
|
|
<span class="bank-name">Mandiri VA</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- E-Wallet & QRIS -->
|
|
<div class="accordion-item">
|
|
<h2 class="accordion-header" id="headingQRIS">
|
|
<a class="accordion-button collapsed" type="button"
|
|
data-bs-toggle="collapse" data-bs-target="#collapseQRIS"
|
|
aria-expanded="false" aria-controls="collapseQRIS">
|
|
<span class="accordion-left">
|
|
<span class="fw-semibold">E-Wallet & QRIS</span>
|
|
<span class="accordion-icons">
|
|
<span class="bank-icon-box"><img src="https://manjapro.net/dist/img/qris.png" alt="QRIS"></span>
|
|
</span>
|
|
</span>
|
|
</a>
|
|
</h2>
|
|
<div id="collapseQRIS" class="accordion-collapse collapse"
|
|
aria-labelledby="headingQRIS" data-bs-parent="#accordionMetode">
|
|
<div class="accordion-body p-0">
|
|
<ul class="list-group list-group-flush bank-list">
|
|
<li class="list-group-item">
|
|
<a class="list-btn pay-method" onclick="pilihMetode(\'E-Wallet & QRIS\', \'QRIS\', \'https://manjapro.net/dist/img/qris.png\')">
|
|
<div class="bank-logo-box"><img src="https://manjapro.net/dist/img/qris.png" alt="QRIS"></div>
|
|
<span class="bank-name">QRIS</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="metodeTerpilih" class="d-none">
|
|
<div class="method-card method-selected">
|
|
<div class="bank-logo-box" style="margin-top: 0px;">
|
|
<img src="https://manjapro.net/dist/img/qris.png" id="metodeLogo">
|
|
</div>
|
|
<span class="bank-name" id="metodeText"></span>
|
|
<button type="button" class="btn btn-sm ubah-btn" onclick="ubahMetode()" style="font-size: 105%; color: #ff7f11;"><strong>Ubah</strong></button>
|
|
</div>
|
|
</div>
|
|
|
|
<button id="btnBayar" class="btn btn-orange w-100 d-none" onclick="bayar()">Bayar</button>
|
|
|
|
<script>
|
|
let metodeDipilih = "";
|
|
let metodeService = "";
|
|
let imgMetode = "";
|
|
const idTagihan = '.$idTagihan.';
|
|
|
|
function pilihMetode(metode, service, logo){
|
|
metodeDipilih = metode;
|
|
metodeService = service;
|
|
imgMetode = logo;
|
|
|
|
document.getElementById("pilihanMetode").classList.add("d-none");
|
|
document.getElementById("metodeTerpilih").classList.remove("d-none");
|
|
document.getElementById("metodeText").innerHTML = metode + "<br>" + service;
|
|
document.getElementById("metodeLogo").src = logo;
|
|
document.getElementById("btnBayar").classList.remove("d-none");
|
|
|
|
document.querySelectorAll(".accordion-button").forEach(el => el.classList.remove("selected-icon"));
|
|
let opened = document.querySelector(".accordion-button[aria-expanded=\'true\']");
|
|
if(opened) opened.classList.add("selected-icon");
|
|
}
|
|
|
|
function ubahMetode(){
|
|
metodeDipilih = "";
|
|
metodeService = "";
|
|
document.getElementById("pilihanMetode").classList.remove("d-none");
|
|
document.getElementById("metodeTerpilih").classList.add("d-none");
|
|
document.getElementById("btnBayar").classList.add("d-none");
|
|
document.querySelectorAll(".accordion-button").forEach(el => el.classList.remove("selected-icon"));
|
|
}
|
|
|
|
function bayar(){
|
|
if(metodeDipilih !== ""){
|
|
let btn = document.getElementById("btnBayar");
|
|
btn.disabled = true;
|
|
btn.innerText = "Memproses...";
|
|
|
|
fetch("/proses.php", {
|
|
method: "POST",
|
|
headers: {"Content-Type": "application/x-www-form-urlencoded"},
|
|
body: "action=bayar"
|
|
+ "&paymentMethod=" + encodeURIComponent(metodeService)
|
|
+ "&idTagihan=" + encodeURIComponent(idTagihan)
|
|
})
|
|
.then(res => res.json())
|
|
.then(data => {
|
|
btn.disabled = false;
|
|
btn.innerText = "Bayar Sekarang";
|
|
if(data.success){
|
|
window.location.reload();
|
|
} else {
|
|
alert("Gagal: " + (data.message || "Terjadi kesalahan"));
|
|
}
|
|
})
|
|
.catch(err => {
|
|
btn.disabled = false;
|
|
btn.innerText = "Bayar Sekarang";
|
|
console.error(err);
|
|
alert("Terjadi error saat menghubungi server.");
|
|
});
|
|
|
|
} else {
|
|
alert("Silakan pilih metode pembayaran terlebih dahulu!");
|
|
}
|
|
}
|
|
</script>
|
|
';
|
|
}
|
|
|
|
function getStatus($pelanggan) {
|
|
return '
|
|
<div id="statusBerhasil">
|
|
<div class="card-body mb-4 text-center">
|
|
<h5><b>Transaksi Berhasil</b></h5>
|
|
<p>' . htmlspecialchars($pelanggan['tgl_lunas']) . '</p>
|
|
<img src="https://i.pinimg.com/originals/89/86/fe/8986fef7a58272135c7c5d006a312554.gif" width="120px" alt="Success">
|
|
</div>
|
|
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<div class="detail-row">
|
|
<span class="label">Id Transaksi</span>
|
|
<span class="value">' . htmlspecialchars('#PGPDN' . $pelanggan['order_id']) . '</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card-body">
|
|
<div class="detail-row">
|
|
<span class="label">Customer</span>
|
|
<span class="value">' . htmlspecialchars($pelanggan['nama']) . '</span>
|
|
</div>
|
|
<div class="detail-row">
|
|
<span class="label">Metode</span>
|
|
<span class="value">' . htmlspecialchars($pelanggan['metode']) . '</span>
|
|
</div>
|
|
|
|
<hr>
|
|
|
|
<div class="detail-row">
|
|
<span class="label">Order</span>
|
|
<span class="value">' . htmlspecialchars($pelanggan['keterangan']) . '</span>
|
|
</div>
|
|
<div class="detail-row">
|
|
<span class="label">Subtotal</span>
|
|
<span class="value">Rp ' . number_format($pelanggan['subtotal'], 0, ',', '.') . '</span>
|
|
</div>
|
|
<div class="detail-row">
|
|
<span class="label">Service fee</span>
|
|
<span class="value">Rp ' . number_format($pelanggan['servicefee'], 0, ',', '.') . '</span>
|
|
</div>
|
|
|
|
<hr>
|
|
|
|
<div class="detail-row">
|
|
<span class="label">Total</span>
|
|
<span class="value">
|
|
<h5><b>Rp ' . number_format($pelanggan['total'], 0, ',', '.') . '</b></h5>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>';
|
|
}
|