forked from brooksbingham/theme-elegance
chore: update customer templates
parent
3b25639921
commit
8218fdcbf3
|
|
@ -23,31 +23,31 @@
|
|||
* International Registered Trademark & Property of PrestaShop SA
|
||||
*}
|
||||
{block name='order_products_table'}
|
||||
<div class="box hidden-sm-down">
|
||||
<table id="order-products" class="table table-bordered">
|
||||
<thead class="thead-default">
|
||||
<div class="box hidden sm:block">
|
||||
<table id="order-products" class="table-auto border-separate border border-gray-200 w-full">
|
||||
<thead class="bg-gray-100">
|
||||
<tr>
|
||||
<th>{l s='Product' d='Shop.Theme.Catalog'}</th>
|
||||
<th>{l s='Quantity' d='Shop.Theme.Catalog'}</th>
|
||||
<th>{l s='Unit price' d='Shop.Theme.Catalog'}</th>
|
||||
<th>{l s='Total price' d='Shop.Theme.Catalog'}</th>
|
||||
<th class="px-4 py-2 text-left">{l s='Product' d='Shop.Theme.Catalog'}</th>
|
||||
<th class="px-4 py-2 text-left">{l s='Quantity' d='Shop.Theme.Catalog'}</th>
|
||||
<th class="px-4 py-2 text-left">{l s='Unit price' d='Shop.Theme.Catalog'}</th>
|
||||
<th class="px-4 py-2 text-left">{l s='Total price' d='Shop.Theme.Catalog'}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
{foreach from=$order.products item=product}
|
||||
<tr>
|
||||
<td>
|
||||
<tr class="border-t border-gray-200">
|
||||
<td class="px-4 py-2">
|
||||
<strong>
|
||||
<a {if isset($product.download_link)}href="{$product.download_link}"{/if}>
|
||||
<a {if isset($product.download_link)}href="{$product.download_link}"{/if} class="text-blue-600 hover:underline">
|
||||
{$product.name}
|
||||
</a>
|
||||
</strong><br/>
|
||||
{if $product.reference}
|
||||
{l s='Reference' d='Shop.Theme.Catalog'}: {$product.reference}<br/>
|
||||
<span class="text-sm text-gray-500">{l s='Reference' d='Shop.Theme.Catalog'}: {$product.reference}<br/></span>
|
||||
{/if}
|
||||
{if $product.customizations}
|
||||
{foreach from=$product.customizations item="customization"}
|
||||
<div class="customization">
|
||||
<a href="#" data-toggle="modal" data-target="#product-customizations-modal-{$customization.id_customization}">{l s='Product customization' d='Shop.Theme.Catalog'}</a>
|
||||
<div class="customization mt-2">
|
||||
<a href="#" data-toggle="modal" data-target="#product-customizations-modal-{$customization.id_customization}" class="text-blue-600 hover:underline">{l s='Product customization' d='Shop.Theme.Catalog'}</a>
|
||||
</div>
|
||||
<div id="_desktop_product_customization_modal_wrapper_{$customization.id_customization}">
|
||||
<div class="modal fade customization-modal" id="product-customizations-modal-{$customization.id_customization}" tabindex="-1" role="dialog" aria-hidden="true">
|
||||
|
|
@ -61,11 +61,11 @@
|
|||
</div>
|
||||
<div class="modal-body">
|
||||
{foreach from=$customization.fields item="field"}
|
||||
<div class="product-customization-line row">
|
||||
<div class="col-sm-3 col-xs-4 label">
|
||||
<div class="product-customization-line flex mb-2">
|
||||
<div class="w-1/3 font-semibold text-sm text-gray-600">
|
||||
{$field.label}
|
||||
</div>
|
||||
<div class="col-sm-9 col-xs-8 value">
|
||||
<div class="w-2/3 text-sm">
|
||||
{if $field.type == 'text'}
|
||||
{if (int)$field.id_module}
|
||||
{$field.text nofilter}
|
||||
|
|
@ -73,7 +73,7 @@
|
|||
{$field.text}
|
||||
{/if}
|
||||
{elseif $field.type == 'image'}
|
||||
<img src="{$field.image.small.url}">
|
||||
<img src="{$field.image.small.url}" class="w-16 h-16 object-cover">
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -86,7 +86,7 @@
|
|||
{/foreach}
|
||||
{/if}
|
||||
</td>
|
||||
<td>
|
||||
<td class="px-4 py-2">
|
||||
{if $product.customizations}
|
||||
{foreach $product.customizations as $customization}
|
||||
{$customization.quantity}
|
||||
|
|
@ -95,52 +95,49 @@
|
|||
{$product.quantity}
|
||||
{/if}
|
||||
</td>
|
||||
<td class="text-xs-right">{$product.price}</td>
|
||||
<td class="text-xs-right">{$product.total}</td>
|
||||
<td class="px-4 py-2 text-right">{$|cat:$product.price}</td>
|
||||
<td class="px-4 py-2 text-right">{$|cat:$product.total}</td>
|
||||
</tr>
|
||||
{/foreach}
|
||||
<tfoot>
|
||||
{foreach $order.subtotals as $line}
|
||||
{if $line.value}
|
||||
<tr class="text-xs-right line-{$line.type}">
|
||||
<td colspan="3">{$line.label}</td>
|
||||
<td>{$line.value}</td>
|
||||
<tr class="text-right border-t border-gray-200">
|
||||
<td colspan="3" class="px-4 py-2">{$line.label}</td>
|
||||
<td class="px-4 py-2">{$line.value}</td>
|
||||
</tr>
|
||||
{/if}
|
||||
{/foreach}
|
||||
<tr class="text-xs-right line-{$order.totals.total.type}">
|
||||
<td colspan="3">{$order.totals.total.label}</td>
|
||||
<td>{$order.totals.total.value}</td>
|
||||
<tr class="text-right border-t border-gray-200">
|
||||
<td colspan="3" class="px-4 py-2">{$order.totals.total.label}</td>
|
||||
<td class="px-4 py-2">{$order.totals.total.value}</td>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="order-items hidden-md-up box">
|
||||
<div class="order-items sm:hidden box">
|
||||
{foreach from=$order.products item=product}
|
||||
<div class="order-item">
|
||||
<div class="row">
|
||||
<div class="col-sm-5 desc">
|
||||
<div class="name">{$product.name}</div>
|
||||
<div class="order-item py-4 border-b border-gray-200">
|
||||
<div class="flex">
|
||||
<div class="w-1/2">
|
||||
<div class="text-lg font-semibold">{$product.name}</div>
|
||||
{if $product.reference}
|
||||
<div class="ref">{l s='Reference' d='Shop.Theme.Catalog'}: {$product.reference}</div>
|
||||
<div class="text-sm text-gray-500">{l s='Reference' d='Shop.Theme.Catalog'}: {$product.reference}</div>
|
||||
{/if}
|
||||
{if $product.customizations}
|
||||
{foreach $product.customizations as $customization}
|
||||
<div class="customization">
|
||||
<a href="#" data-toggle="modal" data-target="#product-customizations-modal-{$customization.id_customization}">{l s='Product customization' d='Shop.Theme.Catalog'}</a>
|
||||
</div>
|
||||
<div id="_mobile_product_customization_modal_wrapper_{$customization.id_customization}">
|
||||
<div class="customization mt-2">
|
||||
<a href="#" data-toggle="modal" data-target="#product-customizations-modal-{$customization.id_customization}" class="text-blue-600 hover:underline">{l s='Product customization' d='Shop.Theme.Catalog'}</a>
|
||||
</div>
|
||||
<div id="_mobile_product_customization_modal_wrapper_{$customization.id_customization}"></div>
|
||||
{/foreach}
|
||||
{/if}
|
||||
</div>
|
||||
<div class="col-sm-7 qty">
|
||||
<div class="row">
|
||||
<div class="col-xs-4 text-sm-left text-xs-left">
|
||||
{$product.price}
|
||||
</div>
|
||||
<div class="col-xs-4">
|
||||
<div class="w-1/2 text-right">
|
||||
<div class="flex justify-between">
|
||||
<div class="text-sm">{$product.price}</div>
|
||||
<div class="text-sm">
|
||||
{if $product.customizations}
|
||||
{foreach $product.customizations as $customization}
|
||||
{$customization.quantity}
|
||||
|
|
@ -149,27 +146,26 @@
|
|||
{$product.quantity}
|
||||
{/if}
|
||||
</div>
|
||||
<div class="col-xs-4 text-xs-right">
|
||||
{$product.total}
|
||||
</div>
|
||||
<div class="text-sm">{'$'|cat:$product.total}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/foreach}
|
||||
</div>
|
||||
<div class="order-totals hidden-md-up box">
|
||||
|
||||
<div class="order-totals sm:hidden box mt-4">
|
||||
{foreach $order.subtotals as $line}
|
||||
{if $line.value}
|
||||
<div class="order-total row">
|
||||
<div class="col-xs-8"><strong>{$line.label}</strong></div>
|
||||
<div class="col-xs-4 text-xs-right">{$line.value}</div>
|
||||
<div class="order-total flex justify-between py-2">
|
||||
<div class="text-sm font-semibold">{'$line.label'}</div>
|
||||
<div class="text-sm">{'$line.value'}</div>
|
||||
</div>
|
||||
{/if}
|
||||
{/foreach}
|
||||
<div class="order-total row">
|
||||
<div class="col-xs-8"><strong>{$order.totals.total.label}</strong></div>
|
||||
<div class="col-xs-4 text-xs-right">{$order.totals.total.value}</div>
|
||||
<div class="order-total flex justify-between py-2">
|
||||
<div class="text-sm font-semibold">{'$order.totals.total.label'}</div>
|
||||
<div class="text-sm">{'$order.totals.total.value'}</div>
|
||||
</div>
|
||||
</div>
|
||||
{/block}
|
||||
|
|
|
|||
|
|
@ -25,21 +25,21 @@
|
|||
{block name='order_products_table'}
|
||||
<form id="order-return-form" action="{$urls.pages.order_follow}" method="post">
|
||||
|
||||
<div class="box hidden-sm-down">
|
||||
<table id="order-products" class="table table-bordered return">
|
||||
<thead class="thead-default">
|
||||
<div class="box hidden sm:block">
|
||||
<table id="order-products" class="table-auto border-separate border border-gray-200 w-full return">
|
||||
<thead class="bg-gray-100">
|
||||
<tr>
|
||||
<th class="head-checkbox"><input type="checkbox"/></th>
|
||||
<th>{l s='Product' d='Shop.Theme.Catalog'}</th>
|
||||
<th>{l s='Quantity' d='Shop.Theme.Catalog'}</th>
|
||||
<th>{l s='Returned' d='Shop.Theme.Customeraccount'}</th>
|
||||
<th>{l s='Unit price' d='Shop.Theme.Catalog'}</th>
|
||||
<th>{l s='Total price' d='Shop.Theme.Catalog'}</th>
|
||||
<th class="px-4 py-2"><input type="checkbox"/></th>
|
||||
<th class="px-4 py-2">{l s='Product' d='Shop.Theme.Catalog'}</th>
|
||||
<th class="px-4 py-2">{l s='Quantity' d='Shop.Theme.Catalog'}</th>
|
||||
<th class="px-4 py-2">{l s='Returned' d='Shop.Theme.Customeraccount'}</th>
|
||||
<th class="px-4 py-2">{l s='Unit price' d='Shop.Theme.Catalog'}</th>
|
||||
<th class="px-4 py-2">{l s='Total price' d='Shop.Theme.Catalog'}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
{foreach from=$order.products item=product name=products}
|
||||
<tr>
|
||||
<td>
|
||||
<tr class="border-t border-gray-200">
|
||||
<td class="px-4 py-2">
|
||||
{if !$product.customizations}
|
||||
<span id="_desktop_product_line_{$product.id_order_detail}">
|
||||
<input type="checkbox" id="cb_{$product.id_order_detail}" name="ids_order_detail[{$product.id_order_detail}]" value="{$product.id_order_detail}">
|
||||
|
|
@ -52,15 +52,15 @@
|
|||
{/foreach}
|
||||
{/if}
|
||||
</td>
|
||||
<td>
|
||||
<td class="px-4 py-2">
|
||||
<strong>{$product.name}</strong><br/>
|
||||
{if $product.reference}
|
||||
{l s='Reference' d='Shop.Theme.Catalog'}: {$product.reference}<br/>
|
||||
<span class="text-sm text-gray-500">{l s='Reference' d='Shop.Theme.Catalog'}: {$product.reference}<br/></span>
|
||||
{/if}
|
||||
{if $product.customizations}
|
||||
{foreach from=$product.customizations item="customization"}
|
||||
<div class="customization">
|
||||
<a href="#" data-toggle="modal" data-target="#product-customizations-modal-{$customization.id_customization}">{l s='Product customization' d='Shop.Theme.Catalog'}</a>
|
||||
<div class="customization mt-2">
|
||||
<a href="#" data-toggle="modal" data-target="#product-customizations-modal-{$customization.id_customization}" class="text-blue-600 hover:underline">{l s='Product customization' d='Shop.Theme.Catalog'}</a>
|
||||
</div>
|
||||
<div id="_desktop_product_customization_modal_wrapper_{$customization.id_customization}">
|
||||
<div class="modal fade customization-modal" id="product-customizations-modal-{$customization.id_customization}" tabindex="-1" role="dialog" aria-hidden="true">
|
||||
|
|
@ -74,11 +74,11 @@
|
|||
</div>
|
||||
<div class="modal-body">
|
||||
{foreach from=$customization.fields item="field"}
|
||||
<div class="product-customization-line row">
|
||||
<div class="col-sm-3 col-xs-4 label">
|
||||
<div class="product-customization-line flex mb-2">
|
||||
<div class="w-1/3 font-semibold text-sm text-gray-600">
|
||||
{$field.label}
|
||||
</div>
|
||||
<div class="col-sm-9 col-xs-8 value">
|
||||
<div class="w-2/3 text-sm">
|
||||
{if $field.type == 'text'}
|
||||
{if (int)$field.id_module}
|
||||
{$field.text nofilter}
|
||||
|
|
@ -86,7 +86,7 @@
|
|||
{$field.text}
|
||||
{/if}
|
||||
{elseif $field.type == 'image'}
|
||||
<img src="{$field.image.small.url}">
|
||||
<img src="{$field.image.small.url}" class="w-16 h-16 object-cover">
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -99,14 +99,14 @@
|
|||
{/foreach}
|
||||
{/if}
|
||||
</td>
|
||||
<td class="qty">
|
||||
<td class="px-4 py-2">
|
||||
{if !$product.customizations}
|
||||
<div class="current">
|
||||
{$product.quantity}
|
||||
</div>
|
||||
{if $product.quantity > $product.qty_returned}
|
||||
<div class="select" id="_desktop_return_qty_{$product.id_order_detail}">
|
||||
<select name="order_qte_input[{$product.id_order_detail}]" class="form-control form-control-select">
|
||||
<div class="select mt-2" id="_desktop_return_qty_{$product.id_order_detail}">
|
||||
<select name="order_qte_input[{$product.id_order_detail}]" class="form-control border-gray-300 rounded-md shadow-sm">
|
||||
{section name=quantity start=1 loop=$product.quantity+1-$product.qty_returned}
|
||||
<option value="{$smarty.section.quantity.index}">{$smarty.section.quantity.index}</option>
|
||||
{/section}
|
||||
|
|
@ -118,10 +118,10 @@
|
|||
<div class="current">
|
||||
{$customization.quantity}
|
||||
</div>
|
||||
<div class="select" id="_desktop_return_qty_{$product.id_order_detail}_{$customization.id_customization}">
|
||||
<div class="select mt-2" id="_desktop_return_qty_{$product.id_order_detail}_{$customization.id_customization}">
|
||||
<select
|
||||
name="customization_qty_input[{$customization.id_customization}]"
|
||||
class="form-control form-control-select"
|
||||
class="form-control border-gray-300 rounded-md shadow-sm"
|
||||
>
|
||||
{section name=quantity start=1 loop=$customization.quantity+1}
|
||||
<option value="{$smarty.section.quantity.index}">{$smarty.section.quantity.index}</option>
|
||||
|
|
@ -132,32 +132,32 @@
|
|||
<div class="clearfix"></div>
|
||||
{/if}
|
||||
</td>
|
||||
<td class="text-xs-right">{$product.qty_returned}</td>
|
||||
<td class="text-xs-right">{$product.price}</td>
|
||||
<td class="text-xs-right">{$product.total}</td>
|
||||
<td class="px-4 py-2 text-right">{$product.qty_returned}</td>
|
||||
<td class="px-4 py-2 text-right">{'$'|cat:$product.price}</td>
|
||||
<td class="px-4 py-2 text-right">{'$'|cat:$product.total}</td>
|
||||
</tr>
|
||||
{/foreach}
|
||||
<tfoot>
|
||||
{foreach $order.subtotals as $line}
|
||||
{if $line.value}
|
||||
<tr class="text-xs-right line-{$line.type}">
|
||||
<td colspan="5">{$line.label}</td>
|
||||
<td colspan="2">{$line.value}</td>
|
||||
<tr class="text-right border-t border-gray-200">
|
||||
<td colspan="5" class="px-4 py-2">{'$line.label'}</td>
|
||||
<td colspan="2" class="px-4 py-2">{'$line.value'}</td>
|
||||
</tr>
|
||||
{/if}
|
||||
{/foreach}
|
||||
<tr class="text-xs-right line-{$order.totals.total.type}">
|
||||
<td colspan="5">{$order.totals.total.label}</td>
|
||||
<td colspan="2">{$order.totals.total.value}</td>
|
||||
<tr class="text-right border-t border-gray-200">
|
||||
<td colspan="5" class="px-4 py-2">{'$order.totals.total.label'}</td>
|
||||
<td colspan="2" class="px-4 py-2">{'$order.totals.total.value'}</td>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="order-items hidden-md-up box">
|
||||
<div class="order-items sm:hidden box">
|
||||
{foreach from=$order.products item=product}
|
||||
<div class="order-item">
|
||||
<div class="row">
|
||||
<div class="order-item py-4 border-b border-gray-200">
|
||||
<div class="flex">
|
||||
<div class="checkbox">
|
||||
{if !$product.customizations}
|
||||
<span id="_mobile_product_line_{$product.id_order_detail}"></span>
|
||||
|
|
@ -167,29 +167,27 @@
|
|||
{/foreach}
|
||||
{/if}
|
||||
</div>
|
||||
<div class="content">
|
||||
<div class="row">
|
||||
<div class="col-sm-5 desc">
|
||||
<div class="name">{$product.name}</div>
|
||||
<div class="content w-full">
|
||||
<div class="flex">
|
||||
<div class="w-1/2">
|
||||
<div class="name font-semibold text-sm">{$product.name}</div>
|
||||
{if $product.reference}
|
||||
<div class="ref">{l s='Reference' d='Shop.Theme.Catalog'}: {$product.reference}</div>
|
||||
<div class="ref text-sm text-gray-500">{l s='Reference' d='Shop.Theme.Catalog'}: {$product.reference}</div>
|
||||
{/if}
|
||||
{if $product.customizations}
|
||||
{foreach $product.customizations as $customization}
|
||||
<div class="customization">
|
||||
<a href="#" data-toggle="modal" data-target="#product-customizations-modal-{$customization.id_customization}">{l s='Product customization' d='Shop.Theme.Catalog'}</a>
|
||||
<div class="customization mt-2">
|
||||
<a href="#" data-toggle="modal" data-target="#product-customizations-modal-{$customization.id_customization}" class="text-blue-600 hover:underline">{l s='Product customization' d='Shop.Theme.Catalog'}</a>
|
||||
</div>
|
||||
<div id="_mobile_product_customization_modal_wrapper_{$customization.id_customization}">
|
||||
</div>
|
||||
{/foreach}
|
||||
{/if}
|
||||
</div>
|
||||
<div class="col-sm-7 qty">
|
||||
<div class="row">
|
||||
<div class="col-xs-4 text-sm-left text-xs-left">
|
||||
{$product.price}
|
||||
</div>
|
||||
<div class="col-xs-4">
|
||||
<div class="w-1/2">
|
||||
<div class="flex justify-between">
|
||||
<div class="text-sm">{'$'|cat:$product.price}</div>
|
||||
<div class="text-sm">
|
||||
{if $product.customizations}
|
||||
{foreach $product.customizations as $customization}
|
||||
<div class="q">{l s='Quantity' d='Shop.Theme.Catalog'}: {$customization.quantity}</div>
|
||||
|
|
@ -202,12 +200,9 @@
|
|||
{/if}
|
||||
{/if}
|
||||
{if $product.qty_returned > 0}
|
||||
<div>{l s='Returned' d='Shop.Theme.Customeraccount'}: {$product.qty_returned}</div>
|
||||
<div class="text-xs text-gray-600">{l s='Returned' d='Shop.Theme.Customeraccount'}: {$product.qty_returned}</div>
|
||||
{/if}
|
||||
</div>
|
||||
<div class="col-xs-4 text-xs-right">
|
||||
{$product.total}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -216,38 +211,38 @@
|
|||
</div>
|
||||
{/foreach}
|
||||
</div>
|
||||
<div class="order-totals hidden-md-up box">
|
||||
<div class="order-totals sm:hidden box">
|
||||
{foreach $order.subtotals as $line}
|
||||
{if $line.value}
|
||||
<div class="order-total row">
|
||||
<div class="col-xs-8"><strong>{$line.label}</strong></div>
|
||||
<div class="col-xs-4 text-xs-right">{$line.value}</div>
|
||||
<div class="order-total flex justify-between py-2 px-4 border-b border-gray-200">
|
||||
<div class="text-sm font-semibold">{$line.label}</div>
|
||||
<div class="text-sm">{'$line.value'}</div>
|
||||
</div>
|
||||
{/if}
|
||||
{/foreach}
|
||||
<div class="order-total row">
|
||||
<div class="col-xs-8"><strong>{$order.totals.total.label}</strong></div>
|
||||
<div class="col-xs-4 text-xs-right">{$order.totals.total.value}</div>
|
||||
<div class="order-total flex justify-between py-2 px-4 border-t border-gray-200">
|
||||
<div class="text-sm font-semibold">{$order.totals.total.label}</div>
|
||||
<div class="text-sm">{'$order.totals.total.value'}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="box">
|
||||
<header>
|
||||
<h3>{l s='Merchandise return' d='Shop.Theme.Customeraccount'}</h3>
|
||||
<p>{l s='If you wish to return one or more products, please mark the corresponding boxes and provide an explanation for the return. When complete, click the button below.' d='Shop.Theme.Customeraccount'}</p>
|
||||
<div class="box mt-4">
|
||||
<header class="mb-4">
|
||||
<h3 class="text-lg font-semibold">{l s='Merchandise return' d='Shop.Theme.Customeraccount'}</h3>
|
||||
<p class="text-sm text-gray-600">{l s='If you wish to return one or more products, please mark the corresponding boxes and provide an explanation for the return. When complete, click the button below.' d='Shop.Theme.Customeraccount'}</p>
|
||||
</header>
|
||||
<section class="form-fields">
|
||||
<section class="form-fields mb-4">
|
||||
<div class="form-group">
|
||||
<textarea cols="67" rows="3" name="returnText" class="form-control"></textarea>
|
||||
<textarea cols="67" rows="3" name="returnText" class="form-control border-gray-300 rounded-md shadow-sm w-full"></textarea>
|
||||
</div>
|
||||
</section>
|
||||
<footer class="form-footer">
|
||||
<footer class="form-footer mt-4">
|
||||
<input type="hidden" name="id_order" value="{$order.details.id}">
|
||||
<button class="form-control-submit btn btn-primary" type="submit" name="submitReturnMerchandise">
|
||||
<button class="form-control-submit btn bg-blue-500 text-white rounded-md py-2 px-6 hover:bg-blue-600" type="submit" name="submitReturnMerchandise">
|
||||
{l s='Request a return' d='Shop.Theme.Customeraccount'}
|
||||
</button>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
{/block}
|
||||
{/block}}
|
||||
|
|
|
|||
|
|
@ -20,7 +20,6 @@
|
|||
* @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'}
|
||||
|
||||
|
|
@ -30,35 +29,42 @@
|
|||
|
||||
{block name='page_content'}
|
||||
{block name='order_infos'}
|
||||
<div id="order-infos">
|
||||
<div class="box">
|
||||
<div class="row">
|
||||
<div class="col-xs-{if $order.details.reorder_url}9{else}12{/if}">
|
||||
<div id="order-infos" class="space-y-6">
|
||||
<div class="bg-white shadow rounded-lg p-6">
|
||||
<div class="flex flex-wrap items-center">
|
||||
<div class="w-full {if $order.details.reorder_url}lg:w-9/12{else}lg:w-full{/if}">
|
||||
<strong>
|
||||
{l
|
||||
s='Order Reference %reference% - placed on %date%'
|
||||
d='Shop.Theme.Customeraccount'
|
||||
sprintf=['%reference%' => $order.details.reference, '%date%' => $order.details.order_date]
|
||||
}
|
||||
{l s='Order Reference %reference% - placed on %date%' d='Shop.Theme.Customeraccount' sprintf=['%reference%' => $order.details.reference, '%date%' => $order.details.order_date]}
|
||||
</strong>
|
||||
</div>
|
||||
{if $order.details.reorder_url}
|
||||
<div class="col-xs-3 text-xs-right">
|
||||
<a href="{$order.details.reorder_url}" class="button-primary">{l s='Reorder' d='Shop.Theme.Actions'}</a>
|
||||
<div class="w-full lg:w-3/12 text-right">
|
||||
<a href="{$order.details.reorder_url}" class="btn btn-primary">{l s='Reorder' d='Shop.Theme.Actions'}</a>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
</div><div class="bg-white shadow rounded-lg p-6">
|
||||
<div class="flex flex-wrap items-center">
|
||||
<div class="w-full {if $order.details.reorder_url}lg:w-9/12{else}lg:w-full{/if}">
|
||||
<strong>
|
||||
{l s='Order Reference %reference% - placed on %date%' d='Shop.Theme.Customeraccount' sprintf=['%reference%' => $order.details.reference, '%date%' => $order.details.order_date]}
|
||||
</strong>
|
||||
</div>
|
||||
{if $order.details.reorder_url}
|
||||
<div class="w-full lg:w-3/12 text-right">
|
||||
<a href="{$order.details.reorder_url}" class="btn btn-primary">{l s='Reorder' d='Shop.Theme.Actions'}</a>
|
||||
</div>
|
||||
{/if}
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="box">
|
||||
<ul>
|
||||
<div class="bg-white shadow rounded-lg p-6">
|
||||
<ul class="space-y-4">
|
||||
<li><strong>{l s='Carrier' d='Shop.Theme.Checkout'}</strong> {$order.carrier.name}</li>
|
||||
<li><strong>{l s='Payment method' d='Shop.Theme.Checkout'}</strong> {$order.details.payment}</li>
|
||||
|
||||
{if $order.details.invoice_url}
|
||||
<li>
|
||||
<a href="{$order.details.invoice_url}">
|
||||
<a href="{$order.details.invoice_url}" class="text-blue-500 hover:text-blue-700">
|
||||
{l s='Download your invoice as a PDF file.' d='Shop.Theme.Customeraccount'}
|
||||
</a>
|
||||
</li>
|
||||
|
|
@ -80,21 +86,21 @@
|
|||
{/block}
|
||||
|
||||
{block name='order_history'}
|
||||
<section id="order-history" class="box">
|
||||
<h3>{l s='Follow your order\'s status step-by-step' d='Shop.Theme.Customeraccount'}</h3>
|
||||
<table class="table table-striped table-bordered table-labeled hidden-xs-down">
|
||||
<thead class="thead-default">
|
||||
<section id="order-history" class="bg-white shadow rounded-lg p-6">
|
||||
<h3 class="text-xl font-semibold">{l s='Follow your order\'s status step-by-step' d='Shop.Theme.Customeraccount'}</h3>
|
||||
<table class="table-auto w-full hidden md:table">
|
||||
<thead class="text-gray-700">
|
||||
<tr>
|
||||
<th>{l s='Date' d='Shop.Theme.Global'}</th>
|
||||
<th>{l s='Status' d='Shop.Theme.Global'}</th>
|
||||
<th class="px-4 py-2">{l s='Date' d='Shop.Theme.Global'}</th>
|
||||
<th class="px-4 py-2">{l s='Status' d='Shop.Theme.Global'}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{foreach from=$order.history item=state}
|
||||
<tr>
|
||||
<td>{$state.history_date}</td>
|
||||
<td>
|
||||
<span class="label label-pill {$state.contrast}" style="background-color:{$state.color}">
|
||||
<td class="px-4 py-2">{($state.history_date)}</td>
|
||||
<td class="px-4 py-2">
|
||||
<span class="inline-block px-4 py-1 rounded-full text-white" style="background-color:{$state.color}">
|
||||
{$state.ostate_name}
|
||||
</span>
|
||||
</td>
|
||||
|
|
@ -102,12 +108,12 @@
|
|||
{/foreach}
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="hidden-sm-up history-lines">
|
||||
<div class="block md:hidden">
|
||||
{foreach from=$order.history item=state}
|
||||
<div class="history-line">
|
||||
<div class="date">{$state.history_date}</div>
|
||||
<div class="state">
|
||||
<span class="label label-pill {$state.contrast}" style="background-color:{$state.color}">
|
||||
<div class="mb-4">
|
||||
<div class="text-sm font-semibold">{($state.history_date)}</div>
|
||||
<div class="mt-2">
|
||||
<span class="inline-block px-4 py-1 rounded-full text-white" style="background-color:{$state.color}">
|
||||
{$state.ostate_name}
|
||||
</span>
|
||||
</div>
|
||||
|
|
@ -118,30 +124,29 @@
|
|||
{/block}
|
||||
|
||||
{if $order.follow_up}
|
||||
<div class="box">
|
||||
<div class="bg-white shadow rounded-lg p-6">
|
||||
<p>{l s='Click the following link to track the delivery of your order' d='Shop.Theme.Customeraccount'}</p>
|
||||
<a href="{$order.follow_up}">{$order.follow_up}</a>
|
||||
<a href="{$order.follow_up}" class="text-blue-500 hover:text-blue-700">{$order.follow_up}</a>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
{block name='addresses'}
|
||||
<div class="addresses">
|
||||
<div class="flex flex-wrap">
|
||||
{if $order.addresses.delivery}
|
||||
<div class="col-lg-6 col-md-6 col-sm-6">
|
||||
<article id="delivery-address" class="box">
|
||||
<h4>{l s='Delivery address %alias%' d='Shop.Theme.Checkout' sprintf=['%alias%' => $order.addresses.delivery.alias]}</h4>
|
||||
<address>{$order.addresses.delivery.formatted nofilter}</address>
|
||||
<div class="w-full lg:w-6/12 p-4">
|
||||
<article id="delivery-address" class="bg-white shadow rounded-lg p-6">
|
||||
<h4 class="text-lg font-semibold">{l s='Delivery address %alias%' d='Shop.Theme.Checkout' sprintf=['%alias%' => $order.addresses.delivery.alias]}</h4>
|
||||
<address class="text-sm text-gray-700">{$order.addresses.delivery.formatted nofilter}</address>
|
||||
</article>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<div class="col-lg-6 col-md-6 col-sm-6">
|
||||
<article id="invoice-address" class="box">
|
||||
<h4>{l s='Invoice address %alias%' d='Shop.Theme.Checkout' sprintf=['%alias%' => $order.addresses.invoice.alias]}</h4>
|
||||
<address>{$order.addresses.invoice.formatted nofilter}</address>
|
||||
<div class="w-full lg:w-6/12 p-4">
|
||||
<article id="invoice-address" class="bg-white shadow rounded-lg p-6">
|
||||
<h4 class="text-lg font-semibold">{l s='Invoice address %alias%' d='Shop.Theme.Checkout' sprintf=['%alias%' => $order.addresses.invoice.alias]}</h4>
|
||||
<address class="text-sm text-gray-700">{$order.addresses.invoice.formatted nofilter}</address>
|
||||
</article>
|
||||
</div>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
{/block}
|
||||
|
||||
|
|
@ -157,57 +162,31 @@
|
|||
|
||||
{block name='order_carriers'}
|
||||
{if $order.shipping}
|
||||
<div class="box">
|
||||
<table class="table table-striped table-bordered hidden-sm-down">
|
||||
<thead class="thead-default">
|
||||
<div class="bg-white shadow rounded-lg p-6">
|
||||
<table class="table-auto w-full hidden md:table">
|
||||
<thead class="text-gray-700">
|
||||
<tr>
|
||||
<th>{l s='Date' d='Shop.Theme.Global'}</th>
|
||||
<th>{l s='Carrier' d='Shop.Theme.Checkout'}</th>
|
||||
<th>{l s='Weight' d='Shop.Theme.Checkout'}</th>
|
||||
<th>{l s='Shipping cost' d='Shop.Theme.Checkout'}</th>
|
||||
<th>{l s='Tracking number' d='Shop.Theme.Checkout'}</th>
|
||||
<th class="px-4 py-2">{l s='Date' d='Shop.Theme.Global'}</th>
|
||||
<th class="px-4 py-2">{l s='Carrier' d='Shop.Theme.Checkout'}</th>
|
||||
<th class="px-4 py-2">{l s='Weight' d='Shop.Theme.Checkout'}</th>
|
||||
<th class="px-4 py-2">{l s='Shipping cost' d='Shop.Theme.Checkout'}</th>
|
||||
<th class="px-4 py-2">{l s='Tracking number' d='Shop.Theme.Checkout'}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{foreach from=$order.shipping item=line}
|
||||
<tr>
|
||||
<td>{$line.shipping_date}</td>
|
||||
<td>{$line.carrier_name}</td>
|
||||
<td>{$line.shipping_weight}</td>
|
||||
<td>{$line.shipping_cost}</td>
|
||||
<td>{$line.tracking nofilter}</td>
|
||||
<td class="px-4 py-2">{$line.shipping_date}</td>
|
||||
<td class="px-4 py-2">{$line.carrier_name}</td>
|
||||
<td class="px-4 py-2">{$line.shipping_weight}</td>
|
||||
<td class="px-4 py-2">{$line.shipping_cost}</td>
|
||||
<td class="px-4 py-2">{$line.tracking nofilter}</td>
|
||||
</tr>
|
||||
{/foreach}
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="hidden-md-up shipping-lines">
|
||||
{foreach from=$order.shipping item=line}
|
||||
<div class="shipping-line">
|
||||
<ul>
|
||||
<li>
|
||||
<strong>{l s='Date' d='Shop.Theme.Global'}</strong> {$line.shipping_date}
|
||||
</li>
|
||||
<li>
|
||||
<strong>{l s='Carrier' d='Shop.Theme.Checkout'}</strong> {$line.carrier_name}
|
||||
</li>
|
||||
<li>
|
||||
<strong>{l s='Weight' d='Shop.Theme.Checkout'}</strong> {$line.shipping_weight}
|
||||
</li>
|
||||
<li>
|
||||
<strong>{l s='Shipping cost' d='Shop.Theme.Checkout'}</strong> {$line.shipping_cost}
|
||||
</li>
|
||||
<li>
|
||||
<strong>{l s='Tracking number' d='Shop.Theme.Checkout'}</strong> {$line.tracking nofilter}
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
{/foreach}
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
{/block}
|
||||
|
||||
{block name='order_messages'}
|
||||
{include file='customer/_partials/order-messages.tpl'}
|
||||
{/block}
|
||||
{/block}
|
||||
|
|
|
|||
Loading…
Reference in New Issue