@extends('admin.layouts.cmlayout')
@section('body')
<!-- Begin Page Content -->

<div class="container-fluid">
  <div class="d-sm-flex align-items-center justify-content-between mb-4">
    <h1 class="h3 mb-0 text-gray-800">Bookings</h1>
  </div>
  <div class="row">
        <div class="col-xl-12 col-md-12">
          <div class="card shadow mb-4">
            <div class="card-body">
              <div class="table-responsive">
                <table class="table table-bordered" id="dataTableusers" width="100%" cellspacing="0">
                  <thead>
                    <tr>
                      <th>S.No.</th>
                      <th>Status</th>
                      <th>Quote</th>
                      <th>Listing</th>
                      <th>Booking Date</th>
                      <th>Customer</th>
                      <th>Price</th>
                      <th>Action</th>
                    </tr>
                  </thead>
                  <tbody>
                                            @forelse($booking_list as $booking)
                        <tr>
                        <td class="no-padding"><a href="javascript:void(0);" class="edit-link bookininfo" data-id="{{$booking->id}}">{{$i}}</a></td>
                        <td class="no-padding"><a href="javascript:void(0);" class="edit-link bookininfo" data-id="{{$booking->id}}">
                        @if($booking->payment_status == 3)
                        <span class="badge badge-info">New</span>
                        @elseif($booking->payment_status == 2)
                        <span class="badge badge-info">Updated</span>
                        @else
                        <span class="badge badge-success">Paid</span>
                        @endif
                        </a></td>
                        <td class="no-padding"><a href="javascript:void(0);" class="edit-link bookininfo" data-id="{{$booking->id}}">{{$booking->artist_quote->venu_name}} {{$booking->artist_quote->wedding_date}}</a></td>
                        <td class="no-padding"><a href="javascript:void(0);" class="edit-link bookininfo" data-id="{{$booking->id}}">{{ $booking->artistact->act_name }}</a></td>
                        <td class="no-padding"><a href="javascript:void(0);" class="edit-link bookininfo" data-id="{{$booking->id}}">{{$booking->artist_quote->wedding_date}}</a></td>
                        <td class="no-padding"><a href="javascript:void(0);" class="edit-link bookininfo" data-id="{{$booking->id}}">{{$booking->artist_quote->user->first_name}} {{$booking->artist_quote->user->last_name}} ({{$booking->artist_quote->user->email}})</a></td>
                        <td class="no-padding"><a href="javascript:void(0);" class="edit-link bookininfo" data-id="{{$booking->id}}">&pound; {{ $booking->price }}</a></td>
                        <td>
                        <a href="{{route('booking.edit', $booking->id)}}" class="anchorLess"><i class="fas fa-edit" aria-hidden="true" ></i></a>
                        <a href="javascript:void(0);" class="bookininfo" data-id="{{$booking->id}}"><i class="fas fa-eye info" aria-hidden="true" ></i></a>
                        </td>    
                        </tr>
                                                @empty
                        <tr>
                            <td colspan="7" class="text-center">No record found</td>
                        </tr>
                     @endforelse 
                  </tbody>
                </table>
              </div>
            </div>
          </div>
        </div>
  </div>
</div>
            <div class="modal fade" id="empModal" role="dialog">
                <div class="modal-dialog">
                
                    <!-- Modal content-->
                    <div class="modal-content">
                        <div class="modal-header">
                            <h4 class="modal-title">Booking Info</h4>
                          <button type="button" class="close" data-dismiss="modal">&times;</button>
                          
                        </div>
                        <div class="modal-body">
                          
                        </div>
                        <div class="modal-footer">
                          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                        </div>
                    </div>
                  
                </div>
            </div>
<script type='text/javascript'>
  $(document).ready(function(){

    $('.bookininfo').click(function(){
      var userid = $(this).data('id');

      // AJAX request
      $.ajax({
        url: baseurl+'/admin/booking-detail/'+userid,
        type: 'get',
        success: function(response){ 
          // Add response in Modal body
          $('.modal-body').html(response); 
          // Display Modal
          $('#empModal').modal('show'); 
        }
      });
    });
  });
 </script>
@endsection