@extends('layouts.admin')
@section('content')
<div class="container-fluid">
    <div class="content">
        <!-- Start Content-->
        <div class="container-fluid">
            <!-- start page title -->
            <div class="row">
                <div class="col-12">
                    <div class="page-title-box">
                        <div class="page-title-right">
                            <ol class="breadcrumb m-0">
                                <li class="breadcrumb-item"><a href="{{ route('dashboard') }}">{{ env('APP_NAME') }}</a></li>
                                <li class="breadcrumb-item"><a href="{{ route('orders.index') }}">{{__('labels.order.title')}}</a></li>
                                <li class="breadcrumb-item active">{{__('labels.order.view')}}</li>
                            </ol>
                        </div>
                        <h4 class="page-title"></h4>
                    </div>
                </div>
            </div>
            <!-- end page title -->


            <div id="ShowDropifyMessage"></div>
            <div class="masonry-item">
                <div class="">
                    <div class="mT-10">
                        <div class="row">
                            <div class="col-md-8">
                                <h5 style="padding-left:7px">{{__('labels.order.orderno')}}<strong> #{{$data['order']->order_no}}</strong></h5>
                                <table class="table table-bordered" id="product-table">
                                    <thead>
                                        <tr>
                                            <th>{{ __('labels.product.form.pcode') }}</th>
                                            <th>{{ __('labels.product.form.name') }}</th>
                                            <th>{{ __('labels.product.form.pack_qty') }}</th>
                                            <th>{{ __('labels.product.form.strength') }}</th>
                                            <th>{{ __('labels.product.form.quantity') }}</th>
                                            <th>{{ __('labels.product.form.amount') }}</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @if(isset($data['order']) && $data['order']->items)
                                        @forelse($data['order']->items as $index => $variant)
                                        <tr>
                                            <td>{{$variant->pcode_sku}}</td>
                                            <td>
                                                <a href="{{url('products/'.$variant?->product['id'])}}">
                                                    @php
                                                    $defaultImage = 'images/default.jpg';
                                                    @endphp
                                                    @if($variant->product->images->isNotEmpty())
                                                    @php
                                                    $imageUrl = $variant->product->images->first()->file_path ? $variant->product->images->first()->file_path : $defaultImage;
                                                    @endphp
                                                    <img style="width:130px; height: auto;" src="{{ asset($imageUrl) }}">
                                                    @else
                                                    <img style="width:130px; height: auto;" src="{{ asset(defaultImage) }}">
                                                    @endif

                                                    {{ $variant->product['name'] }}
                                                </a>
                                            </td>
                                            <td> {{ $variant->pack_qty }} </td>
                                            <td> {{ $variant->strength }} </td>
                                            <td> {{ $variant->quantity }} </td>
                                            <td> {{ $variant->price }} € </td>
                                        </tr>
                                        @empty
                                        <tr>
                                            <td colspan="3">{{ __('labels.product.form.no_variants') }}</td>
                                        </tr>
                                        @endforelse
                                        @else
                                        <tr>
                                            <td colspan="3">{{ __('labels.product.form.no_variants') }}</td>
                                        </tr>
                                        @endif
                                    </tbody>
                                </table>
                                <div class="mt-4">
                                    <div class="order_delivery_amount">
                                        <ul class="oda_top">
                                            <li>
                                                <div class="d-flex align-items-center">
                                                    <div class="inline-block">€ &nbsp;&nbsp;
                                                        <!-- <svg class="mr-2" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                            <path d="M9 17C9 18.1046 8.10457 19 7 19C5.89543 19 5 18.1046 5 17C5 15.8954 5.89543 15 7 15C8.10457 15 9 15.8954 9 17Z"></path>
                                                            <path d="M19 17C19 18.1046 18.1046 19 17 19C15.8954 19 15 18.1046 15 17C15 15.8954 15.8954 15 17 15C18.1046 15 19 15.8954 19 17Z"></path>
                                                            <path d="M13 16V6C13 5.44772 12.5523 5 12 5H4C3.44772 5 3 5.44772 3 6V16C3 16.5523 3.44772 17 4 17H5M13 16C13 16.5523 12.5523 17 12 17H9M13 16L13 8C13 7.44772 13.4477 7 14 7H16.5858C16.851 7 17.1054 7.10536 17.2929 7.29289L20.7071 10.7071C20.8946 10.8946 21 11.149 21 11.4142V16C21 16.5523 20.5523 17 20 17H19M13 16C13 16.5523 13.4477 17 14 17H15M5 17C5 18.1046 5.89543 19 7 19C8.10457 19 9 18.1046 9 17M5 17C5 15.8954 5.89543 15 7 15C8.10457 15 9 15.8954 9 17M15 17C15 18.1046 15.8954 19 17 19C18.1046 19 19 18.1046 19 17M15 17C15 15.8954 15.8954 15 17 15C18.1046 15 19 15.8954 19 17" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
                                                        </svg> -->
                                                    </div>
                                                    {{__('labels.order.table.default_delivery')}}
                                                </div>
                                                <!-- <strong>
                                                    5.99&nbsp;€
                                                </strong> -->
                                            </li>
                                        </ul>
                                        <div class="ordergrid">
                                            <div class="col-span-2">
                                                <article class="space-y-2">
                                                    <div>
                                                        <strong> {{__('labels.order.table.notes')}}:</strong>
                                                        <p class="text-sm mt-1 text-gray-500">
                                                            {{__('labels.order.table.no_notes')}}
                                                        </p>
                                                    </div>
                                                </article>
                                            </div>
                                            <div>
                                                <dl class="space-y-1 text-sm text-right text-gray-700">
                                                    <div class="d-flex justify-content-between">
                                                        <dt>Sub Total</dt>
                                                        <dd>{{ $data['order']->sub_total_amount ?? 0.00 }}&nbsp;€</dd>
                                                    </div>
                                                    <div class="d-flex justify-content-between">
                                                        <dt>Discount Total</dt>
                                                        <dd class="text-red-500">-{{ $data['order']->discount_amount ?? 0.00 }}&nbsp;€</dd>
                                                    </div>
                                                    <div class="d-flex justify-content-between">
                                                        <dt>{{__('labels.order.table.shipping_cost')}} ({{ucfirst($data['order']->shipping_method ?? 'standard')}})</dt>
                                                        <dd>{{ $data['order']->shipping_cost ?? 0.00 }}&nbsp;€</dd>
                                                    </div>
                                                    <div class="d-flex justify-content-between">
                                                        <dt>{{__('labels.order.table.prescription_fee')}}</dt>
                                                        <dd>{{ $data['order']->prescription_fee ?? 0.00 }}&nbsp;€</dd>
                                                    </div>
                                                    <div class="d-flex justify-content-between font-bold text-gray-900">
                                                        <dt>{{__('labels.order.table.total_amnt')}}</dt>
                                                        <dd>{{ $data['order']->total_amount ?? 0.00 }}&nbsp;€</dd>
                                                    </div>
                                                </dl>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <hr>
                                <div class="mt-4">
                                    <div class="row">
                                        <div class="col-md-4">
                                        <div class="download_btns_bx">
                                            <h5>{{__('labels.order.download_invoice')}}</h5>
                                            <a class="btn btn-success" href="{{url('order/invoice/'.$data['order']->id)}}">
                                                    <svg class="w-4 mr-2" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                        <path fill-rule="evenodd" clip-rule="evenodd" d="M3 17C3 16.4477 3.44772 16 4 16H16C16.5523 16 17 16.4477 17 17C17 17.5523 16.5523 18 16 18H4C3.44772 18 3 17.5523 3 17ZM6.29289 9.29289C6.68342 8.90237 7.31658 8.90237 7.70711 9.29289L9 10.5858L9 3C9 2.44772 9.44771 2 10 2C10.5523 2 11 2.44771 11 3L11 10.5858L12.2929 9.29289C12.6834 8.90237 13.3166 8.90237 13.7071 9.29289C14.0976 9.68342 14.0976 10.3166 13.7071 10.7071L10.7071 13.7071C10.5196 13.8946 10.2652 14 10 14C9.73478 14 9.48043 13.8946 9.29289 13.7071L6.29289 10.7071C5.90237 10.3166 5.90237 9.68342 6.29289 9.29289Z" fill="currentColor"></path>
                                                    </svg>
                                                    {{__('labels.order.download_invoice')}}
                                            </a>
                                        </div>
                                        </div>
                                        <div class="col-md-4">
                                        <div class="download_btns_bx">
                                            <h5>{{__('labels.order.view_question')}}</h5>
                                            <a class="btn btn-info" target="_blank" href="{{url('order/view-questions-list/'.$data['order']->id)}}">
                                                    <svg class="w-4 mr-2" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                        <path d="M8.4453 14.8321C8.75216 15.0366 9.1467 15.0557 9.47186 14.8817C9.79701 14.7077 10 14.3688 10 14L10 11.2019L15.4453 14.8321C15.7522 15.0366 16.1467 15.0557 16.4719 14.8817C16.797 14.7077 17 14.3688 17 14V6C17 5.63121 16.797 5.29235 16.4719 5.11833C16.1467 4.94431 15.7522 4.96338 15.4453 5.16795L10 8.79815V6C10 5.63121 9.79702 5.29235 9.47186 5.11833C9.1467 4.94431 8.75216 4.96338 8.4453 5.16795L2.4453 9.16795C2.1671 9.35342 2 9.66565 2 10C2 10.3344 2.1671 10.6466 2.4453 10.8321L8.4453 14.8321Z" fill="currentColor"></path>
                                                    </svg>
                                                    {{__('labels.order.view_question')}}
                                            </a>
                                        </div>
                                        </div>
                                        <div class="col-md-4">
                                            <div class="download_btns_bx">
                                            <h5>{{__('labels.order.prescription')}}</h5>
                                            <a class="btn btn-success" href="{{url('order/prescription/'.$data['order']->UUID)}}">
                                                    <svg class="w-4 mr-2" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                        <path fill-rule="evenodd" clip-rule="evenodd" d="M3 17C3 16.4477 3.44772 16 4 16H16C16.5523 16 17 16.4477 17 17C17 17.5523 16.5523 18 16 18H4C3.44772 18 3 17.5523 3 17ZM6.29289 9.29289C6.68342 8.90237 7.31658 8.90237 7.70711 9.29289L9 10.5858L9 3C9 2.44772 9.44771 2 10 2C10.5523 2 11 2.44771 11 3L11 10.5858L12.2929 9.29289C12.6834 8.90237 13.3166 8.90237 13.7071 9.29289C14.0976 9.68342 14.0976 10.3166 13.7071 10.7071L10.7071 13.7071C10.5196 13.8946 10.2652 14 10 14C9.73478 14 9.48043 13.8946 9.29289 13.7071L6.29289 10.7071C5.90237 10.3166 5.90237 9.68342 6.29289 9.29289Z" fill="currentColor"></path>
                                                    </svg>
                                                    {{__('labels.order.download_prescription')}}
                                            </a>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row mt-4">
                                        <div class="col-md-12">
                                            <h5 style="padding-left:7px">{{__('labels.order.update_order')}}</h5>
                                            {{ Form::open(array('method'=>'PUT','route' => array('orders.update', $data['order']->id),'class' => 'form-horizontal submitOrderForm')) }}
                                            {{Form::hidden('id', $data['order']->id),array('class'=>'form-control')}}
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <div class="form-group" style="padding-left:7px">
                                                        <select class="form-control" name="order_status">
                                                            <option {{$data['order']->order_status=='Awaiting Payment' ? 'selected' : ''}} value="Awaiting Payment">{{__('labels.order.form.awaiting_payment')}}</option>

                                                            <option {{$data['order']->order_status=='Cancelled Order' ? 'selected' : ''}} value="Cancelled Order">{{__('labels.order.form.canceled')}}</option>

                                                            <option {{$data['order']->order_status=='Refused Order' ? 'selected' : ''}} value="Refused Order">{{__('labels.order.form.refused_order')}}</option>

                                                            <option {{$data['order']->order_status=='Processing' ? 'selected' : ''}} value="Processing">{{__('labels.order.form.processing')}}</option>

                                                            <option {{$data['order']->order_status=='On Hold' ? 'selected' : ''}} value="On Hold">{{__('labels.order.form.on_hold')}}</option>

                                                            <option {{$data['order']->order_status=='Completed' ? 'selected' : ''}} value="Completed">{{__('labels.order.form.completed')}}</option>

                                                            <option {{$data['order']->order_status=='Refunded' ? 'selected' : ''}} value="Refunded">{{__('labels.order.form.refunded')}}</option>

                                                            <option {{$data['order']->order_status=='Hublify Ready' ? 'selected' : ''}} value="Hublify Ready">{{__('labels.order.form.hublify_ready')}}</option>

                                                            <option {{$data['order']->order_status=='Hublify Processing' ? 'selected' : ''}} value="Hublify Processing">{{__('labels.order.form.hublify_processing')}}</option>

                                                            <option {{$data['order']->order_status=='Hublify Shipped' || $data['order']->order_status=='shipped' ? 'selected' : ''}} value="Hublify Shipped">{{__('labels.order.form.shipped')}}</option>

                                                            <option {{$data['order']->order_status=='Hublify Cancelled' ? 'selected' : ''}} value="Hublify Cancelled">{{__('labels.order.form.hublify_canceled')}}</option>
                                                        </select>
                                                    </div>
                                                </div>
                                                <div class="col-md-6">
                                                    <label></label>
                                                    {{Form::submit(__('labels.order.update_order'),['class'=>'btn btn-primary btn-color','id'=>'submitOrderFormButton'])}}
                                                </div>
                                            </div>
                                            {{ Form::close() }}
                                        </div>

                                    </div>
                                </div>
                            </div>
                            <div class="col-md-4">
                                <table class="table table-bordered mT-35" id="product-description-table">
                                    <tbody>
                                        <tr>
                                            <th colspan="2">
                                                <div style="display: flex;">
                                                    {{ $data['order']->user?->name ?? '-' }}
                                                    <div class='peer' style="margin-left: auto;">
                                                        <a type="button" title="{{__('labels.order.table.view_customer')}}" href="{{url('users/'.$data['order']->user?->id)}}">{{__('labels.order.table.view_customer')}}</a>
                                                    </div>
                                                </div>
                                            </th>
                                        </tr>
                                        <tr>
                                            <th>{{__('labels.order.table.order_status')}}</th>
                                            <td>{{ __($data['order']->order_status ?? '-') }} </td>
                                        </tr>
                                        <tr>
                                            <th>{{__('labels.order.table.reference')}}</th>
                                            <td>{{ $data['order']->hublify_order_no ?? '-' }} </td>
                                        </tr>
                                        <tr>
                                            <th>{{__('labels.order.table.shipping_method')}}</th>
                                            <td>{{ date('d-m-Y h:i a' , strtotime($data['order']->ordered_at)) ?? '' }} </td>
                                        </tr>
                                        <tr>
                                            <th>{{__('labels.order.table.shipping_method')}}</th>
                                            <td>{{ ucfirst($data['order']->shipping_method ?? 'standard') }} </td>
                                        </tr>
                                    </tbody>
                                </table>

                                <table class="table table-bordered" id="shipping-address">
                                    <tbody>
                                        <tr>
                                            <th colspan="2">
                                                <div style="display: flex;">
                                                    {{__('labels.order.table.shipping_address')}}
                                                    <div class='peer' style="margin-left: auto;">
                                                        <!-- <a data-page-link='{{url("change-order-address/".$data["order"]->id)}}' href='javascript:void(0)' data-value="{{$data['order']->shipping_address}}" data-label="{{__('labels.order.table.enter_shipping_add')}}" data-name="shipping_address" data-status-text="{{__('labels.order.table.update_shipping_add')}}" title="{{__('labels.order.table.update_shipping_add')}}" class='td-n c-deep-purple-500 cH-blue-500 p-5 updateOrderAddresses'>
                                                            <i class='ti-pencil'></i>
                                                        </a> -->
                                                    </div>
                                                </div>
                                            </th>
                                        </tr>
                                        <tr>
                                            <td colspan="2">
                                                @php
                                                    $houseNo = isset($data['decoded_shipping_address']['house_no']) ? $data['decoded_shipping_address']['house_no'] : '';
                                                    $address = isset($data['decoded_shipping_address']['address']) ? $data['decoded_shipping_address']['address'] : '';
                                                    $additional_address = isset($data['decoded_shipping_address']['address_additional']) ? ' '.$data['decoded_shipping_address']['address_additional'].', ' : '';
                                                    $post_number = isset($data['decoded_shipping_address']['post_number']) ? $data['decoded_shipping_address']['post_number'].', ' : '';
                                                    $city = isset($data['decoded_shipping_address']['city']) ? $data['decoded_shipping_address']['city'] : '';
                                                    $postalCode = isset($data['decoded_shipping_address']['postal_code']) ? $data['decoded_shipping_address']['postal_code'] : '';
                                                    $phone = isset($data['decoded_shipping_address']['phone']) ? $data['decoded_shipping_address']['phone'] : '';
                                                @endphp
                                                {{ $houseNo  }}, {{$address}}{{$additional_address}}{{$post_number}}<br>{{$city }}, {{$postalCode}} <br>
                                                <svg class="w-4 mr-2" width="15" height="15" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                    <path d="M3 8L10.8906 13.2604C11.5624 13.7083 12.4376 13.7083 13.1094 13.2604L21 8M5 19H19C20.1046 19 21 18.1046 21 17V7C21 5.89543 20.1046 5 19 5H5C3.89543 5 3 5.89543 3 7V17C3 18.1046 3.89543 19 5 19Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
                                                </svg>{{ $data['order']->user?->email ?? '-' }} <br>
                                                <svg class="w-4 mr-2" width="15" height="15" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                    <path d="M3 5C3 3.89543 3.89543 3 5 3H8.27924C8.70967 3 9.09181 3.27543 9.22792 3.68377L10.7257 8.17721C10.8831 8.64932 10.6694 9.16531 10.2243 9.38787L7.96701 10.5165C9.06925 12.9612 11.0388 14.9308 13.4835 16.033L14.6121 13.7757C14.8347 13.3306 15.3507 13.1169 15.8228 13.2743L20.3162 14.7721C20.7246 14.9082 21 15.2903 21 15.7208V19C21 20.1046 20.1046 21 19 21H18C9.71573 21 3 14.2843 3 6V5Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
                                                </svg>{{$phone}}
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>

                                <table class="table table-bordered" id="billing-address">
                                    <tbody>
                                        <tr>
                                            <th colspan="2">
                                                <div style="display: flex;">
                                                    {{__('labels.order.table.billing_address')}}
                                                    <!-- <div class='peer' style="margin-left: auto;">
                                                        <a href='javascript:void(0)' data-page-link='{{url("change-order-address/".$data["order"]->id)}}' data-value="{{$data['order']->billing_address}}" data-name="billing_address" data-label="{{__('labels.order.table.enter_billing_add')}}" data-status-text="{{__('labels.order.table.update_billing_add')}}" title="{{__('labels.order.table.update_billing_add')}}" class='td-n c-deep-purple-500 cH-blue-500 p-5 updateOrderAddresses'> <i class='ti-pencil'></i></a>
                                                    </div> -->
                                                </div>
                                            </th>
                                        </tr>
                                        <tr>
                                            <td colspan="2">
                                                @php
                                                    $houseNo = isset($data['decoded_billing_address']['house_no']) ? $data['decoded_billing_address']['house_no'] : '';
                                                    $address = isset($data['decoded_shipping_address']['address']) ? $data['decoded_shipping_address']['address'] : '';
                                                    $additional_address = isset($data['decoded_shipping_address']['address_additional']) ? ' '.$data['decoded_shipping_address']['address_additional'].', ' : '';
                                                    $post_number = isset($data['decoded_billing_address']['post_number']) ? $data['decoded_billing_address']['post_number'].', ' : '';
                                                    $city = isset($data['decoded_billing_address']['city']) ? $data['decoded_billing_address']['city'] : '';
                                                    $postalCode = isset($data['decoded_billing_address']['postal_code']) ? $data['decoded_billing_address']['postal_code'] : '';
                                                    $phone = isset($data['decoded_billing_address']['phone']) ? $data['decoded_billing_address']['phone'] : '';
                                                @endphp

                                                {{ $houseNo }}, {{$address}}{{$additional_address}}{{$post_number}}<br/>{{$city}}, {{$postalCode}} <br>
                                                <svg class="w-4 mr-2" width="15" height="15" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                    <path d="M3 8L10.8906 13.2604C11.5624 13.7083 12.4376 13.7083 13.1094 13.2604L21 8M5 19H19C20.1046 19 21 18.1046 21 17V7C21 5.89543 20.1046 5 19 5H5C3.89543 5 3 5.89543 3 7V17C3 18.1046 3.89543 19 5 19Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
                                                </svg>{{ $data['order']->user?->email ?? '-' }} <br>
                                                <svg class="w-4 mr-2" width="15" height="15" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                    <path d="M3 5C3 3.89543 3.89543 3 5 3H8.27924C8.70967 3 9.09181 3.27543 9.22792 3.68377L10.7257 8.17721C10.8831 8.64932 10.6694 9.16531 10.2243 9.38787L7.96701 10.5165C9.06925 12.9612 11.0388 14.9308 13.4835 16.033L14.6121 13.7757C14.8347 13.3306 15.3507 13.1169 15.8228 13.2743L20.3162 14.7721C20.7246 14.9082 21 15.2903 21 15.7208V19C21 20.1046 20.1046 21 19 21H18C9.71573 21 3 14.2843 3 6V5Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
                                                </svg>{{$phone}}
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                                <table class="table table-bordered" id="hublify">
                                    <tbody>
                                    <tr>
                                            <th colspan="2"> {{__('labels.order.table.hublify_shipping')}}</th>
                                        </tr>
                                        <tr>
                                            <td colspan="2">
                                                <ul>
                                                    <li class="mb-2"><strong>{{ __('labels.order.table.order_id') }}: </strong>{{ $data['order']->hublify_order_no ?? 'N/A' }}</li>

                                                    <li class="mb-2"><strong>{{ __('labels.order.table.time_sent') }}: </strong>
                                                        {{ isset($data['order']->hublify_order_time) ? date('d-m-Y h:i:s a', strtotime($data['order']->hublify_order_time)) : 'N/A' }}
                                                    </li>
                                                    @php 
                                                        $tracking_url = $data['order']->hublify_tracking_url ?? 'N/A';

                                                    @endphp 

                                                    <li class="mb-2"><strong>{{ __('labels.order.table.tracking_URL') }}: </strong>
                                                        @if($tracking_url == 'N/A')
                                                            {{$tracking_url}}
                                                        @else
                                                            <a href="{{ $tracking_url }}" target="_blank" >{{ $tracking_url }} </a> 
                                                        @endif
                                                    </li>

                                                    <li class="mb-2"><strong>{{ __('labels.order.table.order_state_code') }}: </strong>{{ $data['order']->hublify_order_status ?? 'N/A' }}</li>


                                                    <li class="mb-2"><strong>{{ __('labels.order.table.tracking_number') }}: </strong>{{ $data['order']->hublify_tracking_number ?? 'N/A' }}</li>
                                                </ul>

                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                                <table class="table table-bordered" id="payment">
                                    <tbody>
                                    <tr>
                                            <th colspan="2">{{__('labels.order.payment_info')}}</th>
                                        </tr>
                                        <tr>
                                            <th>{{__('labels.order.table.transaction_id')}}</th>
                                            <td>{{ $data['order']->payments?->transaction_id ?? '-' }} </td>
                                        </tr>
                                        <tr>
                                            <th>{{__('labels.order.table.payment_method')}}</th>
                                            <td>{{ __($data['order']->payments?->payment_method ?? '-') }} </td>
                                        </tr>

                                        <tr>
                                            <th>{{__('labels.order.table.payment_status')}}</th>
                                            <td>{{ __($data['order']->payments?->payment_status ?? '-') }} </td>
                                        </tr>
                                    </tbody>
                                </table>


                            </div>
                        </div>
                        <hr>
                        <div class="row">
                            <h3>{{__('labels.order.table.Timeline')}}</h3>
                            <div class="col-md-12 col-lg-12">
                                <div id="tracking-pre"></div>
                                <div id="tracking">
                                    <div class="tracking-list">
                                        @if(isset($data['timeline']) && $data['timeline'])
                                        @forelse($data['timeline'] as $index => $timeline)
                                        @php
                                        $class = ($timeline->status == 'cancelled') ? 'tracking-icon status-intransit' : 'tracking-icon status-outfordelivery';
                                        @endphp
                                        <div class="tracking-item">
                                            <div class="{{ $class }}">
                                                <svg class="svg-inline--fa fa-shipping-fast fa-w-20" aria-hidden="true" data-prefix="fas" data-icon="shipping-fast" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512" data-fa-i2svg="">
                                                    <path fill="currentColor" d="M624 352h-16V243.9c0-12.7-5.1-24.9-14.1-33.9L494 110.1c-9-9-21.2-14.1-33.9-14.1H416V48c0-26.5-21.5-48-48-48H112C85.5 0 64 21.5 64 48v48H8c-4.4 0-8 3.6-8 8v16c0 4.4 3.6 8 8 8h272c4.4 0 8 3.6 8 8v16c0 4.4-3.6 8-8 8H40c-4.4 0-8 3.6-8 8v16c0 4.4 3.6 8 8 8h208c4.4 0 8 3.6 8 8v16c0 4.4-3.6 8-8 8H8c-4.4 0-8 3.6-8 8v16c0 4.4 3.6 8 8 8h208c4.4 0 8 3.6 8 8v16c0 4.4-3.6 8-8 8H64v128c0 53 43 96 96 96s96-43 96-96h128c0 53 43 96 96 96s96-43 96-96h48c8.8 0 16-7.2 16-16v-32c0-8.8-7.2-16-16-16zM160 464c-26.5 0-48-21.5-48-48s21.5-48 48-48 48 21.5 48 48-21.5 48-48 48zm320 0c-26.5 0-48-21.5-48-48s21.5-48 48-48 48 21.5 48 48-21.5 48-48 48zm80-208H416V144h44.1l99.9 99.9V256z"></path>
                                                </svg>
                                                <!-- <i class="fas fa-circle"></i> -->
                                            </div>
                                            <div class="tracking-date">{{ date('d-m-Y', strtotime($timeline->created_at)) }}<span>{{ date('h:i a', strtotime($timeline->created_at)) }}</span></div>
                                            <div class="tracking-content">{{$timeline->updated_by}}<span>{{$timeline->status}}</span></div>
                                        </div>
                                        @empty
                                        <div>{{__('labels.order.table.no_timeline')}}</div>
                                        @endforelse
                                        @endif
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-12">
                                <a href="{{ route('orders.index') }}" class="btn btn-secondary btn-color">{{__('labels.order.cancel')}}</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>


