Symfony Profiler

{% extends 'layout.html.twig' %}
{% block logo_large %}
LOCCA CASHMAG
{% endblock %}
{% block title %}
LOCCA CASHMAG
{% endblock %}
{% block page_title %}
TICKET STATISTICS
<form action="{{ path('manage_stat' )}}" method="POST">
<input
type="datetime-local"
class="datetime-local"
name="debut"
value="{{ dateDebut|date('c') |split('+') |first }}"/>
-- au --
<input
type="datetime-local"
class="datetime-local"
name="fin"
value="{{ dateFin| date('c') |split('+') |first }}" />
<input type="submit" id="bydate" style="display:none" class="btn btn-primary mb-2" value="Valider"/>
</form>
<br>
<div><h3>Total CA de la période : {{ totalCaDeLaPeriode |number_format(2, ',', ' ')}}</h3></div>
{% endblock %}
{% block page_subtitle %}
Application rapatriement Base de donnée
</br>
{% if is_granted('IS_AUTHENTICATED_FULLY') %}
<p>Email Utilisateur: {{ app.user.email }}</p>
{% endif %}
{% endblock %}
{% block sidebar_nav %}
{% include 'navbar.html.twig' %}
{% endblock %}
{% block page_content %}
{% include 'flash-message.html.twig' %}
<style>
.overlay {
background-color:#EFEFEF;
position: fixed;
width: 100%;
height: 100%;
z-index: 1000;
top: 0px;
left: 0px;
opacity: .5;
filter: alpha(opacity=50);
display: none;
}
.spinner {
position: absolute;
left: 50%;
top: 50%;
height:60px;
width:60px;
margin:0px auto;
-webkit-animation: rotation .6s infinite linear;
-moz-animation: rotation .6s infinite linear;
-o-animation: rotation .6s infinite linear;
animation: rotation .6s infinite linear;
border-left:6px solid rgba(0,174,239,.15);
border-right:6px solid rgba(0,174,239,.15);
border-bottom:6px solid rgba(0,174,239,.15);
border-top:6px solid rgba(0,174,239,.8);
border-radius:100%;
z-index:99999;
display: none;
}
@-webkit-keyframes rotation {
from {-webkit-transform: rotate(0deg);}
to {-webkit-transform: rotate(359deg);}
}
@-moz-keyframes rotation {
from {-moz-transform: rotate(0deg);}
to {-moz-transform: rotate(359deg);}
}
@-o-keyframes rotation {
from {-o-transform: rotate(0deg);}
to {-o-transform: rotate(359deg);}
}
@keyframes rotation {
from {transform: rotate(0deg);}
to {transform: rotate(359deg);}
}
</style>
<div class="spinner"></div>
<div class="overlay"></div>
<div class="row yearschosen 2022" >
{% for pointOfSalesCA in allPointOfSalesCA %}
{# {% set date = month ~ "/1/2022" %} #}
<div class="col-lg-4 col-md-6 col-sm-6 col-12">
<div class="small-box">
<div>
<h4>{{ pointOfSalesCA.name}}</h4>
</div>
<div>
<h4>Total vente : {{ pointOfSalesCA.number}}</h4>
</div>
<div >
<h4>Chifre d'affaire : {{ pointOfSalesCA.ca |number_format(2, ',', ' ')}} </h4>
</div>
</div>
</div>
{% endfor %}
</div>
<div class="box box-primary">
<div class="box-header with-border">
<h3 class="box-title">Chiffres d'Affaire (CA) / point de vente du {{ dateDebut|date('d F Y') }} Au {{ dateFin|date('d F Y') }}</h3>
<div class="box-tools pull-right">
<button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i>
</button>
<button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button>
</div>
</div>
<div class="box-body">
<div class="chart">
<canvas id="myChart1"></canvas>
</div>
</div>
</div>
{% endblock %}
{% block footer %}
{% include 'footer.html.twig' %}
{% endblock %}
{% block javascripts %}
{{ parent() }}
<script>
$(document).on('change', '.datetime-local', function() {
$("#bydate").show();
});
</script>
<script>
var myChart1 = document.getElementById('myChart1').getContext('2d');
// Global Options
//Chart.defaults.global.defaultFontFamily = 'Lato';
// Chart.defaults.global.defaultFontSize = 18;
// Chart.defaults.global.defaultFontColor = '#777';
var pointDeVenteName = {{ pointDeVenteName|json_encode|raw }};
var ArrayCA = {{ ArrayCA|json_encode|raw }};
var nbrVente = {{ nbrVente|json_encode }};
var massPopChart = new Chart(myChart1, {
type:'bar', // bar, horizontalBar, pie, line, doughnut, radar, polarArea
data:{
labels:pointDeVenteName,
datasets: [
{
label: 'Chiffre affaire',
data: ArrayCA,
borderColor: 'rgb(54, 162, 235)',
backgroundColor: 'rgba(54, 162, 235, 0.2)',
}]
},
options:{
title:{
display:true,
text:'Largest Cities In Massachusetts',
fontSize:25,
responsive: true
},
legend:{
display:true,
position:'right',
labels:{
fontColor:'#000'
}
},
layout:{
padding:{
left:50,
right:0,
bottom:0,
top:0
}
},
tooltips:{
enabled:true
}
}
});
</script>
{% endblock %}

templates/default/stat.html.twig line 1