mohitj
/
theme-elegance
forked from brooksbingham/theme-elegance
1
0
Fork 0
Code Pull Requests Activity

refactor: update orders history page

pagebuilder
abhisheks 2023-11-26 18:25:46 +05:30
parent c72869ec3f
commit 5e612c5b4f
1 changed files with 32 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

86
templates/customer/history.tpl
View File

@ -25,95 +25,69 @@
{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>{l s='Here are the orders you\'ve placed since your account was created.' d='Shop.Theme.Customeraccount'}</h6>
<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="table table-striped table-bordered table-labeled hidden-sm-down">
<table class="mt-2 w-full">
<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="hidden-md-down">{l s='Payment' d='Shop.Theme.Checkout'}</th>
<th class="hidden-md-down">{l s='Status' d='Shop.Theme.Checkout'}</th>
<th>{l s='Invoice' 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>
<th scope="row">{$order.details.reference}</th>
<td>{$order.details.order_date}</td>
<td class="text-xs-right">{$order.totals.total.value}</td>
<td class="hidden-md-down">{$order.details.payment}</td>
<td>
<span
class="label label-pill {$order.history.current.contrast}"
style="background-color:{$order.history.current.color}"
>
<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}
</span>
</td>
<td class="text-sm-center hidden-md-down">
<td class="text-center max-md:hidden">
{if $order.details.invoice_url}
<a href="{$order.details.invoice_url}"><i class="material-icons">&#xE415;</i></a>
<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-sm-center order-actions">
<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}">{l s='Reorder' d='Shop.Theme.Actions'}</a>
<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>
<div class="orders hidden-md-up">
{foreach from=$orders item=order}
<div class="order">
<div class="row">
<div class="col-xs-10">
<a href="{$order.details.details_url}"><h3>{$order.details.reference}</h3></a>
<div class="date">{$order.details.order_date}</div>
<div class="total">{$order.totals.total.value}</div>
<div class="status">
<span
class="label label-pill {$order.history.current.contrast}"
style="background-color:{$order.history.current.color}"
>
{$order.history.current.ostate_name}
</span>
{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>
</div>
<div class="col-xs-2 text-xs-right">
<div>
<a href="{$order.details.details_url}" data-link-action="view-order-details" title="{l s='Details' d='Shop.Theme.Customeraccount'}">
<i class="material-icons">&#xE8B6;</i>
</a>
</div>
{if $order.details.reorder_url}
<div>
<a href="{$order.details.reorder_url}" title="{l s='Reorder' d='Shop.Theme.Actions'}">
<i class="material-icons">&#xE863;</i>
</a>
</div>
{/if}
</div>
</div>
</div>
{/foreach}
</div>
{/if}
{/block}