{% extends "base.html" %}
{% from "_macros.html" import export_buttons, indent, level_select with context %}
{% block title %}{{ t('Budget vs Actual') }}{% endblock %}
{% block content %}
<div class="page-head">
  <div><small><a href="{{ url_for('budgets.index') }}">{{ t('Budgets') }}</a></small>
    <h1>{{ t('Budget vs Actual') }} — {{ b.name }}</h1>
    <small>{{ fy }} · {{ b.bcode }}{% if b.cc_code %} · {{ t('Cost Centre') }} {{ b.cc_code }} {{ nm({'name_en': b.cc_name_en, 'name_ar': b.cc_name_ar}) }}{% else %} · {{ t('Whole branch') }}{% endif %}</small></div>
  {% if can_write %}<div class="actions">
    <a class="btn ghost" href="{{ url_for('budgets.edit', bid=b.id) }}">{{ t('Edit budget') }}</a>
    <a class="btn ghost" href="{{ url_for('budgets.new', copy=b.id) }}">{{ t('Copy') }}</a>
    <form method="post" action="{{ url_for('budgets.delete', bid=b.id) }}" class="inline" onsubmit="return confirm('{{ t('Delete this budget?') }}')"><button class="btn ghost">{{ t('Delete') }}</button></form>
  </div>{% endif %}
</div>
<form class="filters report-filters" method="get">
  <div class="tabs" style="margin:0;border:0">
    {% for code, lbl in [('month', 'Month'), ('ytd', 'Year to date'), ('year', 'Full year')] %}
      <label class="chip"><input type="radio" name="scope" value="{{ code }}" {{ 'checked' if scope == code }} onchange="this.form.submit()"> {{ t(lbl) }}</label>
    {% endfor %}
  </div>
  {% if scope != 'year' %}<label>{{ t('Month') }} <select name="upto" onchange="this.form.submit()">{% for p in pers %}<option value="{{ p }}" {{ 'selected' if p == upto }}>{{ p }}</option>{% endfor %}</select></label>{% else %}<input type="hidden" name="upto" value="{{ upto }}">{% endif %}
  {% if levels > 1 %}<span onchange="this.closest('form').submit()">{{ level_select(level, levels) }}</span>{% endif %}
  {{ export_buttons() }}
</form>
<div class="report-meta">
  <span>{{ data.periods[0] }}{% if data.periods|length > 1 %} → {{ data.periods[-1] }}{% endif %}</span>
  <span>{{ t('Amounts in') }} {{ cur }}</span>
</div>
<div class="card flush" style="overflow-x:auto">
  <table class="report">
    <thead><tr><th>{{ t('Account') }}</th><th class="num">{{ t('Budget') }}</th><th class="num">{{ t('Actual') }}</th>
      <th class="num">{{ t('Variance') }}</th><th class="num">{{ t('% of budget') }}</th><th style="width:16%"></th></tr></thead>
    <tbody>
    {% for r in data.rows %}
      {% if r.kind == 'section' %}<tr class="section"><td colspan="6">{{ r.label }}</td></tr>
      {% else %}
      <tr class="{{ r.kind }}">
        <td class="lvl-1"{{ indent(r) }}>{% if r.account %}<a href="{{ url_for('reports.gl', account_id=r.account.id, b=b.branch_id, date_from=d_from, date_to=d_to, cc=b.cost_centre_id) }}">{{ r.account.code }} {{ nm(r.account) }}</a>{% else %}{{ r.label }}{% endif %}</td>
        <td class="num">{{ r.budget|money(cur) }}</td>
        <td class="num">{{ r.actual|money(cur) }}</td>
        <td class="num {{ 'fav' if r.favourable and r.variance else 'unfav' if r.variance }}">{{ ('+' if r.variance > 0 else '') ~ r.variance|money(cur) if r.variance else '—' }}</td>
        <td class="num">{{ '%.0f'|format(r.pct) ~ '%' if r.pct is not none else '' }}</td>
        <td>{% if r.pct is not none and r.kind != 'section' %}<div class="meter {{ '' if r.favourable else 'over' }}"><span style="width: {{ [[r.pct, 0]|max, 100]|min|round(0) }}%"></span></div>{% endif %}</td>
      </tr>
      {% endif %}
    {% endfor %}
    </tbody>
  </table>
  <div class="notes">{{ t('Variance = actual − budget. Green is favourable (income above budget, costs below budget); red is unfavourable.') }}</div>
</div>
{% endblock %}