@extends('layouts.master')
@section('content')
<input type="hidden" id="a_u_a_b_t" value="{!! $a_user_api_bearer_token !!}">
<input type="hidden" id="userId" value="{{Auth::user()->id}}">
<input type="hidden" id="orderid" value="">
<script type="text/javascript">
localStorage.setItem('a_u_a_b_t', $('#a_u_a_b_t').val());
</script>
<div class="modal" id="confirm" tabindex="-1" role="dialog">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title text-white">Are your Sure You Want To Cancel Your Current Booking</h5>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-danger" onclick="cancelBooking()">Confirm</button>
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>
<!-- Button trigger modal -->
<!-- Modal -->
<div class="modal fade" id="ratingModel" tabindex="-1" role="dialog" aria-labelledby="ratingModel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel"></h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>

      <div class="modal-body">
        <p class="ratingmsg text-danger"></p>
        <div align="center">
          <i class="fa fa-star fa-2x" data-index="0"></i>
          <i class="fa fa-star fa-2x" data-index="1"></i>
          <i class="fa fa-star fa-2x" data-index="2"></i>
          <i class="fa fa-star fa-2x" data-index="3"></i>
          <i class="fa fa-star fa-2x" data-index="4"></i>
        </div>
        <br>
        <label for="exampleFormControlTextarea3">Your review</label>
        <textarea class="form-control" id="reviewinput" value="" rows="5" required></textarea>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <button type="submit" id="saveChanges" class="btn btn-primary">Save changes</button>
      </div>
    </div>
  </div>
</div>
<!--Modle end-->

<!-- <div class="container current-booking-container">
   <h3 class="mb-3">Current Bookings</h3>
   <div style="overflow-x:auto;" id="currrentBooking">
      <table class="table">
         <thead>
            <tr>
               <th scope="col">Profile</th>
               <th scope="col">Professional Name</th>
               <th scope="col">Booking Date</th>
               <th scope="col">Booking Time</th>
               <th scope="col">Status</th>
               <th scope="col">Action</th>
            </tr>
         </thead>
         <tbody id="current-booking-table-body">

         </tbody>
         <div id="no-booking-found-msg"></div>
      </table>
   </div>
</div> -->
<nav class="navbar navbar-expand-md navbar-light bg-light">
  <a class="navbar-brand ml-5" href="{{route('mybookings')}}"><i class="fa fa-home" aria-hidden="true"></i>
    Dashboard</a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav">
    <span class="navbar-toggler-icon"></span>
  </button>
  <div class="collapse navbar-collapse" id="navbarNav">
    <!-- <ul class="navbar-nav mr-auto">
            <li class="nav-item active">
                <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
            </li>
            <li class="nav-item">
                <a class="nav-link" href="#">Features</a>
            </li>
            <li class="nav-item">
                <a class="nav-link" href="#">Pricing</a>
            </li>
        </ul> -->
    <ul class="navbar-nav mr-5 ml-auto">
      <li class="nav-item active">
        <a class="nav-link" href="{{'address'}}"><button class="btn btn-sm btn-outline-dark">Manage Address</button></a>
      </li>
      <li class="nav-item active">
        <a class="nav-link"><button class="btn btn-sm btn-dark">Current Bookings</button></a>
      </li>
      <li class="nav-item active">
        <a class="nav-link" href="{{route('profile')}}"><button class="btn btn-sm btn-outline-dark">My
            Profile</button></a>
      </li>
      <li class="nav-item active">
        <a class="nav-link" href="{{route('showallbookings')}}"><button class="btn btn-sm btn-outline-dark">All
            Bookings</button></a>
      </li>
      <li class="nav-item active">
        <a class="nav-link" href="{{ route('logout') }}"
          onclick="event.preventDefault();document.getElementById('logout-form').submit();">
          <button class="btn btn-sm btn-outline-danger">Log Out</button></a>
        <form class="" id="logout-form" action="{{ route('logout') }}" method="POST" style="display: none;">
          @csrf
        </form>
      </li>
    </ul>
  </div>
</nav>
<div class="container mt-1 dashboard">
  <div class="alert alert-danger" role="alert" id="alert">

  </div>
  <div class="container rounded bg-white">
    <nav aria-label="breadcrumb" class="main-breadcrumb">
      <ol class="breadcrumb">
        <li class="breadcrumb-item active" aria-current="page">Current Bookings</li>

      </ol>
    </nav>
    <div class="row">
      <div class="col-md-12">
        <table class="table">
          <thead>
            <tr>
              <th scope="col">Profile</th>
              <th scope="col">Name</th>
              <th scope="col">Date</th>
              <th scope="col">Time</th>
              <th scope="col">Status</th>
              <th scope="col">Phone</th>
              <th scope="col">Action</th>
            </tr>
          </thead>
          <tbody id="current-booking-table-body">

          </tbody>

        </table>
        <div id="no-booking-found-msg"></div>
      </div>
    </div>
  </div>
</div>

<!--view details model-->
<div class="modal fade" id="view-booking-detail-model" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
  aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="view-booking-detail-model">Booking Details</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body" id="rander-booking-details">

      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary btn-sm" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>


<!--end of view details model-->
<script src="{{asset('js/dashboard/dashboard.js')}}"></script>
@endsection