{% extends request.ajax ? "layout_blank.phtml" : "layout_default.phtml" %}

{% import "macro_functions.phtml" as mf %}

{% block meta_title %}{% trans 'My Products & Services' %}{% endblock %}

{% block content %}
    <div class="h-block">
        <div class="h-block-header">
            <div class="icon"><span class="big-light-icon i-services"></span></div>
            <h2>{% trans 'Ordered Services' %}</h2>
        </div>
        <div class="block">

        <table class="with-border">
            <thead>
                <tr>
                    <th>{% trans 'Product/Service' %}</th>
                    <th>{% trans 'Price' %}</th>
                    <th>{% trans 'Next due date' %}</th>
                    <th>{% trans 'Status' %}</th>
                    <th>&nbsp</th>
                </tr>
            </thead>

            <tbody>
                {% set orders = client.order_get_list({"per_page":10, "page":request.page, "hide_addons":1}) %}
                {% for i, order in orders.list %}

                <tr class="{{ cycle(['odd', 'even'], i) }}">
                    <td><a href="{{ '/order/service/manage'|link }}/{{order.id}}">{{order.title}}</a></td>
                    <td>{{  order.total | money(order.currency) }} {% if order.period%}{{ order.period | period_title }}{% endif %}</td>
                    <td>{% if order.expires_at %}{{order.expires_at|bb_date}}{% else %}-{% endif %}</td>
                    <td>{{ mf.status_name(order.status) }}</td>
                    <td class="actions"><a class="bb-button" href="{{ '/order/service/manage'|link }}/{{order.id}}"><span class="dark-icon i-drag"></span></a></td>
                </tr>

                {% else %}

                <tr>
                    <td colspan="5">{% trans 'The list is empty' %}</td>
                </tr>

                {% endfor %}

            </tbody>

        </table>

            <div class="box">
                <a class="bb-button bb-button-red" href="{{ 'order'|link }}">{% trans 'Order new service' %}</a>
            </div>
        </div>
    </div>

{% include "partial_pagination.phtml" with {'list': orders} %}

{% endblock %}