<% layout('layouts/main') %>
<div class="app-shell">
  <%- partial('partials/client-nav') %>
  <section class="content">
    <div class="page-head"><h1>Mes demandes</h1></div>
    <div class="mobile-list">
      <% requests.forEach(r=>{ %>
        <article class="list-card">
          <div class="list-card-head"><div><strong><%= r.service_type %></strong><span><%= r.address || 'Adresse à confirmer' %></span></div><span class="badge"><%= ui.label(r.status) %></span></div>
          <div class="request-progress">
            <% const steps = ['nouvelle','en_analyse','devis_envoye','devis_accepte','planifiee','terminee']; %>
            <% const currentIndex = Math.max(0, steps.indexOf(r.status)); %>
            <% steps.forEach((step, index)=>{ %>
              <span class="<%= index <= currentIndex ? 'done' : '' %>"><%= ui.label(step) %></span>
            <% }) %>
          </div>
          <span class="muted"><%= ui.date(r.created_at) %></span>
        </article>
      <% }) %>
      <% if (!requests.length) { %><p class="panel">Aucune demande pour le moment.</p><% } %>
    </div>
  </section>
</div>
