@extends('layouts.app')
@section('title', 'Resultados de Búsqueda - Reembolsos')
@push('styles')
    <link href="{{ asset('css/refund.css') }}" rel="stylesheet">
    <style>
        .country-flag {
            width: 24px;
            height: auto;
            margin-right: 8px;
        }
        .document-row:hover {
            background-color: #f8f9fa;
        }
        .badge-status {
            font-size: 0.75rem;
        }
        .search-summary {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            color: white;
            border-radius: 10px;
        }
    </style>
@endpush
@section('content')
<div id="layout-wrapper">
    @include('layouts.partials.header')
    @include('layouts.partials.sidebar')
    <div class="main-content">
        <div class="page-content">
            <div class="container-fluid">
                <!-- Page Title -->
                <div class="row">
                    <div class="col-12">
                        <div class="page-title-box d-sm-flex align-items-center justify-content-between">
                            <h4 class="mb-sm-0 font-size-18">Resultados de Búsqueda</h4>
                            <div class="page-title-right">
                                <ol class="breadcrumb m-0">
                                    <li class="breadcrumb-item"><a href="{{ route('dashboard') }}">Dashboard</a></li>
                                    <li class="breadcrumb-item"><a href="{{ route('refund.index') }}">Reembolsos</a></li>
                                    <li class="breadcrumb-item active">Resultados</li>
                                </ol>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Header con información de búsqueda -->
                <div class="row mb-4">
                    <div class="col-12">
                        <div class="card search-summary">
                            <div class="card-body">
                                <div class="d-flex justify-content-between align-items-center">
                                    <div>
                                        <h5 class="mb-1 text-white">
                                            <i class="bx bx-search-alt me-2"></i>
                                            Email: <strong>{{ $email }}</strong>
                                        </h5>
                                        <p class="mb-0 text-white-50">
                                            Encontrados {{ array_sum(array_map(function($r) { return count($r['documents']); }, $results)) }} documentos 
                                            en {{ count($results) }} países
                                        </p>
                                    </div>
                                    <div>
                                        <a href="{{ route('refund.index') }}" class="btn btn-light">
                                            <i class="bx bx-arrow-back me-2"></i>
                                            Nueva Búsqueda
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Resultados por país -->
                @if(count($results) > 0)
                    @foreach($results as $countryCode => $countryData)
                    <div class="row mb-4">
                        <div class="col-12">
                            <div class="card">
                                <div class="card-header">
                                    <div class="d-flex align-items-center">
                                        <img src="{{ asset('flags/' . strtolower($countryCode) . '.png') }}" 
                                             alt="{{ $countryCode }}" 
                                             class="country-flag"
                                             onerror="this.style.display='none'">
                                        <h5 class="mb-0">
                                            {{ $countryData['country_name'] }} ({{ $countryCode }})
                                        </h5>
                                        <span class="badge bg-primary ms-2">
                                            {{ count($countryData['documents']) }} documentos
                                        </span>
                                    </div>
                                </div>
                                <div class="card-body p-0">
                                    <div class="table-responsive">
                                        <table class="table table-hover mb-0">
                                            <thead class="table-light">
                                                <tr>
                                                    <th>ID</th>
                                                    <th>Cliente</th>
                                                    <th>Monto</th>
                                                    <th>Gateway</th>
                                                    <th>Estado</th>
                                                    <th>Fecha</th>
                                                    <th width="120">Acciones</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                @foreach($countryData['documents'] as $document)
                                                @php
                                                    // Intentar múltiples formas de obtener los datos
                                                    $data = json_decode($document->data, true);
                                                    
                                                    // Obtener email
                                                    $email = $data['email'] ?? 'N/A';
                                                    
                                                    // Obtener nombres - probar diferentes formatos
                                                    $firstName = $data['first_name'] ?? $data['firstName'] ?? $data['name'] ?? 'N/A';
                                                    $lastName = $data['last_name'] ?? $data['lastName'] ?? $data['surname'] ?? '';
                                                    
                                                    // Si no hay first_name, intentar separar el campo name
                                                    if ($firstName === 'N/A' && isset($data['name'])) {
                                                        $nameParts = explode(' ', $data['name'], 2);
                                                        $firstName = $nameParts[0] ?? 'N/A';
                                                        $lastName = $nameParts[1] ?? '';
                                                    }
                                                    
                                                    $fullName = trim($firstName . ' ' . $lastName);
                                                    if ($fullName === 'N/A' || $fullName === '') {
                                                        $fullName = 'Nombre no disponible';
                                                    }
                                                    
                                                    // Obtener monto del campo payment JSON
                                                    $payment = json_decode($document->payment, true);
                                                    $amount = '0.00';
                                                    
                                                    if (is_array($payment)) {
                                                        // Intentar diferentes ubicaciones del monto
                                                        $amount = $payment['amount'] ?? 
                                                                 $payment['amount_total'] ?? 
                                                                 $payment['amount_paid'] ?? 
                                                                 ($payment['amount_received'] ?? '0.00');
                                                        
                                                        // Si está en centavos, convertir a dólares
                                                        if (is_numeric($amount) && $amount > 1000) {
                                                            $amount = $amount / 100;
                                                        }
                                                    }
                                                    
                                                    $amount = is_numeric($amount) ? number_format(floatval($amount), 2) : '0.00';
                                                @endphp
                                                <tr class="document-row">
                                                    <td>
                                                        <span class="badge bg-secondary">{{ $document->id }}</span>
                                                    </td>
                                                    <td>
                                                        <div>
                                                            <strong>{{ $fullName }}</strong>
                                                            <br>
                                                            <small class="text-muted">{{ $email }}</small>
                                                        </div>
                                                    </td>
                                                    <td>
                                                        <span class="fw-bold text-success">
                                                            ${{ $amount }}
                                                        </span>
                                                    </td>
                                                    <td>
                                                        <span class="badge bg-info badge-status">{{ $document->payment_gateway ?? 'N/A' }}</span>
                                                    </td>
                                                    <td>
                                                        @if($document->status === 'PAID')
                                                            <span class="badge bg-success badge-status">Pagado</span>
                                                        @else
                                                            <span class="badge bg-warning badge-status">{{ ucfirst($document->status) }}</span>
                                                        @endif
                                                    </td>
                                                    <td>
                                                        <small>{{ \Carbon\Carbon::parse($document->created_at)->format('d/m/Y H:i') }}</small>
                                                    </td>
                                                    <td>
                                                        <button type="button" 
                                                                class="btn btn-sm btn-outline-danger" 
                                                                onclick="showRefundModal('{{ $countryCode }}', '{{ $document->id }}', '{{ $amount }}', '{{ $fullName }}')">
                                                            <i class="bx bx-undo me-1"></i>
                                                            Reembolsar
                                                        </button>
                                                    </td>
                                                </tr>
                                                @endforeach
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    @endforeach
                @else
                    <div class="row">
                        <div class="col-12">
                            <div class="card">
                                <div class="card-body text-center py-5">
                                    <i class="bx bx-search-alt display-4 text-muted mb-3"></i>
                                    <h5 class="text-muted">No se encontraron documentos</h5>
                                    <p class="text-muted mb-4">
                                        No se encontraron documentos pagados para el email <strong>{{ $email }}</strong> 
                                        en los países seleccionados.
                                    </p>
                                    <a href="{{ route('refund.index') }}" class="btn btn-primary">
                                        <i class="bx bx-arrow-back me-2"></i>
                                        Realizar nueva búsqueda
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>
                @endif
            </div>
        </div>
    </div>
