{% extends "budgets/base.html" %}
{% load bf static %}
{% block title %}{{ dept.name }} budget{% endblock %}
{% block content %}
<div class="pagehead">
  <div>
    <p class="crumbs"><a href="{% url 'dashboard' %}">Dashboard</a> / v{{ version.number }} {{ version.name }}</p>
    <h1>{{ dept.name }} <span class="pill {{ sub.status }}">{{ sub.get_status_display }}</span></h1>
    <p class="muted">Owner {{ dept.owner.username }} - version is {{ version.get_status_display|lower }}{% if not can_edit %} - read only{% endif %}</p>
  </div>
  <form method="get" class="inline">
    <select onchange="location.href=this.value">{% for d in departments %}<option value="{% url 'grid' version.pk d.pk %}" {% if d == dept %}selected{% endif %}>{{ d.name }}</option>{% endfor %}</select>
  </form>
</div>

<div class="formulabar" id="formulabar" {% if not can_edit %}hidden{% endif %}>
  <span class="fx">fx</span>
  <span id="fbar-label" class="muted">Select a cell</span>
  <input id="fbar-input" autocomplete="off" placeholder="Number, or =formula such as =headcount * avg_salary / 12" disabled>
  <button class="btn small" id="fbar-fill" disabled title="Apply this value or formula to every month in the row">Fill row</button>
</div>
<div id="fbar-error" class="flash error" hidden></div>

<div class="gridwrap">
<table class="data grid" id="grid" data-api="{% url 'api_cell' version.pk dept.pk %}" data-editable="{{ can_edit|yesno:'1,0' }}">
  <thead><tr><th class="sticky">Account</th>{% for m in months %}<th class="num">{{ m|date:"M y" }}</th>{% endfor %}<th class="num">Total</th></tr></thead>
  <tbody>
  {% for r in grid.rows %}
  <tr data-account="{{ r.account.pk }}" data-name="{{ r.account.code }} {{ r.account.name }}">
    <th class="sticky"><a href="{% url 'variance_detail' dept.pk r.account.pk %}?version={{ version.pk }}" title="Variance drill-down">{{ r.account.code }}</a> {{ r.account.name }}</th>
    {% for c in r.cells %}
    <td class="cellbox{% if c.error %} err{% endif %}{% if c.raw|slice:':1' == '=' %} has-formula{% endif %}">
      <input class="cell" data-month="{{ forloop.counter0 }}" data-raw="{{ c.raw }}" value="{{ c.value|money }}" {% if not can_edit %}readonly{% endif %} title="{{ c.error }}" inputmode="decimal">
    </td>
    {% endfor %}
    <td class="num rowtotal">{{ r.total|money }}</td>
  </tr>
  {% endfor %}
  </tbody>
  <tfoot>
    <tr class="sum" data-total="income"><th class="sticky">Revenue</th>{% for v in grid.income %}<td class="num">{{ v|money }}</td>{% endfor %}<td class="num">{{ grid.totals.income|money }}</td></tr>
    <tr class="sum" data-total="cost"><th class="sticky">Costs</th>{% for v in grid.cost %}<td class="num">{{ v|money }}</td>{% endfor %}<td class="num">{{ grid.totals.cost|money }}</td></tr>
    <tr class="sum net" data-total="net"><th class="sticky">Net result</th>{% for v in grid.net %}<td class="num">{{ v|money }}</td>{% endfor %}<td class="num">{{ grid.totals.net|money }}</td></tr>
  </tfoot>
</table>
</div>
<p class="muted small">Cells with a tinted corner are formulas. Click a cell to see its formula, edit it, press Enter to save.{% if headcount_note %} Salary lines can follow the <a href="{% url 'headcount' version.pk %}?dept={{ dept.pk }}">headcount plan</a>.{% endif %}
 Functions: <code>prev</code> <code>growth</code> <code>sum_dept</code> <code>line</code> <code>if</code> <code>min</code> <code>max</code> <code>abs</code> <code>round</code>.</p>

<div class="toolbar">
  {% if can_edit and addable %}
  <form method="get" class="inline"><select name="add" onchange="this.form.submit()"><option value="">Add account row...</option>{% for a in addable %}<option value="{{ a.pk }}">{{ a.code }} {{ a.name }}</option>{% endfor %}</select></form>
  {% endif %}
  {% if can_submit and sub.status == 'draft' or can_submit and sub.status == 'rejected' %}
  <form method="post" action="{% url 'submit' version.pk dept.pk %}" class="inline">{% csrf_token %}<input type="hidden" name="next" value="{{ request.path }}"><button class="primary">Submit for approval</button></form>
  {% endif %}
</div>
{% if can_review %}
<form method="post" action="{% url 'review' version.pk dept.pk %}" class="card">{% csrf_token %}
  <input type="hidden" name="next" value="{{ request.path }}">
  <h2>Review this submission</h2>
  <textarea name="comment" rows="2" placeholder="Comment (required to reject)"></textarea>
  <button class="primary" name="decision" value="approve">Approve</button>
  <button class="danger" name="decision" value="reject">Reject</button>
</form>
{% endif %}
{% if events %}<h2>History</h2><ul class="timeline">{% for e in events %}<li><b>{{ e.user.username }}</b> {{ e.action }} <span class="muted">{{ e.created_at|date:"d M H:i" }}</span>{% if e.comment %} - {{ e.comment }}{% endif %}</li>{% endfor %}</ul>{% endif %}
{% endblock %}
{% block scripts %}<script type="module" src="{% static 'budgets/grid.js' %}"></script>{% endblock %}