@extends('front.layouts.app')

@section('title') Welcome to  @endsection
@section('head')
@endsection
@section('content')
<div class="signup-form" style="padding-bottom:0px;">
    <h1>Request from <br>Pharmacy</h1>
    <div class="form-group">
        <label class="sp-b"><strong>{{$booking->pharmacy->pharmacy_name}}</strong><br><span>{{$booking->pharmacy->address}}</span></label>
    </div>
    <div class="form-group">
        <label><span>{{$booking->pharmacy->owner_name}}</span></label>
        <div class="divider"></div>
    </div>
    <div class="form-group">
        <label>Required Dates</label>
        <div class="responsive-calendar">
            <div class="controls">
                <h4><span data-head-month></span> <span data-head-year></span></h4>
                <a class="pull-right" data-go="next">
                    <div class="btn btn-primary" style="background: none;"><i class="fa fa-angle-right"></i></div>
                </a>
                <a class="pull-right" data-go="prev">
                    <div class="btn btn-primary" style="background: none;"><i class="fa fa-angle-left"></i></div>
                </a>
            </div>
            <div class="day-headers">
                <div class="day header">Mo</div>
                <div class="day header">Tu</div>
                <div class="day header">W</div>
                <div class="day header">Th</div>
                <div class="day header">F</div>
                <div class="day header">Sa</div>
                <div class="day header">Su</div>
            </div>
            <div class="days" data-group="days">
            </div>
        </div>
    </div>
    <div class="form-group">
        <label>Request Notes<br><br>
        {{$booking->notes}}</label>
    </div>
    <div class="sign-footer">
        <div class="form-group">
            <label><span class="ins"><strong>Contact Phone:</strong><br>{{$booking->pharmacy->contact_phone}}</span></label>
            <label><span class="ins"><strong>Contact Email:</strong><br>{{$booking->pharmacy->email}}</span></label>
        </div>
        <div class="form-group">
            <div class="owl-carousel owl-theme">
                <div class="item">
                    {!! fileShow('/uploads/pharmacy/uploads_license/', $booking->pharmacy->uploads_license) !!}
                </div>
                <div class="item">  
                    {!! fileShow('/uploads/pharmacy/uploads_shop_photo/', $booking->pharmacy->uploads_shop_photo) !!}
                </div>
            </div>
        </div>
        <div class="form-group">
            <a href="javascript:;" class="submit-btn d2 accept">Accept Offer</a>
            <a href="javascript:;" class="edit-button d1 decline" style="min-width:unset;">Decline Offer</a>
        </div>
    </div>
    <div class="btm-iconbar">
        @include('front.pharmacist-menu')
    </div>
</div>
@endsection
@section('script')
<script type="text/javascript">
    $(".accept").click(function(){
        redirectUrl = "{{ route('booking.change-status', ['id' => $booking->id, 'status' => '1']) }}";
        window.location.href = redirectUrl;
    });

    $(".decline").click(function(){
        redirectUrl = "{{ route('booking.change-status', ['id' => $booking->id, 'status' => '2']) }}";
        window.location.href = redirectUrl;
    });
    
    $(".responsive-calendar").responsiveCalendar({
        events: {
            @foreach($booking->date as $date)
                "{{$date}}" : {'class' : "date-green" },
            @endforeach
        }
    });

    $(document).ready(function() {
      $('.owl-carousel').owlCarousel({
        loop: true,
         items:1,
         nav:true,
        margin:0,
        responsiveClass: true,
      })
    })
</script>
@endsection