</div>

<!-- Modal de Reembolso Individual -->
<div class="modal fade" id="refundModal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">
                    <i class="bx bx-undo me-2"></i>
                    Procesar Reembolso
                </h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body">
                <div id="refund-details"></div>
                <div class="mb-3">
                    <label for="refund-amount" class="form-label">Monto a Reembolsar</label>
                    <div class="input-group">
                        <span class="input-group-text">$</span>
                        <input type="number" 
                               class="form-control" 
                               id="refund-amount" 
                               min="0.01" 
                               step="0.01" 
                               required>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancelar</button>
                <button type="button" class="btn btn-danger" onclick="processRefund()">
                    <i class="bx bx-check me-2"></i>
                    Procesar Reembolso
                </button>
            </div>
        </div>
    </div>
</div>

<script>
let currentRefundData = {};

function showRefundModal(countryCode, documentId, amount, customerName) {
    currentRefundData = {
        country_code: countryCode,
        document_id: documentId,
        original_amount: parseFloat(amount)
    };
    
    document.getElementById('refund-details').innerHTML = `
        <div class="alert alert-info">
            <strong>País:</strong> ${countryCode}<br>
            <strong>Documento ID:</strong> ${documentId}<br>
            <strong>Cliente:</strong> ${customerName}<br>
            <strong>Monto Original:</strong> $${parseFloat(amount).toFixed(2)}
        </div>
    `;
    
    document.getElementById('refund-amount').value = amount;
    document.getElementById('refund-amount').max = amount;
    
    const modal = new bootstrap.Modal(document.getElementById('refundModal'));
    modal.show();
}

function processRefund() {
    const amount = parseFloat(document.getElementById('refund-amount').value);
    
    if (!amount || amount <= 0) {
        alert('Por favor ingresa un monto válido');
        return;
    }
    
    if (amount > currentRefundData.original_amount) {
        alert('El monto no puede ser mayor al monto original');
        return;
    }
    
    const formData = new FormData();
    formData.append('_token', document.querySelector('meta[name="csrf-token"]').getAttribute('content'));
    formData.append('country_code', currentRefundData.country_code);
    formData.append('document_id', currentRefundData.document_id);
    formData.append('amount_to_refund', amount);
    
    fetch('{{ route("refund.process") }}', {
        method: 'POST',
        body: formData
    })
    .then(response => response.json())
    .then(data => {
        if (data.success) {
            alert('Reembolso procesado exitosamente');
            location.reload();
        } else {
            alert('Error: ' + data.message);
        }
    })
    .catch(error => {
        console.error('Error:', error);
        alert('Error de conexión');
    });
}
</script>
@endsection