@extends('provider.layout.app')

@section('content')

 <div class="col-md-12" style="margin-bottom: 20px;">
    <div class="">
        <div class="row no-margin">
        <div class="pro-dashboard-head">

        </div>

        <div class="pro-dashboard-content">

            <!-- Earning Content -->
            <div class="earning-content gray-bg">
                <div class="container-fluid">


                    <!-- Earning section -->
                    <div class="earning-section earn-main-sec pad20">
                        <!-- Earning section head -->
                        <div class="earning-section-head row no-margin">
                            <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12 no-left-padding">
                                <h3 class="earning-section-tit">@lang('provider.scheduled_rides')</h3>
                            </div>
                        </div>
                        <!-- End of earning section head -->

                        <!-- Earning-section content -->
                        <div class="tab-content list-content">
                            <div class="list-view pad30 ">

                                 <table class="table table-condensed" style="border-collapse:collapse;">
                                    <thead>
                                        <tr>
                                            <th>ID</th>
                                            <th>@lang('provider.rider_id')</th>
                                            <th>@lang('provider.pickup_time')</th>
                                            <th>@lang('provider.rider_name')</th>
                                            <th>@lang('provider.amount')</th>
                                            <th>@lang('provider.status')</th>
                                            <th>@lang('provider.action')</th>
                                        </tr>
                                    </thead>
                                    <tbody>
{{--                                       <div id="rideRequests">--}}
{{--                                            <!-- Scheduled rides will be dynamically inserted here -->--}}
{{--                                        </div>--}}
@if(count($rideRequests) > 0)
    @foreach($rideRequests as $ride)
        <tr>
            <td>{{ $ride->id }}</td>
            <td>{{ $ride->rider_id }}</td> <!-- Rider ID -->
            <td>{{ date('Y D, M d - H:i A', strtotime($ride->created_at)) }}</td>
            <td>
                @if($ride->rider)
                    {{ $ride->rider->name }}
                @else
                    @lang('provider.no_rider_assigned')
                @endif
            </td>
            <td>${{ number_format($ride->amount, 2) }}</td>
            <td>{{ ucfirst($ride->status) }}</td>
            <td>
                <form action="{{ route('provider.updateRideStatus') }}" method="POST">
                    @csrf
                    <input type="hidden" name="ride_id" value="{{ $ride->id }}">

                    <select name="status" required>
                        <option value="in-progress" {{ $ride->status == 'in-progress' ? 'selected' : '' }}>in progress</option>
                        <option value="accepted" {{ $ride->status == 'accepted' ? 'selected' : '' }}>Accepted</option>
                        <option value="completed" {{ $ride->status == 'completed' ? 'selected' : '' }}>Completed</option>
                        <option value="canceled" {{ $ride->status == 'canceled' ? 'selected' : '' }}>Canceled</option>
                    </select>

                    <button type="submit" class="btn btn-primary">Update Status</button>
                </form>

            <!--<form action="{{ url('provider/upcoming/detail') }}" method="GET">-->
            <!--    <input type="hidden" name="request_id" value="{{ $ride->id }}">-->
                <!--    <button type="submit" class="full-primary-btn fare-btn detail_button">-->
            <!--        @lang('provider.detail')-->
                <!--    </button>-->
                <!--</form>-->
            </td>
        </tr>
    @endforeach
@else
    <tr>
        <td colspan="8" class="text-center">@lang('provider.no_ride_found')</td>
    </tr>
@endif
                                    </tbody>
                                </table>


                            </div>

                        </div>
                    <!-- End of earning section -->
                </div>
            </div>
            <!-- Endd of earning content -->
        </div>

        </div>
      </div>
    </div>
 </div>
@endsection

@section('scripts')
<script type="text/javascript">
    $('.detail_button').click(function(){
         $(this).parent().submit();
    });

</script>
@endsection