{% load i18n %}

<html>
<head>
    <title>Transaction Report</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <style type="text/css">
    @page {
       size: 11.69in 8.27in;
    }
    table {
       max-width: 10in;
       font-family: sans;
       font-size: 10px;
    }
    table tr:nth-child(even) {
        background-color: #eee;
    }
    table tr:nth-child(odd) {
        background-color: #fff;
    }
    table th {
        color: white;
        background-color: grey;
    }
    .item.column-created, .item.column-updated {
        text-align: center;
    }
    .item.column-amount {
        text-align: right;
    }
    </style>
</head>
<body>

<table id="summary">
<tr class="header">
    <th class="title column-name">{% trans "Summary" %}</th>
    <th class="title column-amount">{% trans "Amount" %}</th>
</tr>
{% for state, amount in states.items %}
<tr>
    <td class="item column-name">{{ state }}</td>
    <td class="item column-amount">{{ amount }}</td>
</tr>
{% endfor %}
<tr>
    <td class="item column-name"><b>{% trans "TOTAL" %}</b></td>
    <td class="item column-amount"><b>{{ total }}</b></td>
</tr>
</table>


<table>
<tr id="transaction">
    <th class="title column-id">ID</th>
    <th class="title column-bill">{% trans "Bill" %}</th>
    <th class="title column-account">{% trans "Account" %}</th>
    <th class="title column-billcontant">{% trans "Contact" %}</th>
    <th class="title column-iban">IBAN</th>
    <th class="title column-amount">{% trans "Amount" %}</th>
    <th class="title column-state">{% trans "State" %}</th>
    <th class="title column-created">{% trans "Created" %}</th>
    <th class="title column-updated">{% trans "Updated" %}</th>
</tr>
{% for transaction in transactions %}
<tr>
    <td class="item column-id">{{ transaction.id }}</td>
    <td class="item column-bill">{{ transaction.bill.number }}</td>
    <td class="item column-account">{{ transaction.bill.account.username }}</td>
    <td class="item column-billcontant">{{ transaction.bill.buyer.get_name }}</td>
    <td class="item column-iban">{{ transaction.source.data.iban }}</td>
    <td class="item column-amount">{{ transaction.amount }}</td>
    <td class="item column-state">{{ transaction.get_state_display }}</td>
    <td class="item column-created">{{ transaction.created_at|date }}</td>
    <td class="item column-updated">{% if transaction.created_at|date != transaction.modified_at|date %}{{ transaction.modified_at|date }}{% else %} --- {% endif %}</td>
</tr>
{% endfor %}
</table>
</body>
</html>
