@extends('layouts.deliverymanagerapp')
@section('content')
<x-flash/>
<div class="card mb-4">
    <div class="card-header">
        <div class="d-flex">
            <div class="mr-auto p-2 align-self-center"><h4>All Orders</h4></div>
            <div class="p-2"> 
                <div class="input-group d-flex align-self-center">
                    <input type="text" style=" background-color: #ffff !important" id="searchorder"  oninput="searOrder()" class="form-control bg-light border-0 small" placeholder="Search order number" aria-label="Search" aria-describedby="basic-addon2">
                    <div class="input-group-append">
                    <button class="btn btn-primary" type="button">
                    <i class="fas fa-search fa-sm"></i>
                    </button>
                    </div>
                </div>
            </div>
            <div class="p-2">
            <select class="custom-select" id="status" onchange="statusChange()" name="status">
                    <option value="null">Choose Status</option>
                    @foreach(App\Status::get() as $status)                  
                     <option value="{{$status->id}}">{{$status->status}}</option>
                     @endforeach
            </select>
            </div>   
        </div>
    </div>
    <div class="card-body">
        <div class="table-responsive">
            <table class="table">
                <thead>
               
                    <tr>
                        <th>SI No</th>
                        <th>Order No</th>
                        <th>Order Date</th>
                        <th>Customer</th>
                        <th>Customer Contact</th>
                        <th>Store</th>
                        <th>Store Contact</th>
                        <th>Status</th>
                        <th colspan="2">Actions</th>                        
                    </tr>
                </thead>
                <tbody id="orders_tbl">
                @php $i=1; @endphp
                @if($Orders)
                    @foreach($Orders as $Order)
                    <tr>
                       <td>{{$i++}}</td>
                       <td>#{{$Order->id}}</td>
                       @php $date = date("M j, Y, g:i a",strtotime($Order->order_date));@endphp
                       <td>{{$date}}</td>
                       <td>{{$Order->DeliveryDetail->name}}</td>
                       <td>{{$Order->DeliveryDetail->phone}}</td>
                       <td>{{$Order->store->title}}</td>
                       <td>{{$Order->store->user->whatsapp}}</td>
                       <td>{{$Order->status->status}}</td>
                       <td><a class="btn btn-info" href="{{route('Order.detailedView',$Order->id)}}">View</a></td>
                    </tr>
                    @endforeach
                    @endif
                </tbody>
            </table>
        </div>
    </div>
    <div class="card-footer">
       {{-- <div class="d-flex justify-content-end font-weight-bold"><h5>Total:  {{$Inventories->Count()}}</h5></div> --}}       
    </div>
</div>

<script>
function searOrder(){

var items = document.getElementById("searchorder").value;

$.ajax({
    url: '{{ route('searchOrders') }}',
    method: "get",
    data: {_token: '{{ csrf_token() }}',searchitems:items },
                success: function (response){
                 document.getElementById('orders_tbl').innerHTML=response; 
                
                    }
            });   

}

function statusChange(){

    var statusid = document.getElementById("status").value;
    $.ajax({
    url: '{{ route('searchOrdersStastus') }}',
    method: "get",
    data: {_token: '{{ csrf_token() }}',statusid:statusid },
                success: function (response){
                 document.getElementById('orders_tbl').innerHTML=response; 
                
                    }
            });   
    
}

</script>

@endsection