@extends('layouts.main')
@section('title','Jobs')
@section('content')
<style type="text/css">

.jobListpage .events__item-inner:hover {
    box-shadow: 0 2px 18px rgb(0 0 0 / 14%);
    transform: scale(1.01);
}

.jobListpage .events__title {
    font-family: 'Barlow Condensed Medium', sans-serif;
    font-size: 26px;
    font-size: 24px;
    font-weight: 500;
    margin-bottom: 0;
    color: #091e42 !important;
    max-width: 100%;
    line-height: 26px;
}

.jobListpage .events__title small {
    font-size: 15px;
    color: #ff9900;
}

.jobListpage .events__item-inner {
    padding: 24px 24px 16px;
    height: 100%;
    float: left;
    width: 100%;
    margin: 0 0 20px;
}

.jobListpage .job-description {
    background: transparent;
    color: #091e42 !important;
}

.has-description{
     color: #091e42 !important;
}

.jobListpage .events__content {
    flex: 1;
}

.jobListpage .events__more .link-btn {
    width: 100px;
    height: 100px;
    border: 1px solid #e7e7e7;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 10px;
    margin-right: 20px;
}

.jobListpage .events__item-inner:hover {
    box-shadow: 0 2px 18px rgb(0 0 0 / 14%);
    transform: scale(1.01);
}

.link-btn img {
    width: 100%;
}

}
</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">
    <div class="main-body">
      <div class="page-wrapper">
        <div class="page-header">
          <div class="page-header-title">
            <h4>Jobs</h4>
          </div>
          <div class="page-header-breadcrumb">
            <ul class="breadcrumb-title">
              <li class="breadcrumb-item">
                <a href="#!">
                  <span class="hiremee-home"></span>
                </a>
              </li>
              <li class="breadcrumb-item">
                <a href="{{ secure_url('blog-create')}}">
                  Dashboard
                </a>
              </li>
              <li class="breadcrumb-item"><a href="{{ secure_url('getcmsjob')}}">Jobs</a>
              </li>
            </ul>
          </div>
        </div>



      <div class="row">
          <div class="col-md-12">
            <p class="text-custom d-flex align-items-center">
              <div class="col-md-6">
             <h4 class="f-w-400 f-16 m-t-15 g-l-b"> Search Job:</h4>
           </div>
             <div class="col-md-12">
              {!! Form::text('job_title',"",['class'=>'form-control','id'=>'search_job','placeholder'=>'Search any jobs.....']) !!}
            </div>
            </p>
            
          </div>
      </div>

        
        <div class="page-body">
         {{--@if($message = Session::get('success'))
                     <div class="alert alert-success background-success">
                      <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                      <i class="icofont icofont-close-line-circled text-white"></i>
                      </button>
                      <strong>Success!</strong> {{ $message }}
                    </div>
          @elseif($message = Session::get('error'))
          <div class="alert alert-danger background-danger">
              <button type="button" class="close" data-dismiss="alert" aria-label="Close">
              <i class="icofont icofont-close-line-circled text-white"></i>
              </button>
              <strong>Error!</strong>{{ $message }}
            </div>
          @endif--}}
  


           <div class="row">
            <div class="col-xs-12 col-sm-12 col-md-12">
             <!--   <div class="main-accord">
                <div class="course-panel"> -->
                <div id="customized_company_list_render">
                     {!! $component !!}
                </div>
              <!-- </div>   
                </div> -->
              
            </div>
          </div>

        </div>
      </div>
    </div>
  </div>
</div>
@endsection     
@section('footer')
<!--Summernote-->
<script>
  $(document).ready(function(){
    $('.clearfix').find('img').hide();
  });
  
 $(document).on('click','.onoffswitch-checkbox',function (){
    var id=$(this).attr('id');
    var check=$(this).attr('data-status');
    console.log(check,"check");
   swal({
      html: true, 
      title: '<span class="sweet-warning-text">Are You Sure Want to change the status?</span>', 
      type: "warning",
      showCancelButton: true,
      confirmButtonText: "OK",
      closeOnConfirm: false,
    },function(isConfirm){
       if (isConfirm) {
         swal.close();
        if(check==1){
           var status=2;
        }else{
          var status=1;
        }
        console.log(status,"status");
        $.ajax({
          type : "POST",
          url: "{{ secure_url('enablestatus') }}",
          data : {'status':status,'id':id},
          success : function(data)
          {
            if(data=='Success') 
            {
              $('#error_messagesek').text("");
             alertMessage("success","Status Changed Successfully","Success");
             window.location.reload();
            }
            else if(data=='UnSuccess')
            {
              alertMessage("danger","Error","Something Went Wrong");
              
            }
              
          }
          });
      } else {
        if(check=='disable'){
         var data='<input type="checkbox" name="onoffswitch" class="onoffswitch-checkbox" id="'+id+'" data-status="'+check+'" checked><label class="onoffswitch-label" for="'+id+'"><span class="onoffswitch-inner"></span><span class="onoffswitch-switch"></span></label>';
        }else{
         var data='<input type="checkbox" name="onoffswitch" class="onoffswitch-checkbox" id="'+id+'" data-status="'+check+'"><label class="onoffswitch-label" for="'+id+'"><span class="onoffswitch-inner"></span><span class="onoffswitch-switch"></span></label>';
        }
        $("#js-changes-status"+id).html(data);
      }
   });

});


  $(document).on("click", "#js-jobsearch-load-more", function () {
    console.log("yesss");
        var __this = $(this);
        var job_title= $('#search_job').val();
            __data ="&page="+__this.attr('data-page')+"&job_title="+job_title;
            __loader = $("body").find('.hme-loading-mask');

        $.ajax({
            url: "{{ secure_url('getcmsjob') }}",
            dataType: "json",
            beforeSend: function () {
                __this.addClass("d-none");
                __loader.fadeIn()
            },
            data: __data,
            success: function (response) {
                $("body").find("#customized_company_list_render").append(response.html);
                if (response.hasmore) {
                    __this.attr("data-page", response.next_page).removeClass("d-none");
                    __loader.fadeOut();
                     __this.attr("data-page", response.current_page).addClass("d-none");
                } else {
                    __loader.fadeOut();
                }
            }
        });
        return false;
    });


  $(document).on('keyup','#search_job',function(){
     $('.hme-loading-mask').fadeIn();
    var job_title= $(this).val();
    $.ajax({
        url: "{{ secure_url('getcmsjob') }}",
        type: "get",
        data: {'page':$(this).attr('data-page'),'job_title':job_title},
        success: function(response){
            if (response.status == 200) {
           $('#customized_company_list_render').html(response.html);
            $('.hme-loading-mask').fadeOut();
           }
        }, error : function(err){
            $('.hme-loading-mask').fadeOut();
            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,
                confirmButtonColor: '#f0443a',
            });
        }
     })

 });



</script>
@endsection