@extends('layouts.app')

@section('title', 'Payarc')

@section('content')
<div class="page-content">
    <div class="container-fluid">
        <div class="row">
            <div class="col-12">
                <div class="page-title-box">
                    <h4 class="mb-0">Payarc API</h4>
                    <p class="text-muted">Conexión y datos de casos</p>
                </div>
            </div>
        </div>

        <!-- Connection Status -->
        <div class="row">
            <div class="col-md-6">
                <div class="card">
                    <div class="card-body">
                        <h5 class="card-title">🔗 Estado de Conexión</h5>

                        @if(isset($connectionTest['success']) && $connectionTest['success'])
                            <div class="alert alert-success">
                                <i class="fas fa-check-circle"></i> Conexión exitosa
                                <br><small>Status: {{ $connectionTest['status_code'] ?? '200' }}</small>
                            </div>
                        @else
                            <div class="alert alert-danger">
                                <i class="fas fa-times-circle"></i> Error de conexión
                                <br><small>{{ $connectionTest['error'] ?? 'Sin error especificado' }}</small>
                            </div>
                        @endif
                    </div>
                </div>
            </div>

            <div class="col-md-6">
                <div class="card">
                    <div class="card-body">
                        <h5 class="card-title">📊 Casos (Últimos 7 días)</h5>

                        @if(isset($casesData['ok']) && $casesData['ok'])
                            <div class="alert alert-success">
                                <i class="fas fa-chart-line"></i> Datos obtenidos
                                <br><small>Status: {{ $casesData['http_code'] }}</small>
                            </div>
                        @elseif(isset($casesData['raw']) && str_contains($casesData['raw'], 'Cloudflare'))
                            <div class="alert alert-danger">
                                <i class="fas fa-shield-alt"></i> <strong>Bloqueado por Cloudflare</strong>
                                <br><small>Tu IP está en lista negra. Contacta a Payarc para whitelist.</small>
                                <br><small>IP: 147.135.161.120 | Ray ID: Ver debug</small>
                            </div>
                        @else
                            <div class="alert alert-warning">
                                <i class="fas fa-exclamation-triangle"></i> Sin datos
                                <br><small>{{ $casesData['error'] ?? 'Error desconocido' }}</small>
                            </div>
                        @endif
                    </div>
                </div>
            </div>
        </div>

        <!-- Cases Data -->
        @if(isset($casesData['ok']) && $casesData['ok'] && isset($casesData['body']['data']))
        <div class="row">
            <div class="col-12">
                <div class="card">
                    <div class="card-body">
                        <h5 class="card-title">📋 Lista de Casos</h5>

                        @if(count($casesData['body']['data']) > 0)
                            <div class="table-responsive">
                                <table class="table table-striped">
                                    <thead>
                                        <tr>
                                            <th>ID</th>
                                            <th>Tipo</th>
                                            <th>Estado</th>
                                            <th>Monto</th>
                                            <th>Fecha</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @foreach($casesData['body']['data'] as $case)
                                        <tr>
                                            <td><code>{{ $case['id'] ?? 'N/A' }}</code></td>
                                            <td>{{ $case['type'] ?? 'N/A' }}</td>
                                            <td>
                                                <span class="badge bg-{{ $case['status'] === 'open' ? 'warning' : 'success' }}">
                                                    {{ $case['status'] ?? 'N/A' }}
                                                </span>
                                            </td>
                                            <td>${{ number_format(($case['amount'] ?? 0) / 100, 2) }}</td>
                                            <td>{{ isset($case['created_at']) ? date('d/m/Y', strtotime($case['created_at'])) : 'N/A' }}</td>
                                        </tr>
                                        @endforeach
                                    </tbody>
                                </table>
                            </div>
                        @else
                            <div class="text-center py-4">
                                <i class="fas fa-inbox fa-3x text-muted mb-3"></i>
                                <p class="text-muted">No hay casos en los últimos 7 días</p>
                            </div>
                        @endif
                    </div>
                </div>
            </div>
        </div>
        @endif

        <!-- JSON Response -->
        @if(isset($casesData['body']))
        <div class="row">
            <div class="col-12">
                <div class="card">
                    <div class="card-body">
                        <h5 class="card-title">📄 Respuesta JSON</h5>
                        <pre class="bg-light p-3" style="max-height: 400px; overflow-y: auto;"><code>{{ json_encode($casesData['body'], JSON_PRETTY_PRINT | JSON_UNESCAPED_SLASHES) }}</code></pre>
                    </div>
                </div>
            </div>
        </div>
        @endif

        <!-- Raw Data (Debug) -->
        @if(isset($casesData['raw']))
        <div class="row">
            <div class="col-12">
                <div class="card">
                    <div class="card-body">
                        <h5 class="card-title">🔧 Datos Raw (Debug)</h5>
                        <div class="accordion" id="debugAccordion">
                            <div class="accordion-item">
                                <h2 class="accordion-header">
                                    <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#debugCollapse">
                                        Ver respuesta completa de la API
                                    </button>
                                </h2>
                                <div id="debugCollapse" class="accordion-collapse collapse" data-bs-parent="#debugAccordion">
                                    <div class="accordion-body">
                                        <pre class="bg-light p-3" style="max-height: 300px; overflow-y: auto;"><code>{{ $casesData['raw'] }}</code></pre>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        @endif

    </div>
</div>
@endsection