{**
 * 2007-2019 PrestaShop and Contributors
 *
 * NOTICE OF LICENSE
 *
 * This source file is subject to the Academic Free License 3.0 (AFL-3.0)
 * that is bundled with this package in the file LICENSE.txt.
 * It is also available through the world-wide-web at this URL:
 * https://opensource.org/licenses/AFL-3.0
 * If you did not receive a copy of the license and are unable to
 * obtain it through the world-wide-web, please send an email
 * to license@prestashop.com so we can send you a copy immediately.
 *
 * DISCLAIMER
 *
 * Do not edit or add to this file if you wish to upgrade PrestaShop to newer
 * versions in the future. If you wish to customize PrestaShop for your
 * needs please refer to https://www.prestashop.com for more information.
 *
 * @author    PrestaShop SA <contact@prestashop.com>
 * @copyright 2007-2019 PrestaShop SA and Contributors
 * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
 * International Registered Trademark & Property of PrestaShop SA
 *}
{extends file='customer/page.tpl'}

{block name='page_title'}
  <h2 class="text-2xl font-bold mb-8">
    {l s='Order history' d='Shop.Theme.Customeraccount'}
  </h2>
{/block}

{block name='page_content'}
  <h6 class='text-lg'>{l s='Here are the orders you\'ve placed since your account was created.' d='Shop.Theme.Customeraccount'}</h6>

  {if $orders}
    <table class="mt-2 w-full border-separate border-spacing-x-0 border-spacing-y-[12px]">
      <thead class="thead-default">
        <tr>
          <th>{l s='Order reference' d='Shop.Theme.Checkout'}</th>
          <th>{l s='Date' d='Shop.Theme.Checkout'}</th>
          <th>{l s='Total price' d='Shop.Theme.Checkout'}</th>
          <th class="max-md:hidden">{l s='Payment' d='Shop.Theme.Checkout'}</th>
          <th>{l s='Status' d='Shop.Theme.Checkout'}</th>
          <th class="max-md:hidden">{l s='Invoice' d='Shop.Theme.Checkout'}</th>
          <th>&nbsp;</th>
        </tr>
      </thead>
      <tbody>
        {foreach from=$orders item=order}
          <tr class="even:bg-gray-200 text-sm md:text-base">
            <td class="text-center">{$order.details.reference}</th>
            <td class="text-center">{$order.details.order_date}</td>
            <td class="text-center">{$order.totals.total.value}</td>
            <td class="text-center max-md:hidden">{$order.details.payment}</td>
            <td class="text-center max-md:px-2">
                {$order.history.current.ostate_name}
            </td>
            <td class="text-center max-md:hidden">
              {if $order.details.invoice_url}
                <a href="{$order.details.invoice_url}">
                  <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-file-download mx-auto" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M14 3v4a1 1 0 0 0 1 1h4" /><path d="M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z" /><path d="M12 17v-6" /><path d="M9.5 14.5l2.5 2.5l2.5 -2.5" /></svg>
                </a>
              {else}
                -
              {/if}
            </td>
            <td class="text-center md:flex gap-2 items-center justify-center">
              <a href="{$order.details.details_url}" data-link-action="view-order-details">
                  <svg xmlns="http://www.w3.org/2000/svg" class="md:hidden icon icon-tabler icon-tabler-file-description" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M14 3v4a1 1 0 0 0 1 1h4" /><path d="M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z" /><path d="M9 17h6" /><path d="M9 13h6" /></svg>
                  <h2 class="text-sm md:text-base max-md:hidden">
                    {l s='Details' d='Shop.Theme.Customeraccount'}
                  </h2>
              </a>
              {if $order.details.reorder_url}
                <a href="{$order.details.reorder_url}">
                    <svg xmlns="http://www.w3.org/2000/svg" class="md:hidden icon icon-tabler icon-tabler-reorder" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M3 15m0 1a1 1 0 0 1 1 -1h2a1 1 0 0 1 1 1v2a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1z" /><path d="M10 15m0 1a1 1 0 0 1 1 -1h2a1 1 0 0 1 1 1v2a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1z" /><path d="M17 15m0 1a1 1 0 0 1 1 -1h2a1 1 0 0 1 1 1v2a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1z" /><path d="M5 11v-3a3 3 0 0 1 3 -3h8a3 3 0 0 1 3 3v3" /><path d="M16.5 8.5l2.5 2.5l2.5 -2.5" /></svg>
                    <h2 class="text-sm md:text-sm max-md:hidden">
                        {l s='Reorder' d='Shop.Theme.Actions'}
                    </h2>
                </a>
              {/if}
            </td>
          </tr>
        {/foreach}
      </tbody>
    </table>
    {else}
    <div class='w-full mt-2 p-2 bg-red-100 border border-red-300'>
      <span>You have not placed any orders yet !</span>
    </div>
  {/if}
{/block}