{% extends "layout.html" %}
{% block title %}Follow-ups{% endblock %}
{% block content %}
<header class="page-banner mb-5">
  <p class="eyebrow">CRM workflow</p>
  <h1>Follow-ups</h1>
  <p class="sub">
    {% if mode == 'mine' %}Your follow-ups. <a href="?owner=all">Show everyone's</a>{% else %}Everyone's follow-ups. <a href="?owner=mine">Show only mine</a>{% endif %}
    · {{ total_items }} open
  </p>
</header>
{% if total_items == 0 %}
  <div class="panel"><p class="mute" style="margin:0">No follow-ups scheduled. Set one when you log an activity, or on the school page.</p></div>
{% endif %}
{% for title, key, items in groups %}{% if items %}
<section class="panel">
  <h2>{{ title }} <span class="mute">({{ items|length }})</span></h2>
  <div class="tw"><table>
    <thead><tr><th>Due</th><th>School</th><th>Municipality</th><th>Priority</th><th>Stage</th><th>Owner</th><th>Task</th></tr></thead>
    <tbody>{% for l in items %}
      <tr class="lead-row" data-href="{{ url('school_crm', kwargs={'org_id': l.school.organization_id}) }}" tabindex="0" aria-label="Open CRM page for {{ l.school.name }}">
        <td class="due {{ 'late' if key == 'overdue' }}">{{ l.next_followup|dt }}</td>
        <td><a href="{{ url('school_crm', kwargs={'org_id': l.school.organization_id}) }}">{{ l.school.name }}</a></td>
        <td>{{ l.school.municipality }}</td>
        <td><span class="pill pr-{{ l.priority or '' }}">{{ PRIORITY_LABELS.get(l.priority or '', '-') }}</span></td>
        <td><span class="pill st-{{ l.stage }}">{{ STAGE_LABELS[l.stage] }}</span></td>
        <td>{{ l.owner.username if l.owner else '-' }}</td>
        <td class="wrapcell">{{ l.next_action or '-' }}</td>
      </tr>{% endfor %}</tbody>
  </table></div>
</section>
{% endif %}{% endfor %}
{% endblock %}
{% block scripts %}
<script>
  document.querySelectorAll(".lead-row[data-href]").forEach((row) => {
    row.addEventListener("click", (event) => {
      if (event.target.closest("a, button, form, input, select, textarea")) return;
      window.location.href = row.dataset.href;
    });
    row.addEventListener("keydown", (event) => {
      if (event.target !== row || (event.key !== "Enter" && event.key !== " ")) return;
      event.preventDefault();
      window.location.href = row.dataset.href;
    });
  });
</script>
{% endblock %}