@extends('../layout/' . $layout)

@section('subhead')
    <title>Atarud MIS - Exams List</title>
@endsection

@section('subcontent')
    <div class="flex items-center mt-8">
        <h2 class="intro-y text-lg font-medium mr-auto">Exams List</h2>
        <a href="javascript:;" data-tw-toggle="modal" data-tw-target="#new-exam" class="btn btn-primary w-24 ml-auto">
            <i data-lucide="plus-circle" class="w-4 h-4 mr-1"></i> Add
        </a>
    </div>

    <div class="grid grid-cols-12 gap-6 mt-6">

        <!-- BEGIN: Data List -->
        <div class="intro-y col-span-12 overflow-auto lg:overflow-visible">

            <div class="overflow-x-auto" style="border-radius:5px; border:1px solid #e5e7eb;">
                <table class="table table-striped">
                    <thead>
                        <tr class="bg-primary text-white">
                            <th class="whitespace-nowrap text-center">#</th>
                            <th class="whitespace-nowrap text-center">Title</th>
                            <th class="whitespace-nowrap text-center">Exam Duration</th>
                            <th class="whitespace-nowrap text-center">Actions</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach($exams as $exam)
                        <tr>
                            <td class="text-center">{{ ++$loop->index }}</td>
                            <td class="text-center">{{ $exam->title }}</td>
                            <td class="text-center">{{ $exam->exam_time }}</td>
                            <td class="table-report__action w-56">
                                <div class="flex justify-center items-center">
                                    <a class="flex items-center mr-3" title="Edit" href="javascript:;">
                                        <i data-lucide="settings" class="w-4 h-4 mr-1"></i>
                                    </a>
                                    <a class="flex items-center mr-3" title="View" href="{{route('view-exam', $exam->id)}}">
                                        <i data-lucide="eye" class="w-4 h-4 mr-1"></i>
                                    </a>
                                    {{-- <a class="flex items-center mr-3" title="View" href="{{route('exam.assign-questions', $exam->id)}}">
                                        <i data-lucide="file-text" class="w-4 h-4 mr-1"></i>
                                    </a> --}}
                                    {{-- <a class="flex items-center mr-3" title="View" href="{{route('view-exam', $exam->id)}}">
                                        <i data-lucide="user-plus" class="w-4 h-4 mr-1"></i>
                                    </a> --}}
                                    <a class="flex items-center text-danger" title="delete" onclick="return deleteRecord({{ $exam->id }});" href="javascript:;" data-tw-toggle="modal" data-tw-target="#delete-confirmation-modal">
                                        <i data-lucide="trash-2" class="w-4 h-4 mr-1"></i>
                                    </a>

                                </div>
                            </td>
                        </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        </div>
        <!-- END: Data List -->
    </div>
    @include('../pages/exam/create')
    @include('../pages/exam/delete')
@endsection
@section('script')
<script type="text/javascript">
     function deleteRecord(id){
        document.getElementById('id').value = id;
    }
</script>
@endsection