@extends('layouts.main')
@section('title',trans('core.title_invites_sent'))
@section('content')
<style>
.adjust-arrows:after {
  top:25px !important;
}
.dynamic-proctoring{
  height: 300px;
  overflow-y: auto;
  overflow-x: hidden;
}
</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>Manage Candidate</h4>
          </div>
          <div class="page-header-breadcrumb p-r-10">
            <ul class="breadcrumb-title">
              <li class="breadcrumb-item">
                <a href="{{ (Auth::guard('corporate')->user()->user_type == 1) ? secure_url('company/dashboard') : secure_url('recruiter/dashboard') }}">
                    <span class="hiremee-home"></span>
                </a>
              </li>
              <li class="breadcrumb-item"><a href="{{ secure_url('pro/invites-sent') }}">Manage Candidate</a></li>
            </ul>
          </div>
        </div>
        <div class="page-body">
          <div class="pageheader">
            <div class="row">
              <div class="col col-md-6 d-flex align-items-center">
                Candidates Invites Re-Send
              </div>
              
              <div class="col col-md-6 d-flex align-items-center justify-content-end">
                <button class="btn btn-danger c-white candidate-bulk-delte">Delete</button>
                <button id="js-pro-downloadinvitesent-report" class="btn btn-primary pro-green c-white with-icon" @if($candidate_lists->count() == 0) disabled="disabled" @endif><span class="btn-icon hmepro-icon-excel"></span> Download Report</button>
              </div>
            </div>
          
            <!-- @author Naveenkumar S @version 21.0 -->
            <div class="d-none" id="report_filter_form">
              <div class="row">
                <div class="col col-md-6 d-flex c-white align-items-center"></div>
                <div class="col col-md-6 d-flex align-items-center justify-content-end">
                @php
                  $filter_range = HireMeeHelper::countBasedLimiter($candidate_lists->total(),getenv('CANDIDATEEXCEL_DOWNLOAD_ROWS'));
                @endphp
                  <div class="col col-md-4">
                    <label class="m-t-5 m-b-0">Select Result Range</label>
                    {!! Form::select('rprt_filter_range',$filter_range,'',['class'=>'form-control','id'=>'rprt_filter_range']) !!}
                  </div>
                  <div class="col col-md-3 m-t-20">
                    <button id="js-pro-invitesent-excel-report" class="btn btn-primary pro-green c-white with-icon"><span class="btn-icon hmepro-icon-excel"></span> Download</button>
                  </div>
                </div>
              </div>
            </div>
            <!-- Start -->
            {!! Form::open(["url" =>secure_url('pro/invites-sent'), "method" => "GET", "id" => "invite_form", "name" => "invite_form"]) !!}
              <div class="row" style="margin-top: 26px;">
                <div class="col-md-5 text-left f-w-400">
                  <p class="l-h-0" >Assessment Category<span class="text-danger">*</span> :</p>
                  <div class="input-group">
                    <div class="pos-relative">
                      <div class="form-radio">
                        <div class="radio radiofill radio-primary radio-inline" style="margin-right: 10px;">
                          <label>
                            <input name="assessment_type" class="assessment_type" value="1" data-bv-field="member" type="radio" {{ (isset($assessment_type) && $assessment_type==1) ? 'checked' : '' }}><i class="helper"></i>Corporate
                          </label>
                        </div>
                        <div class="radio radiofill radio-primary radio-inline" style="margin-right: 10px;">
                          <label>
                            <input name="assessment_type" class="assessment_type" value="2" data-bv-field="member" type="radio" {{ (isset($assessment_type) && $assessment_type==2) ? 'checked' : '' }}><i class="helper"></i>Assessment Inventory
                          </label>
                        </div>
                        <div class="radio radiofill radio-primary radio-inline" style="margin-right: 10px;">
                          <label>
                            <input name="assessment_type" class="assessment_type" value="3" data-bv-field="member" type="radio" {{ (isset($assessment_type) && $assessment_type==3) ? 'checked' : '' }}><i class="helper"></i>Advanced Coding
                          </label>
                        </div>
                      </div>
                    </div>
                  </div>   
                </div>
                    
                <div class="col-md-3 col-lg-3 text-left f-w-400">
                  <p class="l-h-0">Assessment Name:</p>
                  <div class="hme-select-style adjust-arrows">
                   {!! Form::select('assessment', $assessmentdrops, $assessment_id ? $assessment_id : '', ['class' => 'form-control js-select2', 'id'=>'assessment', 'placeholder' => 'Select Assessment']) !!}
                   <!--  <span class="input-group-addon">
                      <i class="icofont icofont-calendar"></i>
                    </span> -->
                  </div>
                </div>

                <div class="col-md-2 text-left f-w-400">
                  <p class="l-h-0">Start Date <span class="text-danger">*</span> :</p>
                  <div class="input-group">
                    {!! Form::text('start_date',$start_date ? $start_date : '',['class'=>'form-control','placeholder'=>'2020-10-22', 'id' => 'start_date']) !!}
                    <span class="input-group-addon">
                      <i class="icofont icofont-calendar"></i>
                    </span>
                  </div>
                </div>

                <div class="col-md-2 text-left f-w-400"><p class="l-h-0">End Date <span class="text-danger">*</span> :</p>
                  <div class="input-group">
                    {!! Form::text('end_date',$end_date ? $end_date : '',['class'=>'form-control','placeholder'=>'2020-10-22', 'id' => 'end_date']) !!}
                    <span class="input-group-addon" id="">
                      <i class="icofont icofont-calendar"></i>
                    </span>
                  </div>
                </div>
              </div>

              <!-- @author Naveenkumar Seker @version 24.0 -->
              <div class="row" style="margin-top: -10px;">
                <div class="col-md-3 text-left f-w-400" style="min-width: 26.2%;"><p class="l-h-0"> Search Terms:</p>
                  <div class="input-group">
                    {!! Form::text('search_terms',$search_terms ? $search_terms : '',['class'=>'form-control','placeholder'=>'Testpin/candidate name/email/contact', 'id' => 'testpin']) !!}
                  </div>
                </div>

                <div class="col-md-2 col-lg-3 text-left f-w-400">
                  <p class="l-h-0"> Invite Status:</p>
                  <div class="hme-select-style adjust-arrows">
                    {!! Form::select('invite_status', ['1'=>'Yet to Update','2'=>'Delivered','3'=>'Failed'], $invite_status ? $invite_status : '', ['class' => 'form-control js-select2', 'id'=>'invite_status', 'placeholder' => 'All Status']) !!}
                  </div>
                </div>
                           
                <div class="col-md-5">
                  <div style="margin-top: 16px; margin-bottom: 5px; display: flex;justify-content: flex-end;">
                      <button class="btn btn-primary" type="submit" id="js-btn-submit"  style="color: white;margin-right: 5px;">Search</button>
                      <a href="{{secure_url('pro/invites-sent')}}" class="btn btn-info">Clear</a>
                  </div>
                </div>
              </div>
            {!! Form::close() !!}
          </div>
        </div>
        <!-- End -->
      </div>

      <table class="table table-striped pro-list-table tbl-truncate-break">
        <thead class="bgn-gradient-blue">
          <tr>
            <th scope="col">
              <div class="p-relative">
                <label class="container-checkbox-pro">
                  <input type="checkbox" id="checkAll">
                  <span class="checkmark-round"></span>
                </label>
              </div>
            </th>
            <th scope="col">Name</th>
            <th scope="col">Email Address</th>
            <th scope="col">Assessment Name</th>
            <th scope="col">Test Pin</th>
            <th scope="col">Mobile No.</th>
            <th scope="col">Start Date</th>
            <th scope="col">End Date</th>
            <th scope="col">Proctoring Settings</th>
            <th scope="col">Action</th>
            <th scope="col">Invite Status</th>
          </tr>
        </thead>
        <tbody id="js_inviteresent_listing_container">
          @include('corporate.invites-resent_render')
        </tbody>
      </table>
    </div>

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

