@extends('back/layouts.app')
@section('back_css')
    <x-admin.datatable.header-css/>
    <style>
      a.kt-userpic.kt-userpic--circle.kt-margin-r-5.kt-margin-t-5 img
      {
          width: 50px;
      }
          div#action_div {
          display: inline-flex;
      }
      a.btn.btn-brand.btn-icon-sm {
          color: white;
          background: #0a7a18;
      }
    </style>
@endsection

@section('content')

<div class="kt-container  kt-container--fluid  kt-grid__item kt-grid__item--fluid">
  <div class="kt-portlet">


  </div>

  <div class="kt-portlet kt-portlet--mobile">
    <div class="kt-portlet__body">

      <style> .dataTables_wrapper div.dataTables_filter { display: contents; } </style>
      @if(session()->has('success'))
          <div class="alert alert-success text-center">
              {{ session()->get('success') }}
          </div>
      @elseif(session()->has('MasterErorr'))
          <div class="alert alert-danger text-center">
              <strong> Failed!  </strong> {{ session()->get('MasterErorr') }}
          </div>
      @endif

      @include('back.includes.breadcrumb',['routes' => [
          ['name' => __('meta.title.members')],
      ]])

      <hr>

        <form id="frm_test" method="post" action="{{ route('courses.tests.testResult', ['course' => $test->testable_id, 'test' => $test->id]) }}" style="width: max-content; justify-self: center; direction: rtl;">
            @csrf
            <input type='hidden' name="user_id" value="{{ $user_id }}">
            <input type='hidden' name="test_id" value="{{ $test->id }}">
            <input type='hidden' name="admin" value="admin">
           <!-- Loop through questions -->
          @foreach ($test->questions as $question)
          @if ($userAnswers->has($question->id))
    @php
        $answer = $userAnswers->get($question->id);
        $isCorrect = $answer && in_array($answer->answer_id, $question->correct_answers);
    @endphp

    <input type='hidden' name="questions[]" value="{{ $question->id }}">
    <div class="question">
        <p>
            @if($isCorrect)
                <span class="text-success"><i class="fas fa-check-circle"></i></span>
            @else
                <span class="text-danger"><i class="fas fa-times-circle"></i></span>
            @endif
            {{ $question->title }}
        </p>

        <select name="answers[{{ $question->id }}]" class="form-control">
            <option value="" disabled>اختر</option>
            @foreach ($question->answers as $option)
                <option value="{{ $option->id }}"
                    @if($answer && (int) $answer->answer_id === (int) $option->id) selected @endif
                    @if(in_array($option->id, $question->correct_answers)) class="bg-success" @endif>
                    {{ $option->title }}
                </option>
            @endforeach
        </select>

        @if(!$answer)
            <p class="text-muted">لم يتم اختيار إجابة لهذا السؤال.</p>
        @endif
    </div>
    @endif
@endforeach

            <br>
            <button type="submit" class="btn btn-primary">تعديل الدرجة</button>
        </form>







    </div>
  </div>
</div>






<!-- Modal -->
<div id="myModal" class="modal fade" role="dialog">
  <div class="modal-dialog">

    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title"></h4>
      </div>
      <div class="modal-body" id="modal-body-div">
        <p> </p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>

  </div>
</div>



@endsection