<!-- // Modal for update shipping address/ billing address -->
<div id="myShippingModal" class="modal fade">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="exampleModalLabel">{{__('labels.order.table.update_address')}}</h4>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <form action="" method="post" id="fromPageID">
                    <input type="hidden" name="_method" value="GET" />
                    <input type="hidden" name="_token" value="{{csrf_token()}}">
                    <div class="form-group">
                        <label id="formFieldLabel"></label>
                        <input id="input-field" type="text" name="" class="form-control" required>
                    </div>
                    <button type="submit" class="btn btn-danger btn-color">{{__('labels.admin_dashboard.common.submit')}}</button>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">{{__('labels.order.cancel')}}</button>
            </div>
        </div>
    </div>
</div>


<script>
    $("#submitOrderFormButton").on('click', function(e) {
        e.preventDefault();
        $("#submitOrderFormButton").prop('disabled', true);
        $("#submitOrderFormButton").html('<span class="spinner-border spinner-border-sm mr-2" role="status" aria-hidden="true"></span> Submitting...');
        $("form.submitOrderForm").submit();
    });

    //update shipping/billing addresses
    $(document).on("click", ".updateOrderAddresses", function() {
        var page_link = $(this).attr('data-page-link');
        var status_text = $(this).attr('data-status-text');
        var label = $(this).attr('data-label');
        var name = $(this).attr('data-name');
        var value = $(this).attr('data-value');
        $('#fromPageID').attr('action', page_link);
        $('#exampleModalLabel').text(status_text);
        $('#formFieldLabel').text(label);
        $('#input-field').attr('name', name);
        $('#input-field').val(value);
        $("#myShippingModal").modal("show");
    });
</script>
@endsection