@extends('admin.layouts.app')

@section('content')
<section id='admin'>
    <div class='box'>
        <div class="box-content">
            <div class='box-title'>
                <a href="{{ route('admin.modules.show', $moduleQuiz->module->id) }}">
                    <div class='box-back'>
                        <i class="fa fa-chevron-left"></i>
                    </div>
                </a>
                <p><a href='{{ route('admin.index') }}'>Administración</a> > <a href='{{ route('admin.courses.index') }}'>Cursos</a> > <a href='{{ route('admin.courses.show', $moduleQuiz->module->course->id) }}'>Detalle de Curso</a> > <a href='{{ route('admin.modules.show',  $moduleQuiz->module->id) }}'>Detalle de Modulo</a> > <b>Cuestionario</b></p>
            </div>

            @if ( session('msg') )
                <div class="alert alert-success">
                    {{ session('msg') }}
                    <i onClick="remove(this)" id='alert-close' class="fa fa-times"></i>
                </div>
            @endif
            
            <div class="admin-quiz">
                <h3>Cuestionario de modulo</h3>
                <p>Total preguntas: {{ count($moduleQuiz->quiz->questions) }}</p>
                <p>Porcentaje de aprobación: {{ $moduleQuiz->quiz->minimum }}</p>
                @foreach($moduleQuiz->quiz->questions as $key => $question)
                    <div class='admin-quiz-question'>
                        <div class='admin-quiz-question-item'>
                            <h3>Pregunta Nº{{ $key + 1 }} - Opción {{ $question->type }}</h3>
                            <p>{{ $question->question }}</p>
                            @if($question->image)
                                <img src='/storage/quizzes/{{ $question->image }}'>
                            @endif
                        </div>
                        <div class='admin-quiz-question-item'>
                            @if(get_class($question->questionable) == 'App\Models\Quizzes\Questions\MultipleOptionQuestion')
                            <h3>Opciónes</h3>
                            <div id='admin-quiz-options'>
                                @foreach($question->questionable->options as $option)
                                    <div class='admin-quiz-option'>
                                        <div class='admin-quiz-option-prefix'>
                                            <i class='fas fa-question-circle'></i>
                                        </div>
                                        @if($option->correct)
                                            <b>Correcta:</b>
                                        @endif
                                        <p>{{ $option->option }}</p>
                                    </div>
                                @endforeach
                            </div>
                            @elseif(get_class($question->questionable) == 'App\Models\Quizzes\Questions\SimpleQuestion')
                                <h3>Respuesta</h3>
                                <p>{{ $question->questionable->answer }}</p>
                            @endif
                        </div>
                    </div>
                @endforeach
            </div>
            <div class="push"></div>
            <div class='box-actions'>
                <form action="{{ route('admin.modules.quizzes.destroy', ['module_id' => $moduleQuiz->module->id, 'id' => $moduleQuiz->quiz->id]) }}" method="POST">
                    {{ method_field('DELETE') }}
                    {{ csrf_field() }}
                    <button onclick="return confirm('¿Eliminar cuestionario?')"  class='btn btn-delete btn-submit'>
                        <i class="fas fa-trash-alt"></i>
                        Eliminar
                    </button>
                </form>
                <a href="{{ route('admin.modules.quizzes.edit', ['module_id' => $moduleQuiz->module->id, 'id' => $moduleQuiz->id]) }}">
                    <button class='btn btn-primary'>
                        <i class="fas fa-edit"></i>
                        Editar / Modificar
                    </button>
                </a>
            </div>
        </div>
    </div>
</section>
@endsection