@extends ('Layouts.Application')

@section ('MainContent')

<div class="row">
  <div class="col-sm-12">
    <div class="panel panel-default">
      <div class="panel-heading"><strong> Online Exam </strong>
        @if (\App\Models\Permission::checkLinkPermission('OnlineExamController', 'Task', 'create'))
          <a href="{{ route('LoggedIn.Task.OnlineExam.create') }}" class="pull-right btn btn-primary btn-xs" title="Create Question">
            <i class="fa fa-plus-circle"></i> New MCQ
          </a>
          <a href="{{ route('LoggedIn.Task.OnlineExam.uploadQuestion') }}" class="pull-right btn btn-primary btn-xs" title="Create Question">
            <i class="fa fa-plus-circle"></i> Upload Question
          </a>
        @endif
      </div>

      <div class="panel-body">
        @include ('Layouts.FormValidationErrors')
        @include ('Layouts.ErrorSuccessAndWarninMessages')

        <form class="form-horizontal" id="OnlineExamForm" role="form" onsubmit="return false;">
          @csrf

          <div class="form-group form-group-sm">
            @include (
              'includes.branch_shift_version_names',
              ['labelColWidth' => 1, 'fieldColWidth' => 2, 'showBranchField' => true]
            )

            @include ('includes.class_names', ['labelColWidth' => 1, 'fieldColWidth' => 2])

            @include ('includes.group_names', ['labelColWidth' => 1, 'fieldColWidth' => 2])
          </div>

          <div class="form-group form-group-sm">
            @include ('includes.section_names', ['labelColWidth' => 1, 'fieldColWidth' => 2])

            @include ('includes.subject_names', ['labelColWidth' => 1, 'fieldColWidth' => 2])

            @include ('includes.academic_years', ['labelColWidth' => 1, 'fieldColWidth' => 2, 'value' => 'id'])

            @include ('includes.exam_type_names', ['labelColWidth' => 1, 'fieldColWidth' => 2])
          </div>

          <div class="form-group form-group-sm">
            @include ('includes.exam_head_names', ['labelColWidth' => 1, 'fieldColWidth' => 2])

            <label class="col-sm-1 control-label">Exam Date </label>
            <div class="col-sm-2">
              <input type="text" class="form-control datepicker" name="exam_date" required autocomplete="off">
            </div>
          </div>

          <div class="form-group form-group-sm">
            <div class="col-sm-12">
              <button type="button" class="btn btn-primary btn-sm btn-block" id="ViewOnlineExams">
                <i class="fa fa-search" aria-hidden="true"></i> Search
              </button>
            </div>
          </div>
        </form>
      </div>
      <div id="online_exam_view_table"></div>
    </div>
  </div>
</div>

<script type="text/javascript">
$(function () {
  $('#branch_and_version').trigger('change');

  $("#ViewOnlineExams").on('click', function() {
    $.ajax({
      type: 'POST',
      url: baseURL + '/!/Task/OnlineExam/View',
      data: $("#OnlineExamForm").serialize()
    }).done(function(response) {
      $("#online_exam_view_table").html(response);
      $("#online_exam_view_table table").DataTable();
    });
  });
});

$('.datepicker').datepicker({
  format: 'yyyy-mm-dd',
  autoclose: true,
  todayHighlight: true
});
</script>

@endsection