@extends('admin.layouts.master')
@section('title', 'Dashboard')
@section('content')
    <!-- start page content -->
    <div class="page-content-wrapper">
        <div class="page-content">
            <div class="page-bar">
                <div class="page-title-breadcrumb">
                    <div class=" pull-left">
                        <div class="page-title">New Service Requests</div>
                    </div>
                    <ol class="breadcrumb page-breadcrumb pull-right">
                        <li><i class="fa fa-home"></i>&nbsp;<a class="parent-item" href="{{route('admin.deshbord')}}">Home</a>&nbsp;<i
                                class="fa fa-angle-right"></i>
                        </li>
                        <li class="active">New Service Requests List</li>
                    </ol>
                </div>
            </div>
            <div class="container">
                <div class="row">
                    <div class="col-md-12">
                        <div class="card">
                            <div class="card-header">
                                <div class="row">
                                    <div class="col-md-8">
                                        <p class="text-dark">New Service Requests List</p>
                                    </div>
                                    {{-- <div class="col-md-4 text-right">
 							<a href="{{url('admin/addbuyer')}}" class="btn btn-primary"><i class="fa fa-plus"></i> Add New Buyer</a>
 						</div> --}}
                                </div>
                            </div>
                            <div class="card-body">
                                <div class="table-responsive">
                                <table id="buyertable" class="table table-bordered">
                                    <thead class="thead bg-light text-center">
                                        <tr>
                                            {{-- <th>S.No</th> --}}
                                            <th>SR No</th>
                                            <th>Client Name</th>
                                            <th>Town</th>
                                            <th>Job Name</th>
                                            <th>Service Need Date</th>
                                            <th>Select Status</th>
                                            <th>Job Status</th>
                                            <th>View Job</th>
                                        </tr>
                                    </thead>
                                    <tbody class="tbody text-center">
                                        @foreach ($job as $sjob)
                                            <tr>
                                                {{-- <td>{{ $loop->index+1 }}</td> --}}
							                    <td>{{ $sjob->id }}</td>
                                                <td>{{ $sjob->user->full_name }}</td>
                                                <td>{{ $sjob->town_name }}</td>
                                                <td>{{ $sjob->title }}</td>
                                                <td>{{ $sjob->date }}</td>
                                                <td>
                                                @if($sjob->status ==4 )
                                                    <select class="form-select status_job" aria-label="Default select example" data-id="{{ $sjob->id }}" id="status_job" name="status_job">
                                                        <option value="4"@if($sjob->status ==4 )selected @endif disabled>In Process</option>
                                                    </select>   
                                                @else
                                                    <select class="form-select status_job" aria-label="Default select example" data-id="{{ $sjob->id }}" id="status_job" name="status_job">
                                                        <option value="0" @if($sjob->status ==0 )selected @endif>pending</option>
                                                        <option value="1" @if($sjob->status ==1 )selected @endif>Approved</option>
                                                        <option value="2"@if($sjob->status ==2 )selected @endif>Decline</option>
                                                        <option value="3"@if($sjob->status ==3 )selected @endif>Complete</option>
                                                    </select>   
                                                @endif    
                                                </td>
                                                <td>
                                                    @if ($sjob->status == 0)
                                                        <label class="bg-warning text-white p-2">pending</label>
                                                    @endif
                                                    @if ($sjob->status == 1)
                                                        <label class="bg-success text-white p-2">Approved</label>
                                                    @endif
                                                    @if ($sjob->status == 2)
                                                        <label class="bg-danger text-white p-2">Decline</label>
                                                    @endif
                                                  @if ($sjob->status == 4)
                                                      <label class="bg-info text-white p-2">In Process</label>
                                                    @endif
                                                    @if ($sjob->status == 3)
                                                        <label class="bg-info text-white p-2">Complete</label>
                                                    @endif
                                                </td>
                                                <td>
                                                    <a href="{{ url('/view/client/job/' . $sjob->id) }}"
                                                        class="btn btn-sm btn-danger">
                                                        <i class="fa fa-eye"></i> View
                                                    </a>
                                                    {{-- <a href="" class="btn btn-sm btn-success">
									<i class="fa fa-pencil"></i>
								</a> --}}
                                                    {{-- <a href="" class="btn btn-sm btn-danger">
									<i class="fa fa-trash"></i>
								</a> --}}
                                                </td>
                                            </tr>
                                        @endforeach
                                    </tbody>
                                </table>
                            </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- </div> -->
            </div>
        </div>
        <!-- end page content -->
    @endsection

    @section('scripts')

        <script type="text/javascript">
            $(document).ready(function() {
                $('#buyertable').DataTable({
                    "order":[1,"desc"];
                });

            });

        </script>
        
        <script>
            
        $(document).ready(function(){
                $(document).on('change','.status_job',function() {
                var id = $(this).attr("data-id");
                var status = $(this).find(':selected').val();
                $.ajax({
                    headers: {
                            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                        },  
                    type:"post",
                    url:"{{url('/change/job/status')}}",
                    data:{id:id,status:status},
                    success:function(data){
                        console.log(data);
                        // if (data == 1) {
                            window.location.reload();
                        // }
                    }
                    
                });
            });
        
        })
        </script>

    @endsection