Symfony Profiler

{% extends "@Flexy/FrontBundle/templates/layout.html.twig" %}
{% block body %}
<div class="body-wrapper">



<div class="breadcrumb-area menu-item">
<div class="container simple-container">
<div class="breadcrumb-content">
<ul>
<li><a href="{{path('front_home')}}">Accueil</a></li>
{% for category in singleProduct.categoriesProduct %}
<li ><a href="{{path('single_category_product',{id:category.id})}}">{{category}}</a></li>
{% endfor %}
<li class="active">{{singleProduct.name}}</li>
</ul>
</div>
</div>
</div>


<div class="content-wraper">
<div class="container">
<div class="row single-product-area">
<div class="col-lg-5 col-md-5">

<div class="product-details-left sp-tab-style-left-page">
<div class="product-details-images slider-navigation-1">
<div class="lg-image menu-item">
<a class="popup-img venobox vbox-item" href="/uploads/{{asset(singleProduct.image)}}" data-gall="myGallery">
<img src="/uploads/{{asset(singleProduct.image)}}" alt="{{singleProduct.name}}">
</a>
</div>
{% for image in singleProduct.images %}
<div class="lg-image menu-item">
<a class="popup-img venobox vbox-item" href="/uploads/images/products{{asset(image.path)}}" data-gall="myGallery">
<img src="/uploads/images/products{{asset(image.path)}}" alt="{{image.alt}}">
</a>
</div>
{% endfor %}
</div>
<div class="tab-style-left">
<div class="sm-image"><img src="/uploads/{{asset(singleProduct.image)}}" alt="{{singleProduct.name}}"></div>
{% for image in singleProduct.images %}
<div class="sm-image"><img src="/uploads/images/products{{asset(image.path)}}" alt="{{image.alt}}"></div>
{% endfor %}
</div>
</div>

