@extends('layouts.base')

@section('content')
@section('breadcrumb')
<nav aria-label="breadcrumb">
    <ol class="breadcrumb mb-0">
        <li class="breadcrumb-item"><a href="{{ $homeUrl }}">Accueil</a></li>
        <li class="breadcrumb-item"><a href="{{ route('admin.email-trackings.index') }}">Emails</a></li>
        <li class="breadcrumb-item active" aria-current="page">Preview</li>
    </ol>
</nav>
@endsection

<div class="container-fluid py-4">
    <!-- Header Section -->
    <div class="row mb-4">
        <div class="col-12">
            <div class="d-flex justify-content-between align-items-center">
                <div>
                    <h1 class="h3 mb-1 text-primary">
                        <i class="fas fa-envelope me-2"></i>Preview de l'email
                    </h1>
                    <p class="text-muted mb-0">Détails de l'email envoyé le {{ $emailTracking->created_at->format('d/m/Y à H:i:s') }}</p>
                </div>
                <div>
                    <a href="{{ route('admin.email-trackings.index') }}" class="btn btn-outline-secondary">
                        <i class="fas fa-arrow-left me-2"></i>Retour à la liste
                    </a>
                </div>
            </div>
        </div>
    </div>

    <!-- Blocs d'informations en ligne -->
    <div class="row mb-4">
        <!-- Informations générales -->
        <div class="col-md-4 mb-4">
            <div class="card shadow-sm">
                <div class="card-header bg-secondary text-dark">
                    <h5 class="mb-0"><i class="fas fa-info-circle me-2"></i>Informations</h5>
                </div>
                <div class="card-body">
                    <div class="mb-3">
                        <strong>Sujet :</strong>
                        <div class="mt-1">{{ $emailTracking->subject ?: 'Sans objet' }}</div>
                    </div>
                    <div class="mb-3">
                        <strong>Statut :</strong>
                        <div class="mt-1">
                            @if($emailTracking->status === 'sent')
                            <span class="badge bg-success">Envoyé</span>
                            @elseif($emailTracking->status === 'failed')
                            <span class="badge bg-danger">Échec</span>
                            @else
                            <span class="badge bg-secondary">{{ $emailTracking->status }}</span>
                            @endif
                        </div>
                    </div>
                    <div class="mb-3">
                        <strong>Date d'envoi :</strong>
                        <div class="mt-1">{{ $emailTracking->created_at->format('d/m/Y H:i:s') }}</div>
                    </div>
                    <div class="mb-3">
                        <strong>Type :</strong>
                        <div class="mt-1">
                            <span class="badge bg-secondary">{{ $emailTracking->office_type === 'back-office' ? 'Back-office' : 'Front-office' }}</span>
                            @if($emailTracking->email_type)
                            <span class="badge bg-info ms-1">{{ $emailTracking->email_type }}</span>
                            @endif
                        </div>
                    </div>
                    @if($emailTracking->error_message)
                    <div class="mb-3">
                        <strong>Erreur :</strong>
                        <div class="mt-1 text-danger">{{ $emailTracking->error_message }}</div>
                    </div>
                    @endif
                </div>
            </div>
        </div>

        <!-- Destinataires -->
        <div class="col-md-4 mb-4">
            <div class="card shadow-sm">
                <div class="card-header bg-secondary text-dark">
                    <h5 class="mb-0"><i class="fas fa-users me-2"></i>Destinataires</h5>
                </div>
                <div class="card-body">
                    <div class="mb-3">
                        <strong>À :</strong>
                        <div class="mt-1">
                            @if($emailTracking->to && count($emailTracking->to) > 0)
                            @foreach($emailTracking->to as $recipient)
                            <div>
                                @if($recipient['name'])
                                {{ $recipient['name'] }} &lt;{{ $recipient['email'] }}&gt;
                                @else
                                {{ $recipient['email'] }}
                                @endif
                            </div>
                            @endforeach
                            @else
                            <span class="text-muted">-</span>
                            @endif
                        </div>
                    </div>
                    @if($emailTracking->cc && count($emailTracking->cc) > 0)
                    <div class="mb-3">
                        <strong>CC :</strong>
                        <div class="mt-1">
                            @foreach($emailTracking->cc as $recipient)
                            <div>
                                @if($recipient['name'])
                                {{ $recipient['name'] }} &lt;{{ $recipient['email'] }}&gt;
                                @else
                                {{ $recipient['email'] }}
                                @endif
                            </div>
                            @endforeach
                        </div>
                    </div>
                    @endif
                    @if($emailTracking->bcc && count($emailTracking->bcc) > 0)
                    <div class="mb-3">
                        <strong>BCC :</strong>
                        <div class="mt-1">
                            @foreach($emailTracking->bcc as $recipient)
                            <div>
                                @if($recipient['name'])
                                {{ $recipient['name'] }} &lt;{{ $recipient['email'] }}&gt;
                                @else
                                {{ $recipient['email'] }}
                                @endif
                            </div>
                            @endforeach
                        </div>
                    </div>
                    @endif
                    <div class="mb-3">
                        <strong>Expéditeur :</strong>
                        <div class="mt-1">{{ $emailTracking->from ?: '-' }}</div>
                    </div>
                </div>
            </div>
        </div>

        <!-- Contexte -->
        <div class="col-md-4 mb-4">
            @if($emailTracking->user || $emailTracking->application || $emailTracking->reservation || $emailTracking->task)
            <div class="card shadow-sm">
                <div class="card-header bg-secondary text-dark">
                    <h5 class="mb-0"><i class="fas fa-link me-2"></i>Contexte</h5>
                </div>
                <div class="card-body">
                    @if($emailTracking->user)
                    <div class="mb-2">
                        <strong>Utilisateur :</strong>
                        <div class="mt-1">
                            {{ $emailTracking->user->firstname }} {{ $emailTracking->user->lastname }}
                            <br><small class="text-muted">{{ $emailTracking->user->email }}</small>
                        </div>
                    </div>
                    @endif
                    @if($emailTracking->application)
                    <div class="mb-2">
                        <strong>Application :</strong>
                        <div class="mt-1">{{ $emailTracking->application->name }}</div>
                    </div>
                    @endif
                    @if($emailTracking->reservation)
                    <div class="mb-2">
                        <strong>Réservation :</strong>
                        <div class="mt-1">#{{ $emailTracking->reservation->id }}</div>
                    </div>
                    @endif
                    @if($emailTracking->task)
                    <div class="mb-2">
                        <strong>Tâche :</strong>
                        <div class="mt-1">{{ $emailTracking->task->name }}</div>
                    </div>
                    @endif
                </div>
            </div>
            @endif
        </div>
    </div>

    <!-- Preview de l'email en pleine largeur -->
    <div class="row">
        <div class="col-12">
            <div class="card shadow-sm">
                <div class="card-header bg-secondary text-dark">
                    <h5 class="mb-0"><i class="fas fa-eye me-2"></i>Preview de l'email</h5>
                </div>
                <div class="card-body">
                    @if(!$emailTracking->html_content)
                    <div class="alert alert-info">
                        <i class="fas fa-info-circle me-2"></i>
                        <strong>Note :</strong> Le contenu HTML de cet email n'a pas pu être enregistré.
                    </div>
                    @endif

                    <div class="border rounded p-4 bg-light">
                        <div class="mb-3">
                            <strong>De :</strong> {{ $emailTracking->from ?: config('mail.from.address') }}
                        </div>
                        <div class="mb-3">
                            <strong>À :</strong>
                            @if($emailTracking->to && count($emailTracking->to) > 0)
                            {{ implode(', ', array_column($emailTracking->to, 'email')) }}
                            @else
                            -
                            @endif
                        </div>
                        @if($emailTracking->cc && count($emailTracking->cc) > 0)
                        <div class="mb-3">
                            <strong>CC :</strong>
                            {{ implode(', ', array_column($emailTracking->cc, 'email')) }}
                        </div>
                        @endif
                        @if($emailTracking->bcc && count($emailTracking->bcc) > 0)
                        <div class="mb-3">
                            <strong>BCC :</strong>
                            {{ implode(', ', array_column($emailTracking->bcc, 'email')) }}
                        </div>
                        @endif
                        <div class="mb-3">
                            <strong>Sujet :</strong> {{ $emailTracking->subject ?: 'Sans objet' }}
                        </div>
                        <hr>
                        <div class="mt-4">
                            @if($emailTracking->html_content)
                             <div class="email-preview-content border rounded p-3 bg-white" style="max-height: 1200px; overflow-y: auto;">
                                 <iframe id="email-preview-iframe"
                                     style="width: 100%; min-height: 800px; border: none;"
                                     title="Preview de l'email"
                                     sandbox="allow-same-origin">
                                 </iframe>
                             </div>
                            <div class="mt-3">
                                <button type="button" class="btn btn-sm btn-outline-secondary" onclick="toggleEmailSource()">
                                    <i class="fas fa-code me-1"></i>Afficher le code source
                                </button>
                            </div>
                            <div id="email-source" class="mt-3" style="display: none;">
                                <pre class="bg-light p-3 rounded" style="max-height: 400px; overflow-y: auto;"><code>{{ htmlspecialchars($emailTracking->html_content, ENT_QUOTES, 'UTF-8') }}</code></pre>
                            </div>
                            <script>
                                (function() {
                                    const iframe = document.getElementById('email-preview-iframe');
                                    const htmlContent = @json($emailTracking->html_content);
                                    if (iframe && htmlContent) {
                                        iframe.srcdoc = htmlContent;
                                    }
                                })();
                            </script>
                            @else
                            <p class="text-muted">
                                Le contenu HTML de l'email n'est pas disponible dans cette preview.
                                Pour voir le contenu exact, consultez les logs ou le système d'envoi d'emails.
                            </p>
                            @endif
                        </div>
                    </div>

                    @if($emailTracking->context)
                    <div class="mt-4">
                        <h6>Contexte supplémentaire :</h6>
                        <pre class="bg-light p-3 rounded">{{ json_encode($emailTracking->context, JSON_PRETTY_PRINT | JSON_UNESCAPED_UNICODE) }}</pre>
                    </div>
                    @endif
                </div>
            </div>
        </div>
    </div>
</div>

@push('scripts')
<script>
    function toggleEmailSource() {
        const sourceDiv = document.getElementById('email-source');
        const button = event.target.closest('button');
        if (sourceDiv.style.display === 'none') {
            sourceDiv.style.display = 'block';
            button.innerHTML = '<i class="fas fa-eye me-1"></i>Masquer le code source';
        } else {
            sourceDiv.style.display = 'none';
            button.innerHTML = '<i class="fas fa-code me-1"></i>Afficher le code source';
        }
    }
</script>
@endpush
@endsection