<%- include("../partials/page-header", {
  user,
  title: t.openInvoices.title,
  subtitle: "",
  showUserName: true
}) %>

<div class="container mt-4">
  <%- include("../partials/flash") %>
  <h4><%= t.openInvoices.title %></h4>

  <% if (invoices.length === 0) { %>
    <p><%= t.openInvoices.noinvoices %></p>
  <% } else { %>
    <table class="table">
      <thead>
        <tr>
          <th>#</th>
          <th><%= t.openInvoices.patient %></th>
          <th><%= t.openInvoices.date %></th>
          <th><%= t.openInvoices.amount %></th>
          <th><%= t.openInvoices.status %></th>
          <th></th>
        </tr>
      </thead>
      <tbody>
        <% invoices.forEach(inv => { %>
          <tr>
            <td><%= inv.id %></td>
            <td><%= inv.firstname %> <%= inv.lastname %></td>
            <td><%= inv.invoice_date_formatted %></td>
            <td><%= inv.total_amount_formatted %> €</td>
            <td><%= t.openInvoices.open %></td>

            <td style="text-align:right; white-space:nowrap;">

              <!-- BEZAHLT -->
              <form action="/invoices/<%= inv.id %>/pay" method="POST"
                style="display:inline;"
                class="js-confirm-pay"
                data-msg="<%= t.global.save %>?">
                <button type="submit" class="btn btn-sm btn-success">
                  <%= t.global.save %>
                </button>
              </form>

              <!-- STORNO -->
              <form action="/invoices/<%= inv.id %>/cancel" method="POST"
                style="display:inline;"
                class="js-confirm-cancel"
                data-msg="Storno?">
                <button type="submit" class="btn btn-sm btn-danger" style="margin-left:6px;">
                  STORNO
                </button>
              </form>

            </td>
          </tr>
        <% }) %>
      </tbody>
    </table>
  <% } %>
</div>

<script src="/js/invoice-confirm.js" defer></script>