</div>
<div class="col-lg-4 col-md-5">
<div class="product-details-view-content pt-60">
<div class="product-info">
<h2>{{singleProduct.name}}</h2>
<p class="sell-by">
{% if singleProduct.brand %} Marque: <a href="#">{{singleProduct.brand}}</a>{% endif %} {% if singleProduct.vendor %} / <a href="#"> Par {{singleProduct.vendor}} </a>{% endif %}</span>
</p>
{% if singleProduct.skuCode %}
<span class="product-details-ref d-none">Reference: {{singleProduct.skuCode}}</span>
{% endif %}
<div class="price-box pt-20">
<span class="new-price new-price-2">MAD {{singleProduct.formattedPrice}}</span>
{% if singleProduct.oldPrice or singleProduct.oldPrice > 0 %}
<span class="old-price">MAD {{singleProduct.oldPrice / 100}}</span>
{% endif %}
</div>
<div class="product-desc">
<p>
<span>
{{singleProduct.shortDescription|raw}}
</span>
</p>
</div>
<div class="rating-box pt-20">
<h5>Rating : {{singleProduct.rating|number_format(1, '.', ',')}}/5</h5>
<ul class="rating rating-with-review-item">
{% if singleProduct.rating > 0 %}
{% for stars in 1..singleProduct.rating|number_format %}
<li><i class="fa fa-star"></i></li>
{% endfor %}
{% if singleProduct.rating|number_format < 5 %}
{% for stars in singleProduct.rating|number_format..4 %}
<li class="no-star"><i class="fa fa-star"></i></li>
{% endfor %}
{% endif %}
{% else %}
<li class="no-star"><i class="fa fa-star"></i></li>
<li class="no-star"><i class="fa fa-star"></i></li>
<li class="no-star"><i class="fa fa-star"></i></li>
<li class="no-star"><i class="fa fa-star"></i></li>
{% endif %}
<li class="menu-item" ><a href="#reviews" id="showcomments"> Avis ({{ singleProduct.comments|length }}) <i class="fa fa-comments" ></i> </a></li>
</ul>
</div>
<div class="product-variants p-3">
<div class="produt-variants-size">
{% if singleProduct.attributValues|length > 0 %}
<select class="nice-select">
{% for attribut in singleProduct.attributValues %}
<option value="{{attribut.id}}" title="S">{{attribut}}</option>
{% endfor %}
</select>
{% endif %}
</div>
</div>
<div class="single-add-to-cart">
<form action="#" class="cart-quantity">
<div class="quantity">
<label>Quantité</label>
<div class="cart-plus-minus">
<input class="cart-plus-minus-box" value="1" type="text">
<div class="dec qtybutton"><i class="fa fa-angle-down"></i></div>
<div class="inc qtybutton"><i class="fa fa-angle-up"></i></div>
</div>
</div>
<button data-vendor="{{singleProduct.vendor.id}}" data-id="{{singleProduct.id}}" data-name="{{singleProduct.name}}" data-image="uploads/{{asset(singleProduct.image)}}" data-price="{{singleProduct.formattedPrice}}" data-url="{{path('single_product',{id:singleProduct.id}) }}" class="add-cart add-to-cart active add-product-to-cart" >Ajouter au panier</button>
</form>
</div>
<div class="menu-item product-additional-info pt-25">
<div class="product-social-sharing pt-25">
<ul>
<li class="facebook"><a href="#"><i class="fa fa-facebook"></i>Facebook</a></li>
<li class="twitter"><a href="#"><i class="fa fa-twitter"></i>Twitter</a></li>
<li class="google-plus"><a href="#"><i class="fa fa-google-plus"></i>Google +</a></li>
<li class="instagram"><a href="#"><i class="fa fa-instagram"></i>Instagram</a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-md-3 ">
<div class="block-reassurance ">
<div class="row " >
{% if singleProduct.vendor %}
<div class="col-12 p-3 " >
<div class="card actions p-3">
<h5>Vendeur : <span class="badge badge-warning" >{{singleProduct.vendor}}</span></h5>
<div>
<p>
<small>
100% Evaluation du vendeur<br>
67 abonnés <br>
</small>
<h6>Performance vendeur</h6>
<p>
<span class="badge badge-success text-white" ><i class="fa fa-star" ></i></span> Expeditions : <span class="badge badge-success text-white" >Excellent</span>
<br>
<span class="badge badge-success text-white" ><i class="fa fa-star" ></i></span> Qualité : <span class="badge badge-warning text-white" >Moyen</span>
<br>
<span class="badge badge-success text-white" ><i class="fa fa-star" ></i></span> Avis consommateurs : <span class="badge badge-warning text-white" >Moyen</span>
</p>
</p>
</div>
</div>
</div>
{% endif %}
<div class="col-12" >
<section class="card p-3 -mbs -fs12">
<h6 class="-fs14 -m -upp -pas">Livraison & Retours</h6>
<div class="-hr">
<article class="-pvxs -hr _bet ">
<h6 class="-ptxs -fs16 -m -phs">Choisissez le lieu</h6>
<div class="-fw -pas mb-2">
<div class="-pvs mb-1">
<select required="" class="sel _ol" id="fi-regionId" name="city" aria-label="Région">
{% for singleCity in cities %}
<option value="{{singleCity.id}}" >{{singleCity.name}}</option>
{% endfor %}
</select>
</div>
<div class="-pbxs">
<select required="" class="sel _ol" id="fi-cityId" name="departement" aria-label="Ville">
{% for singleDepartement in departements %}
<option value="{{singleDepartement.id}}" >{{singleDepartement.name}}</option>
{% endfor %}
</select>
</div>
</div>
<section class="-pr" data-delivery-info="">
<div data-info-block="">
<article class="-df -pvxs -phs">
<div class="-df -fw-w -c-bet -fg1 mb-2">
<div class="-df -fw">
<h6 class="-fs14 -m -prs">Livraison à domicile</h6>
</div>
<div>
<div class="markup -ptxs">Livraison <em>15.10 Dhs</em></div>
<div class="markup -ptxs">Livraison le <em>16 février</em> si vous commandez d'ici <em>14hrs 42mins</em></div>
</div>
</div>
</article>
<article class="-df -pvxs -phs mb-2">
<div class="-df -fw-w -c-bet -fg1">
<div class="-df -fw">
<h6 class="-fs14 -m -prs">Point relais</h6>
</div>
<div>
<div class="markup -ptxs">Livraison <em>8.40 Dhs</em></div>
<div class="markup -ptxs">Retrait le <em>16 février</em> si vous commandez d'ici <em>14hrs 42mins</em></div>
</div>
</div>
</article>
</div>
</section>
</article>
<article class="-df -hr _bet -pas mb-2">
<div class="-df -d-co -c-bet">
<h6 class="-fs14 -fw -m">Politique de retour</h6>
<p class="-ptxs">Retour gratuit dans les 15 jours pour les articles provenant de boutiques officielles et dans les 7 jours pour le reste.<a class="_more -mlxs -di" target="_blank" rel="noopener" href="/politique-retour/">En savoir plus</a></p>
</div>
</article>
</div>
</section>
</div>
</div>
</div>
</div>
</div>
</div>
</div>


