@extends('layouts.main_dashboard.app')
@php($routePrefix = auth()->user()?->usesStaffPortal() ? 'teacher' : 'admin')

@section('title', __('dashboard.Student Answers'))
@section('page_heading', __('dashboard.Student Answers'))

@section('breadcrumb')
    <li class="breadcrumb-item text-muted"><a href="{{ route($routePrefix . '.home') }}" class="text-muted text-hover-primary">{{ __('dashboard.Home') }}</a></li>
    <li class="breadcrumb-item"><span class="bullet bg-gray-500 w-5px h-2px"></span></li>
    <li class="breadcrumb-item text-muted"><a href="{{ route($routePrefix . '.courses.show', $quiz->course->id) }}" class="text-muted text-hover-primary">{{ $quiz->course->name }}</a></li>
    <li class="breadcrumb-item"><span class="bullet bg-gray-500 w-5px h-2px"></span></li>
    <li class="breadcrumb-item text-muted"><a href="{{ route($routePrefix . '.courses.quizzes.index', $quiz->course->id) }}" class="text-muted text-hover-primary">{{ $quiz->title }}</a></li>
    <li class="breadcrumb-item"><span class="bullet bg-gray-500 w-5px h-2px"></span></li>
    <li class="breadcrumb-item text-muted">{{ __('dashboard.Student Answers') }}</li>
@endsection

@section('actions')
    <a href="{{ route($routePrefix . '.courses.quizzes.show', ['courseId' => $quiz->course->id, 'quizId' => $quiz->id]) }}" class="btn btn-primary me-3">{{ __('dashboard.View Quiz') }}</a>
    <a href="{{ route($routePrefix . '.courses.quizzes.edit', ['courseId' => $quiz->course->id, 'quizId' => $quiz->id]) }}" class="btn btn-warning">{{ __('dashboard.Edit Quiz') }}</a>
@endsection

@section('content')
<div id="kt_app_content" class="app-content flex-column-fluid">
    <div id="kt_app_content_container" class="app-container container-fluid">
        <div class="rounded-[1.75rem] border border-zinc-200 bg-white shadow-sm dark:border-zinc-800 dark:bg-zinc-900">
            <div class="card-header pt-7">
                <div class="text-lg font-black text-zinc-900 dark:text-white">
                    <i class="ki-outline ki-profile-circle fs-1 me-2"></i>
                    <h2>{{ __('dashboard.Student Answers for') }} {{ $quiz->title }}</h2>
                </div>
            </div>
            <div class="card-body pt-5">
                @if($quizAnswers->isEmpty())
                    <div class="text-center p-10">
                        <i class="ki-outline ki-dropbox fs-3x text-primary mb-5"></i>
                        <div class="fs-4 fw-semibold text-gray-700">{{ __('dashboard.No student answers found for this quiz yet.') }}</div>
                    </div>
                @else
                    <div class="table-responsive">
                        <table class="table align-middle table-row-dashed fs-6 gy-5">
                            <thead>
                                <tr class="text-start text-gray-500 fw-bold fs-7 text-uppercase gs-0">
                                    <th class="min-w-200px">{{ __('dashboard.Student Name') }}</th>
                                    <th class="min-w-150px">{{ __('dashboard.Solution time') }}</th>
                                    <th class="min-w-125px">{{ __('dashboard.Score') }}</th>
                                    <th class="text-end min-w-100px">{{ __('dashboard.Action') }}</th>
                                </tr>
                            </thead>
                            <tbody class="fw-semibold text-gray-600">
                                @foreach($quizAnswers as $quizAnswer)
                                    <tr>
                                        <td>{{ $quizAnswer->student->name ?? 'N/A' }}</td>
                                        <td>{{ round($quizAnswer->solution_time / 60, 2) }} {{ __('dashboard.Minutes') }}</td>
                                        <td><span class="badge badge-light-primary">{{ $quizAnswer->student_score }} / {{ $quizAnswer->quiz_max_score }}</span></td>
                                        <td class="text-end">
                                            <a href="#" class="btn btn-sm btn-light btn-active-light-primary" data-kt-menu-trigger="click" data-kt-menu-placement="bottom-end">{{ __('dashboard.Actions') }}<i class="ki-outline ki-down fs-5 ms-1"></i></a>
                                            <div class="menu menu-sub menu-sub-dropdown menu-column menu-rounded menu-gray-600 menu-state-bg-light-primary fw-semibold fs-7 w-125px py-4" data-kt-menu="true">
                                                <div class="menu-item px-3">
                                                    <a href="{{ route($routePrefix . '.quiz-answers.show', $quizAnswer->id) }}" class="menu-link px-3">{{ __('dashboard.View') }}</a>
                                                </div>
                                                <div class="menu-item px-3">
                                                    <form action="{{ route($routePrefix . '.quiz-answers.destroy', $quizAnswer->id) }}" method="POST" onsubmit="return confirm('{{ __('dashboard.Are you sure you want to delete this item?') }}');">
                                                        @csrf
                                                        @method('DELETE')
                                                        <button type="submit" class="btn btn-link menu-link px-3 text-danger w-100 text-start">{{ __('dashboard.Delete') }}</button>
                                                    </form>
                                                </div>
                                            </div>
                                        </td>
                                    </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                @endif
            </div>
        </div>
    </div>
</div>
@endsection