@extends('layouts.app')

@section('title', 'Trắc nghiệm trực tuyến')

@section('content')
<div class="d-flex justify-content-between align-items-center mb-4">
    <div>
        <h3 class="fw-bold mb-1">Trắc nghiệm trực tuyến</h3>
        <div class="text-muted">Quản lý bài kiểm tra trắc nghiệm tự động chấm điểm</div>
    </div>
    <a href="{{ route('quizzes.create') }}" class="btn btn-primary">
        <i class="bi bi-plus-circle me-1"></i> Tạo bài trắc nghiệm
    </a>
</div>

<div class="alert alert-info">
    <strong>Hướng dẫn:</strong> Sau khi tạo bài trắc nghiệm, bấm nút <strong>Quản lý câu hỏi</strong> để thêm câu hỏi và đáp án đúng.
</div>

@if(session('success'))
    <div class="alert alert-success">{{ session('success') }}</div>
@endif

<div class="card shadow-sm">
    <div class="card-body">
        <table class="table table-hover align-middle">
            <thead class="table-light">
                <tr>
                    <th>STT</th>
                    <th>Bài trắc nghiệm</th>
                    <th>Lớp học</th>
                    <th>Số câu hỏi</th>
                    <th>Thời gian</th>
                    <th>Điểm đạt</th>
                    <th>Trạng thái</th>
                    <th class="text-end">Thao tác</th>
                </tr>
            </thead>
            <tbody>
                @forelse($quizzes as $index => $quiz)
                    <tr>
                        <td>{{ $index + 1 }}</td>
                        <td><strong>{{ $quiz->title }}</strong></td>
                        <td>{{ $quiz->trainingClass->name ?? 'Chưa cập nhật' }}</td>
                        <td>
                            <span class="badge {{ $quiz->questions->count() > 0 ? 'bg-success' : 'bg-danger' }}">
                                {{ $quiz->questions->count() }} câu
                            </span>
                        </td>
                        <td>{{ $quiz->duration_minutes }} phút</td>
                        <td>{{ $quiz->pass_score }} / {{ $quiz->max_score }}</td>
                        <td><span class="badge bg-success">{{ $quiz->status }}</span></td>
                        <td class="text-end">
                            <a href="{{ route('quizzes.questions.index', $quiz->id) }}" class="btn btn-sm btn-success">
                                <i class="bi bi-list-check"></i> Quản lý câu hỏi
                            </a>
                            <a href="{{ route('quizzes.show', $quiz->id) }}" class="btn btn-sm btn-outline-primary">Xem</a>
                            <a href="{{ route('quizzes.edit', $quiz->id) }}" class="btn btn-sm btn-outline-warning">Sửa</a>
                        </td>
                    </tr>
                @empty
                    <tr><td colspan="8" class="text-center text-muted py-4">Chưa có bài trắc nghiệm nào.</td></tr>
                @endforelse
            </tbody>
        </table>
    </div>
</div>
@endsection