<div class="product-area pt-35">
<div class="container">
<div class="row">
<div class="col-lg-12">
<div class="li-product-tab">
<ul class="nav li-product-menu">
<li><a class="active" data-toggle="tab" href="#description" id="description_pro"><span>Description</span></a></li>
<li><a data-toggle="tab" href="#product-details" id="description_technique"><span>Descriptif technique</span></a></li>
<li><a data-toggle="tab" href="#reviews" id="comments"><span>Avis</span></a></li>
</ul>
</div>

</div>
</div>
<div class="tab-content">
<div id="description" class="tab-pane active show" role="tabpanel">
<div class="product-description">
<span>
{{singleProduct.description|raw}}
</span>
</div>
</div>
<div id="product-details" class="tab-pane p-5" role="tabpanel">
<table class="table table-sm ">
<tbody>
<tr>
<th scope="row">Modele</th>
<td>MOD{{singleProduct.skuCode}}</td>
</tr>
<tr>
<th scope="row">Marque</th>
<td>{{singleProduct.brand}}</td>
</tr>
<tr>
<th scope="row">SKU</th>
<td>{{singleProduct.skuCode}}</td>
</tr>
<tr>
<th scope="row">Poids (Kg)</th>
<td>0.9 </td>
</tr>
</tbody>
</table>
</div>
<div id="reviews" class="tab-pane" role="tabpanel">
<div class="product-reviews">
<div class="container">
<div class="row">
<div class="col-sm-3">
<div class="rating-block">
<h4>AVIS </h4>
<h2 class="bold padding-bottom-7"> {{singleProduct.rating|number_format(1, '.', ',')}} <small>/ 5</small></h2>
{% if singleProduct.rating > 0 %}
{% for stars in 1..singleProduct.rating|number_format %}
<button type="button" class="btn btn-warning btn-sm" aria-label="Left Align">
<i class="fa fa-star"></i>
</button> {% endfor %}
{% if singleProduct.rating|number_format < 5 %}
{% for stars in singleProduct.rating|number_format..4 %}
<button type="button" class="btn btn-default btn-grey btn-sm" aria-label="Left Align">
<i class="fa fa-star"></i>
</button>
{% endfor %}
{% endif %}
{% else %}
<button type="button" class="btn btn-default btn-grey btn-sm" aria-label="Left Align"> <i class="fa fa-star"></i></button>
<button type="button" class="btn btn-default btn-grey btn-sm" aria-label="Left Align"> <i class="fa fa-star"></i></button>
<button type="button" class="btn btn-default btn-grey btn-sm" aria-label="Left Align"> <i class="fa fa-star"></i></button>
<button type="button" class="btn btn-default btn-grey btn-sm" aria-label="Left Align"> <i class="fa fa-star"></i></button>
{% endif %}
</div>
</div>
<div class="col-sm-3">
<h4>  </h4>
<div class="pull-left">
<div class="pull-left" style="width:35px; line-height:1;">
<div style="height:9px; margin:5px 0;">5 <i class="fa fa-star"></i> </div>
</div>
<div class="pull-left" style="width:180px;">
<div class="progress" style="height:9px; margin:8px 0;">
{% set percentage = 0 %}
{% if singleProduct.getStars5 > 0 %}
{% set percentage = (singleProduct.getStars5 / singleProduct.comments|length ) * 100 %}
{% endif %}
<div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="5" aria-valuemin="0" aria-valuemax="5" style="width: {{ percentage }}%">
<span class="sr-only">80% Complete (danger)</span>
</div>
</div>
</div>
<div class="pull-right" style="margin-left:10px;"> {{singleProduct.getStars5}}</div>
</div>
<div class="pull-left">
<div class="pull-left" style="width:35px; line-height:1;">
<div style="height:9px; margin:5px 0;">4 <i class="fa fa-star"></i> </div>
</div>
<div class="pull-left" style="width:180px;">
<div class="progress" style="height:9px; margin:8px 0;">
{% set percentage = 0 %}
{% if singleProduct.getStars4 > 0 %}
{% set percentage = (singleProduct.getStars4 / singleProduct.comments|length ) * 100 %}
{% endif %}
<div class="progress-bar progress-bar-primary" role="progressbar" aria-valuenow="4" aria-valuemin="0" aria-valuemax="5" style="width: {{percentage}}%">
<span class="sr-only">80% Complete (danger)</span>
</div>
</div>
</div>
<div class="pull-right" style="margin-left:10px;">
{{singleProduct.getStars4}}
</div>
</div>
<div class="pull-left">
<div class="pull-left" style="width:35px; line-height:1;">
<div style="height:9px; margin:5px 0;">3 <i class="fa fa-star"></i></div>
</div>
<div class="pull-left" style="width:180px;">
<div class="progress" style="height:9px; margin:8px 0;">
{% set percentage = 0 %}
{% if singleProduct.getStars3 > 0 %}
{% set percentage = (singleProduct.getStars3 / singleProduct.comments|length ) * 100 %}
{% endif %}
<div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="3" aria-valuemin="0" aria-valuemax="5" style="width:{{percentage}}%">
<span class="sr-only">80% Complete (danger)</span>
</div>
</div>
</div>
<div class="pull-right" style="margin-left:10px;">{{singleProduct.getStars3}}</div>
</div>
<div class="pull-left">
<div class="pull-left" style="width:35px; line-height:1;">
<div style="height:9px; margin:5px 0;">2 <i class="fa fa-star"></i></div>
</div>
<div class="pull-left" style="width:180px;">
<div class="progress" style="height:9px; margin:8px 0;">
{% set percentage = 0 %}
{% if singleProduct.getStars2 > 0 %}
{% set percentage = (singleProduct.getStars2 / singleProduct.comments|length ) * 100 %}
{% endif %}
<div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="2" aria-valuemin="0" aria-valuemax="5" style="width: {{percentage}}%">
<span class="sr-only">80% Complete (danger)</span>
</div>
</div>
</div>
<div class="pull-right" style="margin-left:10px;">{{singleProduct.getStars2}}</div>
</div>
<div class="pull-left">
<div class="pull-left" style="width:35px; line-height:1;">
<div style="height:9px; margin:5px 0;">1 <i class="fa fa-star"></i></div>
</div>
<div class="pull-left" style="width:180px;">
<div class="progress" style="height:9px; margin:8px 0;">
{% set percentage = 0 %}
{% if singleProduct.getStars1 > 0 %}
{% set percentage = (singleProduct.getStars1 / singleProduct.comments|length ) * 100 %}
{% endif %}
<div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="1" aria-valuemin="0" aria-valuemax="5" style="width: {{percentage}}%">
<span class="sr-only">80% Complete (danger)</span>
</div>
</div>
</div>
<div class="pull-right" style="margin-left:10px;">{{singleProduct.getStars1}}</div>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-7">
<hr/>
<div class="review-block">
{% for singleComment in singleProduct.comments %}
<div class="row">
<div class="col-sm-3">
<img src="http://dummyimage.com/60x60/666/ffffff&text=No+Image" class="img-rounded">
<div class="review-block-name"><b> {{singleComment.customer.lastName}} {{singleComment.customer.firstName}}</b></div>
<div class="review-block-date">{{singleComment.createdAt|date("Y-m-d H:i")}} </div>
</div>
<div class="col-sm-9">
<div class="review-block-rate">
{% for stars in 1..singleComment.rating %}
<button type="button" class="btn btn-warning btn-xs" aria-label="Left Align">
<i class="fa fa-star"></i>
</button>
{% endfor %}
{% if singleComment.rating < 5 %}
{% for stars in singleComment.rating..4 %}
<button type="button" class="btn btn-default btn-grey btn-xs" aria-label="Left Align">
<i class="fa fa-star"></i>
</button>
{% endfor %}
{% endif %}
</div>
<div class="review-block-title">COMMENTAIRES</div>
<div class="review-block-description">{{singleComment.comment|raw}}</div>
</div>
</div>
<hr/>
{% endfor %}
</div>
</div>
</div>
</div> 
<div class="product-details-comment-block">
{% for singleComment in singleProduct.comments %}
<!-- <div class="comment-details">
<div class="comment-author-infos pt-25">
<span>
{{singleComment.customer.lastName}} {{singleComment.customer.firstName}}
<ul class="rating d-inline">
{% for stars in 1..singleComment.rating %}
<li><i class="fa fa-star"></i></li>
{% endfor %}
{% if singleComment.rating < 5 %}
{% for stars in singleComment.rating..4 %}
<li class="no-star"><i class="fa fa-star"></i></li>
{% endfor %}
{% endif %}
</ul>
</span>
<em>{{singleComment.createdAt|date("Y-m-d H:i")}}</em>
</div>
<p>{{singleComment.comment|raw}}</p>
</div>
<hr style="margin:0;">-->
{% endfor %}
{% if is_granted("ROLE_CUSTOMER") %}
<div class="review-btn">
<a class="review-links" href="#" data-toggle="modal" data-target="#mymodal">Ajouter un commentaire!</a>
</div>

