{% extends "base.html" %} {% block header %} <style> @media all { svg g text { display: none; } svg g:hover text { display: block; } span.input-replacement { display: none; } } @media print { svg g text { display: block; } input { display: none; } span.input-replacement { display: inline; } } </style> {{ super() }} {% endblock %} {% block main %} <h1>Sales Statistics</h1> <section id="statistics-range"> <h2>Time Range</h2> <form action="/statistics" method="get" accept-charset="utf-8"> <label class="form-label" for="statistics-range-from">From:</label> <input class="form-control" type="date" id="statistics-range-from" name="fromdate" value="{{fromdate}}" /> <span class="input-replacement">{{fromdate}}</span> <label class="form-label" for="statistics-range-to">To:</label> <input class="form-control" type="date" id="statistics-range-to" name="todate" value="{{todate}}" /> <span class="input-replacement">{{todate}}</span> <input class="btn btn-primary" type="submit" value="Update"> </form> </section> <section id="statistics-total"> <h2>Totals</h2> <ul> <li>Total products purchased: {{ total_consumption }}</li> <li>Total income: {{ total_income|chf }}</li> <li>Total deposited: {{ total_deposits|chf }}</li> <li>Total accounts balance: {{ total_balance|chf }}</li> </ul> </section> <section> <h2>Purchases</h2> <table class="table table-striped"> <thead> <tr><th>Product</th><th>Income</th><th>Units</th></tr> </thead> <tbody> {% for prod, data in consumptions.items() %} <tr><td>{{ prod }}</td><td>{{ -data[0]|chf }}</td><td>{{ data[1] }}</td></tr> {% endfor %} </tbody> <tfoot> <tr><td>Total</td><td>{{ total_income|chf }}</td><td>{{ total_consumption }}</td></tr> </tfoot> </table> {# Really hacky pie chart implementation. #} <svg width="400" height="400"> {% for s in product_slices %} <g> <path d="M 200 200 L {{ s[1]+200 }} {{ s[2]+200 }} A 100 100 0 {{ s[5] }} 1 {{ s[3]+200 }} {{ s[4]+200 }} L 200 200" fill="{{ loop.cycle('green', 'red', 'blue', 'yellow', 'purple', 'orange') }}"></path> <text text-anchor="middle" x="{{ 200 + s[6] }}" y="{{ 200 + s[7] }}">{{ s[0] }} ({{ s[8] }})</text> </g> {% endfor %} </svg> </section> <section id="statistics-balances"> <h2>Account Balances</h2> <ul> <li>Total account balances: {{ total_balance|chf }}</li> <li>Total positive account balances: {{ positive_balance|chf }}</li> <li>Total negative account balances: {{ negative_balance|chf }}</li> </ul> </section> {{ super() }} {% endblock %}