<h1 class="app-main-title">Hubleto Cloud > {{ translate("Payments and invoices") }}</h1>

<table class="table-default dense">
  <thead>
    <tr>
      <th>{{ translate("Charged") }}</th>
      <th>{{ translate("UUID") }}</th>
      <th>{{ translate("Type") }}</th>
      {# <th>Discount</th> #}
      <th>{{ translate("Amount") }}</th>
      {# <th>Discounted amount</th> #}
      <th>{{ translate("Details") }}</th>
      <th>{{ translate("Invoice") }}</th>
    </tr>
  </thead>
  <tbody>
    {% for payment in viewParams.payments %}
      <tr>
        <td>{{ payment.datetime_charged }}</td>
        <td>{{ payment.uuid }}</td>
        <td><div class="badge {{ payment['_ENUM[type_background_css_class]'] }}">{{ payment['_ENUM[type]'] }}</div></td>
        {# <td>{% if payment.discount %} {{ payment.discount }} % {% endif %}</td> #}
        <td class="{% if payment.full_amount < 0 %} text-red-800 {% else %} text-green-800 {% endif %}">{% if payment.full_amount %} {{ payment.full_amount }} € {% endif %}</td>
        {# <td class="{% if payment.discounted_amount < 0 %} text-red-800 {% else %} text-green-800 {% endif %}">{% if payment.discounted_amount %} {{ payment.discounted_amount }} € {% endif %}</td> #}
        <td style="font-family:courier;font-size:8pt">{{ payment.details }}</td>
        <td>{% if payment.has_invoice %}
          <a
            class="btn btn-transparent btn-small"
            href="{{ config.projectUrl }}/cloud/download-invoice"
            target="_blank"
          >
            <span class="icon"><i class="fas fa-arrow-down"></i></span>
            <span class="text">{{ translate("Download invoice") }}</span>
          </a>
        {% endif %}</td>
      </tr>
    {% endfor %}
  </tbody>
</table>