statistics 3rd

This commit is contained in:
Joachim Lusiardi 2016-07-11 22:15:23 +02:00
parent ca5bd9bb02
commit aa9fda93c0

View File

@ -23,159 +23,153 @@
zoom_chart_{{ hash }}()
{% endmacro %}
{% macro chart(data, baseId, unit, link, active)%}
{% set chartID = 'chart_' + baseId %}
<div class="tab-pane {% if active %}active{% endif %}" id="{{ baseId }}">
{% if data|length > 0 %}
<div id="{{ chartID }}" style="width:100%; height:500px;"></div>
<script type="text/javascript">
{{ chartScript(chartID, data, unit) }}
</script>
{% else %}
<div class="alert alert-warning" role="alert">
not enough data: <a href="{{ link }}">log a pitstop</a>?
</div>
{% endif %}
{% macro nav_tab(id, text, active) %}
{#
#}
<li class="{% if active %}active{% endif %}">
<a href="#ref_{{id}}" id="id_{{id}}" data-toggle="tab" >
{{ text }}
</a>
</li>
{% endmacro %}
{% macro tab_pane(id, content, active) %}
<div class="tab-pane {% if active %}active{% endif %}" id="ref_{{ id }}">
{{ content }}
</div>
{% endmacro %}
{% macro chart(data, baseId, unit, link) %}
{% if data|length > 0 %}
{% set chartID = 'chart_' + baseId %}
<div id="{{ chartID }}" style="width:100%; height:500px;"></div>
<script type="text/javascript">
{{ chartScript(chartID, data, unit) }}
</script>
{% else %}
<div class="alert alert-warning" role="alert">
not enough data: <a href="{{ link }}">log a pitstop</a>?
</div>
{% endif %}
{% endmacro %}
{% macro print_consumable_table(consumable) %}
<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.overall_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>
{% endmacro %}
{% macro print_vehicle_table(vehicle) %}
<h3>{{vehicle.name}}</h3>
<div class="table-responsive">
<table class="table table-striped table-bordered table-condensed">
<tr>
<th>Logged Distance:</th>
<td>{{ vehicle.overall_distance | round(2) }} km</td>
</tr>
<tr>
<th>Logged Costs:</th>
<td>{{ vehicle.overall_costs | round(2) }} €</td>
</tr>
</table>
</div>
{% endmacro %}
{% macro tab_script(id) %}
<script type="text/javascript">
jQuery(document).ready(function ($) {
$('#{{id}}').tab();
if(window.location.hash != "") {
$('a[href="' + window.location.hash + '"]').click()
}
});
</script>
{% endmacro %}
{% block body %}
<div id="content">
<ul id="vehicle_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>
{{ nav_tab(vehicle.id, vehicle.name, loop.first) }}
{% endfor %}
</ul>
<div id="vehicle_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>Logged Distance:</th>
<td>{{ vehicle.overall_distance | round(2) }} km</td>
</tr>
<tr>
<th>Logged Costs:</th>
<td>{{ vehicle.overall_costs | round(2) }} €</td>
</tr>
</table>
</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.overall_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>
{% set ID = vehicle.id|string + '_c' + consumable.id|string %}
{% set odometerID = ID + '_odometer' %}
{% set consumptionID = ID + '_consumption' %}
{% set amountID = ID + '_amount' %}
<ul id="charts_{{ID}}_tabs" class="nav nav-tabs" data-tabs="tabs">
<li class="active">
<a href="#v{{odometerID}}" id="i{{odometerID}}" data-toggle="tab" >
Odometer
</a>
</li>
<li>
<a href="#v{{consumptionID}}" id="i{{consumptionID}}" data-toggle="tab" >
Consumption
</a>
</li>
<li>
<a href="#v{{amountID}}" id="i{{amountID}}" data-toggle="tab" >
Amount
</a>
</li>
</ul>
<div id="charts_{{ID}}_tabs-content" class="tab-content">
{% set baseId = 'v' + odometerID %}
{% set link = url_for('select_consumable_for_new_pitstop', vid=vehicle.id) %}
{{ chart(vehicle.odometers, baseId, 'km', link, true) }}
{% set baseId = 'v' + consumptionID %}
{% set link = url_for('create_pit_stop_form', vid=vehicle.id, cid=consumable.id) %}
{{ chart(consumable.average_amount, baseId, consumable.unit + '/100km', link, false) }}
{% set baseId = 'v' + amountID %}
{% set link = url_for('create_pit_stop_form', vid=vehicle.id, cid=consumable.id) %}
{{ chart(consumable.amounts, baseId, consumable.unit, link, false) }}
</div>
<script type="text/javascript">
jQuery(document).ready(function ($) {
$('#charts_{{ID}}_tabs').tab();
if(window.location.hash != "") {
$('a[href="' + window.location.hash + '"]').click()
}
});
</script>
</div>
{% endfor %}
</div>
<div class="tab-pane {% if loop.first %}active{% endif %}" id="ref_{{vehicle.id}}">
{{ print_vehicle_table(vehicle) }}
<ul id="vehicle_{{vehicle.id}}_tabs" class="nav nav-tabs" data-tabs="tabs">
{{ nav_tab(vehicle.id|string + '_odometer', 'Odometer', true) }}
{% for consumable in vehicle.consumables %}
{{ nav_tab(vehicle.id|string + '_' + consumable.id|string, consumable.name, false) }}
{% endfor %}
</ul>
<div id="vehicle_{{vehicle.id}}_content" class="tab-content ">
{{ tab_pane(
vehicle.id|string + '_odometer',
chart(
vehicle.odometers,
'ref_' + vehicle.id|string + '_odometer',
'km',
url_for('select_consumable_for_new_pitstop', vid=vehicle.id)
),
true
)
}}
{% for consumable in vehicle.consumables %}
<div class="tab-pane" id="ref_{{vehicle.id}}_{{consumable.id}}">
{{ print_consumable_table(consumable) }}
<ul id="consumable_{{vehicle.id}}_{{consumable.id}}_tabs" class="nav nav-tabs" data-tabs="tabs">
{{ nav_tab(vehicle.id|string + '_' + consumable.id|string + '_consumption', 'Consumption', true) }}
{{ nav_tab(vehicle.id|string + '_' + consumable.id|string + '_amount', 'Amount', false) }}
</ul>
<div id="consumable_{{vehicle.id}}_{{consumable.id}}_content" class="tab-content ">
{{ tab_pane(
vehicle.id|string + '_' + consumable.id|string + '_consumption',
chart(
consumable.average_amount,
'ref_' + vehicle.id|string + '_' + consumable.id|string + '_consumption',
consumable.unit + '/100km',
url_for('create_pit_stop_form', vid=vehicle.id, cid=consumable.id)
),
true
)
}}
{{ tab_pane(
vehicle.id|string + '_' + consumable.id|string + '_amount',
chart(
consumable.amounts,
'ref_' + vehicle.id|string + '_' + consumable.id|string + '_amount',
consumable.unit,
url_for('create_pit_stop_form', vid=vehicle.id, cid=consumable.id)
),
false
)
}}
</div>
{{ tab_script('vehicle_' + vehicle.id + '_' + consumable.id + '_tabs') }}
</div>
{% endfor %}
</div>
{{ tab_script('vehicle_' + vehicle.id + '_tabs') }}
</div>
{% endfor %}
</div>
{{ tab_script('vehicle_tabs') }}
</div>
<script type="text/javascript">
jQuery(document).ready(function ($) {
$('#vehicle_tabs').tab();
if(window.location.hash != "") {
$('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>
{% endblock %}