@extends('admin.layout')
@section('title','Class Tests')
@section('page-title','Class Tests & Results')

@section('content')
<div style="display:grid;grid-template-columns:320px 1fr;gap:20px;align-items:start;">

<!-- Create Test -->
<div class="card">
    <div class="card-header"><h3><i class="fas fa-plus" style="color:var(--red);margin-right:8px;"></i>Create Test</h3></div>
    <div class="card-body">
        <form method="POST" action="{{ route('admin.test.store') }}">
            @csrf
            <div class="form-grid" style="gap:12px;">
                <div class="form-group"><label>Test Title *</label><input name="title" required placeholder="e.g. Chapter 3 Test"></div>
                <div class="form-group"><label>Course *</label>
                    <select name="course" required>
                        @foreach(['N5','N4','N3','N2','N1','Kaiwa','Online'] as $c)
                        <option value="{{ $c }}">{{ $c }}</option>
                        @endforeach
                    </select>
                </div>
                <div class="form-group"><label>Batch (optional)</label><input name="batch" placeholder="Leave blank for all batches"></div>
                <div class="form-group"><label>Topic</label><input name="topic" placeholder="e.g. Hiragana & Katakana"></div>
                <div class="form-group"><label>Test Date *</label><input type="date" name="test_date" value="{{ date('Y-m-d') }}" required></div>
                <div class="form-grid form-grid-2">
                    <div class="form-group"><label>Total Marks</label><input type="number" name="total_marks" value="100" required></div>
                    <div class="form-group"><label>Passing Marks</label><input type="number" name="passing_marks" value="60"></div>
                </div>
                <div class="form-group"><label>Notes</label><textarea name="notes" rows="2" style="resize:none;"></textarea></div>
            </div>
            <button type="submit" class="btn btn-primary" style="margin-top:14px;width:100%;"><i class="fas fa-pen-to-square"></i> Create Test</button>
        </form>
    </div>
</div>

<!-- Tests List -->
<div>
    @forelse($tests as $test)
    @php
        $given  = $test->results->whereNotNull('marks_obtained')->count();
        $total  = $test->results->count();
        $avg    = $given > 0 ? round($test->results->whereNotNull('marks_obtained')->avg('marks_obtained'), 1) : null;
        $passed = $test->results->filter(fn($r)=>$r->marks_obtained!==null && $r->marks_obtained>=$test->passing_marks)->count();
    @endphp
    <div class="card" style="margin-bottom:16px;">
        <div class="card-header">
            <div>
                <div style="font-size:15px;font-weight:700;color:#0f172a;">{{ $test->title }}</div>
                <div style="font-size:12px;color:#64748b;margin-top:2px;">
                    <span class="badge badge-blue" style="margin-right:4px;">{{ $test->course }}</span>
                    {{ $test->test_date->format('d M Y') }}
                    @if($test->topic) · {{ $test->topic }} @endif
                    · {{ $test->total_marks }} marks
                </div>
            </div>
            <div style="display:flex;align-items:center;gap:10px;">
                @if($avg !== null)
                <span class="badge {{ ($avg/$test->total_marks*100)>=60?'badge-green':'badge-red' }}">Avg: {{ $avg }}/{{ $test->total_marks }}</span>
                @endif
                <span class="badge badge-gray">{{ $given }}/{{ $total }} entered</span>
                <button onclick="document.getElementById('marks-{{ $test->id }}').classList.toggle('hidden')" class="btn btn-outline btn-sm"><i class="fas fa-list"></i> Enter Marks</button>
            </div>
        </div>
        <div id="marks-{{ $test->id }}" class="hidden">
            <form method="POST" action="{{ route('admin.test.results',$test) }}">
                @csrf
                <div style="overflow-x:auto;">
                <table>
                    <thead><tr><th>Student</th><th>ID</th><th>Marks (/ {{ $test->total_marks }})</th><th>Grade</th><th>Remarks</th></tr></thead>
                    <tbody>
                        @foreach($test->results->load('student') as $r)
                        <tr>
                            <td style="font-weight:600;">{{ $r->student?->name }}</td>
                            <td><span class="badge badge-gray" style="font-size:10px;">{{ $r->student?->student_id }}</span></td>
                            <td>
                                <input type="number" name="results[{{ $r->student_id }}][marks]" value="{{ $r->marks_obtained }}"
                                    min="0" max="{{ $test->total_marks }}"
                                    style="width:70px;padding:6px 8px;border:1.5px solid #e2e8f0;border-radius:6px;font-size:13px;">
                            </td>
                            <td>
                                <select name="results[{{ $r->student_id }}][grade]" style="padding:6px 8px;border:1.5px solid #e2e8f0;border-radius:6px;font-size:13px;">
                                    <option value="">—</option>
                                    @foreach(['A+','A','B+','B','C','D','F','Absent'] as $g)
                                    <option value="{{ $g }}" {{ $r->grade==$g?'selected':'' }}>{{ $g }}</option>
                                    @endforeach
                                </select>
                            </td>
                            <td><input name="results[{{ $r->student_id }}][remarks]" value="{{ $r->remarks }}" placeholder="Optional" style="width:120px;padding:6px 8px;border:1.5px solid #e2e8f0;border-radius:6px;font-size:13px;"></td>
                        </tr>
                        @endforeach
                    </tbody>
                </table>
                </div>
                <div style="padding:14px 16px;border-top:1px solid #f1f5f9;">
                    <button type="submit" class="btn btn-primary btn-sm"><i class="fas fa-save"></i> Save All Marks</button>
                </div>
            </form>
        </div>
    </div>
    @empty
    <div class="card"><div style="padding:40px;text-align:center;color:#94a3b8;">No tests created yet.</div></div>
    @endforelse
    @if($tests->hasPages())
    <div style="padding:14px;">{{ $tests->links() }}</div>
    @endif
</div>
</div>
@endsection

@push('styles')
<style>.hidden{display:none;}</style>
@endpush