<div class="md-modal m-w-440 md-effect-1" id="proctoring-settings">
  <div class="md-content">
    <button type="button" class="btn btn-primary btn-icon-custom waves-effect md-close login-close-btn hme-modal-close" id="js-invites-pending-modal-close"><span class="hiremee-multiply f-18"></span></button>
    <div class="row p-l-15 p-r-15">
      <div class="col-sm-12 col-lg-12">
        <div class="page-header-title m-t-10 m-b-20">
          <h4 class="g-l-b">Proctoring Settings</h4>
        </div>

        <div class="dynamic-proctoring"></div>
      </div>
    </div>
  </div>
</div>

<div class="md-modal m-w-440 md-effect-1" id="invites-pending-edit">
  <div class="md-content">
    <button type="button" class="btn btn-primary btn-icon-custom waves-effect md-close login-close-btn" id="js-invites-pending-edit-close"><span class="hiremee-multiply f-18"></span></button>
    <div class="row p-l-15 p-r-15">
      <div class="col-sm-12 col-lg-12">
        <div class="page-header-title m-t-10 m-b-20">
          <h4 class="g-l-b">Edit Candidate Information</h4>
        </div>
        <div class="row form-group">
          <div class="col-md-6 text-left f-w-400 m-b-8"> FirstName :</div>
          <div class="col-md-6 text-left f-w-400 m-b-8"> LastName :</div>
          <div class="col-md-6">
            <input type="text" name="feedback_subject" class="form-control js-tooltip-validate candidate_name" placeholder="Rohit Kumar" id="feedback_subject" value="">
            <span id="feedback_subject-error"></span>
          </div>
          <div class="col-md-6">
            <input type="text" name="feedback_subject" class="form-control js-tooltip-validate candidate_last_name" placeholder="Rohit Kumar" id="feedback_subject" value="">
            <span id="feedback_subject-error"></span>
          </div>
        </div>
        <div class="row form-group">
          <div class="col-md-12 text-left f-w-400 m-b-8">Email :</div>
          <div class="col-md-12">
            <input type="text" name="feedback_subject" class="form-control js-tooltip-validate candidate_email" placeholder="your@email.com" id="feedback_subject" value="">
            <span id="feedback_subject-error"></span>
          </div>
        </div>
        <div class="row form-group">
          <div class="col-md-12 text-left f-w-400 m-b-8">Mobile No. :</div>
          <div class="col-md-12">
            <input type="text" name="candidate_mobile" class="form-control js-tooltip-validate candidate_mobile" placeholder="+91 9876543210" maxlength="10" id="candidate_mobile" value="">
            <span id="candidate_mobile-error"></span>
          </div>
        </div>
        <div class="row m-t-20">
          <input type="hidden" name="candidate_id" class="candidate_id" value="">
          <div class="col-sm-12 d-flex justify-content-center">
            <button type="submit" class="btn btn-primary f-16 pull-right invite_candidate_update"> Update Information</button>
          </div>
          <div class="col-md-2"></div>
        </div>
      </div>
    </div>
  </div>
