


<div class="receipt-wrapper" id="receipt-to-capture">

    
    <div class="receipt-header">
        <div class="receipt-icon-success">
            
            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" class="w-6 h-6">
                <path stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5" />
            </svg>
        </div>
        <h4>Pembayaran Berhasil</h4>
        <h2>IDR <?php echo e(number_format($invoice->total_amount, 0, ',', '.')); ?></h2>
    </div>

    
    <div class="receipt-body">
        <div class="receipt-detail-list">
            <div class="receipt-detail-item">
                <span>Pembayaran ke</span>
                <strong>PAMSIMAS <?php echo e($invoice->user->profile->village ?? 'Desa Anda'); ?></strong>
            </div>
            <div class="receipt-detail-item">
                <span>Jenis Transaksi</span>
                <strong><?php echo e(Str::title(str_replace('_', ' ', $invoice->payment_method ?? 'N/A'))); ?></strong>
            </div>
            
            <?php if($invoice->payment_code): ?>
            <div class="receipt-detail-item">
                <span>Nomor Bayar / VA</span>
                <strong><?php echo e($invoice->payment_code); ?></strong>
            </div>
            <?php endif; ?>

            <div class="receipt-detail-item">
                <span>Dibayar pada</span>
                <strong><?php echo e($invoice->paid_at->translatedFormat('d M Y, H:i')); ?> WIB</strong>
            </div>
            <div class="receipt-detail-item">
                <span>Transaction ID</span>
                <strong style="word-break: break-all;"><?php echo e($invoice->transaction_id ?? 'N/A'); ?></strong>
            </div>
        </div>
    </div>
</div> 



<div class="receipt-footer">
    <button class="receipt-btn-icon" id="share-button">
        <i class="fas fa-share-alt"></i>
    </button>
    <button class="receipt-btn-icon" id="download-button">
        <i class="fas fa-download"></i>
    </button>
    <a href="<?php echo e(route('invoices.index')); ?>" class="receipt-btn-primary">
        Selesai
    </a>
</div>


<?php $__env->startPush('scripts'); ?>
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>

<script>
    const shareButton = document.getElementById('share-button');
    if (shareButton) {
        shareButton.addEventListener('click', async () => {
            if (navigator.share) {
                try {
                    await navigator.share({
                        title: 'Bukti Pembayaran PAMSIMAS',
                        text: 'Pembayaran tagihan PAMSIMAS sebesar Rp <?php echo e(number_format($invoice->total_amount, 0, ',', '.')); ?> telah berhasil.',
                        url: window.location.href
                    });
                } catch (err) {
                    console.error('Gagal membagikan:', err);
                }
            } else {
                alert('Fitur bagikan tidak didukung di browser ini.');
            }
        });
    }

    const downloadButton = document.getElementById('download-button');
    if (downloadButton) {
        downloadButton.addEventListener('click', () => {
            // Target elemen yang mau "difoto"
            const receiptElement = document.getElementById('receipt-to-capture');

            downloadButton.innerHTML = '<i class="fas fa-spinner fa-spin"></i>';
            downloadButton.disabled = true;

            html2canvas(receiptElement, { 
                scale: 2, 
                useCORS: true,
                // Pastikan latar belakang putih saat di-capture
                backgroundColor: '#ffffff', 
                // Abaikan scrollbar jika ada
                scrollY: -window.scrollY
            }).then(canvas => {
                const link = document.createElement('a');
                link.href = canvas.toDataURL('image/png');
                link.download = 'resi-pamsimas-<?php echo e(Str::slug($invoice->invoice_number)); ?>.png';

                document.body.appendChild(link);
                link.click();
                document.body.removeChild(link);

                downloadButton.innerHTML = '<i class="fas fa-download"></i>';
                downloadButton.disabled = false;

            }).catch(err => {
                console.error('Gagal membuat gambar:', err);
                alert('Maaf, gagal mengunduh gambar.');
                downloadButton.innerHTML = '<i class="fas fa-download"></i>';
                downloadButton.disabled = false;
            });
        });
    }
</script>
<?php $__env->stopPush(); ?><?php /**PATH C:\Users\UsEr\Documents\0 Mata Kuliah\Tugas Akhir\Project Pamsimas\PAMSIMAS_User\resources\views/invoices/_receipt_view.blade.php ENDPATH**/ ?>