{% extends "core/base.html" %}{% load cohortly %}
{% block title %}Forecast{% endblock %}
{% block content %}
<div class="head"><h1>12-month MRR forecast <small>{{ currency }}</small></h1>
<div class="actions"><a class="btn" href="?{{ filter_qs }}{% if filter_qs %}&{% endif %}new_per_month={{ base.new_customers_per_month }}&avg_new_mrr={{ base.avg_new_mrr }}&growth_pct={{ growth_pct }}&format=csv">Export CSV</a></div></div>
<form class="inputs card" method="get">
  {% for k, v in filters.items %}<input type="hidden" name="{{ k }}" value="{{ v }}">{% endfor %}
  <label>New customers / month<input name="new_per_month" type="number" step="0.1" min="0" value="{{ base.new_customers_per_month }}"></label>
  <label>Avg new-customer MRR<input name="avg_new_mrr" type="number" step="0.01" min="0" value="{{ base.avg_new_mrr }}"></label>
  <label>Monthly growth of new customers (%)<input name="growth_pct" type="number" step="0.1" value="{{ growth_pct|floatformat:1 }}"></label>
  <button class="btn primary">Update</button>
  <p class="muted">Defaults are the trailing 3-month averages ({{ defaults.new_customers_per_month }} customers, {{ defaults.avg_new_mrr|money:2 }} MRR). Low and High scenarios scale the new-customer rate by 0.5x and 1.5x.</p>
</form>
<section class="card">{{ chart|safe }}</section>
<section class="card"><table>
<thead><tr><th rowspan="2">Month</th>{% for name in scenarios %}<th colspan="3" class="c">{{ name }}</th>{% endfor %}</tr>
<tr>{% for name in scenarios %}<th class="r">Existing</th><th class="r">New</th><th class="r">Total</th>{% endfor %}</tr></thead>
<tbody>{% for month, row in table %}<tr><td>{{ month|date:"Y-m" }}</td>{% for name, r in row.items %}<td class="r">{{ r.existing|money }}</td><td class="r">{{ r.new|money }}</td><td class="r"><b>{{ r.total|money }}</b></td>{% endfor %}</tr>{% endfor %}</tbody></table>
<p class="muted">Current MRR {{ last_mrr|money }}. Existing customers follow their segment's average revenue-retention curve from their current age; new customers follow the all-customer curve.</p></section>
{% endblock %}