@model List<QRRapidoApp.Models.QRCodeHistory>
@using Microsoft.Extensions.Localization
@inject IStringLocalizer<QRRapidoApp.Resources.SharedResource> Localizer

@{
    ViewData["Title"] = "Histórico de QR Codes";
    Layout = "~/Views/Shared/_Layout.cshtml";
    var userId = User.FindFirst(System.Security.Claims.ClaimTypes.NameIdentifier)?.Value;
}

<div class="container mt-4">
    <div class="row">
        <div class="col-12">
            <div class="d-flex justify-content-between align-items-center mb-4">
                <div>
                    <h2><i class="fas fa-history text-primary"></i> Histórico de QR Codes</h2>
                    <p class="text-muted">Seus QR codes gerados ficam salvos aqui para download futuro</p>
                </div>
                <div>
                    <a href="/" class="btn btn-primary">
                        <i class="fas fa-plus"></i> Gerar Novo QRCode
                    </a>
                </div>
            </div>

            @if (Model != null && Model.Any())
            {
                <div class="row">
                    @foreach (var qr in Model)
                    {
                        <div class="col-12 col-md-6 col-lg-4 mb-4">
                            <div class="card h-100 shadow-sm">
                                <div class="card-body">
                                    <div class="text-center mb-3">
                                        <img src="data:image/png;base64,@qr.QRCodeBase64" 
                                             alt="QR Code" 
                                             class="img-fluid border" 
                                             style="max-width: 150px; max-height: 150px;">
                                    </div>
                                    
                                    <div class="mb-2">
                                        <small class="text-muted">Tipo:</small>
                                        <span class="badge bg-secondary">@qr.Type</span>
                                    </div>
                                    
                                    <div class="mb-2">
                                        <small class="text-muted">Conteúdo:</small>
                                        <p class="small mb-0" style="word-break: break-all;">
                                            @if (qr.Content.Length > 50)
                                            {
                                                @(qr.Content.Substring(0, 50) + "...")
                                            }
                                            else
                                            {
                                                @qr.Content
                                            }
                                        </p>
                                    </div>
                                    
                                    <div class="mb-3">
                                        <small class="text-muted">Criado em:</small>
                                        <br>
                                        <small>@qr.CreatedAt.ToString("dd/MM/yyyy HH:mm")</small>
                                    </div>
                                </div>
                                
                                <div class="card-footer bg-light">
                                    <div class="btn-group w-100" role="group">
                                        <a href="/api/QR/Download/@qr.Id?format=png" 
                                           class="btn btn-sm btn-outline-primary" 
                                           title="Download PNG">
                                            <i class="fas fa-download"></i> PNG
                                        </a>
                                        <a href="/api/QR/Download/@qr.Id?format=svg" 
                                           class="btn btn-sm btn-outline-primary" 
                                           title="Download SVG">
                                            <i class="fas fa-download"></i> SVG
                                        </a>
                                        <a href="/api/QR/Download/@qr.Id?format=pdf" 
                                           class="btn btn-sm btn-outline-primary" 
                                           title="Download PDF">
                                            <i class="fas fa-download"></i> PDF
                                        </a>
                                        <button type="button" 
                                                class="btn btn-sm btn-outline-secondary" 
                                                onclick="regenerateQR('@qr.Id')"
                                                title="Regenerar">
                                            <i class="fas fa-redo"></i>
                                        </button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    }
                </div>
                
                @if (Model.Count == 50)
                {
                    <div class="alert alert-info text-center">
                        <i class="fas fa-info-circle"></i>
                        Mostrando os 50 QR codes mais recentes. Os mais antigos são removidos automaticamente.
                    </div>
                }
            }
            else
            {
                <div class="text-center py-5">
                    <i class="fas fa-qrcode fa-4x text-muted mb-3"></i>
                    <h4 class="text-muted">Nenhum QR Code encontrado</h4>
                    <p class="text-muted">
                        Quando você gerar QR codes estando logado, eles aparecerão aqui para download futuro.
                    </p>
                    <a href="/" class="btn btn-primary">
                        <i class="fas fa-plus"></i> Gerar Primeiro QRCode
                    </a>
                </div>
            }
        </div>
    </div>
</div>

@section Scripts {
<script>
function regenerateQR(qrId) {
    // Get QR data from history and regenerate
    fetch(`/api/QR/History`)
        .then(response => response.json())
        .then(data => {
            const qrData = data.find(q => q.id === qrId);
            if (qrData) {
                // Parse customization settings and redirect to home with parameters
                const settings = JSON.parse(qrData.customizationSettings || '{}');
                const params = new URLSearchParams({
                    content: qrData.content,
                    type: qrData.type,
                    size: settings.size || 300,
                    primaryColor: settings.primaryColor || '#000000',
                    backgroundColor: settings.backgroundColor || '#FFFFFF'
                });
                
                window.location.href = `/?${params.toString()}`;
            }
        })
        .catch(error => {
            console.error('Error regenerating QR:', error);
            alert('Erro ao regenerar QR Code. Tente novamente.');
        });
}

// Auto-refresh the page periodically to show new QR codes
setInterval(() => {
    // Only refresh if user is still on this page and there are QR codes
    if (document.visibilityState === 'visible' && document.querySelector('.card')) {
        location.reload();
    }
}, 300000); // Refresh every 5 minutes
</script>
}