@extends('layouts.backend')

@section('title')
    @lang('backend.titles.students_evaluations')
@endsection

@section('content')
<header class="main-header clearfix">
    <h1>
        <i class="icon pe-7s-folder"></i>
        @lang('backend.titles.students_evaluations')
    </h1>
</header>

<div class="row">
    <div class="col-md-12">
        <article class="widget">
            <header class="widget__header">
                <h3 class="widget__title">@lang('backend.menu.evaluations')</h3>
            </header>
            <div class="widget__content">
                <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
                    @foreach($dataArray as $data)
                        <div class="panel panel-default">
                            <div class="panel-heading" role="tab" 
                            id="heading{{$data['evaluation']['id']}}">
                                <h4 class="panel-title">
                                    <a role="button" data-toggle="collapse"
                                       data-parent="#accordion" href="#collapse{{$data['evaluation']['id']}}"
                                       aria-expanded="true" aria-controls="collapse{{$data['evaluation']['id']}}">
                                        {{$data['evaluation']['title']}} -
                                        {{$data['evaluation']['date']}}
                                    </a>
                                </h4>
                            </div>
                            <div id="collapse{{$data['evaluation']['id']}}" class="panel-collapse collapse"
                                 role="tabpanel" aria-labelledby="heading{{$data['evaluation']['id']}}">
                                <div class="panel-body">
                                    <header class='widget__header'>
                                    <h3 class='widget__title'>
                                        {{$data['name']}} - 
                                        @lang('backend.titles.score'):
                                        <span class="color--{{($data['evaluation']['completed'])?'skyblue':'red'}}">
                                        {{$data['evaluation']['score']}}
                                        </span>
                                    </h3>
                                    </header>
                                    <div class='widget__content'>
                                        <!-- aqui se obtienen las preguntas que le aparecieron al estudiante -->
                                        @foreach($data['evaluation']['questions'] as $question_id => $question)
                                        <div class='media user'>
                                            <div class='media-body'>
                                                <h4 class='media-heading user__name'>
                                                    {{$question['text']}}
                                                </h4>
                                                <small class='user__location'>
                                                <i class='fa fa-question-circle'></i> 
                                                {{trans('backend.question_types.'.$question['type'])}}
                                                </small>
                                                <input type='checkbox' class='btn-more-check' 
                                                id='more{{$question_id}}-{{$data['evaluation']['id']}}'>
                                                <label data-toggle='tooltip' data-placement='left' title="@lang('backend.questions_views.see_answers')" class='c-btn--more' for='more{{$question_id}}-{{$data['evaluation']['id']}}'></label>
                                                <div class='accordion__details'>
                                                    <p>@lang('backend.questions_views.answers')</p>
                                                    <table class='table'><tbody>
                                                    @foreach ($question['answers'] as $answer)
                                                        @if($question['type'] == 1)
                                                        <tr class='{{$answer['background']}}'>
                                                            <td style='text-align: center' width='10%'>
                                                                <i class='{{$answer['icon']}}'></i>
                                                            </td>
                                                            <td>{{$answer['text']}}</td>
                                                        </tr>
                                                        @elseif($question['type'] == 2)
                                                        <tr class='{{$answer['background']}}'>
                                                            <td style='text-align: center' width='10%'>
                                                                <i class='{{$answer['icon']}}'></i>
                                                            </td>
                                                            <td>{{$answer['text']}}</td>
                                                            <td><i class='fa fa-arrow-right'></i></td>
                                                            <td>{{$answer['pair']}}</td>
                                                        </tr>
                                                        @endif
                                                    @endforeach
                                                    </tbody></table>
                                                </div>
                                            </div>
                                        </div>
                                        @endforeach
                                    </div>
                                </div>
                            </div>
                        </div>
                    @endforeach
                </div>
            </div>
        </article><!-- /widget -->
    </div>
</div>
@endsection