@extends('dashboard.layouts.app')
@section('css')
<style>
    img{
        object-fit:cover;
    }
</style>
@endsection
@section('content')
<div class="page-titles">
    <h5 class="font-medium m-b-0">Leaves</h5><br>
  <div class="d-flex align-items-center">
      <h5 class="font-medium m-b-0"><a href="{{url('/dashboard/leave/create')}}" class="waves-effect waves-light btn">Add leave</a></h5>
      <div class="custom-breadcrumb ml-auto">
          <a href="{{url('/dashboard')}}" class="breadcrumb">Home</a>
          <a href="{{url('/dashboard/leave')}}" class="breadcrumb">Leaves</a>
      </div>
  </div>
</div>
<div class="container-fluid">
  <div class="row">
      <div class="col s12 l12">
          <div class="card df">
              <div class="card-content">
                  
                  @if ($message = Session::get('success') )
                  <div class="success-alert-bar p-15 m-b-20 green white-text">
                    {{ $message }}
                </div>
            
              @endif
              <div class="table-outer">
              <table id="zero_config1" class="responsive-table display" style="width:100%">
                <thead>
                    <tr>
                        <th>#</th>
                        <th>Name</th>
                        <th>Department</th>
                        <th>Leaves</th>
                        <th></th>
                    </tr>
                </thead>
                <tbody>
                    
                    
                </tbody>
            </table>



      </div>

              </div>
          </div>
      </div>
  </div>
</div>
@endsection
@section('js')
<script>
    var contactTable = $('#zero_config1').DataTable({
           processing: true,
           serverSide: true,//changed to false to download all data csv
          // pageLength: 10,
         //lengthMenu: [[10, 25, 50, -1], [10, 25, 50, "All"]],
           paging:true,
           ajax:{
                url: "{{ url('dashboard/leave/leave-list') }}",
               
            },
          
           columns: [
                    {data: 'DT_RowIndex', name: 'DT_RowIndex',orderable: false, searchable: false},
                    { data: 'name', name: 'doctor_name' },
                    { data: 'department', name: 'departments.dept_title' },
                    { data: 'leaves', name: 'leaves' },
                    
                    {data: 'action', name: 'action', orderable: false, searchable: false},
                 ],
                 "drawCallback": function( settings ) {
                    $('.dropdown-trigger').dropdown();
       
    },
    //dom: 'lBfrtip',//to hide lengthmenu dropdown use dom:Bfrtip
        // Configure the drop down options.
        // lengthMenu: [
        //     [ 10, 25, 50, -1 ],
        //     [ '10 rows', '25 rows', '50 rows', 'Show all' ]
        // ],
    
        
        });

    $(".card").on('click','.deleteRecord',function (e) {
        e.preventDefault();

        var ele = $(this);
        var id = ele.attr("data-id");
        if(confirm("Are you sure you want to remove?")) {
            $.ajax({
                url: '{{ url('dashboard/leave/delete') }}',
                method: "DELETE",
                data: {_token: '{{ csrf_token() }}', id: ele.attr("data-id")},
                success: function (response) {
                    alert('Deleted');
                    $('#zero_config1').DataTable().draw();
                }
            });
        }
    });
</script>
@endsection