<% layout('layouts/main') %>
<% const adminBase = typeof adminBaseUrl !== 'undefined' ? adminBaseUrl : '/admin'; %>
<% const p = planning || {}; %>
<% const context = p.context || { clients: [], employees: [] }; %>
<% const name = (item) => [item?.first_name, item?.last_name].filter(Boolean).join(' ') || item?.email || 'Non renseigné'; %>
<% const clientName = (item) => item?.company_name || name(item); %>
<% const scoreTone = (score) => Number(score || 0) >= 100 ? 'success' : (Number(score || 0) >= 60 ? 'warning' : 'danger'); %>
<div class="app-shell">
  <%- partial('partials/admin-nav') %>
  <section class="content advanced-module-page planning-assistant-page">
    <div class="page-head compact-page-head">
      <div>
        <p class="eyebrow">Planning assisté</p>
        <h1>Planifier avec disponibilités, conflits et recommandations.</h1>
        <p class="muted">Moteur interne sans IA externe : compétences, zones, absences, charge hebdomadaire et historique client sont croisés avant l’assignation.</p>
      </div>
      <div class="actions">
        <a class="button secondary" href="<%= adminBase %>/interventions">Interventions</a>
        <a class="button secondary" href="<%= adminBase %>/interventions.csv">Export CSV</a>
      </div>
    </div>

    <section class="suite-command-grid advanced-kpis">
      <article><span>Interventions visibles</span><strong><%= p.summaries.total || 0 %></strong><small><%= p.startDate %> au <%= p.endDate %></small></article>
      <article><span>Alertes bloquantes</span><strong><%= p.summaries.blocking || 0 %></strong><small>À corriger avant confirmation</small></article>
      <article><span>Non assignées</span><strong><%= p.summaries.unassigned || 0 %></strong><small>À répartir dans l’équipe</small></article>
      <article><span>Sans checklist</span><strong><%= p.summaries.withoutChecklist || 0 %></strong><small>Checklist métier recommandée</small></article>
    </section>

    <section class="panel compact-panel">
      <form method="get" class="form-grid planning-filter-grid">
        <label>Vue<select name="view">
          <% [['day','Jour'],['week','Semaine'],['month','Mois'],['employee','Par employé'],['client','Par client']].forEach(([value,label]) => { %>
            <option value="<%= value %>" <%= p.view===value?'selected':'' %>><%= label %></option>
          <% }) %>
        </select></label>
        <label>Date<input type="date" name="date" value="<%= p.filters.date || p.startDate %>"></label>
        <label>Statut<select name="status">
          <option value="">Tous</option>
          <% ['planifiee','confirmee','en_cours','terminee','annulee','reportee'].forEach((status) => { %><option value="<%= status %>" <%= p.filters.status===status?'selected':'' %>><%= ui.label(status) %></option><% }) %>
        </select></label>
        <label>Employé<select name="staff_id"><option value="">Tous</option><% context.employees.forEach((employee) => { %><option value="<%= employee.id %>" <%= Number(p.filters.staff_id)===Number(employee.id)?'selected':'' %>><%= name(employee) %></option><% }) %></select></label>
        <label>Client<select name="client_id"><option value="">Tous</option><% context.clients.forEach((client) => { %><option value="<%= client.id %>" <%= Number(p.filters.client_id)===Number(client.id)?'selected':'' %>><%= clientName(client) %></option><% }) %></select></label>
        <label>Recherche<input name="q" value="<%= p.filters.q || '' %>" placeholder="Prestation, adresse, client"></label>
        <div class="filter-actions"><button>Filtrer</button><a class="button secondary" href="<%= adminBase %>/planning-assiste">Réinitialiser</a></div>
      </form>
    </section>

    <section class="panel advanced-suggestions">
      <div class="inline-heading">
        <div><h2>Créneaux suggérés</h2><p class="muted">Basés sur la première mission visible ou sur une mission type de 2h.</p></div>
      </div>
      <div class="compact-card-grid">
        <% (p.suggested || []).forEach((slot) => { %>
          <article class="mini-record">
            <strong><%= ui.date(slot.starts_at, true) %></strong>
            <span><%= slot.ends_at ? String(slot.ends_at).slice(11,16) : '' %> · <%= name(slot.employee) %></span>
            <em>Score <%= slot.score %></em>
          </article>
        <% }) %>
        <% if (!(p.suggested || []).length) { %><div class="empty-state slim"><strong>Aucun créneau fiable</strong><span>Ajoutez disponibilités, durée estimée et adresse pour obtenir des suggestions exploitables.</span></div><% } %>
      </div>
    </section>

    <section class="advanced-record-list">
      <div class="section-heading compact-heading"><h2>Interventions analysées</h2><p>Chaque carte affiche l’employé recommandé, les raisons et les alertes bloquantes/non bloquantes.</p></div>
      <% (p.interventions || []).forEach((item) => { const rec = item.recommendation || {}; const best = rec.best || null; %>
        <article class="panel planning-card">
          <header>
            <div>
              <p class="eyebrow"><%= ui.label(item.status) %></p>
              <h2><%= item.service_type || 'Intervention' %></h2>
              <p class="muted"><%= clientName(item) %> · <%= item.address || 'Adresse manquante' %> · <%= item.starts_at ? ui.date(item.starts_at, true) : 'Créneau non fixé' %></p>
            </div>
            <span class="badge <%= best ? scoreTone(best.score) : 'danger' %>"><%= best ? `Score ${best.score}` : 'Aucune reco' %></span>
          </header>
          <div class="planning-card-grid">
            <div>
              <strong>Employé recommandé</strong>
              <% if (best) { %>
                <p><%= name(best.employee) %></p>
                <ul class="clean-list">
                  <% best.reasons.slice(0, 5).forEach((reason) => { %><li><%= reason %></li><% }) %>
                </ul>
              <% } else { %>
                <p class="muted">Aucun employé disponible dans les critères actuels.</p>
              <% } %>
            </div>
            <div>
              <strong>Alertes</strong>
              <% const allAlerts = [...(rec.alerts || []), ...((best && best.alerts) || []).map((label) => ({ severity: 'candidate', label }))]; %>
              <% if (allAlerts.length) { %>
                <ul class="clean-list alert-list">
                  <% allAlerts.forEach((alert) => { %><li class="<%= alert.severity %>"><%= alert.label %></li><% }) %>
                </ul>
              <% } else { %>
                <p class="muted">Aucune alerte détectée.</p>
              <% } %>
            </div>
            <div>
              <strong>Autres candidats</strong>
              <div class="mini-ranking">
                <% (rec.candidates || []).slice(0, 4).forEach((candidate) => { %>
                  <span><b><%= name(candidate.employee) %></b><em><%= candidate.score %></em></span>
                <% }) %>
              </div>
            </div>
            <div class="planning-actions">
              <form method="post" action="<%= adminBase %>/planning-assiste/interventions/<%= item.id %>/assigner">
                <input type="hidden" name="_csrf" value="<%= csrfToken %>">
                <label>Assigner<select name="assigned_user_id"><option value="">Non assigné</option><% context.employees.forEach((employee) => { %><option value="<%= employee.id %>" <%= Number(item.assigned_user_id)===Number(employee.id)?'selected':'' %>><%= name(employee) %></option><% }) %></select></label>
                <button class="secondary">Assigner</button>
              </form>
              <form method="post" action="<%= adminBase %>/planning-assiste/interventions/<%= item.id %>/statut">
                <input type="hidden" name="_csrf" value="<%= csrfToken %>">
                <label>Statut<select name="status"><% ['planifiee','confirmee','en_cours','terminee','annulee','reportee'].forEach((status) => { %><option value="<%= status %>" <%= item.status===status?'selected':'' %>><%= ui.label(status) %></option><% }) %></select></label>
                <button class="secondary">Mettre à jour</button>
              </form>
              <form method="post" action="<%= adminBase %>/planning-assiste/interventions/<%= item.id %>/dupliquer">
                <input type="hidden" name="_csrf" value="<%= csrfToken %>">
                <div class="form-grid two"><label>Nouveau début<input type="datetime-local" name="starts_at"></label><label>Nouvelle fin<input type="datetime-local" name="ends_at"></label></div>
                <button class="secondary">Dupliquer</button>
              </form>
            </div>
          </div>
        </article>
      <% }) %>
      <% if (!(p.interventions || []).length) { %><div class="empty-state"><strong>Aucune intervention</strong><span>Créez des interventions ou ajustez les filtres pour obtenir l’analyse assistée.</span></div><% } %>
    </section>

    <details class="panel workbench-secondary-drawer" id="reglages-planning">
      <summary><span>Réglages planning</span><small>Disponibilités, compétences, absences et récurrences.</small></summary>
      <div class="advanced-admin-grid" data-module-workspace data-module-workspace-label="Réglages planning">
      <details class="panel suite-module-drawer" id="disponibilites" open>
        <summary class="suite-module-title"><div><p class="eyebrow">Disponibilités employés</p><h2>Jours, heures et zones acceptées.</h2></div><span class="suite-module-toggle">Ouvrir</span></summary>
        <form method="post" action="<%= adminBase %>/planning-assiste/disponibilites" class="form-grid compact">
          <input type="hidden" name="_csrf" value="<%= csrfToken %>">
          <label>Employé<select name="user_id"><% context.employees.forEach((employee) => { %><option value="<%= employee.id %>"><%= name(employee) %></option><% }) %></select></label>
          <div class="checkbox-row">
            <% [[1,'Lun'],[2,'Mar'],[3,'Mer'],[4,'Jeu'],[5,'Ven'],[6,'Sam'],[7,'Dim']].forEach(([value,label]) => { %><label class="check"><input type="checkbox" name="weekdays" value="<%= value %>" <%= value<=5?'checked':'' %>><span><%= label %></span></label><% }) %>
          </div>
          <div class="form-grid two"><label>Début<input type="time" name="starts_at" value="08:00"></label><label>Fin<input type="time" name="ends_at" value="17:30"></label></div>
          <label>Zones acceptées<textarea name="zones" rows="2" placeholder="Lausanne&#10;1000&#10;Morges"></textarea></label>
          <button>Ajouter disponibilité</button>
        </form>
      </details>

      <details class="panel suite-module-drawer" id="competences">
        <summary class="suite-module-title"><div><p class="eyebrow">Compétences</p><h2>Types de prestations maîtrisées.</h2></div><span class="suite-module-toggle">Ouvrir</span></summary>
        <form method="post" action="<%= adminBase %>/planning-assiste/competences" class="form-grid compact">
          <input type="hidden" name="_csrf" value="<%= csrfToken %>">
          <label>Employé<select name="user_id"><% context.employees.forEach((employee) => { %><option value="<%= employee.id %>"><%= name(employee) %></option><% }) %></select></label>
          <div class="checkbox-row">
            <% (p.serviceTypes || []).forEach((service) => { %><label class="check"><input type="checkbox" name="skill_<%= service.key %>" checked><span><%= service.label %></span></label><% }) %>
          </div>
          <label>Niveau<select name="skill_level"><option value="3">Confirmé</option><option value="4" selected>Expert</option><option value="5">Référent</option></select></label>
          <button>Enregistrer compétences</button>
        </form>
      </details>

      <details class="panel suite-module-drawer" id="absences">
        <summary class="suite-module-title"><div><p class="eyebrow">Absences</p><h2>Vacances, maladie et certificats.</h2></div><span class="suite-module-toggle">Ouvrir</span></summary>
        <form method="post" action="<%= adminBase %>/planning-assiste/absences" enctype="multipart/form-data" class="form-grid compact">
          <input type="hidden" name="_csrf" value="<%= csrfToken %>">
          <label>Employé<select name="user_id"><% context.employees.forEach((employee) => { %><option value="<%= employee.id %>"><%= name(employee) %></option><% }) %></select></label>
          <div class="form-grid two"><label>Type<select name="absence_type"><option value="vacation">Vacances</option><option value="sickness">Maladie</option><option value="accident">Accident</option><option value="unpaid">Sans solde</option></select></label><label>Statut<select name="status"><option value="approved">Validée</option><option value="requested">Demandée</option></select></label></div>
          <div class="form-grid two"><label>Début<input type="date" name="starts_on"></label><label>Fin<input type="date" name="ends_on"></label></div>
          <label>Certificat si maladie<input type="file" name="certificate" accept=".pdf,image/*"></label>
          <label>Notes<textarea name="notes" rows="2"></textarea></label>
          <button>Ajouter absence</button>
        </form>
      </details>

      <details class="panel suite-module-drawer" id="recurrences">
        <summary class="suite-module-title"><div><p class="eyebrow">Récurrences</p><h2>Cycles automatiques de ménage.</h2></div><span class="suite-module-toggle">Ouvrir</span></summary>
        <form method="post" action="<%= adminBase %>/planning-assiste/recurrences" class="form-grid compact">
          <input type="hidden" name="_csrf" value="<%= csrfToken %>">
          <label>Client<select name="client_id"><option value="">Non lié</option><% context.clients.forEach((client) => { %><option value="<%= client.id %>"><%= clientName(client) %></option><% }) %></select></label>
          <label>Titre<input name="title" placeholder="Ménage hebdomadaire bureaux"></label>
          <div class="form-grid two"><label>Type<select name="service_type"><% (p.serviceTypes || []).forEach((service) => { %><option value="<%= service.key %>"><%= service.label %></option><% }) %></select></label><label>Récurrence<select name="recurrence_type"><option value="weekly">Chaque semaine</option><option value="biweekly">Toutes les 2 semaines</option><option value="monthly">Chaque mois</option><option value="custom">Jours personnalisés</option></select></label></div>
          <div class="form-grid two"><label>Début<input type="date" name="starts_on"></label><label>Fin optionnelle<input type="date" name="ends_on"></label></div>
          <div class="form-grid two"><label>Durée minutes<input type="number" name="duration_minutes" value="120"></label><label>Employé<select name="assigned_user_id"><option value="">À choisir</option><% context.employees.forEach((employee) => { %><option value="<%= employee.id %>"><%= name(employee) %></option><% }) %></select></label></div>
          <label>Adresse<input name="address"></label>
          <label>Notes<textarea name="notes" rows="2"></textarea></label>
          <button>Créer récurrence</button>
        </form>
      </details>
      </div>
    </details>
  </section>
</div>
