@extends('layouts.web')
@section('page-title', 'Customer Details')
@section('link-active-2', 'active')

@section('main-container')

    <div id="container-main-customer">
        <div class="container-main-customer-left-side">
        <form action="" method="POST">
            @csrf
            <div class="customer-details-fill">
                <h2>Traveller Details</h2>
                <table class="simple-table">
                    <tr>
                        <td class="title-bold">Customer Name:</td>
                        <td>{{$customer->name}}</td>
                    </tr>
                    <tr>
                        <td class="title-bold">Customer Address:</td>
                        <td>{{$customer->address}}</td>
                    </tr>
                    <tr>
                        <td class="title-bold">Customer Phone No.:</td>
                        <td>{{$customer->phone_number}}</td>
                    </tr>
                    <tr>
                        <td class="title-bold">Customer Email:</td>
                        <td>{{$customer->email}}</td>
                    </tr>

                    <tr>
                        <td class="title-bold">Start From:</td>
                        <td>{{$route->start_from}}({{$route->end_to}})</td>
                    </tr>
                    <tr>
                       <td class="title-bold">Destination:</td>
                       <td>{{$subroute->name}}</td>
                   </tr>
                   <tr>
                    <td class="title-bold">Vehicle Number:</td>
                    <td>{{Str::upper($depature->registration_number)}}</td>
                    </tr>
                   <tr>
                    <td class="title-bold">Ticket Number:</td>
                    <td>{{$booked->ticket_number}}</td>
                   </tr>

                   <tr>
                    <td class="title-bold">Seat Number:</td>
                    <td>{{$booked->sit_number}} {{$booked->vip}}</td>
                   </tr>
                   
                   <tr>
                    <td class="title-bold">Boarding Point:</td>
                    <td>{{$booked->boarding_point}}</td>
                   </tr>
                   <tr>
                    <td class="title-bold">Reporting Time:</td>
                    <td>{{date_format(date_create($booked->date_depature), 'd M Y')}}, {{date_format(date_create($depature->reporting_time), 'H:i A')}}</td>
                   </tr>
                   <tr>
                       <td class="title-bold">Departure:</td>
                       <td>{{date_format(date_create($booked->date_depature), 'd M Y')}}, {{date_format(date_create($depature->depature_time), 'H:i A')}}</td>
                   </tr>
                   <tr>
                       <td class="title-bold">Expected Arrival:</td>
                       <td>{{date_format(date_create($depature->expected_arrival_time), 'd M Y H:i A')}}</td>
                   </tr>

                </table>
            </div>
            <div class="payment-details-fill">
                <h2>Payment Details</h2>
                <table class="simple-table">
                    @if($booked->payment_mode != "Cash")
                    <tr>
                        <td class="title-bold">Ticket Status:</td>
                        <td><b>Pending</b><br>
                        <p>
                            This ticket is in pending waiting for payment approve
                        </p></td>
                    </tr>
                    @endif
                    <tr>
                        <td class="title-bold">Payment Details:</td>
                        <td>{{$booked->payment_mode}}</td>
                    </tr>
                    <tr>
                        <td class="title-bold">Fare:</td>
                        <td>{{number_format($booked->fare, 2)}} TZS</td>
                    </tr>
                </table>
            </div>

            <div class="payment-details-fill">
                <h2>Ticket Details</h2>
                <table class="simple-table">

                    <tr>
                        <td class="title-bold">Ticket Number:</td>
                        <td>{{$booked->ticket_number}}</td>
                       </tr>
    
                       <tr>
                        <td class="title-bold">Seat Number:</td>
                        <td>{{$booked->sit_number}} {{$booked->vip}}</td>
                       </tr>
                    <tr>
                       <td class="title-bold">QR: CODE</td>
                       <td>
                           @php

                           $date_m = date_format(date_create($booked->date_depature), 'd M Y');;
                           $price_m = number_format($booked->fare, 2);

                            $messages = "Dear Customer $customer->name\n\n";
                            $messages .= "Your Ticket has been successfully processed\n";
                            $messages .="Depature Date: \n";
                            $messages .="Ticket Number: $booked->ticket_number\n";
                            $messages .="Start From: $route->start_from\n";
                            $messages .="Destination: $route->end_to\n";
                            $messages .="Seat Number: $booked->sit_number\n";
                            $messages .="Boarding Point: $booked->boarding_point\n";
                            $messages .="Cost: $price_m TZS\n";
                            $messages .="\nThank you for Choosing Aifola Express";

                            $url = "https://chart.googleapis.com/chart?chs=145x145&cht=qr&chl=$messages&choe=UTF-8"; 
                            
                            @endphp
                            <div id="" style="padding:1.5px;clear:both;text-align:center;margin:0px 0px">
                                <img src="{{$url}}" title="TRA QR Code Generated Verification" />
                           </div>
                       </td>
                   </tr>
                   <tr>
                       <td class="title-bold">Expired/Auto Canceled:</td>
                       <td>If the ticket will not be paid within 1 hour it will be cancelled or expired by system</td>
                   </tr>
                </table>

                <div class="block-cont"></div>    

                <div class="block-cont"></div>
                <a href="{{route('index')}}"><button type="button" class="btn bg-success text-white w-100">Back To Home</button></a>
                <div class="block-cont"></div>
            </div>

        </div>

        <div class="container-main-customer-right-side">


            <h3>How To Pay your ticket</h3>
            <p>
                Contact us if you have problem on how to pay your ticket or click the link below to learn
            </p>

            <p>
                <a href="{{route('web.how-to-pay')}}" target="_blank">Learn more here how to pay your ticket</a>
            </p>

            <hr>

            <h3>Please Note:</h3>
            <ol>
                <li>Price listed does not include luggage price </li>
                <li>Passenger will allowed to board freely with two handbags only, and extra bag will be charged. </li>
                <li>Ensure information provided is correct </li>
                <li>You will receive confirmation SMS/Email once your payment is confirmed</li>
                <li>Any booking unpaid until expiration date will automatically be cancelled </li>
                <li>Fares are not guaranteed until Aifola Express confirms your booking and payment is made in full </li>
                <li><strong>Disclaimer:</strong> Aifola Express may refuse carriage of you or your baggage if, in the exercise of our reasonable discretion, we determine either that the payment of your fare is fraudulent or the booking of your seat has been done fraudulently or unlawfully </li>
            </ol>

        </div>

        <div class="block-cont"></div>
    </div>

@endsection


<!-- js script -->
@push('scripts')

<script>
    $(function(){
        $(document).on('click', '.bus-info-btn button', function(){
            //alert("hello");
            $('#seat-and-confirm').css({"display":"block"});
        });
    });
</script>

@endpush