{extends file="admin-layout.tpl"}

{block name="page-title"}{intl l='Edit an order'}{/block}

{block name="check-permissions"}admin.order.edit{/block}

{block name="main-content"}

    {assign oder_tab {$smarty.get.tab|default:"cart"}}

    <div class="orders edit-order">

        <div id="wrapper" class="container">

            <ul class="breadcrumb">
	            <li><a href="{url path='/admin/home'}">{intl l="Home"}</a></li>
	            <li><a href="{url path='/admin/orders'}">{intl l="Orders"}</a></li>
	        </ul>

	        <div class="row">
            	<div class="col-md-12">

                    <div class="general-block-decorator">

                        {ifloop rel='the-order'}

                            {loop type="order" name="the-order" id=$order_id customer="*"}

                                {loop type="currency" name="order-currency" id=$CURRENCY}
                                    {assign "orderCurrency" $SYMBOL}
                                {/loop}

                                {assign "orderStatusId" $STATUS}

                                <div class="lead clearfix">
                                    <span class='label label-default pull-left'>{$REF}</span>
                                    <div class="pull-right select-fixed-width">
                                        <form id="order-update-status-form" action="{url path="/admin/order/update/$ID/status"}" method="post">
                                            <input class="js-current-tab" type="hidden" name="tab" value="{$oder_tab}">
                                            <select class="js-update-order-status" name="status_id" data-toggle="selectpicker">
                                                {loop type="order-status" name="all-status"}
                                                {assign "orderStatusLabel" "order_$CODE"}
                                                    <option {if $ID == $orderStatusId}selected="selected" {/if} value="{$ID}" data-content="<span class='label label-{#$orderStatusLabel#}'>{$TITLE}</span>">{$TITLE}</option>
                                                {/loop}
                                            </select>
                                        </form>
                                    </div>
                                </div>

                                <ul class="nav nav-tabs clearfix">
                                    <li {if $oder_tab == 'cart'}class="active"{/if}><a href="#cart" data-tab-name="cart" data-toggle="tab"><span class="glyphicon glyphicon-shopping-cart"></span> {intl l="Ordered products"}</a></li>
                                    <li {if $oder_tab == 'bill'}class="active"{/if}><a href="#bill" data-tab-name="bill" data-toggle="tab"><span class="glyphicon glyphicon-list-alt"></span> {intl l="Invoice and Delivery"}</a></li>

                                </ul>

                                <div class="tab-content">
                                    <div class="tab-pane fade {if $oder_tab == 'cart'}active in{/if}" id="cart">
                                        <div class="table-responsive">
                                            <table class="table table-striped table-condensed table-left-aligned">
                                                <caption class="clearfix">
                                                   {intl l='Cart'}
                                                </caption>
                                                <thead>
                                                    <tr>
                                                       <th class="col-md-7">{intl l="Product"}</th>
                                                       <th class="col-md-1">{intl l="Unit. price"}</th>
                                                       <th class="col-md-1">{intl l="Tax"}</th>
                                                       <th class="col-md-1">{intl l="Unit taxed price"}</th>
                                                       <th class="col-md-1">{intl l="Quantity"}</th>
                                                       <th class="col-md-1">{intl l="Taxed total"}</th>
                                                    </tr>
                                                </thead>

                                                <tbody>
                                                {loop type="order_product" name="order-products" order=$ID}
                                                    {if $WAS_IN_PROMO == 1}
                                                        {assign "realPrice" $PROMO_PRICE}
                                                        {assign "realTax" $PROMO_PRICE_TAX}
                                                        {assign "realTaxedPrice" $TAXED_PROMO_PRICE}
                                                    {else}
                                                        {assign "realPrice" $PRICE}
                                                        {assign "realTax" $PRICE_TAX}
                                                        {assign "realTaxedPrice" $TAXED_PRICE}
                                                    {/if}
                                                    <tr>
                                                        <td>
                                                            <a href="#">{$TITLE}</a>
                                                            {ifloop rel="combinations"}
                                                            <dl class="dl-horizontal">
                                                                {loop type="order_product_attribute_combination" name="combinations" order_product=$ID}
                                                                <dt>{$ATTRIBUTE_TITLE}</dt>
                                                                <dd>{$ATTRIBUTE_AVAILABILITY_TITLE}</dd>
                                                                {/loop}
                                                            </dl>
                                                            {/ifloop}
                                                        </td>
                                                        <td>{$orderCurrency} {$realPrice}</td>
                                                        <td>{$orderCurrency} {$realTax}</td>
                                                        <td>{$orderCurrency} {$realTaxedPrice}</td>
                                                        <td>{$QUANTITY}</td>
                                                        <td>{$orderCurrency} {$realTaxedPrice * $QUANTITY}</td>
                                                    </tr>
                                                {/loop}
                                                </tbody>
                                                <tbody class="table-condensed">
                                                    <tr class="active">
                                                        <td colspan="2" class="td-unstyled"></td>
                                                        <td colspan="3"><strong>{intl l="Total without discount"}</strong></td>
                                                        <td><strong>{$orderCurrency} {$TOTAL_TAXED_AMOUNT-$POSTAGE}</strong></td>
                                                    </tr>
                                                    <tr>
                                                        <td colspan="2" class="td-unstyled"></td>
                                                        <td colspan="3"><strong>{intl l="Discount"}</strong></td>
                                                        <td><strong>{$orderCurrency} 0</strong></td>
                                                    </tr>
                                                    <tr class="active">
                                                        <td colspan="2" class="td-unstyled"></td>
                                                        <td colspan="3"><strong>{intl l="Coupon code"}</strong></td>
                                                        <td><strong>{$orderCurrency} 0</strong></td>
                                                    </tr>
                                                    <tr>
                                                        <td colspan="2" class="td-unstyled"></td>
                                                        <td colspan="3"><strong>{intl l="Total including discount"}</strong></td>
                                                        <td><strong>{$orderCurrency} {$TOTAL_TAXED_AMOUNT-$POSTAGE}</strong></td>
                                                    </tr>
                                                    <tr class="active">
                                                        <td colspan="2" class="td-unstyled"></td>
                                                        <td colspan="3"><strong>{intl l="Postage"}</strong></td>
                                                        <td><strong>{$orderCurrency} {$POSTAGE}</strong></td>
                                                    </tr>
                                                    <tr>
                                                        <td colspan="2" class="td-unstyled"></td>
                                                        <td colspan="3" class="last"><strong>{intl l="Total"}</strong></td>
                                                        <td class="last"><strong>{$orderCurrency} {$TOTAL_TAXED_AMOUNT}</strong></td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </div>

                                        <div class="table-responsive">
                                            <table class="table table-striped table-condensed table-left-aligned">
                                                <caption class="clearfix">
                                                    {intl l='Payment information'}
                                                </caption>
                                                <tbody>
                                                <tr>
                                                    <th>{intl l="Payment module"}</th>
                                                    <td>{loop name="payment-module" type="module" id=$PAYMENT_MODULE}{$TITLE}{/loop}</td>
                                                </tr>
                                                <tr>
                                                    <th>{intl l="Transaction reference"}</th>
                                                    <td>{$TRANSACTION_REF}</td>
                                                </tr>
                                                </tbody>
                                            </table>
                                        </div>

                                    </div> <!-- #cart -->

                                    <div class="tab-pane fade {if $oder_tab == 'bill'}active in{/if} clearfix" id="bill">

                                        <div class="title title-without-tabs clearfix">
                                            {intl l='Delivery module'}
                                            <div class="pull-right col-md-3">
                                                <form action="{url path="/admin/order/update/$ID/delivery-ref"}" method="post">
                                                    <input class="js-current-tab" type="hidden" name="tab" value="{$oder_tab}">
                                                    <div class="input-group">
                                                        <input class="form-control" type="text" name="delivery_ref" value="{$DELIVERY_REF}" placeholder="{intl l="tracking reference"}"/>
                                                        <span class="input-group-btn">
                                                            <button class="btn btn-default btn-primary"><span class="glyphicon glyphicon-check"></span></button>
                                                        </span>
                                                    </div>
                                                </form>
                                            </div>
                                        </div>

                                        {loop name="payment-module" type="module" id=$DELIVERY_MODULE}

                                        <dl class="dl-horizontal">
                                            <dt>{intl l="Name"}</dt>
                                            <dd>{$TITLE}</dd>
                                        </dl>
                                        <dl class="dl-horizontal">
                                            <dt>{intl l="Description"}</dt>
                                            <dd>{$DESCRIPTION}</dd>
                                        </dl>

                                        {/loop}

                                        <div class="col-md-6">
                                            <div class="table-responsive">
                                                <table class="table table-striped table-condensed table-left-aligned">
                                                    <caption class="clearfix">
                                                        {intl l='Invoice informations'}
                                                        <div class="pull-right">
                                                            <a class="btn btn-default btn-primary" title="{intl l='Download invoice as PDF'}" href="{url path="/admin/order/pdf/invoice/$ID"}">
                                                                <span class="glyphicon glyphicon-cloud-download"></span> {intl l='PDF | Invoice'}
                                                            </a>
                                                            <a class="btn btn-default btn-primary js-update-order-address" data-address-id="{$INVOICE_ADDRESS}" title="{intl l='Edit invoice address'}" href="#edit_order_address_dialog" data-toggle="modal">
                                                                <span class="glyphicon glyphicon-edit"></span>
                                                            </a>
                                                        </div>
                                                    </caption>
                                                    <tbody>
                                                    <tr>
                                                        <th>{intl l="Invoice reference"}</th>
                                                        <td>{$INVOICE_REF}</td>
                                                    </tr>
                                                    <tr>
                                                        <th>{intl l="Invoice date"}</th>
                                                        <td>{format_date date=$INVOICE_DATE output="date"}</td>
                                                    </tr>

                                                    {loop type="order_address" name="order-invoice-address" id=$INVOICE_ADDRESS}
                                                        <tr data-field-class="js-title" data-value="{$TITLE}">
                                                            <th>{intl l="Title"}</th>
                                                            <td>{loop type="title" name="order-invoice-address-title" id=$TITLE}{$LONG}{/loop}</td>
                                                        </tr>
                                                        <tr data-field-class="js-company">
                                                            <th>{intl l="Company"}</th>
                                                            <td>{$COMPANY}</td>
                                                        </tr>
                                                        <tr data-field-class="js-firstname">
                                                            <th>{intl l="Firstname"}</th>
                                                            <td>{$FIRSTNAME}</td>
                                                        </tr>
                                                        <tr data-field-class="js-lastname">
                                                            <th>{intl l="Lastname"}</th>
                                                            <td>{$LASTNAME}</td>
                                                        </tr>
                                                        <tr data-field-class="js-address1">
                                                            <th>{intl l="Street address"}</th>
                                                            <td>{$ADDRESS1}</td>
                                                        </tr>
                                                        <tr data-field-class="js-address2">
                                                            <th>{intl l="Additional address"}</th>
                                                            <td>{$ADDRESS2}</td>
                                                        </tr>
                                                        <tr data-field-class="js-address3">
                                                            <th>{intl l="Additional address"}</th>
                                                            <td>{$ADDRESS3}</td>
                                                        </tr>
                                                        <tr data-field-class="js-zipcode">
                                                            <th>{intl l="Zip code"}</th>
                                                            <td>{$ZIPCODE}</td>
                                                        </tr>
                                                        <tr data-field-class="js-city">
                                                            <th>{intl l="City"}</th>
                                                            <td>{$CITY}</td>
                                                        </tr>
                                                        <tr data-field-class="js-country" data-value="{$COUNTRY}">
                                                            <th>{intl l="Country"}</th>
                                                            <td>{loop type="country" name="order-invoice-address-country" id=$COUNTRY}{$TITLE}{/loop}</td>
                                                        </tr>
                                                        <tr data-field-class="js-phone">
                                                            <th>{intl l="Phone"}</th>
                                                            <td>{$PHONE}</td>
                                                        </tr>
                                                    {/loop}
                                                    </tbody>
                                                </table>
                                            </div>
                                        </div>

                                        <div class="col-md-6">
                                            <div class="table-responsive">
                                                <table class="table table-striped table-condensed table-left-aligned">
                                                    <caption class="clearfix">
                                                        {intl l='Delivery address'}
                                                        <div class="pull-right">
                                                            <a class="btn btn-default btn-primary" title="{intl l='Download purchase order as PDF'}" href="{url path="/admin/order/pdf/delivery/$ID"}">
                                                                <span class="glyphicon glyphicon-cloud-download"></span> {intl l='PDF | Purchase order'}
                                                            </a>
                                                            <a class="btn btn-default btn-primary js-update-order-address" data-address-id="{$DELIVERY_ADDRESS}" title="{intl l='Edit delivery address'}" href="#edit_order_address_dialog" data-toggle="modal">
                                                                <span class="glyphicon glyphicon-edit"></span>
                                                            </a>
                                                        </div>
                                                    </caption>
                                                    <tbody>
                                                    {loop type="order_address" name="order-delivery-address" id=$DELIVERY_ADDRESS}
                                                        <tr data-field-class="js-title" data-value="{$TITLE}">
                                                            <th>{intl l="Title"}</th>
                                                            <td>{loop type="title" name="order-delivery-address-title" id=$TITLE}{$LONG}{/loop}</td>
                                                        </tr>
                                                        <tr data-field-class="js-company">
                                                            <th>{intl l="Company"}</th>
                                                            <td>{$COMPANY}</td>
                                                        </tr>
                                                        <tr data-field-class="js-firstname">
                                                            <th>{intl l="Firstname"}</th>
                                                            <td>{$FIRSTNAME}</td>
                                                        </tr>
                                                        <tr data-field-class="js-lastname">
                                                            <th>{intl l="Lastname"}</th>
                                                            <td>{$LASTNAME}</td>
                                                        </tr>
                                                        <tr data-field-class="js-address1">
                                                            <th>{intl l="Street address"}</th>
                                                            <td>{$ADDRESS1}</td>
                                                        </tr>
                                                        <tr data-field-class="js-address2">
                                                            <th>{intl l="Additional address"}</th>
                                                            <td>{$ADDRESS2}</td>
                                                        </tr>
                                                        <tr data-field-class="js-address3">
                                                            <th>{intl l="Additional address"}</th>
                                                            <td>{$ADDRESS3}</td>
                                                        </tr>
                                                        <tr data-field-class="js-zipcode">
                                                            <th>{intl l="Zip code"}</th>
                                                            <td>{$ZIPCODE}</td>
                                                        </tr>
                                                        <tr data-field-class="js-city">
                                                            <th>{intl l="City"}</th>
                                                            <td>{$CITY}</td>
                                                        </tr>
                                                        <tr data-field-class="js-country" data-value="{$COUNTRY}">
                                                            <th>{intl l="Country"}</th>
                                                            <td>{loop type="country" name="order-delivery-address-country" id=$COUNTRY}{$TITLE}{/loop}</td>
                                                        </tr>
                                                        <tr data-field-class="js-phone">
                                                            <th>{intl l="Phone"}</th>
                                                            <td>{$PHONE}</td>
                                                        </tr>
                                                    {/loop}
                                                    </tbody>
                                                </table>
                                            </div>
                                        </div>



                                    </div> <!-- #bill -->

                                </div>
                            {/loop}

                        {/ifloop}
                        {elseloop rel="the-order"}

                            DOES NOT EXISTS

                        {/elseloop}

					</div>

            	</div>
            </div>

        </div>
    </div>

	{* Update an Address *}

    {form name="thelia.order.update.address"}
        
        {* Capture the dialog body, to pass it to the generic dialog *}
        {capture "edit_order_address_dialog"}
            
            {form_hidden_fields form=$form}
                    
            {form_field form=$form field='id'}
                <input type="hidden" id="{$label_attr.for}" name="{$name}" class="js-order-address-id" value="{$value}">
            {/form_field}

            {form_field form=$form field='company'}
                <div class="form-group {if $error}has-error{/if}">
                    <label for="{$label_attr.for}" class="control-label">{intl l=$label} : </label>
                    <input type="text" id="{$label_attr.for}" name="{$name}" class="form-control js-company" value="{$value}" title="{intl l=$label}" placeholder="{intl l='Company'}">
                </div>
            {/form_field}

            {form_field form=$form field='title'}                
                <div class="form-group {if $error}has-error{/if}">
                    <label for="{$label_attr.for}" class="control-label">{intl l=$label} : </label>
                    
                    <select name="{$name}" id="{$label_attr.for}" class="form-control js-title">
                        {loop type="title" name="title1"}
                            <option value='{$ID}'>{$LONG}</option>
                        {/loop}
                    </select>                    
                </div>
            {/form_field}

            {form_field form=$form field='firstname'}
                <div class="form-group {if $error}has-error{/if}">
                    <label for="{$label_attr.for}" class="control-label">{intl l=$label} : </label>
                    <input type="text" id="{$label_attr.for}" name="{$name}" class="form-control js-firstname" value="{$value}" title="{intl l=$label}" placeholder="{intl l='Firstname'}">
                </div>
            {/form_field}

            {form_field form=$form field='lastname'}
                <div class="form-group {if $error}has-error{/if}">
                    <label for="{$label_attr.for}" class="control-label">{intl l=$label} : </label>
                    <input type="text" id="{$label_attr.for}" name="{$name}" class="form-control js-lastname" value="{$value}" title="{intl l=$label}" placeholder="{intl l='Lastname'}">
                </div>
            {/form_field}

            {form_field form=$form field='address1'}
                <div class="form-group {if $error}has-error{/if}">
                    <label for="{$label_attr.for}" class="control-label">{intl l=$label} : </label>
                    <input type="text" id="{$label_attr.for}" name="{$name}" class="form-control js-address1" value="{$value}" title="{intl l=$label}" placeholder="{intl l='Address'}">
                </div>

                <div class="form-group">
                    {form_field form=$form field='address2'}
                        <input type="text" id="{$label_attr.for}" name="{$name}" class="form-control js-address2" value="{$value}" title="{intl l=$label}" placeholder="{intl l='Additional address'}">
                    {/form_field}                    
                </div>

                <div class="form-group">
                    {form_field form=$form field='address3'}
                        <input type="text" id="{$label_attr.for}" name="{$name}" class="form-control js-address3" value="{$value}" title="{intl l=$label}" placeholder="{intl l='Additional address'}">
                    {/form_field}
                </div>
            {/form_field}

            {form_field form=$form field='zipcode'}
                <div class="form-group {if $error}has-error{/if}">
                    <label for="{$label_attr.for}" class="control-label">{intl l=$label} : </label>
                    <input type="text" id="{$label_attr.for}" name="{$name}" class="form-control js-zipcode" value="{$value}" title="{intl l=$label}" placeholder="{intl l='Zip code'}">
                </div>
            {/form_field}

            {form_field form=$form field='city'}
                <div class="form-group {if $error}has-error{/if}">
                    <label for="{$label_attr.for}" class="control-label">{intl l=$label} : </label>
                    <input type="text" id="{$label_attr.for}" name="{$name}" class="form-control js-city" value="{$value}" title="{intl l=$label}" placeholder="{intl l='City'}">
                </div>
            {/form_field}

            {form_field form=$form field='country'}
                <div class="form-group {if $error}has-error{/if}">
                    <label for="{$label_attr.for}" class="control-label">{intl l=$label} : </label>
                    <select name="{$name}" id="{$label_attr.for}" class="form-control js-country">
                        {loop type="country" name="country1"}
                            <option value="{$ID}">{$TITLE}</option>
                        {/loop}
                    </select>
                </div>
            {/form_field}

            {form_field form=$form field='phone'}
                <div class="form-group {if $error}has-error{/if}">
                    <label for="{$label_attr.for}" class="control-label">{intl l=$label} : </label>
                    <input type="text" id="{$label_attr.for}" name="{$name}" class="form-control js-phone" value="{$value}" title="{intl l=$label}" placeholder="{intl l='Phone'}">
                </div>
            {/form_field}

        {/capture}
    
        {include
            file = "includes/generic-create-dialog.html"

            dialog_id    = "edit_order_address_dialog"
            dialog_title = {intl l="Edit order address"}
            dialog_body  = {$smarty.capture.edit_order_address_dialog nofilter}

            dialog_ok_label     = {intl l="Confirm changes"}
            dialog_cancel_label = {intl l="Cancel"}

            form_action        = {url path="/admin/order/update/$order_id/address"}
            form_enctype       = {form_enctype form=$form}
            form_error_message = $form_error_message
            form_id = 'updateOrderAddressForm'
        }

    {/form}
    
{/block}

{block name="javascript-initialization"}

    {javascripts file='assets/js/bootstrap-select/bootstrap-select.js'}
        <script src='{$asset_url}'></script>
    {/javascripts}
    {javascripts file='assets/js/main.js'}
        <script src='{$asset_url}'></script>
    {/javascripts}

    <script type="text/javascript">
        $(".js-update-order-status").change(function(e){
            e.preventDefault();
            $('#order-update-status-form').submit();
        });

        $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
            $(".js-current-tab").val($(e.target).data("tab-name"));
        });

        $(".js-update-order-address").click(function(){
            $(".js-order-address-id").val(
                $(this).data("address-id")
            );

            $(this).parents('table').find('tr').each(function(k, v) {
                if(!$(v).data('field-class')) {
                    return true;
                }
                if($(v).data('value')) {
                    var fieldValue = $(v).data('value');
                } else {
                    var fieldValue = $(v).children('td').text();
                }

                $('.' + $(v).data('field-class')).val(fieldValue);
            });
        });
    </script>

{/block}