Files
kimai2/templates/user/stats.html.twig

98 lines
3.6 KiB
Twig

{% extends 'user/layout.html.twig' %}
{% import "macros/actions.html.twig" as actions %}
{% import "macros/widgets.html.twig" as widgets %}
{% block profile_content %}
{% if years is empty %}
{{ widgets.callout('warning', 'error.no_entries_found') }}
{% endif %}
<script type="text/javascript">
var userProfileChartOptions = {
maintainAspectRatio : true,
responsive : true,
legend : false,
barPercentage : 0.5,
categoryPercentage : 0.9,
scales: {
xAxes: [{
gridLines: {
display: false
}
}],
yAxes: [{
gridLines: {
display: true,
color: 'rgba(0,0,0,.05)',
lineWidth: 1
}
}]
}
};
var userProfileChartLabels = [
{% for i in 1..12 %}
'{{ ('month.' ~i)|trans }}'
{% if not loop.last %},{% endif %}
{% endfor %}
];
</script>
{% for year,yearStat in years %}
{% embed '@AdminLTE/Widgets/box-widget.html.twig' %}
{% block box_title %}{{ year }}{% endblock %}
{% block box_body %}
<div class="chart">
<canvas id="userProfileChart{{ year }}" style="height: 200px;"></canvas>
</div>
<script type="text/javascript">
$(document).ready(function () {
var userProfileChartData{{ year }} = {
labels: userProfileChartLabels,
datasets: [
{
label: '{{ year }}',
backgroundColor : '#00a65a',
borderColor : '#00a65a',
data: [
{% for month in yearStat.months %}
{{ (month.totalDuration / 3600)|round }}
{% if not loop.last %},{% endif %}
{% endfor %}
]
}
]
};
var userProfileChartCanvas{{ year }} = $("#userProfileChart{{ year }}").get(0).getContext("2d");
{% if tab == 'charts' %}
var userProfileChart{{ year }} = new Chart(
userProfileChartCanvas{{ year }}, {
type: 'bar',
data: userProfileChartData{{ year }},
options: userProfileChartOptions
}
);
{% endif %}
$('a[href="#charts"]').on('shown.bs.tab', function(event){
var userProfileChart{{ year }} = new Chart(
userProfileChartCanvas{{ year }}, {
type: 'bar',
data: userProfileChartData{{ year }},
options: userProfileChartOptions
}
);
});
});
</script>
{% endblock %}
{% endembed %}
{% endfor %}
{% endblock %}