{% extends request.ajax ? "layout_blank.phtml" : "layout_default.phtml" %}
{% set active_menu = 'order' %}
{% import "macro_functions.phtml" as mf %}

{% block meta_title %}{% trans 'Orders' %}{% endblock %}

{% block top_content %}
{% if request.show_filter %}
<div class="widget filterWidget">
    <div class="head"><h5 class="iMagnify">{% trans 'Filter orders' %}</h5></div>
    <div class="body nopadding">

        <form method="get" action="" class="mainForm">
            <input type="hidden" name="_url" value="{{ request._url }}" />
            <fieldset>
                <div class="rowElem noborder">
                    <label>{% trans 'ID' %}</label>
                    <div class="formRight">
                        <input type="text" name="id" value="{{ request.id }}">
                    </div>
                    <div class="fix"></div>
                </div>

                <div class="rowElem">
                    <label>{% trans 'Title' %}</label>
                    <div class="formRight">
                        <input type="text" name="title" value="{{ request.title }}">
                    </div>
                    <div class="fix"></div>
                </div>

                <div class="rowElem">
                    <label>{% trans 'Status' %}</label>
                    <div class="formRight">
                        {{ mf.selectbox('status', admin.order_get_status_pairs, request.status, 0, 'All statuses') }}
                    </div>
                    <div class="fix"></div>
                </div>

                <div class="rowElem">
                    <label>{% trans 'Type' %}:</label>
                    <div class="formRight">
                        {{ mf.selectbox('type', admin.product_get_types, request.type, 0, 'All types') }}
                    </div>
                    <div class="fix"></div>
                </div>
                
                <div class="rowElem">
                    <label>{% trans 'Product' %}:</label>
                    <div class="formRight">
                        {{ mf.selectbox('product_id', admin.product_get_pairs, request.product_id, 0, 'All products') }}
                    </div>
                    <div class="fix"></div>
                </div>

                <div class="rowElem">
                    <label>{% trans 'Period' %}</label>
                    <div class="formRight">
                        {{ mf.selectbox('period', guest.system_periods, request.period, 0, 'All periods') }}
                    </div>
                    <div class="fix"></div>
                </div>
                
                <div class="rowElem">
                    <label>{% trans 'Invoice option' %}</label>
                    <div class="formRight">
                        {{ mf.selectbox('invoice_option', admin.order_get_invoice_options, request.invoice_option, 0, 'All types') }}
                    </div>
                    <div class="fix"></div>
                </div>

                <div class="rowElem">
                    <label>{% trans 'Creation date' %}</label>
                    <div class="formRight moreFields">
                        <ul>
                            <li style="width: 100px"><input type="text" name="date_from" value="{% if request.date_from %}{{ request.date_from|date('Y-m-d') }}{%endif%}" placeholder="{{ now|date('Y-m-d') }}" class="datepicker"/></li>
                            <li class="sep">-</li>
                            <li style="width: 100px"><input type="text" name="date_to" value="{% if request.date_to %}{{ request.date_to|date('Y-m-d') }}{%endif%}" placeholder="{{ now|date('Y-m-d') }}" class="datepicker"/></li>
                        </ul>
                    </div>
                    <div class="fix"></div>
                </div>

                <input type="hidden" name="show_filter" value="1" />
                <input type="submit" value="{% trans 'Filter' %}" class="greyishBtn submitForm" />
            </fieldset>
        </form>
        <div class="fix"></div>
    </div>
</div>
{% else %}
{% set count_orders = admin.order_get_statuses %}
<div class="stats">
    <ul>
        <li><a href="{{ 'order'|alink({'status' : 'pending_setup'}) }}" class="count green" title="">{{ count_orders.pending_setup }}</a><span>{% trans 'Pending setup' %}</span></li>
        <li><a href="{{ 'order'|alink({'status' : 'active'}) }}" class="count blue" title="">{{ count_orders.active }}</a><span>{% trans 'Active' %}</span></li>
        <li><a href="{{ 'order'|alink({'status' : 'suspended'}) }}" class="count red" title="">{{ count_orders.suspended }}</a><span>{% trans 'Suspended' %}</span></li>
        <li class="last"><a href="{{ 'order'|alink }}" class="count grey" title="">{{ count_orders.total }} </a><span>{% trans 'Total' %}</span></li>
    </ul>
    <div class="fix"></div>
</div>

{% endif %}

{% endblock %}

{% block content %}

