@extends('layouts.app')
@section('content')
    <div class="container">
		        <section class="withdraw">
		    <header class="page-header">
		        <i class="icon-withdraw icon--lg"></i>
		        <h3>Withdraw</h3>
		    </header>
		    <nav class="side-nav">
		        <ul>
		            <li class="side-nav__item side-nav__item--active">
		                <a href="/withdraw/bank-transfer">
		                    <i class="icon-bank-transfer icon--md"></i>
		                    <span>Bank Transfer</span>
		                </a>
		            </li>
		        </ul>
		    </nav>
		    <div class="withdraw-content">
                @if($pending && $pending->status === 'pending')
                    <div class="deposit-pending">
                    <div class="alert alert--success alert--icon-top">
                        <i class="icon-info icon--lg"></i>
                
                        <div class="alert__content">
                            <h4>Withdraw Pending</h4>
                
                            <p style="text-align:center;">
                                Permintaan withdraw anda sudah kami terima dan sedang diproses.
                            </p>
                
                            <ul class="deposit-detail">
                                <li>
                                    <span>Nama Bank / E-Wallet</span>
                                    <p>{{ $pending->bank ?? '-' }}</p>
                                </li>
                
                                <li>
                                    <span>Nama Rekening</span>
                                    <p>{{ $pending->account_name ?? '-' }}</p>
                                </li>
                
                                <li>
                                    <span>Nomor Rekening</span>
                                    <p>{{ $pending->account_number ?? '-' }}</p>
                                </li>
                
                                <li>
                                    <span>Jumlah Withdraw</span>
                                    <p>Rp {{ number_format($pending->amount, 0, ',', '.') }}</p>
                                </li>
                
                                <li>
                                    <span>Status</span>
                                    <p>{{ strtoupper($pending->status ?? 'PENDING') }}</p>
                                </li>
                
                                <li>
                                    <span>Tanggal</span>
                                    <p>{{ optional($pending->created_at)->format('d-m-Y H:i') }}</p>
                                </li>
                            </ul>
                
                            <p style="text-align:center;">
                                Jika withdraw anda belum diproses dalam beberapa waktu,
                                silakan hubungi livechat untuk bantuan lebih lanjut.
                            </p>
                        </div>
                    </div>
                </div>
                @elseif(!$isAllowedWithdraw)
                    <div class="alert alert--warning">
                        <i class="icon-exclamation-triangle icon--lg"></i>
                        <p>Saldo anda lebih rendah dari jumlah minimum penarikan.</p>
                    </div>
            
                @elseif(!($menu['withdraw_enabled'] ?? false))
                    <div class="alert alert--warning">
                        <i class="icon-exclamation-triangle icon--lg"></i>
                        <p>Withdraw Anda Telah Dinonaktifkan Harap Hubungi Livechat.</p>
                    </div>
            
                @else
                    <form method="POST" action="{{ route('withdraw.bank.submit') }}">
                        @csrf
            
                        <div class="input__container">
                            <label>Jumlah</label>
                            <div class="input__root">
                                <input type="number" name="amount" class="input" required>
                                <i class="input__icon icon-coins icon--xs"></i>
                            </div>
                        </div>
            
                        <div class="preset-amounts">
                            <div class="preset-amounts__label">
                                <span>Pilih nominal</span>
                            </div>
            
                            <div class="preset-amounts__body">
                                @foreach([25000, 50000, 100000, 1000000] as $nominal)
                                    <div class="preset-amounts__item">
                                        <label role="button" for="wd{{ $nominal }}" class="btn btn--flex btn--light">
                                            Rp {{ number_format($nominal, 0, ',', '.') }}
                                        </label>
                                        <input id="wd{{ $nominal }}" name="withdraw-amounts" type="radio" class="preset-amounts__input" value="{{ $nominal }}">
                                    </div>
                                @endforeach
                            </div>
                        </div>
            
                        <div class="wallet-detail wallet-detail__deposit-to">
                            <div class="wallet-detail__label">
                                <span>Saldo anda akan ditransfer ke dalam akun ini</span>
                            </div>
            
                            @php
                                $paymentName = ($bank?->payment_method ?? null) === 'bank'
                                    ? ($bank->bank ?? '-')
                                    : ($bank->emoney ?? '-');
            
                                $rekening = strtoupper($bank->nomor_rekening ?? '');
                                $panjang = strlen($rekening);
            
                                $maskedRekening = $panjang > 4
                                    ? str_repeat('*', $panjang - 4) . substr($rekening, -4)
                                    : $rekening;
                            @endphp
            
                            <div class="wallet-detail__body">
                                <div class="wallet-detail__labels">
                                    <label>{{ ($bank?->payment_method ?? null) === 'bank' ? 'Nama Bank' : 'E-Wallet' }}</label>
                                    <label>Nama Rekening</label>
                                    <label>{{ ($bank?->payment_method ?? null) === 'bank' ? 'Nomor Rekening' : 'Nomor Akun' }}</label>
                                </div>
            
                                <div class="wallet-detail__values">
                                    <span>{{ strtoupper($paymentName) }}</span>
                                    <span>{{ strtoupper($bank->nama_rekening ?? '-') }}</span>
                                    <span>{{ $maskedRekening ?: '-' }}</span>
                                </div>
                            </div>
                        </div>
            
                        <button type="submit" name="withdraw" class="btn btn--block btn--brand">
                            <span>Kirim</span>
                        </button>
                    </form>
                @endif
            </div>
		</section>
    </div>
<script>
document.addEventListener('DOMContentLoaded', function () {

    const amountInput = document.querySelector('input[name="amount"]');
    const presets = document.querySelectorAll('.preset-amounts__input');

    if (!amountInput || !presets.length) return;

    presets.forEach(radio => {
        radio.addEventListener('change', function () {

            amountInput.value = this.value;

            amountInput.dispatchEvent(new Event('input', { bubbles: true }));
            amountInput.dispatchEvent(new Event('blur', { bubbles: true }));

        });
    });

});
</script>
@endsection