@extends('layouts.main')

@section('content')
<div class="pagetitle">
    <h1>Detail Withdraw #{{ $withdrawRequest->id }}</h1>
    <nav>
        <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="{{ url('/admin/dashboard') }}">Home</a></li>
            <li class="breadcrumb-item"><a href="{{ route('admin.withdraw.index') }}">Withdraw</a></li>
            <li class="breadcrumb-item active">Detail #{{ $withdrawRequest->id }}</li>
        </ol>
    </nav>
</div>

<section class="section">

    <div class="row">
        <!-- Withdraw Details -->
        <div class="col-lg-8">
            <div class="card mb-4">
                <div class="card-header">
                    <i class="fas fa-info-circle me-1"></i>
                    Informasi Withdraw
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-md-6">
                            <table class="table table-borderless">
                                <tr>
                                    <td><strong>ID Withdraw:</strong></td>
                                    <td>#{{ $withdrawRequest->id }}</td>
                                </tr>
                                <tr>
                                    <td><strong>Jumlah:</strong></td>
                                    <td class="text-success"><h5>{{ $withdrawRequest->formatted_amount }}</h5></td>
                                </tr>
                                <tr>
                                    <td><strong>Status:</strong></td>
                                    <td>
                                        @if($withdrawRequest->status == 'pending')
                                            <span class="badge bg-secondary fs-6">{{ $withdrawRequest->status_label }}</span>
                                        @elseif($withdrawRequest->status == 'processing')
                                            <span class="badge bg-warning fs-6">{{ $withdrawRequest->status_label }}</span>
                                        @elseif($withdrawRequest->status == 'completed')
                                            <span class="badge bg-success fs-6">{{ $withdrawRequest->status_label }}</span>
                                        @else
                                            <span class="badge bg-danger fs-6">{{ $withdrawRequest->status_label }}</span>
                                        @endif
                                    </td>
                                </tr>
                                <tr>
                                    <td><strong>Tanggal Request:</strong></td>
                                    <td>{{ $withdrawRequest->created_at->format('d F Y, H:i') }} WIB</td>
                                </tr>
                                @if($withdrawRequest->processed_at)
                                <tr>
                                    <td><strong>Tanggal Diproses:</strong></td>
                                    <td>{{ $withdrawRequest->processed_at->format('d F Y, H:i') }} WIB</td>
                                </tr>
                                @endif
                            </table>
                        </div>
                        <div class="col-md-6">
                            <table class="table table-borderless">
                                <tr>
                                    <td><strong>User:</strong></td>
                                    <td>
                                        {{ $withdrawRequest->user->name }}<br>
                                        <small class="text-muted">{{ $withdrawRequest->user->email }}</small><br>
                                        <small class="text-muted">{{ $withdrawRequest->user->phone }}</small>
                                    </td>
                                </tr>
                                @if($withdrawRequest->processedBy)
                                <tr>
                                    <td><strong>Diproses Oleh:</strong></td>
                                    <td>{{ $withdrawRequest->processedBy->name }}</td>
                                </tr>
                                @endif
                                @if($withdrawRequest->admin_notes)
                                <tr>
                                    <td><strong>Catatan Admin:</strong></td>
                                    <td>
                                        <div class="alert alert-info mb-0">
                                            {{ $withdrawRequest->admin_notes }}
                                        </div>
                                    </td>
                                </tr>
                                @endif
                            </table>
                        </div>
                    </div>
                </div>
            </div>

            <!-- Bank Account Info -->
            <div class="card mb-4">
                <div class="card-header">
                    <i class="fas fa-university me-1"></i>
                    Informasi Rekening Tujuan
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-md-6">
                            <table class="table table-borderless">
                                <tr>
                                    <td><strong>Bank:</strong></td>
                                    <td>{{ $withdrawRequest->bankAccount->bank_name }}</td>
                                </tr>
                                <tr>
                                    <td><strong>Nomor Rekening:</strong></td>
                                    <td>
                                        <code>{{ $withdrawRequest->bankAccount->account_number }}</code>
                                        <button class="btn btn-sm btn-outline-secondary ms-2" 
                                                onclick="copyToClipboard('{{ $withdrawRequest->bankAccount->account_number }}')">
                                            <i class="fas fa-copy"></i>
                                        </button>
                                    </td>
                                </tr>
                                <tr>
                                    <td><strong>Nama Pemilik:</strong></td>
                                    <td>{{ $withdrawRequest->bankAccount->account_name }}</td>
                                </tr>
                            </table>
                        </div>
                    </div>
                </div>
            </div>

            <!-- Proof Image Section -->
            <div class="card mb-4">
                <div class="card-header">
                    <i class="fas fa-image me-1"></i>
                    Bukti Transfer
                    @if($withdrawRequest->proof_image_url)
                        <button class="btn btn-sm btn-danger float-end" onclick="deleteProofImage({{ $withdrawRequest->id }})">
                            <i class="fas fa-trash"></i> Hapus Bukti
                        </button>
                    @endif
                </div>
                <div class="card-body">
                    @if($withdrawRequest->proof_image_url)
                        <div class="text-center">
                            <img src="{{ asset('storage/' . $withdrawRequest->proof_image_url) }}" 
                                 alt="Bukti Transfer" 
                                 class="img-fluid border rounded shadow"
                                 style="max-height: 500px; cursor: pointer;"
                                 onclick="viewImageFullscreen('{{ asset('storage/' . $withdrawRequest->proof_image_url) }}')">
                            <p class="mt-2 text-muted">Klik gambar untuk melihat ukuran penuh</p>
                        </div>
                    @else
                        <div class="alert alert-warning text-center">
                            <i class="fas fa-exclamation-triangle me-2"></i>
                            Belum ada bukti transfer yang diunggah.
                        </div>
                    @endif
                </div>
            </div>
        </div>

        <!-- Actions Sidebar -->
        <div class="col-lg-4">
            <div class="card">
                <div class="card-header">
                    <i class="fas fa-cogs me-1"></i>
                    Aksi Admin
                </div>
                <div class="card-body">
                    <!-- Status Update Form -->
                    <form method="POST" action="{{ route('admin.withdraw.update-status', $withdrawRequest->id) }}" 
                          enctype="multipart/form-data">
                        @csrf
                        @method('PUT')
                        
                        <div class="mb-3">
                            <label for="status" class="form-label">Update Status:</label>
                            <select class="form-select" id="status" name="status" required>
                                <option value="pending" {{ $withdrawRequest->status == 'pending' ? 'selected' : '' }}>
                                    Pending
                                </option>
                                <option value="processing" {{ $withdrawRequest->status == 'processing' ? 'selected' : '' }}>
                                    Processing
                                </option>
                                <option value="completed" {{ $withdrawRequest->status == 'completed' ? 'selected' : '' }}>
                                    Completed
                                </option>
                                <option value="rejected" {{ $withdrawRequest->status == 'rejected' ? 'selected' : '' }}>
                                    Rejected
                                </option>
                            </select>
                        </div>

                        <div class="mb-3">
                            <label for="admin_notes" class="form-label">Catatan Admin:</label>
                            <textarea class="form-control" id="admin_notes" name="admin_notes" rows="3" 
                                      placeholder="Masukkan catatan untuk user...">{{ $withdrawRequest->admin_notes }}</textarea>
                        </div>

                        <div class="mb-3">
                            <label for="proof_image" class="form-label">Upload Bukti Transfer:</label>
                            <input type="file" class="form-control" id="proof_image" name="proof_image" 
                                   accept="image/jpeg,image/png,image/jpg">
                            <div class="form-text">
                                Format: JPEG, PNG, JPG. Maksimal 5MB.
                                @if($withdrawRequest->proof_image_url)
                                    <br><strong>File akan mengganti bukti yang sudah ada.</strong>
                                @endif
                            </div>
                        </div>

                        <div class="d-grid gap-2">
                            <button type="submit" class="btn btn-primary">
                                <i class="fas fa-save"></i> Update Withdraw
                            </button>
                        </div>
                    </form>

                    <hr>

                    <!-- Quick Actions -->
                    <div class="d-grid gap-2">
                        @if($withdrawRequest->status == 'pending')
                            <button class="btn btn-warning" onclick="quickUpdate('processing')">
                                <i class="fas fa-play"></i> Set ke Processing
                            </button>
                        @endif
                        
                        @if($withdrawRequest->status == 'processing')
                            <button class="btn btn-success" onclick="quickUpdate('completed')">
                                <i class="fas fa-check"></i> Tandai Selesai
                            </button>
                        @endif
                        
                        @if(in_array($withdrawRequest->status, ['pending', 'processing']))
                            <button class="btn btn-danger" onclick="quickUpdate('rejected')">
                                <i class="fas fa-times"></i> Tolak Request
                            </button>
                        @endif
                    </div>

                    <hr>

                    <!-- Navigation -->
                    <div class="d-grid gap-2">
                        <a href="{{ route('admin.withdraw.index') }}" class="btn btn-secondary">
                            <i class="fas fa-arrow-left"></i> Kembali ke Daftar
                        </a>
                    </div>
                </div>
            </div>

            <!-- User Info Card -->
            <div class="card mt-4">
                <div class="card-header">
                    <i class="fas fa-user me-1"></i>
                    Info User
                </div>
                <div class="card-body">
                    <div class="text-center mb-3">
                        <h5>{{ $withdrawRequest->user->name }}</h5>
                        <p class="text-muted mb-1">{{ $withdrawRequest->user->email }}</p>
                        <p class="text-muted">{{ $withdrawRequest->user->phone }}</p>
                    </div>
                    
                    <hr>
                    
                    <div class="mb-2">
                        <strong>Saldo Saat Ini:</strong>
                        <span class="float-end text-success">
                            Rp {{ number_format($withdrawRequest->user->saldo, 0, ',', '.') }}
                        </span>
                    </div>
                    
                    <div class="mb-2">
                        <strong>Total Withdraw:</strong>
                        <span class="float-end">
                            {{ $withdrawRequest->user->withdrawRequests()->completed()->count() }} kali
                        </span>
                    </div>
                    
                    <div class="mb-2">
                        <strong>Member Sejak:</strong>
                        <span class="float-end">
                            {{ $withdrawRequest->user->created_at->format('M Y') }}
                        </span>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- Image Fullscreen Modal -->
