@extends('layouts.app')
@section('title', 'Broadsheet')
@section('content')
<div class="card">
    <h2 style="font-size:17px;color:#0b4f2c;margin-bottom:16px;">Broadsheet</h2>

    <form method="GET" style="display:flex;gap:10px;margin-bottom:18px;">
        <select name="class_arm_id" style="padding:8px;border:1px solid #ddd;border-radius:6px;font-size:13px;">
            <option value="">Select Class Arm</option>
            @foreach($classArms as $arm)
                <option value="{{ $arm->id }}" {{ $selectedClassArmId == $arm->id ? 'selected' : '' }}>{{ $arm->schoolClass->name }} {{ $arm->name }}</option>
            @endforeach
        </select>
        <select name="term_id" style="padding:8px;border:1px solid #ddd;border-radius:6px;font-size:13px;">
            <option value="">Select Term</option>
            @foreach($terms as $term)
                <option value="{{ $term->id }}" {{ $selectedTermId == $term->id ? 'selected' : '' }}>{{ $term->name }}</option>
            @endforeach
        </select>
        <button type="submit" style="background:#0b4f2c;color:#fff;border:none;padding:8px 18px;border-radius:6px;font-size:13px;cursor:pointer;">Load</button>
    </form>

    @if($broadsheet)
        <div style="overflow-x:auto;">
            <table style="width:100%;border-collapse:collapse;font-size:12px;">
                <thead>
                    <tr style="background:#f4f6f5;text-align:left;">
                        <th style="padding:6px;position:sticky;left:0;background:#f4f6f5;">Student</th>
                        @foreach($broadsheet['subjects'] as $subject)
                            <th style="padding:6px;text-align:center;">{{ $subject['name'] }}</th>
                        @endforeach
                        <th style="padding:6px;">Aggregate</th>
                        <th style="padding:6px;">Position</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($broadsheet['rows'] as $row)
                        <tr style="border-bottom:1px solid #eee;">
                            <td style="padding:6px;font-weight:bold;position:sticky;left:0;background:#fff;">{{ $row['student_name'] }}</td>
                            @foreach($broadsheet['subjects'] as $subject)
                                <td style="padding:6px;text-align:center;">{{ $row['scores'][$subject['id']] ?? '-' }}</td>
                            @endforeach
                            <td style="padding:6px;font-weight:bold;">{{ $row['aggregate'] ?? '—' }}</td>
                            <td style="padding:6px;">{{ $row['position'] ?? '—' }}</td>
                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
        <div style="margin-top:14px;display:flex;gap:10px;">
            <form method="POST" action="{{ url('/api/class-arms/' . $selectedClassArmId . '/terms/' . $selectedTermId . '/publish') }}">
                @csrf
                <button type="submit" style="background:#0b4f2c;color:#fff;border:none;padding:9px 18px;border-radius:6px;font-size:13px;cursor:pointer;">Publish Results to Parents/Students</button>
            </form>
        </div>
    @else
        <p style="color:#999;font-size:13px;text-align:center;padding:30px 0;">Select a class arm and term to view the broadsheet.</p>
    @endif
</div>
@endsection