@extends('layouts.app')

@section('content')
    <div class="container mt-3">
        <div class="card p-3 shadow-sm">
            <h5 class="mb-3">Submitted Answers — {{ $assignment->title }}</h5>

            @if ($assignment->answers->count())
                <div class="table-responsive">
                    <table class="table table-bordered table-sm table bordered-table sm-table mb-0 text-center">
                        <thead class="">
                            <tr>
                                <th class="text-center">#</th>
                                <th class="text-center">Student</th>
                                <th class="text-center">Status</th>
                                <th class="text-center">Answer Text</th>
                                <th class="text-center">Files</th>
                                <th class="text-center">Action</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach ($assignment->answers as $index => $answer)
                                <tr>
                                    <td>{{ $index + 1 }}</td>
                                    <td>{{ $answer->student->first_name }} {{ $answer->student->last_name }}</td>
                                    <td>
                                        @if ($answer->graded_at)
                                            <span class="badge bg-success">Graded ({{ $answer->grade }}/100)</span>
                                        @else
                                            <span class="badge bg-warning text-dark">Not Graded</span>
                                        @endif
                                    </td>
                                    <td>
                                        @if ($answer->text)
                                            {{ $answer->text }}
                                        @else
                                            <em class="text-muted">—</em>
                                        @endif
                                    </td>
                                    <td>
                                        @if ($answer->answerAttachments->count())
                                            <ul class="list-unstyled mb-0">
                                                @foreach ($answer->answerAttachments as $att)
                                                    <li>
                                                        <a href="{{ config('app.Student_URL') . $att->file_answer }}" 
                                                           target="_blank" alt="{{ basename($att->file_answer) }}">
                                                            View,
                                                        </a>
                                                    </li>
                                                @endforeach
                                            </ul>
                                        @else
                                            <em class="text-muted">No files</em>
                                        @endif
                                    </td>
                                    <td>
                                        @if (!$answer->graded_at)
                                            <a href="{{ route('assignments.grade', $answer->id) }}" 
                                               class="btn btn-sm btn-outline-primary">
                                                Grade
                                            </a>
                                        @else
                                            <span class="text-success">Done</span>
                                        @endif
                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
            @else
                <p class="text-muted">No students have submitted this assignment yet.</p>
            @endif
        </div>
    </div>
@endsection