@extends('layouts.master')

@section('title') {{__('admin.dashboard')}} -@endsection
@section('css')
<link href="{{ asset('public/css/artist/autoptimize_0796f2a3114c.css') }}?v={{__system_settings('version')}}" rel="stylesheet">
<link href="{{ asset('public/css/artist/automix1.css') }}?v={{__system_settings('version')}}" rel="stylesheet">
<link href="{{ asset('public/css/artist/automix2.css') }}?v={{__system_settings('version')}}" rel="stylesheet">
<style>
    @media screen and (min-width: 1200px) {
    .bai-browse-table.bai-browse-table--no-add-to-list:not(.bai-browse-table--representative-table) .bai-browse-table__head, .bai-browse-table.bai-browse-table--no-add-to-list:not(.bai-browse-table--representative-table) .bai-browse-table__row {
        grid-template-columns: 25% 25% 25% 25%;
    }
    
    .a-bg-success{
            border: 1px solid #fac41d;
    }
    .a-bg-danger{
            border: 1px solid #d04d4d !important;
    }
}
</style>
<style>
    .rcp-table-n {
    border-bottom: 1px solid #e8e8e8;
    border-right: 1px solid #e8e8e8;
    margin: 0 0 30px;
    min-width: 760px;
    width: 100%;
}

.rcp-table-n th, .rcp-table-n td {
    border-left: 1px solid #e8e8e8;
    padding: 10px;
}

.rcp-table-n th {
    background-color: #e8e8e8;
}

#rcp-account-overview td, #rcp-account-overview th, #rcp-payment-history td, #rcp-payment-history th {
    vertical-align: top;
    padding-inline: 20px;
    text-align: left;
}



</style>

@endsection
@section('content')

<section class="section section-sm">
    <div class="container-fluid">
        <div class="row mt-4">
            <div class="col-md-12 col-lg-12">
                <div class="main-body">
   
   <main class="page-main container">
    <header class="page-header">
        <h1 class="page-header-title">Your Membership</h1>
    </header>
    <!-- / Page Header -->
    <p></p>
    <div class="container">
        <div class="subscription-container">
            <!--h1 class="page-header-title">Your Membership</h1-->
            <h2 class="page-header-subtitle">Account overview</h2>
            <div class="table table-responsive">
                <table class="rcp-table-n" id="rcp-account-overview">
                    <thead>
                        <tr>
                            <th>Status</th>
                            <th>Subscription</th>
                            <th>Expiration</th>
                            <th>Actions</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse($subscriptionPlans as $subscriptionPlan)
                                @php
                $plan = $subscriptionPlan->plan;
                @endphp
                @if(!blank($plan))
                        <tr>
                            <td>{{ $subscriptionPlan->status == 1 ? 'Active' :'Inactive' }}</td>
                            <td>{{$plan->name}}</td>
                            <td>{{__date_parse($subscriptionPlan->ends_at , 'M d, Y')}}</td>
                            <td>
                                <a href="{{ secure_url('subscription') }}" title="Upgrade or change your subscription" class="rcp_sub_details_renew">Upgrade or change your subscription</a>
                            </td>
                        </tr>
                        @endif
                @empty
                   <tr>
                            <td>Active</td>
                            <td>Free</td>
                            <td>none</td>
                            <td>
                                <a href="{{ secure_url('subscription') }}" title="Upgrade or change your subscription" class="rcp_sub_details_renew">Upgrade or change your subscription</a>
                            </td>
                        </tr>            
                @endforelse
                    </tbody>
                </table>
            </div>
            <h2 class="page-header-subtitle">Payment History</h2>
            <div class="table table-responsive">
                <table class="rcp-table-n" id="rcp-payment-history">
                    <thead>
                        <tr>
                            <th>Invoice #</th>
                            <th>Subscription</th>
                            <th>Amount</th>
                            <th>Date</th>
                            <th>Actions</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse($subscriptionPlans as $subscriptionPlan)
                        @if($subscriptionPlan->status == '1')
                                @php
                $plan = $subscriptionPlan->plan;
                @endphp
                @if(!blank($plan))
                    <tr>
                            <td>Invoice #</td>
                            <td>{{$plan->name}}</td>
                            <td>{{__format_number($plan->price , 2)}}</td>
                            <td>{{__date_parse($subscriptionPlan->ends_at , 'M d, Y')}}</td>
                            <td></td>
                        </tr>
                @endif
                @endif
                @empty
                        <tr>
                            <td colspan="5">You have not made any payments.</td>
                        </tr>
                        @endforelse
                    </tbody>
                </table>

                <script>
                    jQuery(document).ready(function () {
                        jQuery("#delete-account-button").click(function () {
                            if (confirm("Are You Sure? Deleting your account will completely remove you from all of Booking Agent Info services.")) {
                                jQuery.ajax({
                                    type: "POST",
                                    data: { action: "set_account_for_delete" },
                                    url: "/wp-admin/admin-ajax.php",

                                    success: function (data) {
                                        var result = JSON.parse(data);
                                        if (result.message == "ok") {
                                            jQuery(".wrap-delete-account-button").html("Within 48 hours your account will be deleted.");
                                        } else {
                                            jQuery(".wrap-delete-account-button").html("Error. Please try again later.");
                                        }
                                    },
                                });
                            }
                        });
                    });
                </script>
            </div>
        </div>
    </div>

  
    <p></p>
</main>

</div>

            </div>
        </div>
    </div>
  </section>
@endsection

@section('javascript')
  
  @endsection