@extends('layouts.squelette')
<!-- ************************************** -->
@section('css_header')
<style>
    .section_titre{
    background-color: #d8d8d85e;
    padding: 15px;
    margin-bottom: 10px;
}
</style>
@endsection
<!-- ************************************** -->
@section('titre_header')
{{ __('Questionnaire') }}
@endsection
<!-- ************************************** -->
@section('titre_page')
{{ __('Questionnaire') }}
@endsection
<!-- ************************************** -->
@section('panel_boutons')
@endsection
<!-- ************************************** -->
@section('contenu')

<div class="container">
    <div class="row justify-content-center">
        <div class="col-md-8">
            <div class="card"> 
                <div class="card-body">
                    <form method="POST" action="{{ route('survey.answer', $survey->sur_id) }}" enctype="multipart/form-data">
                        @csrf 
                        <input type="hidden" name="sit_id" value={{@$site}}>
                        <div class="form-group" style="text-align: center;"> 
                            <h4>{{ $survey->sur_title }}</h4>
                            {!! $survey->sur_description !!}
                        </div>
 
                        @foreach ($survey->sections as $section)
                            <div class="mb-4">
                                <div class="section_titre">
                                    <h5 class="mb-0">{{ $section->surSec_title }}</h5> 
                                </div> 
                                <ul>
                                    @php
                                    $i=0;
                                    $sortedQuestions = $section->questions->sortBy('surQue_order'); 
                                    @endphp
                                    @foreach ($sortedQuestions as $question)
                                    @php
                                    $i++;
                                    $isLast = $loop->last;
                                    @endphp

                                        <li>
                                            <div class="input-group">
                                                {{--<span>Q{{$i}}. </span>--}} <label for="question_text" class=" {{ $question->surQue_fieldRequired ? 'required_label' : '' }}"> {{ $question->surQue_text }} </label> 
                                             </div>

                                            <div class="form-group"> 
                                                @if ($question->surQue_typeField === 'text')
                                                    <input type="text" name="answers[{{ $question->surQue_id  }}]" {{ $question->surQue_fieldRequired ? 'required' : '' }} class="form-control" value="{{ $question->answer ? $question->answer->surAns_text : '' }}">
                                                @elseif ($question->surQue_typeField === 'number')
                                                    <input type="number" name="answers[{{ $question->surQue_id  }}]" {{ $question->surQue_fieldRequired ? 'required' : '' }} class="form-control" value="{{ $question->answer ? $question->answer->surAns_text : '' }}">
                                                @elseif ($question->surQue_typeField === 'textarea')
                                                    <textarea name="answers[{{ $question->surQue_id  }}]" {{ $question->surQue_fieldRequired ? 'required' : '' }} class="form-control">{{ $question->answer ? $question->answer->surAns_text : '' }}</textarea>
                                                @elseif ($question->surQue_typeField === 'select')
                                                    <select name="answers[{{ $question->surQue_id  }}]" {{ $question->surQue_fieldRequired ? 'required' : '' }} class="form-control">
                                                        <option value="">{{ __('Selectionner une option') }}</option>
                                                        @foreach ($question->options as $option)
                                                            <option value="{{ $option->surQueOpt_text }}" {{ $question->answer && $question->answer->surAns_text == $option->surQueOpt_text ? 'selected' : '' }}>
                                                                {{ $option->surQueOpt_text }}
                                                            </option>
                                                        @endforeach
                                                    </select>
                                                @elseif ($question->surQue_typeField === 'checkbox')
                                                    @foreach ($question->options as $option)
                                                        <div class="form-check">
                                                            <input class="form-check-input"  type="checkbox" name="answers[{{ $question->surQue_id  }}][]" value="{{ $option->surQueOpt_text }}" id="option{{ $loop->index }}" {{ $question->answer && in_array($option->surQueOpt_text, explode(',', $question->answer->surAns_text)) ? 'checked' : '' }}>
                                                            <label class="form-check-label" for="option{{ $loop->index }}">
                                                                {{ $option->surQueOpt_text }}
                                                            </label>
                                                        </div>
                                                    @endforeach
                                                @elseif ($question->surQue_typeField === 'radio')
                                                    @foreach ($question->options as $option)
                                                        <div class="form-check">
                                                            <input class="form-check-input" {{ $question->surQue_fieldRequired ? 'required' : '' }} type="radio" name="answers[{{ $question->surQue_id  }}]" value="{{ $option->surQueOpt_text }}" id="option{{ $loop->index }}" {{ $question->answer && $question->answer->surAns_text == $option->surQueOpt_text ? 'checked' : '' }}>
                                                            <label class="form-check-label" for="option{{ $loop->index }}">
                                                                {{ $option->surQueOpt_text }}
                                                            </label>
                                                        </div>
                                                    @endforeach 
                                                @elseif ($question->surQue_typeField === 'photo') 
                                                        <div class="form-check">
                                                            <div class="form-group" id="group_file"> 
                                                                <input id="answers[{{ $question->surQue_id  }}]" class="fileinput"  type="file" name="answers[{{ $question->surQue_id  }}]" {{ $question->surQue_fieldRequired ? 'required' : '' }} accept="{{ Session::get('value_authorized_extensions') }}">
                                                            </div> 
                                                        </div> 
                                                @endif
                                            </div>
                                        </li>
                                        @unless ($isLast)
                                            <hr>
                                        @endunless
                                    @endforeach
                                </ul> 
                            </div>
                        @endforeach
                        @if(Route::current()->getName() =='show') 
                        <div style="text-align: center"> 
                            <button type="submit" class="btn btn-primary">{{ __('Enregistrer') }}</button>
                        </div>
                        @endif
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection