@extends('website.layout.master')

@section('title')
    History
@endsection

@section('content')

    <link rel="stylesheet" href="https://cdn.datatables.net/2.1.3/css/dataTables.dataTables.css" /

    <main>

        <!-- breadcrumb area start -->
        <div class="breadcrumb__area breadcrumb__overlay breadcrumb__height p-relative fix"
             data-background="{{ URL::asset('website/images/hero/hero-3-2.jpg')}} ">
            <div class="container">
                <div class="row">
                    <div class="col-xxl-12">
                        <div class="breadcrumb__content z-index text-center">
                            <div class="breadcrumb__list">
                                <span><a href="{{route('home')}}">Home</a></span>
                                <span class="dvdr"><i class="fa fa-angle-right"></i></span>
                                <span>History</span>
                            </div>
                            <h3 class="breadcrumb__title">History</h3>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- breadcrumb area end -->


        <!-- pricing area start -->
        <div class="tp-price__area pt-95 pb-120">
            <div class="container">
                <div class="row">
                    <div class="col-xl-12">
                        <div class="tp-price__title-box text-center">
                            <div class="tp-section-subtitle-box"><h4 class="tp-hero__subtitle subtitle-border">Real
                                    Estate Commission Database</h4>
                            </div>
                            <h3 class="tp-section-title">
                        <span class="p-relative">
                           Subscription
                           <span class="tp-title-shape d-none d-md-block">
                              <svg width="145" height="5" viewBox="0 0 145 5" fill="none"
                                   xmlns="http://www.w3.org/2000/svg">
                                 <path
                                         d="M144.738 4.22307C96.8043 2.55338 49.1463 2.288 1.24738 4.99709C-0.427246 5.09661 -0.404312 2.60867 1.24738 2.48703C48.8366 -0.962917 97.2516 -1.06243 144.738 3.70336C145.082 3.73653 145.093 4.23412 144.738 4.22307Z"
                                         fill="#FFB302"/>
                              </svg>
                           </span>
                        </span>
                                History
                            </h3>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-xxl-12 col-xl-12 col-lg-12">
                        <div class="postbox__wrapper">
                            <div class="row text-center justify-content-center">
                                @if(isset(Auth::user()->purchased_subscriptions_data) && sizeof(Auth::user()->purchased_subscriptions_data)>0)
                                    @if(isset(Auth::user()->records_data) && sizeof(Auth::user()->records_data)>0)
                                        <h2><b>Total Remaining Records
                                                : {{ (Auth::user()->purchased_subscriptions_data->sum('records')-sizeof(Auth::user()->records_data)) }}</b>
                                        </h2>
                                    @else
                                        <h2><b>Total Remaining Records
                                                : {{ Auth::user()->purchased_subscriptions_data->sum('records') }}</b>
                                        </h2>
                                    @endif
                                @endif
                            </div>
                            <div class="postbox__comment-form">
                                <h3 class="postbox__comment-form-title">Subscription History</h3>

                                <div class="row">
                                    <div class="table-responsive">
                                        <table id="example" class="table table-striped table-bordered dataTable"
                                               cellspacing="0" width="100%" role="grid" aria-describedby="example_info"
                                               style="width: 100%;">
                                            <thead>
                                            <tr>
                                                <th>ID</th>
                                                <th>Heading</th>
                                                <th>Price</th>
                                                <th>Total Records</th>
                                                <th>Payment Status</th>
                                                <th>Purchased At</th>
                                                <th>Expiry</th>
                                            </tr>
                                            </thead>
                                            <tbody>
                                            @forelse($subscription_history as $s=>$subscription_histor)
                                                <tr>
                                                    <td>{{ $s+1 }}</td>
                                                    <td>{{ $subscription_histor->heading }}</td>
                                                    <td>${{ $subscription_histor->price }}</td>
                                                    <td>{{ $subscription_histor->records }}</td>
                                                    <td>{{ $subscription_histor->payment_status }}</td>
                                                    <td>{{ Carbon\Carbon::parse($subscription_histor->created_at)->format('d M Y') }}</td>
                                                    <td>{{ ($subscription_histor->expiry) ? Carbon\Carbon::parse($subscription_histor->expiry)->format('d M Y') : '--' }}</td>
                                                </tr>
                                            @empty
                                            @endforelse
                                            </tbody>

                                        </table>
                                    </div>
                                </div>

                                <p class="ajax-response"></p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- pricing area end -->

    </main>

@endsection
@section('script')
    <script src="https://code.jquery.com/jquery-3.7.1.min.js"
            integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>
    <script src="https://cdn.datatables.net/2.1.3/js/dataTables.js"></script>
    <script>
        $('#example').dataTable();
    </script>
@endsection