{include file="_partials/head.tpl"}

<div class="page-head page-head-compact">
  <h1>{lang key="shop.orders_list.title"} <span class="page-head-count">{pagination.total}</span></h1>
  <div class="actions">
    <a class="btn btn-primary" href="/admin/shop/orders/create">{icon name="plus" size="14"} {lang key="shop.orders_list.new_order"}</a>
  </div>
</div>

<div class="filters-bar">
  <form method="get" action="/admin/shop/orders" class="filters-form">
    <input type="search" name="q" value="{q}" placeholder="{lang key="shop.orders_list.search_placeholder"}">
    [if {tab}]<input type="hidden" name="tab" value="{tab}">[/if]
    <button type="submit" class="btn btn-secondary">{lang key="shop.common.search"}</button>
    [if {q}]<a href="/admin/shop/orders[if {tab}]?tab={tab}[/if]" class="btn btn-link">{lang key="shop.common.reset"}</a>[/if]
  </form>
</div>

<div class="tabs-bar">
  <a href="/admin/shop/orders[if {q}]?q={q}[/if]" class="tab [if {tab}="all"]is-active[/if]">
    {lang key="shop.common.all"} <span class="tab-count">{tab_counts.all}</span>
  </a>
  [foreach var="status_tabs" as="st"]
    <a href="/admin/shop/orders?tab={st.code}[if {q}]&q={q}[/if]" class="tab [if {st.is_active}]is-active[/if]">
      <span class="tab-dot tab-dot-{st.code}"></span>{st.label}
      <span class="tab-count">{st.count}</span>
    </a>
  [/foreach]
</div>

[if {orders}]
<div class="table-wrap">
  <table class="table table-orders">
    <thead>
      <tr>
        <th>{lang key="shop.orders_list.col.number"}</th>
        <th>{lang key="shop.orders_list.col.date"}</th>
        <th>{lang key="shop.orders_list.col.customer"}</th>
        <th>{lang key="shop.orders_list.col.items"}</th>
        <th>{lang key="shop.orders_list.col.total"}</th>
        <th>{lang key="shop.orders_list.col.payment"}</th>
        <th>{lang key="shop.orders_list.col.status"}</th>
        <th>{lang key="shop.orders_list.col.source"}</th>
      </tr>
    </thead>
    <tbody>
      [foreach var="orders" as="o"]
        <tr>
          <td><a href="/admin/shop/orders/{o.id}" class="row-link"><code class="ord-num">{o.number}</code></a></td>
          <td class="muted"><div>{o.date_short}</div><small>{o.time_short}</small></td>
          <td>
            <a href="/admin/shop/orders/{o.id}" class="row-link">
              <div class="ord-cust-name">{o.customer_name}</div>
              <small class="muted">{o.customer_email}</small>
            </a>
          </td>
          <td class="muted">{o.items_count}</td>
          <td><b>{o.total_fmt}</b></td>
          <td><span class="pay-badge pay-{o.payment_status}">{o.payment_status_label}</span></td>
          <td><span class="badge badge-{o.status}">{o.status_label}</span></td>
          <td class="muted"><span class="src-badge src-{o.source}">{o.source_label}</span></td>
        </tr>
      [/foreach]
    </tbody>
  </table>
</div>
{include file="_partials/pagination.tpl"}
[else]
<div class="empty-state">
  {icon name="cart" size="48"}
  <h3>{lang key="shop.orders_list.empty.title"}</h3>
  <p class="muted">{lang key="shop.orders_list.empty.text"}</p>
  <a href="/admin/shop/orders/create" class="btn btn-primary">{icon name="plus" size="14"} {lang key="shop.orders_list.empty.cta"}</a>
</div>
[/if]

{include file="_partials/foot.tpl"}
