fixed stats

app/rollerverbrauch/templates/statistics.html

@@ -1,33 +1,62 @@
 {% extends "layout.html" %}
 
 {% block body %}
+    <div id="content">
+        <ul id="tabs" class="nav nav-tabs" data-tabs="tabs">
+            {% for vehicle in data %}
+                <li {% if loop.first %}class="active" {%endif %}>
+                    <a href="#v{{vehicle.id}}" id="i{{vehicle.id}}" data-toggle="tab">
+                        {{ vehicle.name }}
+                    </a>
+                </li>
+            {% endfor %}
+        </ul>
+        <div id="my-tab-content" class="tab-content">
+            {% for vehicle in data %}
+                <div class="tab-pane {% if loop.first %}active{% endif %}" id="v{{vehicle.id}}">
+                    <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>
+						</table>
+					</div>
+                </div>
+            {% endfor %}
+        </div>
+    </div>
+
+
+    <script type="text/javascript">
+        jQuery(document).ready(function ($) {
+            $('#tabs').tab();
+            if(window.location.hash != "") {
+                  $('a[href="' + window.location.hash + '"]').click()
+            }
+          });
+
+    </script>
 
-	<div class="table-responsive">
-		<table class="table table-striped table-bordered table-condensed">
-			<tr>
-				<th>Number of Pitstops:</th>
-				<td>{{ data.count }}</td>
-			</tr>
-			<tr>
-				<th>Logged Distance:</th>
-				<td>{{ data.distance | round(2) }} km</td>
-			</tr>
-			<tr>
-				<th>Average Distance:</th>
-				<td>{{ data.averageDistance | round(2) }} km</td>
-			</tr>
-			<tr>
-				<th>Litres fuelled:</th>
-				<td>{{ data.litres | round(2) }} l</td>
-			</tr>
-			<tr>
-				<th>Average Litres fuelled:</th>
-				<td>{{ data.averageListresFuelled | round(2) }} l</td>
-			</tr>
-			<tr>
-				<th>Average Litres used:</th>
-				<td>{{ data.averageListresUsed | round(2) }} l/100km</td>
-			</tr>
-		</table>
-	</div>
 {% endblock %}