</div>

<div class="compose-message " id="show-message"><i class="fa fa-external-link"></i> Send Invite</div>
<div id="js-corp-notification-sidebar" class="users1 p-chat-user showChat-msg">
  <div class="compose-message-title" id="show-message"><i class="fa fa-external-link"></i> Send Invite 
    <button type="button" class="close" aria-label="Close">
      <span class="hmepro-icon-minus c-white"></span>
    </button>
  </div>

  <div class="had-container">
    <div class="card card_main p-fixed bg-e5e5e5 users-main1">
      <div class="user-box">
        <div class="main-friend-list p-l-15 p-t-30 p-r-15 bg-f7" id="js-corporate-notification-component">
          <div class="form-group mb-4">
            <label>Custom Message </label>
            <div class="pos-relative">
              @if(isset($custom_message)&&(!is_null($custom_message['custom_mapping'])) && (!empty($custom_message->email_template_content)))
                <div class="feedback_message" rows="5" name="feedback_message" id="feedback_message"> 
                  {!! $custom_message->email_template_content !!}
                </div>
              @else
                <textarea class="form-control max-textarea feedback_message" rows="5" name="feedback_message" id="feedback_message" placeholder="Your message (Suggestions, Issues, Improvements etc,.)"></textarea>
              @endif
            </div>
          </div>
          <div class="row search-button-bottom1 d-flex justify-content-center" style="max-width:29.5% !important;">
            <div class="col-md-12">
              @php $is_bulk_enabled = 0; @endphp
              @if(isset($is_filtered) && $is_filtered==1 && $overall_count>0)
                @php $is_bulk_enabled = 1; @endphp
                <input type="hidden" name="isfiltered" value="1">
              @endif
              <button class="col-md-4 btn btn-sm f-14 text-333 btn-block btn-primary resent-invites mr-2" type="button" id="js-btn-submit-invites" style="white-space: normal;" data-isbulk="{{ $is_bulk_enabled }}"> <i class="hiremee-sent-mail"></i> Send </button> <span id="send_promp_msg" class=" {{ !$is_bulk_enabled ? 'd-none' : 'd-flex' }}" style="text-align: start;">This will send invite to all {{ $overall_count ?? 0 }} candidates</span>
              <!-- <button class="col-md-12 btn btn-sm f-14 text-333 btn-block btn-primary resent-invites" style="white-space: normal;" id=""><i class="hiremee-sent-mail"></i> Send Invitation</button> -->
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

