{% extends "main/form/base.html" %}
{% load i18n %}
{% load main_extras transaction_extras %}
{% block title %}
  {{ transaction }}
  – Nummi
{% endblock title %}
{% block link %}
  {{ block.super }}
  {% css "main/css/form.css" %}
  {% css "main/css/table.css" %}
  {% css "main/css/plot.css" %}
  {% js "transaction/js/invoice_form.js" %}
{% endblock link %}
{% block body %}
  <h2>{{ transaction }}</h2>
  <section class="transaction-details">
    <ul>
      {% if transaction.statement %}
        <li>
          {% with transaction.statement.account as account %}
            <a href="{{ account.get_absolute_url }}">{{ account.icon|remix }}{{ account }}</a> –
          {% endwith %}
          <a href="{{ transaction.statement.get_absolute_url }}">{{ transaction.statement }}</a>
        </li>
      {% endif %}
      {% if transaction.category %}
        <li>
          <a href="{{ transaction.category.get_absolute_url }}">{{ transaction.category.icon|remix }}{{ transaction.category }}</a>
        </li>
      {% endif %}
      {% if transaction.trader %}
        <li class="wi">{{ "p2p"|remix }}{{ transaction.trader }}</li>
      {% endif %}
      <li class="date wi">{{ "calendar"|remix }}{{ transaction.date }}</li>
      <li class="value">{{ transaction.value|pmvalue }}</li>
    </ul>
    <p>
      <a href="{% url "edit_transaction" transaction.id %}">{{ "edit"|remix }}{% translate "Edit transaction" %}</a>
    </p>
    {% if transaction.description %}
      <p class="description">{{ transaction.description|linebreaksbr }}</p>
    {% endif %}
  </section>
  <section>
    <h3>{% translate "Invoices" %}</h3>
    {% invoice_table transaction %}
    <form class="hidden invoices"
          method="post"
          action="{% url "multiple_invoice" transaction=transaction.pk %}"
          enctype="multipart/form-data">
      {% csrf_token %}
      {{ invoices_form }}
    </form>
  </section>
  <div class="drop-zone">
    <span class="wi">{{ "file-add"|remix }}{% translate "Add invoice" %}</span>
  </div>
{% endblock body %}
