{{ header }}
<div id="account-recurring" class="container">
    <ul class="breadcrumb">
        {% for breadcrumb in breadcrumbs %}
            <li><a href="{{ breadcrumb.href }}">{{ breadcrumb.text }}</a></li>
        {% endfor %}
    </ul>
    <div class="row">{{ column_left }}
        {% if column_left and column_right %}
            {% set class = 'col-sm-6' %}
        {% elseif column_left or column_right %}
            {% set class = 'col-sm-9' %}
        {% else %}
            {% set class = 'col-sm-12' %}
        {% endif %}
        <div id="content" class="{{ class }}">{{ content_top }}
            <h1>{{ heading_title }}</h1>
            {% if subscriptions %}
                <div class="table-responsive">
                    <table class="table table-bordered table-hover">
                        <thead>
                        <tr>
                            <td class="text-left">{{ column_id }}</td>
                            <td class="text-left">{{ column_order_subscription_id }}</td>
                            <td class="text-left">{{ column_product }}</td>
                            <td class="text-left">{{ column_status }}</td>
                            <td class="text-left">{{ column_total_count }}</td>
                            <td class="text-left">{{ column_paid_count }}</td>
                            <td class="text-left">{{ column_remaining_count }}</td>
                            <td class="text-left">{{ column_subscription_created_at }}</td>
                            <td class="text-left">{{ column_subscription_start_at }}</td>
                            <td class="text-left">{{ column_subscription_end_at }}</td>
                            <td class="text-left">{{ column_subscription_next_charge_at }}</td>
                            <td class="text-left"></td>
                        </tr>
                        </thead>
                        <tbody>

                        {% for recurring in subscriptions %}
                            <tr>
                                <td class="text-left">{{ recurring.id }}</td>
                                <td class="text-left">{{ recurring.subscription_id }}</td>
                                <td class="text-left">{{ recurring.productName }}</td>
                                <td class="text-left">{{ recurring.status }}</td>
                                <td class="text-left">{{ recurring.total_count }}</td>
                                <td class="text-left">{{ recurring.paid_count }}</td>
                                <td class="text-left">{{ recurring.remaining_count }}</td>
                                <td class="text-left">{{ recurring.subscription_created_at }}</td>
                                <td class="text-left">{{ recurring.start_at }}</td>
                                <td class="text-left">{{ recurring.end_at }}</td>
                                <td class="text-left">{{ recurring.next_charge_at }}</td>
                                <td class="text-left"><a href="{{ recurring.view }}" data-toggle="tooltip" title="{{ button_view }}" class="btn btn-info"><i class="fa fa-eye"></i></a></td>
                            </tr>
                        {% endfor %}

                        </tbody>
                    </table>
                </div>
                <div class="text-right">{{ pagination }}</div>
            {% else %}
                <p>{{ text_empty }}</p>
            {% endif %}
            <div class="buttons clearfix">
                <div class="pull-right"><a href="{{ continue }}" class="btn btn-primary">{{ button_continue }}</a></div>
            </div>
            {{ content_bottom }}</div>
        {{ column_right }}</div>
</div>
{{ footer }}