<div class="modal fade modal-wrapper" id="mymodal" >
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-body">
<h3 class="review-page-title">Ajouter un commentaire</h3>
<div class="modal-inner-area row">
<div class="col-lg-6">
<div class="li-review-product">
<img width="200px" src="/uploads/{{asset(singleProduct.image)}}" alt="Li's Product">
<div class="li-review-product-desc">
<p class="li-product-name">{{singleProduct.name}}</p>
<p>
<span>{{singleProduct.shortDescription|raw}}</span>
</p>
</div>
</div>
</div>
<div class="col-lg-6">
<div class="li-review-content">

<div class="feedback-area">
<div class="feedback">
<h3 class="feedback-title">Votre avis</h3>
<form action="{{path('comment_product',{id:singleProduct.id})}}" method="POST">
<p class="your-opinion">
<label>Evaluer le produit</label>
<span>
<select name="rating" class="star-rating">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
</span>
</p>
<p class="feedback-form">
<label for="feedback">Votre commentaire</label>
<textarea id="feedback" name="comment" cols="45" rows="8" aria-required="true"></textarea>
</p>
<div class="feedback-input">
<div class="feedback-btn pb-15">
<a href="#" class="close register-button d-none" data-dismiss="modal" aria-label="Close">Close</a>
<button class="register-button" type="submit">Envoyer</button>
</div>
</div>
</form>
</div>
</div>

