<%- include('../partials/header') %>

<section class="panel">
  <h2 class="panel-title">Programmes immobiliers</h2>

  <% if (programmes.length === 0) { %>
    <div class="panel-toolbar">
      <div class="table-search"></div>
      <a href="/programmes/nouveau" class="btn btn-primary">Nouveau programme</a>
    </div>
    <p class="empty">Aucun programme. <a href="/programmes/nouveau">Créer un programme</a>.</p>
  <% } else { %>
    <%
      const maxCodeLen = programmes.reduce(function(max, p) {
        return Math.max(max, String(p.code_interne || '').length);
      }, 1);
    %>
    <div data-programme-search>
      <div class="panel-toolbar">
        <div class="table-search">
          <label class="sr-only" for="programme-search-list">Rechercher par code, nom ou ville</label>
          <input
            id="programme-search-list"
            type="search"
            class="table-search-input"
            data-programme-search-input
            placeholder="Rechercher code, nom ou ville…"
            autocomplete="off"
          >
        </div>
        <a href="/programmes/nouveau" class="btn btn-primary">Nouveau programme</a>
      </div>
      <div class="table-wrap" style="--code-badge-ch: <%= maxCodeLen %>ch">
        <table>
          <thead>
            <tr>
              <th>Code interne</th>
              <th>Nom commercial</th>
              <th>Adresse</th>
              <th>SDP (m²)</th>
              <th>Lots</th>
              <th>Terrain (m²)</th>
              <th>Responsable</th>
            </tr>
          </thead>
          <tbody>
            <% programmes.forEach(function(p) { %>
              <tr data-nom="<%= p.nom_commercial || '' %>" data-ville="<%= p.ville || '' %>" data-code="<%= p.code_interne || '' %>">
                <td><code class="code-badge"><%= p.code_interne %></code></td>
                <td>
                  <strong
                    class="name-open"
                    title="Ouvrir la synthèse"
                    data-href="/programmes/<%= p.id %>"
                  ><%= p.nom_commercial %></strong>
                </td>
                <td>
                  <%= [p.numero, p.rue].filter(Boolean).join(' ') %><br>
                  <span class="muted"><%= p.code_postal %> <%= p.ville %></span>
                </td>
                <td><%= p.surface_plancher != null ? formatNumber(p.surface_plancher, { digits: 2 }) : '—' %></td>
                <td><%= formatInteger(p.nombre_lots) %></td>
                <td><%= p.surface_terrain != null ? formatNumber(p.surface_terrain, { digits: 2 }) : '—' %></td>
                <td>
                  <% if (p.responsable_prenom) { %>
                    <%= p.responsable_prenom %> <%= p.responsable_nom %>
                  <% } else { %>
                    <span class="muted">—</span>
                  <% } %>
                </td>
              </tr>
            <% }) %>
          </tbody>
        </table>
      </div>
      <p class="empty" data-programme-search-empty hidden>Aucun programme ne correspond à la recherche.</p>
    </div>
  <% } %>
</section>

<%- include('../partials/footer') %>
