{% extends '::adminBaseAjax.html.twig' %} 
{% block ajax_body %}

{% set ob_city_dropdown = ob_project_setting['configuration_rule']['site_management']['option']['address']['option']['city']['option']['dropdown']['status'] %}
{% set ob_city_textbox = ob_project_setting['configuration_rule']['site_management']['option']['address']['option']['city']['option']['textbox']['status'] %}
{% set ob_state_dropdown = ob_project_setting['configuration_rule']['site_management']['option']['address']['option']['state']['option']['dropdown']['status'] %}
{% set ob_state_textbox = ob_project_setting['configuration_rule']['site_management']['option']['address']['option']['state']['option']['textbox']['status'] %}
{% set ob_country_dropdown = ob_project_setting['configuration_rule']['site_management']['option']['address']['option']['country']['option']['dropdown']['status'] %}
{% set ob_country_textbox = ob_project_setting['configuration_rule']['site_management']['option']['address']['option']['country']['option']['textbox']['status'] %}

  <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <button aria-label="Close" data-dismiss="modal" class="close" type="button"><i class="fa fa-times"></i></button>
            <div class="modal-header">
                <h1 class="modal-title" ><i class="fa fa-eye"></i>&nbsp;{{ 'orderadmin.order_view_details' | trans }}</h1>
            </div>
            <div class="modal-body order-detail-block">
                <div class="row">
                    <div class="col-lg-12">
                        <div class="order-title">
                            <div class="col-lg-2 col-lg-offset-3 col-md-4 col-sm-4">
                                {{ 'orderadmin.order_id' | trans }}: {{ data.id }}
                            </div>
                            <div class="col-lg-3 col-md-4 col-sm-4">
                                {{ 'orderadmin.created_date' | trans }}: {{ data.createdAt| dateFormat(ob_project_date_format) }}
                            </div>
                            <div class="col-lg-2 col-md-4 col-sm-4">
                                {{ 'orderadmin.total_item' | trans }}: {{ data.orderItemLine| length }}
                            </div>
                            
                        </div>
                    </div>
                </div>

                <div class="row">
                    <div class="col-lg-12">
                        <div id="accordion1" class="accordion-style1 panel-group list-accordion">
                        	<div class="panel panel-default">
                            	<div class="panel-heading">
                                	<h4 class="panel-title">
                                    	<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
                                        	<i class="fa fa-chevron-down"></i>{{ 'orderadmin.billing_information' | trans }}
                                    	</a>
                                	</h4>
                            	</div>
                        {% if data.orderBillingDetail|length > 0 %}
                           <div class="panel-collapse collapse in" id="collapseOne">
                                <div class="panel-body">
                                    <div class="row billing-information">
                                        <div class="col-sm-12 col-md-6 col-lg-3 col-xs-12">
                                            <h4>{{ data.orderBillingDetail.name }}</h4>
                                            <p>
                                            	<span>{{ 'orderadmin.office_address' | trans }}</span><br>
                                            	{{ data.orderBillingDetail.email }} <br>
                                            	{{ data.orderBillingDetail.street1 }} <br>
                                            	
                                            	{% if data.orderBillingDetail.street2 is defined and data.orderBillingDetail.street2 != '' %}
                                            	{{ data.orderBillingDetail.street2 }}<br>
                                            	{% endif %}
                                            	
                                            	{% if ob_city_dropdown %}
                                            		{{ data.orderBillingDetail.cityId|city }},
                                            	{% endif %}
                                            	{% if ob_city_textbox %}
                                            		{{ data.orderBillingDetail.cityName }},
                                            	{% endif %}
                                            	
                                            	{% if ob_state_textbox %}
                                                	{{ data.orderBillingDetail.stateName }},
                                                {% elseif ob_state_dropdown %}
                                                	{{ data.orderBillingDetail.stateId|state }},
                                                {% endif %}
                                            	
                                            	{{ data.orderBillingDetail.zipCode }}<br>
                                            	
                                            	{% if ob_country_textbox %}
                                                	{{ data.orderBillingDetail.countryName }}
                                                {% elseif ob_country_dropdown %}
                                                	{{ data.orderBillingDetail.countryId|country }}
                                                {% endif %}
                                            </p>
                                        </div>
                                        <div class="col-sm-12 col-md-6 col-lg-3 col-xs-12">
                                            <div class="req-info-add-block">
                                                <ul>
                                                    {% if data.orderBillingDetail.phone is defined and data.orderBillingDetail.phone != '' %}<li><i class="fa fa-phone"></i>{{ data.orderBillingDetail.phone }}</li>{% endif %}
                                                    {% if data.orderBillingDetail.fax is defined and data.orderBillingDetail.fax != '' %}<li><i class="fa fa-print"></i>{{ data.orderBillingDetail.fax }}</li>{% endif %}
                                                    {% if data.orderBillingDetail.email is defined and data.orderBillingDetail.email != '' %}<li><i class="fa fa-envelope"></i>{{ data.orderBillingDetail.email }}</li>{% endif %}
                                                    {% if data.orderBillingDetail.website is defined and data.orderBillingDetail.website !='' %}<li><i class="fa fa-globe"></i>{{ data.orderBillingDetail.website }}</li>{% endif %}
                                                </ul>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                          {% endif %}
                          </div>
                        </div>
                        <div class="panel panel-default">
                            <div class="panel-heading">
                                <h4 class="panel-title">
                                    <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#collapsetwo">
                                        <i class="fa fa-chevron-down"></i>{{ 'orderadmin.order_product' | trans }}
                                    </a>
                                </h4>
                            </div>
                      		<div id="js_product_list" >
								{% if data.orderItemLine|length>0 %} 
									{{ render(controller('OfficeBrainOrderBundle:OrderAdmin:adminOrderProductDetail', { 'order_id': data.id })) }}
								{% endif %}
							</div>
 						</div>	
                     <div class="panel panel-default">
                            <div class="panel-heading">
                                <h4 class="panel-title">
                                    <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#collapsethree">
                                        <i class="fa fa-chevron-down"></i>{{ 'orderadmin.payment_infomation' | trans }}
                                    </a>
                                </h4>
                            </div>
                            <div class="panel-collapse collapse" id="collapsethree">
                                <div class="panel-body">
                                    <div class="row payment-information">
                                        <div class="col-lg-6 col-md-6 col-sm-6">
                                            <h6>{{ 'orderadmin.transaction_id' | trans }} :<span>{{ data.transactionId }}</span></h6>
                                        </div>
                                        <div class="col-lg-3 col-md-3 col-sm-3">
                                            <h6>Tax :<span>${{ data.taxTotal|currency}}</span></h6>
                                        </div>
                                        <div class="col-lg-3 col-md-3 col-sm-3">
                                            <h6>{{ 'orderadmin.payment_via' | trans }} :<span>{{ data.paymentMethod|replaceUnderScore}}</span></h6>
                                        </div>
                                        <div class="col-lg-3 col-md-3 col-sm-3">
                                            <h6>{{ 'cart.cart_product_amount' | trans }} :<span>{{ data.orderItemLine[0].currencySymbol|upper }} {{ data.price|currency }}</span></h6>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="panel panel-default">
                            <div class="panel-heading">
                                <h4 class="panel-title">
                                    <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#collapsefour">
                                        <i class="fa fa-chevron-down"></i>{{ 'orderadmin.supplier_information' | trans }}
                                    </a>
                                </h4>
                            </div>
                            <div class="panel-collapse collapse" id="collapsefour">
                                <div class="panel-body">
                                    <div class="row billing-information">
                                        <div class="col-sm-3 col-md-3 col-lg-4 col-xs-12">
{#                                             <img src="{{ asset(ob_project_assets_base_url~'images/logo.png') }}" alt="">#}
                                            <img src="{{ asset(ob_project_admin_asset_url~'/images/logo.png') }}" alt="">
{#                                             <span class="supplier-name">{{ 'orderadmin.supplier_name' | trans }}</span>#}
                                        </div>
                                        <div class="col-sm-12 col-md-6 col-lg-4 col-xs-12">
                                            <h4>{{ data.orderItemLine[0].orderProduct[0].orderShippingDetail.name }}</h4>
                                            <p>
                                            	<span>{{ 'orderadmin.office_address' | trans }}</span><br>
                                            	{% if data.orderItemLine[0].orderProduct[0].orderShippingDetail.email is defined and data.orderItemLine[0].orderProduct[0].orderShippingDetail.email != '' %}
                                            	{{ data.orderItemLine[0].orderProduct[0].orderShippingDetail.email }}<br>
                                            	{% endif %}
                                            	
                                            	{% if data.orderItemLine[0].orderProduct[0].orderShippingDetail.street1 is defined and data.orderItemLine[0].orderProduct[0].orderShippingDetail.street1 != '' %}
                                            	{{ data.orderItemLine[0].orderProduct[0].orderShippingDetail.street1 }}<br>
                                            	{% endif %}
                                            	
                                            	{% if data.orderItemLine[0].orderProduct[0].orderShippingDetail.street2 is defined and data.orderItemLine[0].orderProduct[0].orderShippingDetail.street2 != '' %}
                                            	{{ data.orderItemLine[0].orderProduct[0].orderShippingDetail.street2 }}<br>
                                            	{% endif %}
                                            	
                                            	{% if ob_city_dropdown %}
                                            		{% if data.orderItemLine[0].orderProduct[0].orderShippingDetail.cityId is defined and data.orderItemLine[0].orderProduct[0].orderShippingDetail.cityId != '' %}
                                            		{{ data.orderItemLine[0].orderProduct[0].orderShippingDetail.cityId|city }},
                                            		{% endif %}
                                            	{% endif %}
                                            	{% if ob_city_textbox %}
                                            		{% if data.orderItemLine[0].orderProduct[0].orderShippingDetail.cityName is defined and data.orderItemLine[0].orderProduct[0].orderShippingDetail.cityName != '' %}
                                            		{{ data.orderItemLine[0].orderProduct[0].orderShippingDetail.cityName }},
                                            		{% endif %}
                                            	{% endif %}
                                            	
                                            	{% if ob_state_textbox %}
                                                	{% if data.orderItemLine[0].orderProduct[0].orderShippingDetail.stateName is defined and data.orderItemLine[0].orderProduct[0].orderShippingDetail.stateName != '' %}
                                                	    {{ data.orderItemLine[0].orderProduct[0].orderShippingDetail.stateName }},
                                                	{% endif %}
                                                {% elseif ob_state_dropdown %}
                                                	{% if data.orderItemLine[0].orderProduct[0].orderShippingDetail.stateId is defined and data.orderItemLine[0].orderProduct[0].orderShippingDetail.stateId != '' %}
                                                	    {{ data.orderItemLine[0].orderProduct[0].orderShippingDetail.stateId|state }},
                                                	{% endif %}
                                                {% endif %}
                                            	
                                            	{% if data.orderItemLine[0].orderProduct[0].orderShippingDetail.zipCode is defined and data.orderItemLine[0].orderProduct[0].orderShippingDetail.zipCode != '' %}
                                            	{{ data.orderItemLine[0].orderProduct[0].orderShippingDetail.zipCode }}<br>
                                            	{% endif %}
                                            	
                                            	{% if ob_country_textbox %}
                                                	{% if data.orderItemLine[0].orderProduct[0].orderShippingDetail.countryName is defined and data.orderItemLine[0].orderProduct[0].orderShippingDetail.countryName != '' %}
                                                	    {{ data.orderItemLine[0].orderProduct[0].orderShippingDetail.countryName }}
                                                	{% endif %}
                                                {% elseif ob_country_dropdown %}
                                                	{% if data.orderItemLine[0].orderProduct[0].orderShippingDetail.countryId is defined and data.orderItemLine[0].orderProduct[0].orderShippingDetail.countryId != '' %}
                                                	    {{ data.orderItemLine[0].orderProduct[0].orderShippingDetail.countryId|country }}
                                                	{% endif %}
                                                {% endif %}
                                            	
                                            	</p>
                                        </div>
                                        <div class="col-sm-12 col-md-6 col-lg-4 col-xs-12">
                                            <div class="req-info-add-block">
                                                <ul>
                                                    {% if data.orderItemLine[0].orderProduct[0].orderShippingDetail.phone is defined and data.orderItemLine[0].orderProduct[0].orderShippingDetail.phone != '' %}<li><i class="fa fa-phone"></i>{{ data.orderItemLine[0].orderProduct[0].orderShippingDetail.phone }}</li>{% endif %}
                                                    {% if data.orderItemLine[0].orderProduct[0].orderShippingDetail.email is defined and data.orderItemLine[0].orderProduct[0].orderShippingDetail.email != '' %}<li><i class="fa fa-envelope"></i>{{ data.orderItemLine[0].orderProduct[0].orderShippingDetail.email }}</li>{% endif %}
                                                    {% if data.orderItemLine[0].orderProduct[0].orderShippingDetail.fax is defined and data.orderItemLine[0].orderProduct[0].orderShippingDetail.fax != '' %}<li><i class="fa fa-print"></i>{{ data.orderItemLine[0].orderProduct[0].orderShippingDetail.fax }}</li>{% endif %}
                                                    {% if data.orderItemLine[0].orderProduct[0].orderShippingDetail.website is defined and data.orderItemLine[0].orderProduct[0].orderShippingDetail.website != '' %}<li><i class="fa fa-globe"></i>{{ data.orderItemLine[0].orderProduct[0].orderShippingDetail.website }}</li>{% endif %}
                                                </ul>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            
                         </div>
                      </div>
                    </div>
                </div>
       	      </div>
           </div>
      </div>
{% endblock ajax_body %}