crm/templates/dashboard.html

{% extends 'base.html' %}
{% block title %}Dashboard{% endblock %}
{% block content %}
<div class="head">
  <div><div class="kicker">Overzicht</div><h1>Dashboard</h1></div>
  <a class="btn" href="{{ url_for('contact_new') }}">Nieuw contact</a>
</div>

<div class="kpis">
  <div class="kpi"><div class="label">Nieuwe leads · 30 dagen</div><div class="value">{{ stats.new30 }}</div><div class="muted">{{ stats.customers }} klantrelaties · {{ stats.partners }} partners</div></div>
  <div class="kpi"><div class="label">Open leads</div><div class="value">{{ stats.open_leads }}</div>
    <div class="muted">{{ stats.pipeline_value|euro }} verwacht{% if stats.unassigned %} · <a href="{{ url_for('contacts', type='lead', owner='none') }}">{{ stats.unassigned }} niet toegewezen</a>{% endif %}</div></div>
  <div class="kpi"><div class="label">Open offertes</div><div class="value">{{ stats.open_quotes }}</div><div class="muted">{{ stats.open_value|euro }} excl. btw</div></div>
  <div class="kpi"><div class="label">Gewonnen · 30 dagen</div><div class="value">{{ stats.won_value|euro }}</div><div class="muted">excl. btw</div></div>
</div>

<div class="grid">
  <div class="card">
    <h2>Leads per status</h2>
    <div class="bars">
      {% for key, label, n in pipeline %}
      <a class="bar" href="{{ url_for('contacts', type='lead', status=key) }}">
        <span>{{ label }}</span>
        <span class="track"><span class="fill" style="width: {{ (n / pipe_max * 100)|round(1) }}%"></span></span>
        <span class="num">{{ n }}</span>
      </a>
      {% endfor %}
    </div>
  </div>
  <div class="card">
    <h2>Leads per week</h2>
    <div class="cols">
      {% for wk, n in weekly %}
      <div title="Week {{ wk }}: {{ n }} lead(s)">
        <span>{{ n or '' }}</span>
        <span class="c" style="height: {{ (n / week_max * 75)|round(1) }}%"></span>
        <span>{{ wk }}</span>
      </div>
      {% endfor %}
    </div>
  </div>
  <div class="card">
    <h2>Bronnen</h2>
    {% if sources %}
    <div class="bars">
      {% for s in sources %}
      <div class="bar">
        <span title="{{ s.s }}" style="overflow:hidden;text-overflow:ellipsis;white-space:nowrap">{{ s.s }}</span>
        <span class="track"><span class="fill" style="width: {{ (s.n / source_max * 100)|round(1) }}%"></span></span>
        <span class="num">{{ s.n }}</span>
      </div>
      {% endfor %}
    </div>
    {% else %}<p class="empty">Nog geen leads.</p>{% endif %}
  </div>
</div>

<div class="two">
  <div class="card">
    <h2>Laatste leads</h2>
    {% if recent %}
    <div class="table-wrap"><table>
      <thead><tr><th>Naam</th><th>Bron</th><th>Toegewezen</th><th>Status</th><th>Binnen</th></tr></thead>
      <tbody>
      {% for c in recent %}
        <tr class="link" onclick="location='{{ url_for('contact_view', cid=c.id) }}'">
          <td><a href="{{ url_for('contact_view', cid=c.id) }}">{{ c.name }}</a><div class="muted">{{ c.email }}</div></td>
          <td>{{ c.source }}</td>
          <td>{{ c.user_name or '—' }}</td>
          <td><span class="chip {{ c.status }}">{{ STATUS.get(c.status, c.status) }}</span></td>
          <td class="muted">{{ c.created_at|dt }}</td>
        </tr>
      {% endfor %}
      </tbody>
    </table></div>
    {% else %}<p class="empty">Nog geen contacten. Voeg er een toe of koppel een formulier via Instellingen.</p>{% endif %}
  </div>
  <div>
  <div class="card">
    <h2>Mijn taken</h2>
    {% for t in tasks %}
      <form method="post" action="{{ url_for('task_done', tid=t.id) }}" class="task">
        <button class="check" aria-label="Afronden"></button>
        <div><div>{{ t.title }}</div>
          <div class="muted">{% if t.contact_id %}<a href="{{ url_for('contact_view', cid=t.contact_id) }}">{{ t.contact_name }}</a>{% endif %}
          {% if t.due_date %}· <span class="{{ 'overdue' if t.due_date < today }}">{{ t.due_date|dt('%d-%m-%Y') }}</span>{% endif %}</div></div>
      </form>
    {% else %}
      <p class="empty">Geen openstaande taken.</p>
    {% endfor %}
  </div>
  <div class="card">
    <h2>Ongelezen e-mail</h2>
    {% for e in mails %}
      <p><a href="{{ url_for('inbox_view', eid=e.id) }}">{{ e.subject }}</a><br><span class="muted">{{ e.from_name or e.from_addr }} · {{ e.date|dt }}</span></p>
    {% else %}
      <p class="empty">Geen ongelezen berichten.</p>
    {% endfor %}
    <a href="{{ url_for('inbox') }}">Naar inbox</a>
  </div>
  </div>
</div>
{% endblock %}