@extends('layouts.adminapp')
@section('content')

@section('head',__('lng.DriverCommission'))
{{-- Vehicle --}}
<div class="container-fluid">       
    <main >
<x-app-flash/>
    
    <!-- DataTales Example -->
    <div class="card shadow mb-4">
        <div class="card-body py-3 d-flex flex-row align-items-center justify-content-between">
            
            <h6 class="m-0 font-weight-bold text-primary"> <span style="color: red; font-size: large;">{{$Name}}</span>    {{__('lng.DetailReport')}}</h6>
            <div class="input-group w-75 input-search" >
              {{-- <input type="text"  oninput="Search(this.value)" class="form-control bg-light small" placeholder="{{__('lng.SearchFor')}}" aria-label="Search" aria-describedby="basic-addon2">
              <div class="input-group-append">
                <button class="btn btn-primary" type="button">
                    <i class="mdi mdi-magnify fa-sm"></i>
                </button>
              </div> --}}
              <a href="{{route('DriverCommission.index')}}" class="btn btn-primary btn-icon-split ml-auto">
                <span class="icon text-white-50">
                    <i class="mdi mdi-arrow-left"></i>
                </span>
                <span class="text">Back</span>
                </a>
            </div>
            
            {{-- <a href="{{route('CustomerPayment.create')}}" class="btn btn-primary btn-icon-split">
                <span class="icon text-white-50">
                    <i class="mdi mdi-plus"></i>
                </span>
                <span class="text">{{__('lng.CreateNew')}}</span>
            </a> --}}
        </div>
        <hr>
        <div class="card-body">
            <div class="table-responsive" id="result-tbl">
                <table class="table table-bordered" id="dataTable" width="100%" cellspacing="0">
                    <thead>
                        <tr>
                            <th>{{__('lng.SiNo')}}</th>
                            <th>{{__('lng.Driver')}}</th>
                            <th>{{__('lng.Date')}}</th>
                            <th>{{__('lng.Amount')}}</th>
                            <th>{{__('lng.Destination')}}</th>
                        </tr>
                    </thead>
                    <tbody>
    @php $si = 0; @endphp

    @foreach($DriverCommissions as $DriverCommission)

        {{-- Skip rows based on amount --}}
        @if(
            ($id == 1 && ($DriverCommission->driver_amount ?? 0) == 0) ||
            ($id == 2 && ($DriverCommission->cleaner_amount ?? 0) == 0)
        )
            @continue
        @endif

        <tr>
            @php
                $value = date("m-d-Y", strtotime($DriverCommission->date));
            @endphp

            <td>{{ ++$si }}</td>

            {{-- Name --}}
            <td>
                @if($id == 2)
                    {{ $DriverCommission->cleaner->name ?? '' }}
                @else
                    {{ $DriverCommission->employee->name ?? '' }}
                @endif
            </td>

            {{-- Date --}}
            <td>{{ $value }}</td>

            {{-- Amount --}}
            <td>
                @if($id == 1)
                    {{ $DriverCommission->driver_amount ?? 0 }}
                @else
                    {{ $DriverCommission->cleaner_amount ?? 0 }}
                @endif
            </td>

            {{-- Destination --}}
            <td>{{ $DriverCommission->destination ?? '' }}</td>
        </tr>

    @endforeach
</tbody>
                </table>
                <p class="mb-0">{{$DriverCommissions->count()}} {{__('lng.Items')}}</p>
            </div>
        </div>
        <hr>
        <div class="card-body " id="card-footer">
            
            <div class="table-responsive">
                {{-- {{$CustomerPayments->links()}} --}}
            </div>
        </div>
    </div>


    <script>
        function Search(Value) {
            document.getElementById('card-footer').style.display="none";
            $.ajax({
                url: '{{ route('SearchVehicleDetails') }}',
                method: "get",
                data: {_token: '{{ csrf_token() }}',Value:Value},
                success: function (response){  
                // alert(response);
                    document.getElementById('result-tbl').innerHTML=response; 
                }
            }); 
        }
    </script>
    </main></div>
@endsection