<% layout('layouts/main') %>
<% const adminBase = typeof adminBaseUrl !== 'undefined' ? adminBaseUrl : '/admin'; %>
<div class="app-shell">
  <%- partial('partials/admin-nav') %>
  <section class="content">
    <div class="page-head"><div><p class="eyebrow">Facturation</p><h1>Heures facturables</h1></div></div>
    <form class="panel form-grid two" method="get">
      <label>Mois<input type="month" name="month" value="<%= month %>"></label>
      <button>Afficher</button>
    </form>
    <div class="mobile-list">
      <% rows.forEach(r=>{ %>
        <article class="list-card">
          <div class="list-card-head"><div><strong><%= r.first_name %> <%= r.last_name %></strong><span><%= r.interventions_count %> interventions terminées non facturées</span></div><span class="badge"><%= ui.duration(r.minutes) %></span></div>
          <div class="detail-grid compact">
            <div class="detail-item"><span>Montant prévu</span><strong><%= ui.money(r.amount) %></strong></div>
            <div class="detail-item"><span>Période</span><strong><%= ui.date(r.first_completed_at) %> → <%= ui.date(r.last_completed_at) %></strong></div>
          </div>
          <form method="post" action="<%= adminBase %>/heures-facturables/facturer" data-confirm="Créer une facture brouillon pour ces heures ?">
            <input type="hidden" name="_csrf" value="<%= csrfToken %>">
            <input type="hidden" name="month" value="<%= month %>">
            <input type="hidden" name="user_id" value="<%= r.user_id %>">
            <button>Créer la facture</button>
          </form>
        </article>
      <% }) %>
      <% if (!rows.length) { %><div class="empty-state"><strong>Aucune heure à facturer</strong><span>Les interventions terminées et déjà facturées disparaissent automatiquement de cette liste.</span></div><% } %>
    </div>
  </section>
</div>
