{% extends "base.html" %}
{% from "_macros.html" import icon with context %}
{% from "insights/_parts.html" import month_bars, change with context %}
{% block title %}{{ t('Purchases Overview') }}{% endblock %}
{% block content %}
<div class="page-head"><div><h1>{{ t('Purchases Overview') }}</h1>
  <div class="dash-sub"><span>{{ t('Fiscal year from') }} {{ fys }}</span><span>·</span><span>{{ t('Amounts in') }} {{ currency }}</span><span>·</span><span>{{ t('Excluding VAT') }}</span></div></div>
  {% if can_write %}<div class="actions">{% if has('inventory') %}<a class="btn ghost" href="{{ url_for('inventory.reorder') }}">{{ icon('refresh') }}{{ t('Reorder Suggestions') }}</a>{% endif %}
    <a class="btn" href="{{ url_for('invoices.form', kind='in_invoice') }}">{{ icon('file-in') }}{{ t('Vendor Bill') }}</a></div>{% endif %}
</div>
<div class="kpis">
  <div class="kpi"><div class="top"><span class="label">{{ t('Purchases this month') }}</span><span class="ibox t-amber">{{ icon('cart') }}</span></div>
    <div class="value num">{{ this_m|money(currency) }}<small>{{ currency }}</small></div><div class="sub">{{ change(this_m, last_m) }}</div></div>
  <div class="kpi"><div class="top"><span class="label">{{ t('Purchases (YTD)') }}</span><span class="ibox t-blue">{{ icon('chart') }}</span></div>
    <div class="value num">{{ ytd|money(currency) }}<small>{{ currency }}</small></div><div class="sub">{{ t('Vendor bills less refunds') }}</div></div>
  <a class="kpi" href="{{ url_for('reports.aged', side='payable') }}"><div class="top"><span class="label">{{ t('Payables') }}</span><span class="ibox t-indigo">{{ icon('file-in') }}</span></div>
    <div class="value num">{{ pay|money(currency) }}<small>{{ currency }}</small></div><div class="sub">{{ pay_n }} {{ t('open bills') }}</div></a>
  <a class="kpi {{ 'alert' if over }}" href="{{ url_for('reports.aged', side='payable') }}"><div class="top"><span class="label">{{ t('Due in the next 7 days') }}</span><span class="ibox t-red">{{ icon('clock') }}</span></div>
    <div class="value num">{{ due7|money(currency) }}<small>{{ currency }}</small></div>
    <div class="sub">{% if over %}<span class="delta bad">{{ over|money(currency) }}</span>{{ t('overdue') }} ({{ over_n }}){% else %}{{ due7_n }} {{ t('bills') }}{% endif %}</div></a>
</div>
<div class="stat-row">
  {% if has('procurement') %}<a class="stat" href="{{ url_for('orders.index', kind='purchase', state='to_approve') }}"><span class="ibox t-amber">{{ icon('check') }}</span>
    <div><div class="l">{{ t('Purchase orders waiting approval') }}</div><div class="v num">{{ po_open }}</div></div><div class="r">→</div></a>{% endif %}
  {% if has('inventory') %}<a class="stat" href="{{ url_for('inventory.pickings', kind='in', state='ready') }}"><span class="ibox t-green">{{ icon('down') }}</span>
    <div><div class="l">{{ t('Receipts to process') }}</div><div class="v num">{{ to_receive }}</div></div><div class="r">→</div></a>{% endif %}
  <a class="stat" href="{{ url_for('insights.forecast') }}"><span class="ibox t-blue">{{ icon('wallet') }}</span>
    <div><div class="l">{{ t('13-Week Cash Forecast') }}</div><div class="v">{{ t('Can we pay on time?') }}</div></div><div class="r">→</div></a>
</div>
<div class="two-col">
  <div class="card flush" style="overflow:visible">
    <div class="card-h"><h2>{{ t('Purchases by month') }}</h2></div>
    {{ month_bars(months, series, peak, scale, currency, 'Purchases') }}
  </div>
  <div class="card flush">
    <div class="card-h"><h2>{{ t('Top vendors (YTD)') }}</h2></div>
    <table><tbody>
    {% for r in top %}<tr><td><a href="{{ partner_url(r.id, True) }}">{{ r.label }}</a></td><td class="num">{{ r.value|money(currency) }}</td></tr>
    {% else %}<tr><td class="empty">{{ t('Nothing yet.') }}</td></tr>{% endfor %}</tbody></table>
  </div>
</div>
<div class="card flush">
  <div class="card-h"><h2>{{ t('Supplier Performance') }} <small>({{ t('last 12 months') }})</small></h2><a class="link" href="{{ url_for('insights.suppliers') }}">{{ t('View all') }} →</a></div>
  {% include "insights/_perf_table.html" %}
</div>
{% endblock %}