first step for statistics

This commit is contained in:
2016-07-10 13:40:49 +02:00
parent 43e3f9c98b
commit 4ea42a7efd
2 changed files with 160 additions and 150 deletions

View File

@@ -17,129 +17,94 @@
<h3>{{vehicle.name}}</h3>
<div class="table-responsive">
<table class="table table-striped table-bordered table-condensed">
<tr>
<th>Number of Pitstops:</th>
<td>{{ vehicle.pitstop_count }}</td>
</tr>
<tr>
<th>Logged Distance:</th>
<td>{{ vehicle.overall_distance | round(2) }} km</td>
</tr>
<tr>
<th>Average Distance:</th>
<td>{{ vehicle.average_distance | round(2) }} km</td>
</tr>
<tr>
<th>Litres fuelled:</th>
<td>{{ vehicle.overall_litres | round(2) }} l</td>
</tr>
<tr>
<th>Average Litres fuelled:</th>
<td>{{ vehicle.average_litres_fuelled | round(2) }} l</td>
</tr>
<tr>
<th>Average Litres used:</th>
<td>{{ vehicle.average_litres_used | round(2) }} l/100km</td>
</tr>
<tr>
<th>Logged Costs:</th>
<td>{{ vehicle.overall_costs | round(2) }} €</td>
</tr>
<tr>
<th>Average Costs per Litre:</th>
<td>{{ vehicle.average_costs_per_litre | round(2) }} €/l</td>
</tr>
</table>
</div>
<ul id="charts_tabs" class="nav nav-tabs" data-tabs="tabs">
<li class="active">
<a href="#v{{vehicle.id}}_c3" id="i{{vehicle.id}}_c3" data-toggle="tab">
Consumption
</a>
</li>
<li>
<a href="#v{{vehicle.id}}_c1" id="i{{vehicle.id}}_c1" data-toggle="tab">
Fuelled litres
</a>
</li>
<li>
<a href="#v{{vehicle.id}}_c2" id="i{{vehicle.id}}_c2" data-toggle="tab">
Odometer
</a>
</li>
<li>
<a href="#v{{vehicle.id}}_c4" id="i{{vehicle.id}}_c4" data-toggle="tab">
Costs per litre
</a>
</li>
<li>
<a href="#v{{vehicle.id}}_c5" id="i{{vehicle.id}}_c5" data-toggle="tab">
Costs
</a>
</li>
</ul>
<div id="charts_tabs-content" class="tab-content">
<div class="tab-pane active" id="v{{vehicle.id}}_c3">
{% if vehicle.pitstop_count > 1 %}
<div id="averageUsageDiv{{vehicle.id}}" style="width:100%; height:500px;"></div>
<script type="text/javascript">
{{ chartScript('averageUsageDiv'+vehicle.id|str, vehicle.average_litres, 'l/100 km') }}
</script>
{% else %}
<div class="alert alert-warning" role="alert">
not enough data: <a href="{{ url_for('select_consumable_for_new_pitstop', vid=vehicle.id) }}">log a pitstop</a>?
</div>
{% endif %}
</div>
<div class="tab-pane " id="v{{vehicle.id}}_c1">
{% if vehicle.pitstop_count > 0 %}
<div id="fuelledChartDiv{{vehicle.id}}" style="width:100%; height:500px;"></div>
<script type="text/javascript">
{{ chartScript('fuelledChartDiv'+vehicle.id|str, vehicle.litres, 'l') }}
</script>
{% else %}
<div class="alert alert-warning" role="alert">
not enough data: <a href="{{ url_for('select_consumable_for_new_pitstop', vid=vehicle.id) }}">log a pitstop</a>?
</div>
{% endif %}
</div>
<div class="tab-pane " id="v{{vehicle.id}}_c2">
{% if vehicle.pitstop_count > 0 %}
<div id="odometerChartDiv{{vehicle.id}}" style="width:100%; height:500px;"></div>
<script type="text/javascript">
{{ chartScript('odometerChartDiv'+vehicle.id|str, vehicle.odometers, 'km') }}
</script>
{% else %}
<div class="alert alert-warning" role="alert">
not enough data: <a href="{{ url_for('select_consumable_for_new_pitstop', vid=vehicle.id) }}">log a pitstop</a>?
</div>
{% endif %}
</div>
<div class="tab-pane " id="v{{vehicle.id}}_c4">
{% if vehicle.pitstop_count > 0 %}
<div id="costsPerLitre{{vehicle.id}}" style="width:100%; height:500px;"></div>
<script type="text/javascript">
{{ chartScript('costsPerLitre'+vehicle.id|str, vehicle.costsPerLitre, '€/l') }}
</script>
{% else %}
<div class="alert alert-warning" role="alert">
not enough data: <a href="{{ url_for('select_consumable_for_new_pitstop', vid=vehicle.id) }}">log a pitstop</a>?
</div>
{% endif %}
</div>
<div class="tab-pane " id="v{{vehicle.id}}_c5">
{% if vehicle.pitstop_count > 0 %}
<div id="costs{{vehicle.id}}" style="width:100%; height:500px;"></div>
<script type="text/javascript">
{{ chartScript('costs'+vehicle.id|str, vehicle.costs, '€') }}
</script>
{% else %}
<div class="alert alert-warning" role="alert">
not enough data: <a href="{{ url_for('select_consumable_for_new_pitstop', vid=vehicle.id) }}">log a pitstop</a>?
</div>
{% endif %}
</div>
</div>
<ul id="consumable_tabs" class="nav nav-tabs" data-tabs="tabs">
{% for consumable in vehicle.consumables %}
<li class="{% if loop.first %}active{% endif %}">
<a href="#v{{vehicle.id}}_c{{consumable.id}}" id="i{{vehicle.id}}_c{{consumable.id}}" data-toggle="tab" >
{{ consumable.name }}
</a>
</li>
{% endfor %}
</ul>
<div id="consumable_tabs-content" class="tab-content">
{% for consumable in vehicle.consumables %}
<div class="tab-pane {% if loop.first %}active{% endif %}" id="v{{vehicle.id}}_c{{consumable.id}}">
<table class="table table-striped table-bordered table-condensed">
<tr>
<th>Average Distance:</th>
<td>{{ consumable.average_distance | round(2) }} km</td>
</tr>
<tr>
<th>Amount fuelled:</th>
<td>{{ consumable.amount | round(2) }} {{ consumable.unit }}</td>
</tr>
<tr>
<th>Average Amount fuelled:</th>
<td>{{ consumable.average_amount_fuelled | round(2) }} {{ consumable.unit }}</td>
</tr>
<tr>
<th>Average Amount used:</th>
<td>{{ consumable.average_amount_used | round(2) }} {{ consumable.unit }}/100km</td>
</tr>
</table>
</div>
{% endfor %}
</div>
<ul id="charts_tabs" class="nav nav-tabs" data-tabs="tabs">
<li class="active">
<a href="#v{{vehicle.id}}_codometer" id="i{{vehicle.id}}_codometer" data-toggle="tab" >
Odometer
</a>
</li>
{% for consumable in vehicle.consumables %}
<li>
<a href="#v{{vehicle.id}}_c{{consumable.id}}_consumption" id="i{{vehicle.id}}_c{{consumable.id}}_consumption" data-toggle="tab" >
{{ consumable.name }} consumption
</a>
</li>
{% endfor %}
</ul>
<div id="charts_tabs-content" class="tab-content">
<div class="tab-pane active" id="v{{vehicle.id}}_codometer">
{% if vehicle.odometers|length > 0 %}
<div id="odometerChartDiv{{vehicle.id}}" style="width:100%; height:500px;"></div>
<script type="text/javascript">
{{ chartScript('odometerChartDiv'+vehicle.id|str, vehicle.odometers, 'km') }}
</script>
{% else %}
<div class="alert alert-warning" role="alert">
not enough data: <a href="{{ url_for('select_consumable_for_new_pitstop', vid=vehicle.id) }}">log a pitstop</a>?
</div>
{% endif %}
</div>
{% for consumable in vehicle.consumables %}
<div class="tab-pane active" id="v{{vehicle.id}}_c{{consumable.id}}_consumption">
{% if consumable.average_amount|length > 0 %}
<div id="consumptionChartDiv{{vehicle.id}}_c{{consumable.id}}" style="width:100%; height:500px;"></div>
<script type="text/javascript">
{{ chartScript('consumptionChartDiv'+vehicle.id|str+'_c'+consumable.id|str, consumable.average_amount, consumable.unit+'/100km') }}
</script>
{% else %}
<div class="alert alert-warning" role="alert">
not enough data: <a href="{{ url_for('create_pit_stop_form', vid=vehicle.id, cid=consumable.id) }}">log a pitstop</a>?
</div>
{% endif %}
</div>
{% endfor %}
</div>
</div>
{% endfor %}
</div>
@@ -153,6 +118,18 @@
$('a[href="' + window.location.hash + '"]').click()
}
});
jQuery(document).ready(function ($) {
$('#consumable_tabs').tab();
if(window.location.hash != "") {
$('a[href="' + window.location.hash + '"]').click()
}
});
jQuery(document).ready(function ($) {
$('#charts_tabs').tab();
if(window.location.hash != "") {
$('a[href="' + window.location.hash + '"]').click()
}
});
</script>