@extends('layouts.main')
@section('title',trans('core.title_dashboard'))
@section('content')
<link rel="stylesheet" href="{{secure_asset('assets/hiremee-revamp/css/b2c.css')}}"> 
<style>
.hm-b2c-asses-card{
  padding: 24px 24px;
  border-radius: 8px;
  background-color: #e8f9d1 !important;
  border: 1px solid #0b6624;
}
.take-buy {
  opacity: 0.6 !important;
  cursor: not-allowed !important;
}
.started {
   opacity: 0.6 !important;
 /* cursor: not-allowed !important;*/
}
.hm-b2c-asses-card-price h5 {
    color: #4CAF50 !important;
    font-size: 20px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    margin-top: 5px !important;
    margin-left: 7px !important;
    margin-right: 3px !important;
}
.hm-b2c-asses-card-price h6 {
    color: #6C6C6C !important;
    margin-left: 4px !important;
    font-weight: 900 !important;
    align-self: end !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
}
.hm-b2c-asses-duration span {
    font-size: 20px !important;
   
}
.offer-description{
    font-size: 12px;
    max-width:82%;
    overflow-wrap: anywhere !important;
    margin-left: auto;
    line-height: normal !important;
    color: #c25d3f !important;
    font-weight: 600;
}

.card .card-block p.overview-txt {
    min-height: 49px;
}

  </style>
<link rel="stylesheet" href="{{secure_asset('assets/hiremee-revamp/css/fontawesome.min.css')}}"> 
<div class="hm-b2c-ds-content">
  <div class="hm-b2c-inner-content">
    <!-- <div class="row">
      <div class="col-xl-12 col-md-12 col-sm-12">
        <div class="hm-b2c-page-header">
          <h2>Our Assessments</h2>
          <br>
          <p>Catering to students/individuals. We offer comprehensive, extensive, and AI-proctored assessments.</p>
        </div>  
      </div>
    </div> -->
    <div class="row">
      <div class="col-md-12 ">
        <div class="card borderless-card m-b-0  bg-f7f7f7">
          <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="card-block" id="js-pro-assessment-list-div">
            {!! $component !!}
          </div>
        </div>
      </div>
      <input type="hidden" id="total_count" value={{count($custom_assessment)}}>
      <div class="col-md-12">
         <div class="text-center">
            <a href="javascript:void(0)" class="btn orange btn-md" id="employer_loader" data-page='2'>Load more...</a>
         </div>
      </div>
    </div>
  </div>  
</div>
<script type="text/javascript" src="{{secure_asset('assets/hiremee-revamp/assets/vendor/fontawesome/js/all.js')}}"></script>
<script>
$('.hme-loading-mask').fadeOut();
$(document).ready(function(){
  if($('#total_count').val()>=6){
    $('#employer_loader').show();
  }else{
    $('#employer_loader').hide();
  }
});
$(document).on('click','#employer_loader', function() {
   $(this).hide();
   $('.hme-loading-mask').fadeIn();
   $.ajax({
     url: "{{ secure_url('candidate/custom-assessments')}}",
     type: "get",
     data: {'limit': 6,'page':$(this).attr('data-page')},
     success: function(response){
       if (response.status == 200) {
         $('#js-pro-assessment-list-div').append(response.component);
         $('.hme-loading-mask').fadeOut();
         if(response.hasmore == false) {
           $('#employer_loader').hide();
           $('#loader').show();
         } else {
           $('#employer_loader').show();
           $('#loader').hide();
           $('#employer_loader').attr('data-page',parseInt($('#employer_loader').attr('data-page'))+1);
         }
       }
     },
     error: function(error){
       swal({
         html: true, 
         title: '<span class="sweet-danger-text">Something Went Wrong</span>', 
         text: "Your action  has been suspended, Sorry for the inconvenience. Please try again later",
         type: "error",
         showCancelButton: false,
         confirmButtonText: "OK",
         closeOnConfirm: false
       });
     }
   });
});
$(document).on('click','.waiting-assessment', function() { 
  swal({
     html: true, 
     title: '<span class="sweet-danger-text">Waiting for schedule</span>', 
     text: "Assessment not mapped",
     type: "warning",
     showCancelButton: false,
     confirmButtonText: "OK",
     closeOnConfirm: false
  });
});
</script>
@endsection