<div class="widget simpleTabs">
    <ul class="tabs">
        <li><a href="#tab-index">{% trans 'Orders' %}</a></li>
        <li><a href="#tab-new">{% trans 'New order' %}</a></li>
    </ul>

    <div class="tabs_container">
        <div class="fix"></div>
        <div class="tab_content nopadding" id="tab-index">
        {{ mf.table_search }}
        <table class="tableStatic wide" style="table-layout: fixed">
            <thead>
                <tr>
                    <td style="width: 3%"><input type="checkbox" class="batch-delete-master-checkbox"/></td>
                    <td style="width: 5%">{% trans 'ID' %}</td>
                    <td width="13%">{% trans 'Client' %}</td>
                    <td width="45%">{% trans 'Title' %}</td>
                    <td style="width: 7%">{% trans 'Amount' %}</td>
                    <td>{% trans 'Period' %}</td>
                    <td>{% trans 'Status' %}</td>
                    <td style="width: 10%">&nbsp;</td>
                </tr>
            </thead>

            <tbody>
                {% set orders = admin.order_get_list({"per_page":30, "page":request.page}|merge(request)) %}
                {% for i, order in orders.list %}
                <tr>
                    <td><input type="checkbox" class="batch-delete-checkbox" data-item-id="{{ order.id }}"/></td>
                    <td>{{order.id}}</td>
                    <td class="truncate">
                        <span style="float: left;">
                            <a href="{{ 'client/manage'|alink }}/{{ order.client_id }}"><img src="{{ order.client.email|gravatar }}?size=20" alt="{{ order.client.email }}" /></a>
                        </span>
                        <span style="margin-left: 10px;">
                            <a href="{{ 'client/manage'|alink }}/{{ order.client_id }}">{{order.client.first_name|truncate('1', null, '.')}} {{order.client.last_name}}</a>
                        </span>
                    </td>
                    <td class="truncate">{{order.title }}</td>
                    <td>{{ mf.currency_format( order.total, order.currency) }}</td>
                    <td>{{ mf.period_name(order.period) }}</td>
                    <td>{{ mf.status_name(order.status) }}</td>
                    <td class="actions">
                        <a class="bb-button btn14" href="{{ '/order/manage'|alink }}/{{order.id}}"><img src="images/icons/dark/pencil.png" alt=""></a>
                        <a class="bb-button btn14 bb-rm-tr api-link" data-api-confirm="Are you sure?" href="{{ 'api/admin/order/delete'|link({'id' : order.id}) }}" data-api-redirect="{{ 'order'|alink }}"><img src="images/icons/dark/trash.png" alt=""></a>
                    </td>
                </tr>
                {% else %}
                <tr>
                    <td colspan="8">{% trans 'The list is empty' %}</td>
                </tr>
                {% endfor %}
            </tbody>
        </table>
        {% include "partial_pagination.phtml" with {'list': orders, 'url':'order'} %}
        {% include "partial_batch_delete.phtml" with {'action' : 'admin/order/batch_delete'} %}
        </div>
    </div>
    
    <div class="tab_content nopadding" id="tab-new">
        <form method="post" action="{{ 'order/new'|alink }}" class="mainForm">
            <fieldset>
                <div class="rowElem noborder">
                    <label>{% trans 'Client' %}</label>
                    <div class="formRight">
                        {% if not request.client_id %}
                        <input type="text" id="client_selector" placeholder="{% trans 'Start typing clients name, email or ID' %}" required="required"/>
                        <input type="hidden" name="client_id" value="{{ request.client_id }}" id="client_id"/>
                        {% else %}
                            {% set client = admin.client_get({"id":request.client_id}) %}
                            {{ client.first_name }} {{ client.last_name }}
                        {% endif %}
                    </div>
                    <div class="fix"></div>
                </div>
                <div class="rowElem">
                    <label>{% trans 'Product' %}:</label>
                    <div class="formRight">
                        {{ mf.selectbox('product_id', admin.product_get_pairs, request.product_id, 1) }}
                    </div>
                    <div class="fix"></div>
                </div>
                
            <input type="submit" value="{% trans 'Continue' %}" class="greyishBtn submitForm" />
            {% if request.client_id %}
            <input type="hidden" name="client_id" value="{{ request.client_id}}" />
            {% endif %}
            </fieldset>
        </form>
    </div>
</div>

{% endblock %}

{% block head %}
<link href="css/jquery-ui.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery-ui.js"></script>
{% endblock %}

{% block js%}
{% if not request.client_id %}
<script type="text/javascript">
$(function() {

	$('#client_selector').autocomplete({
        source: function( request, response ) {
            $.ajax({
                url: bb.restUrl('admin/client/get_pairs'),
                dataType: "json",
                data: {
                    per_page: 10,
                    search: request.term
                },
                success: function( data ) {
                    response( $.map( data.result, function( name, id) {
                        return {
                            label: name,
                            value: id
                        }
                    }));
                }
            });
        },
        minLength: 1,
        select: function( event, ui ) {
            $("#client_selector").val(ui.item.label);
            $("#client_id").val(ui.item.value);
            return false;
        }
    });

});
</script>
{% endif %}
{% endblock %}