Files
sterivein/templates/default/order-invoice.html
2013-09-30 11:12:15 +02:00

345 lines
17 KiB
HTML

{extends file="layout.tpl"}
{block name="no-return-functions"}
{check_auth context="front" roles="CUSTOMER" login_tpl="login"}
{check_cart_not_empty}
{check_valid_delivery}
{/block}
{block name="breadcrumb"}
<nav class="nav-breadcrumb" role="navigation" aria-labelledby="breadcrumb-label">
<strong id="breadcrumb-label">{intl l="You are here"} : </strong>
<ul class="breadcrumb" itemprop="breadcrumb">
<li itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a href="{navigate to="index"}" itemprop="url"><span itemprop="title">{intl l="Home"}</span></a></li>
<li itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a href="{url path="/cart"}" itemprop="url"><span itemprop="title">{intl l="Cart"}</span></a></li>
<li itemscope itemtype="http://data-vocabulary.org/Breadcrumb" class="active"><span itemprop="title">{intl l="My order"}</span></li>
</ul>
</nav><!-- /.nav-breadcrumb -->
{/block}
{block name="main-content"}
<div class="main">
<article class="col-main" role="main" aria-labelledby="main-label">
<h1 id="main-label" class="page-header">{intl l="Your Cart"}</h1>
<div class="btn-group checkout-progress">
<a href="{url path="/cart"}" role="button" class="btn btn-step"><span class="step-nb">1</span> <span class="step-label"> <span>{intl l="Your Cart"}</span></a>
<a href="{url path="/order/delivery"}" role="button" class="btn btn-step"><span class="step-nb">2</span> <span class="step-label">{intl l="Billing and delivery"}</span></a>
<a href="#" role="button" class="btn btn-step active"><span class="step-nb">3</span> <span class="step-label">{intl l="Check my order"}</span></a>
<a href="#" role="button" class="btn btn-step disabled"><span class="step-nb">4</span> <span class="step-label">{intl l="Secure payment"}</span></a>
</div>
{form name="thelia.order.payment"}
<form id="form-cart-payment" action="{url path="/order/invoice"}" method="post" role="form" {form_enctype form=$form}>
{form_hidden_fields form=$form}
{if $form_error}<div class="alert alert-danger">{$form_error_message}</div>{/if}
<table class="table table-cart">
<colgroup>
<col width="150">
<col>
<col width="200">
<col width="250">
</colgroup>
<thead>
<tr>
<th class="image">&nbsp;</th>
<th class="product">
<span class="hidden-xs">{intl l="Product Name"}</span>
<span class="visible-xs">{intl l="Name"}</span>
</th>
<th class="unitprice">
<span class="hidden-xs">{intl l="Unit Price"}</span>
<span class="visible-xs">{intl l="Price"}</span>
</th>
<th class="qty">
<span class="hidden-xs">{intl l="Quantity"}</span>
<span class="visible-xs">{intl l="Quantity"}</span>
</th>
<th class="subprice">
<span class="hidden-xs">{intl l="Total"} <abbr title="{intl l="Tax Inclusive"}">{intl l="TTC"}</abbr></span>
<span class="visible-xs">{intl l="Total"}</span>
</th>
</tr>
</thead>
<tbody>
{loop type="cart" name="cartloop"}
<tr>
<td class="image">
<a href="{$PRODUCT_URL}" class="thumbnail">
{assign "cart_count" $LOOP_COUNT}
{ifloop rel='product-image'}
{loop type="image" name="product-image" product=$PRODUCT_ID limit="1" width="118" height="85" force_return="true"}
<img src="{$IMAGE_URL}" alt="Product #{$cart_count}"></a>
{/loop}
{/ifloop}
{elseloop rel="product-image"}
{images file='assets/img/product/1/118x85.png'}<img itemprop="image" src="{$asset_url}" alt="Product #{$cart_count}">{/images}
{/elseloop}
</td>
<td class="product" >
<h3 class="name">
{$TITLE}
</h3>
<div class="product-options">
<dl class="dl-horizontal">
<dt>{intl l="Available"} :</dt>
<dd>{intl l="In Stock"}</dd>
<dt>{intl l="No."}</dt>
<dd>{$REF}</dd>
{*<dt>Select Size</dt>
<dd>Large</dd>
<dt>Select Delivery Date</dt>
<dd>Jan 2, 2013</dd>
<dt>Additional Option</dt>
<dd>Option 1</dd>*}
</dl>
</div>
</td>
<td class="unitprice">
{if $IS_PROMO == 1}
{assign "real_price" $PROMO_TAXED_PRICE}
<div class="special-price"><span class="price">{currency attr="symbol"} {$PROMO_TAXED_PRICE}</span></div>
<small class="old-price">{intl l="instead of"} <span class="price">{currency attr="symbol"} {$TAXED_PRICE}</span></small>
{else}
{assign "real_price" $TAXED_PRICE}
<div class="special-price"><span class="price">{currency attr="symbol"} {$TAXED_PRICE}</span></div>
{/if}
</td>
<td class="qty">
<span class="price">{$QUANTITY}</span>
</td>
<td class="subprice">
<span class="price">{currency attr="symbol"} {$real_price * $QUANTITY}</span>
</td>
</tr>
{/loop}
</tbody>
<tfoot>
<tr >
<td rowspan="3" colspan="3" class="empty">&nbsp;</td>
<th class="shipping">{intl l="Shipping Tax"}</th>
<td class="shipping">
<div class="shipping-price">
<span class="price">{currency attr="symbol"} {order attr="postage"}</span>
</div>
</td>
</tr>
<tr >
<th class="coupon"><label for="coupon">{intl l="You may have a coupon ?"}</label></th>
<td class="coupon">
<div class="input-group">
<input type="text" name="coupon" id="coupon" class="form-control">
<span class="input-group-btn">
<button type="button" class="btn btn-coupon">{intl l="Ok"}</button>
</span>
</div><!-- /input-group -->
</td>
</tr>
<tr >
<th class="total">{intl l="Total"} <abbr title="{intl l="Tax Inclusive"}">{intl l="TTC"}</abbr></th>
<td class="total">
<div class="total-price">
<span class="price">{currency attr="symbol"} {{cart attr="total_taxed_price"} + {order attr="postage"}}</span>
</div>
</td>
</tr>
</tfoot>
</table>
<div id="cart-address">
<div class="panel">
{loop type="address" name="delivery-address" id={order attr="delivery_address"}}
<div class="panel-heading">{intl l="Delivery address"}</div>
<div class="panel-body">
<span class="fn">{loop type="title" name="customer.title.info" id=$TITLE}{$SHORT}{/loop} {$LASTNAME|upper} {$FIRSTNAME|ucwords}</span>
<span class="org">{$COMPANY}</span>
<address class="adr">
<span class="street-address">{$ADDRESS1}</span><br>
{if $ADDRESS2 != ""}
<span class="street-address">{$ADDRESS2}</span><br>
{/if}
{if $ADDRESS3 != ""}
<span class="street-address">{$ADDRESS3}</span><br>
{/if}
<span class="postal-code">{$ZIPCODE}</span>
<span class="locality">{$CITY}, <span class="country-name">{loop type="country" name="customer.country.info" id=$COUNTRY}{$TITLE}{/loop}</span></span>
</address>
</div>
{/loop}
</div>
{form_field form=$form field='invoice-address'}
<div class="panel">
<div class="panel-heading">{intl l="Billing addres"}s</div>
{if $error}
<span class="help-block"><span class="icon-remove"></span> {$message}</span>
{/if}
<div class="panel-body">
<table class="col-md-12">
{if !$error && $value}
{assign defaultParam '*'}
{else}
{assign defaultParam 'true'}
{/if}
{if !$error && $value}
{assign idParam $value}
{else}
{assign idParam '*'}
{/if}
{loop type="address" name="invoice-address" default=$defaultParam id=$idParam}
<tr>
<td>
<span class="fn">{loop type="title" name="customer.title.info" id=$TITLE}{$SHORT}{/loop} {$LASTNAME|upper} {$FIRSTNAME|ucwords}</span>
<span class="org">{$COMPANY}</span>
<address class="adr">
<span class="street-address">{$ADDRESS1}</span><br>
{if $ADDRESS2 != ""}
<span class="street-address">{$ADDRESS2}</span><br>
{/if}
{if $ADDRESS3 != ""}
<span class="street-address">{$ADDRESS3}</span><br>
{/if}
<span class="postal-code">{$ZIPCODE}</span>
<span class="locality">{$CITY}, <span class="country-name">{loop type="country" name="customer.country.info" id=$COUNTRY}{$TITLE}{/loop}</span></span>
</address>
</td>
<td>
<input class="js-invoice-address-selector {if !$error}hidden{/if}" type="radio" name="{$name}" value="{$ID}" {if $value == $ID OR !$error}checked="checked"{/if}>
</td>
</tr>
{if !$error}
<tr class="js-change-invoice-address">
<td colspan="2">
<a href="#" class="btn btn-change-address">{intl l="Change address"}</a>
</td>
</tr>
{/if}
{/loop}
{if !$error && $value}
{assign defaultParam '*'}
{else}
{assign defaultParam 'false'}
{/if}
{if !$error && $value}
{assign excludeParam $value}
{else}
{assign excludeParam 'none'}
{/if}
{loop type="address" name="invoice-address" default=$defaultParam exclude=$excludeParam}
<tr class="js-other-invoice-address {if !$error}hidden{/if}">
<td>
<span class="fn">{loop type="title" name="customer.title.info" id=$TITLE}{$SHORT}{/loop} {$LASTNAME|upper} {$FIRSTNAME|ucwords}</span>
<span class="org">{$COMPANY}</span>
<address class="adr">
<span class="street-address">{$ADDRESS1}</span><br>
{if $ADDRESS2 != ""}
<span class="street-address">{$ADDRESS2}</span><br>
{/if}
{if $ADDRESS3 != ""}
<span class="street-address">{$ADDRESS3}</span><br>
{/if}
<span class="postal-code">{$ZIPCODE}</span>
<span class="locality">{$CITY}, <span class="country-name">{loop type="country" name="customer.country.info" id=$COUNTRY}{$TITLE}{/loop}</span></span>
</address>
</td>
<td>
<input class="js-invoice-address-selector {if !$error}hidden{/if}" type="radio" name="{$name}" value="{$ID}" {if $value == $ID}checked="checked"{/if}>
</td>
</tr>
{/loop}
</table>
</div>
</div>
</div>
{/form_field}
{form_field form=$form field='payment-module'}
<div id="payment-method" class="panel">
<div class="panel-heading">{intl l="Choose your payment method"}</div>
{if $error}
<span class="help-block"><span class="icon-remove"></span> {$message}</span>
{/if}
<div class="panel-body">
<ul class="list-payment">
{loop type="payment" name="payments" force_return="true"}
{assign "paymentModuleId" $ID}
{loop type="image" name="paymentspicture" source="module" source_id=$ID force_return="true" width="100" height="72"}
<li>
<div class="radio">
<label for="payment_{$paymentModuleId}_{$ID}">
<input type="radio" name="{$name}" id="payment_{$paymentModuleId}_{$ID}" value="{$paymentModuleId}">
<img src="{$IMAGE_URL}">
</label>
</div>
</li>
{/loop}
{/loop}
</div>
</div>
{/form_field}
<a href="{url path="/order/delivery"}" role="button" class="btn btn-back"><span>{intl l="Back"}</span></a>
<button type="submit" class="btn btn-checkout-next"><span>{intl l="Next Step"}</span></button>
</form>
{/form}
</article>
</div>
{/block}
{block name="javascript-initialization"}
<script type="text/javascript">
jQuery(function($order) {
$order('.js-change-invoice-address').on('click', 'a', function(e) {
e.preventDefault();
$order('.js-other-invoice-address').removeClass('hidden');
$order('.js-invoice-address-selector').removeClass('hidden');
$order('#js-invoice-address-default-selector').unbind().remove();
$order('.js-change-invoice-address').unbind().remove();
});
});
</script>
{/block}