{{-- kikcash/history --}}


{{-- <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.19/css/dataTables.bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/responsive/2.2.3/css/responsive.dataTables.min.css"> --}}

<div class="row" id="my_wallet">
    <div class="col-md-12">
        {{-- <h4 class="h4 mb-20">Kik Wallet</h4> --}}
         <a class="profile_xs_back">   <h4 class="h4 mb-20 profile_xs_back">
            <div id="profile_xs_back" class=""> <i class="fa fa-chevron-circle-left text-theme"></i> </div>
            Kik Cash
        </h4></a>
        <div class="profile-padding">

<div class="container">
  <div class="row">
    <div class="col-md-4">
       {{-- <a class="button size-1 style-3 ">
    
                                <span class="button-wrapper">
                                    <span class="icon"><img src="img/icon-1.png" alt="arrow icon"></span>
                                    <span class="text">Filter</span>
                                </span>
                            </a> --}}
    </div>
    <div class="col-md-4 h5 text-right">Filter</div>
    <div class="col-md-4">

<input type="text" name="birthday" value="10/24/1984" class="form-input" />

    </div>


  </div>
</div>

<div class="empty-space col-xs-b15 col-sm-b30"></div>
        
            <div class="filterload">
                <table id="example" class="table table-striped " >
                    <thead>
                        <tr>
                            <th>#</th>
                            <th>Date</th>
                            <th class="visible-xs">  </th>
                            <th class="visible-xs"></th>
                            <th  >Description</th>
                            <th class="text-right" data-title="Kik Back " data-breakpoints="xs">Kik back</th>
                            <th class="text-right" data-title="Kik Pay " data-breakpoints="xs">Kik Pay</th>
                            <th class="text-right" data-title="Kikcash" data-breakpoints="xs">Kik Cash</th>
                        </tr>
                    </thead>
                    <tbody>
                                                @foreach ($kikcash as $cash)
                      
  <tr>
  <td>{{++$x}}</td>
  <td>{{$cash->date}}</td>
  <td class="visible-xs"> </td>
  <td class="visible-xs"></td>
  <td>{{$cash->description}}</td>
  @if($cash->kikback>0)
  <td class="text-right h6" style=" color:green ">{{ number_format($cash->kikback,2)}}</td>
  @else
  <td class="text-right">{{ number_format($cash->kikback,2)}}</td>
  @endif

    @if($cash->kikpay>0)
  <td class="text-right h6" style=" color:red">{{ number_format($cash->kikpay,2)}}</td>
  @else
    <td class="text-right">{{ number_format($cash->kikpay,2)}}</td>
  @endif


@if ($cash->kikback==0 && $cash->kikpay==0)
 
<td class="text-right"> 

0.00
 </td>

@else
 
<td class="text-right h6"> 

0.00
 </td>

@endif

 

  </tr>
     
    @endforeach
 
<tfoot class="hidden-xs"> 
  <tr>
    <td>  </td>
    <td></td>
    <td></td>
    <td class="text-right">{{ number_format($back,2)}}</td>
    <td class="text-right">{{ number_format($pay,2)}}</td>
    <td class="text-right">{{ number_format($balance,2 )}}</td>
  </tr>

</tfoot>
                    </tbody>
                </table>
{{-- 
<h3 class="text-right">Total Earned <span>{{number_format($back,2)}}</span> </h3>
<h3 class="text-right">Total Paid <span>{{number_format($pay,2)}}</span> </h3> --}}
<h1 class="text-right h3">Balance <span>{{number_format($balance,2)}}</span> </h1>

            </div>
        </div>
    </div>
</div>


{{-- <script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.10.19/js/dataTables.bootstrap.min.js "></script>
<script src="https://cdn.datatables.net/responsive/2.2.3/js/dataTables.responsive.min.js"></script> --}}

<script>  
 $('.profile_xs_back').click(function(){
        // alert('working');
        // $('.list-group').css('display', 'block');
        // $('#profile_xs_back').css('display', 'none');
        // $('#include_pages').html('');
             openNav();

    });
// $('.table').DataTable({
//   responsive: true
// }


//   );
// $('.table').DataTable( {
//     responsive: true
// } );
$(document).ready(function(){
   $('.table').footable();
        $('.table').attr('data-paging', 'true');
        });


$(function() {
  $('input[name="birthday"]').daterangepicker({
    opens: 'left'
  }, function(start, end, label) {
    console.log("A new date selection was made: " + start.format('YYYY-MM-DD') + ' to ' + end.format('YYYY-MM-DD'));
  
  
});

$('input[name="birthday"]').on('apply.daterangepicker', function(ev, picker) {
  console.log(picker.startDate.format('YYYY-MM-DD'));
  console.log(picker.endDate.format('YYYY-MM-DD'));

$.ajax({
  method: "GET",
  url: "{{url('kikcash/date/filter')}}",
  data: { start: picker.startDate.format('YYYY-MM-DD'), end: picker.endDate.format('YYYY-MM-DD') }
})
  .done(function(msg) {
    // alert( "Data Saved: " + msg );
    $('.filterload').html(msg);
  });
  
  
  });

});


</script>
<style>
 /*table { 
  width: 100%; 
  border-collapse: collapse; 
}

tr:nth-of-type(odd) { 
  background: #eee; 
}
th { 
  background: #333; 
  color: white; 
  font-weight: bold; 
}
td, th { 
  padding: 6px; 
  border: 1px solid #ccc; 
  text-align: left; 
}


*/







</style>