@extends('layouts.master')

@section('content')
    <div class="row">

        <div class="col-lg-12">
            <div class="card">
                <div class="card-header align-items-center d-flex">
                    <h4 class="card-title mb-0 flex-grow-1">Subscriptions</h4>
                    <div class="flex-shrink-0">


                    </div>
                </div>
                <div class="card-body">
                    <div class="list-group" id="user-subscription">

                        @php
                            $total = 0;
                        @endphp

                        @forelse ($user->subscriptions as $user_subscription)

                            @php
                                $total += $user_subscription->price;
                            @endphp

                            <a href="javascript:void(0);" class="list-group-item list-group-item-action">
                                <div class="float-end">
                                    S$ {{ $user_subscription->price }} 
                                </div>
                                <div class="d-flex mb-2 align-items-center">
                                    <div class="flex-grow-1">
                                        <h5 class="list-title fs-15 mb-1">{{ $user_subscription->subscription->title }}</h5>
                                        <p class="list-text mb-0 fs-12">{{ ucfirst($user_subscription->subscription->type->name) }}</p>
                                    </div>
                                </div>
                                <p class="list-text mb-0">{!! $user_subscription->subscription->short_description !!}</p>
                                <p class="list-text mb-0">{!! $user_subscription->subscription->long_description !!}</p>
                            </a>
                        @empty
                            <p>No subscriptions</p>
                        @endforelse

                        <a href="javascript:void(0);" class="list-group-item list-group-item-action">
                            <div class="float-end">
                                S$ {{ $total }} 
                            </div>
                            <div class="d-flex mb-2 align-items-center">
                                <div class="flex-grow-1">
                                    <h5 class="list-title fs-15 mb-1">Total</h5>
                                </div>
                            </div>
                        </a>
                                                    
                    </div>
                </div>
            </div>
        </div>

    </div>
@endsection


@push('header_scripts')
@endpush

@push('footer_scripts')
    <script src="{{ asset('theme/dist/default/assets/libs/@ckeditor/ckeditor5-build-classic/build/ckeditor.js') }}">
    </script>

    <script type="text/javascript">
        $(document).ready(function() {


        });
    </script>
@endpush