@extends('adminlte::page')

@section('title', 'Reef Dashboard')


@section('css')
  <link href="https://gitcdn.github.io/bootstrap-toggle/2.2.2/css/bootstrap-toggle.min.css" rel="stylesheet">

@stop

@section('content')
<!-- -->
<div class="row">
    <div class="col-12">
        <div class="card">
            <div class="card-header">
                <h2 class="card-title">Payment users status</h2>
            </div>
            <div class="card-body">
                <table id="main_table_stripe" class="table table-hover text-center align-middle">
                    <thead class="thead-dark">
                        <tr>
                            <th scope="col">#</th>
                            <th scope="col">User</th>
                            <th scope="col">Email</th>
                            <th scope="col">Plan</th>
                            <th scope="col">Status</th>
                            <th scope="col">Ends on date:</th>
                            <th scope="col">Quantity</th> 
                            <th scope="col">Price (exc VAT) </th> 
                            <th scope="col">Price (inc VAT)</th>
                            <th scope="col">Date</th>
                        </tr>
                    </thead>
                    <tbody>
                        @include('dashboard.stripe-status.list')
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>


@stop

@push('js')
    <script>

        $('#main_table_stripe').dataTable({
            order: [ 1, "desc" ],
            searching: true,
             columnDefs: [
                {
                    'targets': 0,
                    'orderable': false
                },
              
                {
                    'targets': 2,
                    'orderable': false
                },
                {
                    'targets': 3,
                    'orderable': false
                },
                {
                    'targets': 4,
                    'orderable': false
                }

            ]
        });
    
    </script>
@endpush