@extends('layouts.main')
@section('title','Round Zero Assessment')
@section('content')
<style type="text/css">
   .chart {
   width       : 800px;
   height      : 220px;
   }
   .amcharts-chart-div > a {
   display: none !important;
   }
   .amExportButton{
   display: none !important;
   }
</style>
<div class="pcoded-content">
   <div class="hme-loading-mask">
      <div class="hme-loading-container">
         <div class="hme-dual-ring"></div>
         <div>Please wait, Loading...</div>
      </div>
   </div>
   <div class="pcoded-inner-content p-0">
      <div class="main-body">
         <div class="page-wrapper p-0">
            <div class="page-header p-15 m-b-0 pro-page-heading1">
               <div class="page-header-title">
                <h4>Round Zero Assessment Candidate List</h4>
               </div>
               <div class="page-header-breadcrumb p-r-10">
                  <ul class="breadcrumb-title">
                  </ul>
               </div>
            </div>
            <div id="pro-preview-page"></div>
            <div id="rz-assess-status-preview-page"></div>
            <div class="page-body col-md-12">

              <div class="row mb-3 mb-sm-0 justify-content-end mx-0">
                  <div class="col-md-8 pr-0 pr-sm-0 col-12 text-right">
                        <div class="input-group w-50 w-m-100 ml-auto">
                           <input class="form-control" placeholder="Candidate Name" id="search-candidatename" name="search_candidate" type="text" value="" autocomplete="off">
                        </div>
                  </div>
                  <div class="text-right">
                     <button class="btn btn-primary mr-2" id="btn-search-candidate">Submit</button>
                     <button class="btn btn-secondary" id="btn-clear">Clear</button>
                  </div>
               </div>
                  <div class="row">
                     <div class="row col-md-12" id="js_assessment-candidate-series-render">
                      @include('pro.corporate.round-zero-plus.series.candidate-series-report-render')    
                     </div>
                  </div>

     <div class="row">            
        @if($data->hasMorePages())
         <div class="col-md-12 mb-4">
            <div class="text-center">
                  <button class="btn btn-outline-info " style="margin: 15px;" id="js_assess-series-load-more" data-page='2'>Load more...</button>
            </div>
         </div>
         @endif
                  </div>
            </div>
         </div>
      </div>
   </div>
</div>





                                  
@endsection
@section('footer')
<script type="text/javascript">
  
      $(document).on('click','#js-rz-pro-proctoring-pdf-button',function(){

        var test_series_name =$(this).data('series_name');
        var candidate_id =$(this).data('pro_candidate_id');

        $('.hme-loading-mask').fadeIn();
          $.ajax({
          url:"{{ secure_url('pro/rz-series-overall-report') }}",
          type:'post',
          data:{pro_candidate_id:candidate_id,series_name:test_series_name},
          success:function(response){
            $('.hme-loading-mask').fadeOut();
            $('#pro-preview-page').html(response.component);
            $('#pro-preview-large-Modal').modal('show');

          }

      });
    });

      $(document).on('click','#status_view',function(){
         var series_id =$(this).data('series_id');
         var batch_id =$(this).data('batch_id');
          var candidate_id =$(this).data('pro_candidate_id');

          $('.hme-loading-mask').fadeIn();
          $.ajax({
          url:"{{ secure_url('pro/get-rz-assessment_status_view') }}",
          type:'get',
          data:{series_id:series_id,batch_id:batch_id,pro_candidate_id:candidate_id},
          success:function(response){
            $('.hme-loading-mask').fadeOut();
            $('#rz-assess-status-preview-page').html(response.component);
            $('#rz_assess_status_view').modal('show');

          }

      });
      })



  $('#js_assess-series-load-more').on('click',function(){
        $(this).hide();
        data_page=$(this).attr('data-page');
        loadMore(data_page);
    });


  function loadMore(data_page,search=''){
       $('.hme-loading-mask').fadeIn();
             var series_id = "{{Request::segment(3)}}"
        $.ajax({
          url: "{{secure_url('pro/series-candidate-report')}}/"+series_id,
          type: "get",
          data: {'limit': 9,'page':data_page,'search':search,'request_type':'remote'},
          success: function(response){

            if (response.status == 200) {

              if(data_page == 1){
                 $('#js_assessment-candidate-series-render').html(response.component);
              }else{
                 $('#js_assessment-candidate-series-render').append(response.component);
              }
              $('.hme-loading-mask').fadeOut();
               
              if(response.hasmore == false) {
                $('#js_assess-series-load-more').hide();
              } else {
                $('#js_assess-series-load-more').show();
                $('#js_assess-series-load-more').attr('data-page',parseInt($('#js_assess-series-load-more').attr('data-page'))+1);
              }
            }
          },
          error: function(error){
            alertMessage("danger","Your action  has been suspended, Sorry for the inconvenience. Please try again later","Something Went Wrong");
          }
        });
    }


    $('#btn-search-candidate').click(function (e) {
    e.preventDefault();
    var sseriesname =  $('#search-candidatename').val();
    if(sseriesname == "")
    {

    }else{
      loadMore(1,sseriesname);
    } 
  });
  
  $('#btn-clear').click(function (e) {
    e.preventDefault();
    $('#search-candidatename').val('');
    $('#js_assess-series-load-more').attr('data-page',1);
    var sseriesname =  $('#search-candidatename').val();
    loadMore(1,sseriesname);
  });
   
</script>
@endsection