@extends('layouts.app')

 @section('breadcrumb', Breadcrumbs::render('jobapplication-list'))
@section('content')   
<section class="card">  
<div class="">
     
    </div>
    <div class="row p-2">
    <div class="col-md-12">
      <header class="card-header bold d-flex justify-content-between px-2 pt-2 pb-3">
          <div>{{trans('headings.jobapplication-list')}}</div>
        
          <div class="col-md-6 text-right">
           
          
      

              
              
               <!-- <button data-toggle="collapse" data-target="#collapse-table-filter-distributor-list" aria-expanded="false" aria-controls="collapse-table-filter-distributor-list" type="button" class="btn btn-sm btn-secondary mr-1"><i class="fa fa-filter"></i> Filter</button> -->
                
             
                <div class="row text-right">
                <div class="col-md-12 text-right pt-1">
                <button data-toggle="collapse" data-target="#collapse-table-filter-tbl-enquiries" aria-expanded="false" aria-controls="collapse-table-filter-tbl-saloons" type="button" class="btn btn-sm btn-dark text-white"><i class="fa fa-filter"></i> Filter</button>
              <!-- <a href="{{ route('export_excel.excel') }}" class="btn btn-sm btn-dark"> Export</a>  -->
              </div>
  
               </div>
               
            </div>
        
      </header>
    </div>
    
  
    
     </div>
    <div class="px-4 bg-light" id="filter-datatable-block__tbl-enquiries">
      <div class="collapse mb-4 mt-4" id="collapse-table-filter-tbl-enquiries">
      
        <div class="">
            <div class="row">
         
            <div class="col-md-3">
                    <div class="form-group">
                    <label>Clinic User</label>
                      
                         {!! Form::select('vacancy_id',getJobTitles(),isset($result->vacancy_id) ? $result->vacancy_id:null, ['class' => ' form-control','placeholder'=>'Select Job title', 'required','id'=>'vacancy_id','data-name'=>'job title']) !!} 
                            @if ($errors->has('vacancy_id'))
                             <p class="help-block">{{ $errors->first('vacancy_id') }}</p>
                             @endif 
                    </div>
                </div>
            </div>
        </div>
        <div class="mt-2 text-right">
          <button data-type="datatable" data-table="tbl-enquiries" class="btn btn-info btn-sm reset-datatable-filter">Clear</button>
          <button data-type="datatable"  id="btnFiterSubmitSearch" data-table="tbl-enquiries" class="btn btn-dark btn-sm datatable-filter-find" id="x">Submit</button>
        </div>
      </div>
    </div>
    <div id="append-filter-text"></div>
        <x-Datatable 
            id="tbl-jobapplications"
            headers="Name,Phone,Email,Gender,Job Title,Age,"
            createUrl="jobapplication-create"
            filter="false"            
            create="false"            
            title="Names" 
                     
        >          
      </x-Datatable>   
     
</section>       

@endsection
@section('script')
<script src="{{asset('modules/admin/jobapplications/datatable.js')}}"></script> 

@endsection
@section('style')
<style>
.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

.switch input { 
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #2196F3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}
</style>
@endsection