@extends('dashboard.base')

@section('content')
<div class="container mt-4">
    <h3>Purchased Standards</h3>

    @if($purchasedStandards->isEmpty())
        <p>You have not purchased any standards yet.</p>
    @else
        <div class="row">
            @foreach($purchasedStandards as $standard)
                <div class="col-md-6 mb-4">
                    <div class="card p-3" style="background-color: #f8f9fa;">
                        <h5>{{ $standard->standard_title }}</h5>
                        <p><strong>Code:</strong> {{ $standard->standard_code }}</p>
                        <p><strong>Amount Paid:</strong> MWK {{ number_format($standard->amount, 2) }}</p>
                        <p><strong>Purchased On:</strong> {{ $standard->created_at }}</p>

                        <button class="btn btn-primary"
                            onclick="viewPDF('{{ $standard->standard_code }}')">
                            View PDF
                        </button>
                    </div>
                </div>
            @endforeach
        </div>
    @endif

    <div class="mt-4" id="pdfViewerContainer" style="display:none;">
        <h4>Standard PDF</h4>
        <iframe id="pdfViewer" src="" width="100%" height="600px"></iframe>
    </div>
</div>

<script>
function viewPDF(standardCode) {
    const viewer = document.getElementById('pdfViewer');
    const container = document.getElementById('pdfViewerContainer');

    viewer.src = `/purchased-standards/pdf/${encodeURIComponent(standardCode)}`;
    container.style.display = 'block';

    // Scroll to PDF viewer
    container.scrollIntoView({ behavior: 'smooth' });
}
</script>
@endsection