<div class="modal fade" id="imageModal" tabindex="-1">
    <div class="modal-dialog modal-xl">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Bukti Transfer</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body text-center">
                <img id="fullscreenImage" src="" alt="Bukti Transfer" class="img-fluid">
            </div>
        </div>
    </div>
</section>

@endsection

@section('scripts')
<script>
function quickUpdate(status) {
    document.getElementById('status').value = status;
    
    let message = '';
    switch(status) {
        case 'processing': message = 'mengubah status menjadi Processing'; break;
        case 'completed': message = 'menandai sebagai Selesai'; break;
        case 'rejected': message = 'menolak request ini'; break;
    }
    
    if (confirm(`Apakah Anda yakin ingin ${message}?`)) {
        document.querySelector('form').submit();
    }
}

function viewImageFullscreen(imageUrl) {
    document.getElementById('fullscreenImage').src = imageUrl;
    new bootstrap.Modal(document.getElementById('imageModal')).show();
}

function copyToClipboard(text) {
    navigator.clipboard.writeText(text).then(function() {
        // Show toast or alert
        const toast = document.createElement('div');
        toast.className = 'alert alert-success position-fixed';
        toast.style.top = '20px';
        toast.style.right = '20px';
        toast.style.zIndex = '9999';
        toast.innerHTML = '<i class="fas fa-check"></i> Nomor rekening disalin!';
        document.body.appendChild(toast);
        
        setTimeout(() => {
            toast.remove();
        }, 3000);
    });
}

function deleteProofImage(id) {
    if (confirm('Apakah Anda yakin ingin menghapus bukti transfer ini?')) {
        fetch(`/admin/withdraw/${id}/delete-proof`, {
            method: 'DELETE',
            headers: {
                'X-CSRF-TOKEN': '{{ csrf_token() }}',
                'Content-Type': 'application/json'
            }
        })
        .then(response => response.json())
        .then(data => {
            if (data.success) {
                location.reload();
            } else {
                alert('Gagal menghapus bukti transfer');
            }
        });
    }
}
</script>
@endsection