</div>
</div>
</div>
</div>
</div>
</div>
</div>

{% endif %}
</div>
</div>
</div>
</div>
</div>
</div>


<section class="product-area li-laptop-product pt-30 pb-50">
<div class="container">
<div class="row">

<div class="col-lg-12">
<div class="li-section-title">
<h2>
<span>Produits en relation</span>
</h2>
</div>
<div class="row">
<div class="product-active owl-carousel">
{% for singleProduct in associatedProducts %}
{%
include "@Flexy/FrontBundle/templates/products/includes/_singleProduct.html.twig" with
{
singleProduct:singleProduct,
}
%}
{% endfor %}
</div>
</div>
</div>

</div>
</div>
</section>


</div>
{% endblock %}
{% block javascripts %}
{{parent()}}
<script>
$(document).ready(function(){
$.ajax({
url: "{{path('departements_ajax')}}",
data:{
city:$("select[name='city']").val()
},
success:function(data){
$("select[name='departement']").html(data);
},
});
$("select[name='city'").change(function(){
$.ajax({
url: "{{path('departements_ajax')}}",
data:{
city:$(this).val()
},
success:function(data){
$("select[name='departement']").html(data);
},
});
});
$("#showcomments").click(function(){
$("#comments").addClass("active show");
$("#reviews").addClass("active show");
$("#description_technique").removeClass("active show");
$("#product-details").removeClass("active show");
$("#description_pro").removeClass("active show");
$("#description").removeClass("active show");
});
});
</script>
{% endblock %}

src/Flexy/FrontBundle/templates/products/singleProduct.html.twig line 1