<!-- Upgrade to PRO -->
<div class="md-overlay"></div>
<script>
$('#js-inviteresentlisting-load-more').on('click',function(){
  $(this).hide();
  data_page=$(this).attr('data-page');
  loadMore(data_page);
});

function loadMore(data_page){
       $('.hme-loading-mask').fadeIn();
      //@author Naveenkumar S @version 21.0
       var assessment = $("#assessment").val();
       var start_date = $("#start_date").val();
       var end_date = $("#end_date").val();
 
        $.ajax({
          url: "{{secure_url('pro/invites-sent')}}",
          type: "get",
          data: {'limit': 50,'page':data_page,'request_type':'remote','assessment':assessment,'start_date':start_date,'end_date':end_date},
          success: function(response){

            if (response.status == 200) {
              if(data_page == 1){
                  $('#js_inviteresent_listing_container').html(response.component);
               }else{
                  $('#js_inviteresent_listing_container').append(response.component);
               }
              $('.hme-loading-mask').fadeOut();
               
              if(response.hasmore == false) {
                $('#js-inviteresentlisting-load-more').hide();
              } else {
                $('#js-inviteresentlisting-load-more').show();
                $('#js-inviteresentlisting-load-more').attr('data-page',parseInt($('#js-inviteresentlisting-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");
          }
        });
    }  


$(document).ready(function(){


  $('.compose-message').on('click',function(){
  
  var visible = $('.showChat-msg').is(':visible');
  if(visible = "true")
  {

    $('.compose-message').hide();
  }
    });
  $('.compose-message-title').on('click',function(){
  $('.compose-message').show();
   });


});

$('#js-pro-invitesent-excel-report').on('click',function(){
  $('.hme-loading-mask').fadeIn();
  //@author Naveenkumar S @version 21.0
  var assessment = $("#assessment").val();
  var start_date = $("#start_date").val();
  var end_date = $("#end_date").val();
  var range = $("#rprt_filter_range").val();
  var testpin = $("#testpin").val();
  var invite_status = $("#invite_status").val();
  $.ajax({
    url:"{{ secure_url('pro/candidate-download-excel') }}",
    type:"get",
    data:{type:'invite_sent','assessment':assessment,'start_date':start_date,'end_date':end_date,'skip_count':range,'search_terms':testpin,'invite_status':invite_status},
    success:function(response,textstatus,request){
      var a = document.createElement("a");
      a.href = response.file; 
      a.download = response.name;
      document.body.appendChild(a);
      a.click();
      a.remove();  
      $('.hme-loading-mask').fadeOut();   
    },
     error: function (ajaxContext) {
        toastr.error('Export error: '+ajaxContext.responseText);
      }
  });
});

//@author Naveenkumar S @version 21.0
// Start
$(function(){
  @if(isset($assessment_type) && $assessment_type==2 && isset($assessment_id))
      assessmentTypeChange('initial');
  @elseif(isset($assessment_type) && $assessment_type==3 && isset($assessment_id))
      assessmentTypeChange('initial');
  @endif
        $("#start_date").bootstrapMaterialDatePicker({
          time:false,
          clearButton: true,
          format: 'YYYY-MM-DD'
        }).on('change', function(e, date) {

          $("#end_date").val("");
          $("#end_date").bootstrapMaterialDatePicker('setMinDate', date);
        });
    });

    $(function() {
      $("#end_date").bootstrapMaterialDatePicker({
          time:false,
          clearButton: true,
          format: 'YYYY-MM-DD'
        }).on('change', function(e, date) {
          var start   = $("#start_date").val();
          var end   = $("#end_date").val();
          var startDateArr = start.split("-");
          var endDateArr   = end.split("-");
          var startDate    = new Date(startDateArr[0],startDateArr[1],startDateArr[2]);
        var endDate    = new Date(endDateArr[0], endDateArr[1], endDateArr[2]);
          if(endDate < startDate){
            $("#end_date").val("");
            console.log('wrong');
          }

        });
    });

$(function() {
  @if(isset($assessment_type) && $assessment_type==2 && isset($assessment_id))
    assessmentTypeChange('initial');
  @elseif(isset($assessment_type) && $assessment_type==3 && isset($assessment_id))
    assessmentTypeChange('initial');
  @endif
  $('.tooltip').tooltip('hide');
  $('#js-btn-submit').click(function() {
    if($("#testpin").val() != ''){
      $("#invite_form").validate().cancelSubmit = true;
      $("#invite_form").submit();
    }else{
      $("#invite_form").validate({
        ignore: [],
        rules: {
              assessment: {
                required: false
              },
              start_date: {
                required: false
              },
              end_date: {
                required: false
              }
            },
        invalidHandler: function (event, validator) {

          },
          errorElement: 'span',
        errorPlacement: function(error, element) {
                var parent = $(element).parent();
                $('.tooltip').tooltip('hide');          
          $("body").find('#'+error[0].id+'-custom').remove();

          parent.append('<span data-position="left" data-delay="0" data-animation="false" class="js-tootletip hiremee-info text-danger tooltip-validate" id="'+error[0].id+'-custom" data-toggle="tooltip" data-original-title="'+error[0].innerText+'" data-trigger="hover" style="margin-right:25px;"></span>');
          
          $('#'+error[0].id+'-custom').tooltip(tooltip_direction_options);

        },
        submitHandler: function(form) {
              form.submit();
            }
      });
    }
  });
});
    
$('.assessment_type').change(function(e) {
  e.preventDefault();
  assessmentTypeChange(); 
});

$('#btn-clear').click(function() {
  $("#assessment").val(null).trigger('change.select2');
  $("#start_date").val("");
  $("#end_date").val("");
});

$(document).on("click","#js-pro-downloadinvitesent-report",function(){
  if($("#report_filter_form").hasClass('d-none')){
    $("#report_filter_form").removeClass('d-none');
  }else{
    $("#report_filter_form").addClass('d-none');
  }
});
// End

function assessmentTypeChange($type=''){
  var opt = $('.assessment_type:checked').val();
  $.ajax({
     url:"{{ secure_url('company/get-cor-asessment-data') }}",
    data:{'type':opt},
    dataType:'json',
    type:'get',
    beforeSend:function(){
      $('.hme-loading-mask').fadeIn();
    },
    success:function(res){
       $('.hme-loading-mask').fadeOut();
       $('#assessment option').remove();
       $('#assessment').html('<option value="">Select Assessment</option>'+res.response);
       if($type=='initial')
       {
            $('#assessment').val('{{ $assessment_id }}');
       }
     },
     error: function(error){
      $('.hme-loading-mask').fadeOut();
     }
  })
} 
</script>
@endsection