{% extends "ledger/base.html" %}
{% load ledger_extras %}
{% block title %}{{ group.name }} · tripsplit{% endblock %}
{% block content %}
<div class="toolbar">
  <div><h1>{{ group.name }}</h1><p class="sub" style="margin:0">{{ group.members.count }} people{% if group.start_date %} · from {{ group.start_date|date:"j M Y" }}{% endif %}</p></div>
  <span class="spacer"></span>
  <a class="btn secondary" href="?mode={% if mode == 'converted' %}original{% else %}converted{% endif %}">
    {% if mode == 'converted' %}Show per original currency{% else %}Show converted to {{ group.base_currency }}{% endif %}</a>
  <a class="btn" href="{% url 'expense_add' group.id %}">Add expense</a>
</div>
<div class="grid">
{% for b in blocks %}
  <div class="card bars">
    <h2>Balances {% if mode == 'original' or blocks|length > 1 %}<span class="pill">{{ b.currency }}</span>{% endif %}</h2>
    {% for member, v in b.rows %}
      <div class="line">
        <a href="{% url 'member_detail' group.id member.id %}">{{ member.name }}</a>
        <div class="track"><div class="fill {% if v >= 0 %}pos{% else %}neg{% endif %}" style="width:{% widthratio v|absval b.peak 50 %}%"></div></div>
        <span class="num {% if v > 0 %}pos{% elif v < 0 %}neg{% endif %}" style="text-align:right">{{ v|money:b.currency }}</span>
      </div>
    {% endfor %}
    <p class="muted" style="margin-bottom:0">Green: is owed. Red: owes.</p>
  </div>
  <div class="card">
    <h2>Settle-up plan {% if mode == 'original' or blocks|length > 1 %}<span class="pill">{{ b.currency }}</span>{% endif %}</h2>
    {% include "ledger/_plan.html" with transfers=b.optimal_transfers %}
    <p class="muted" style="margin-bottom:0">
      {{ b.optimal|length }} transfer{{ b.optimal|length|pluralize }} (minimum)
      {% if b.savings_vs_greedy %}· saves {{ b.savings_vs_greedy }} vs greedy{% endif %}
      {% if b.savings_vs_pairwise %}· {{ b.savings_vs_pairwise }} fewer than {{ b.pairwise|length }} raw pairwise debts{% endif %}.
      <a href="{% url 'settle' group.id %}">Settle up</a></p>
  </div>
{% endfor %}
</div>
<div class="grid" style="margin-top:18px">
  <div class="card">
    <h2>Recent expenses</h2>
    <table>
    {% for e in expenses %}
      <tr><td><a href="{% url 'expense_detail' group.id e.id %}">{{ e.description }}</a><div class="muted">{{ e.date|date:"j M" }} · {{ e.get_category_display }}</div></td>
          <td class="num">{{ e.amount|dec:e.currency }}{% if e.currency != group.base_currency %}<div class="muted">≈ {{ e.amount|mul:e.fx_rate|dec:group.base_currency }}</div>{% endif %}</td></tr>
    {% empty %}<tr><td class="muted">No expenses yet.</td></tr>{% endfor %}
    </table>
  </div>
  <div class="card">
    <h2>Recent activity</h2>
    <table>
    {% for a in activities %}<tr><td><strong>{{ a.actor }}</strong> {{ a.text }}<div class="muted">{{ a.created_at|timesince }} ago</div></td></tr>
    {% empty %}<tr><td class="muted">Nothing yet.</td></tr>{% endfor %}
    </table>
    <p class="muted" style="margin-bottom:0"><a href="{% url 'activity' group.id %}">Full log and undo</a> · <a href="{% url 'export_csv' group.id %}">Export CSV</a></p>
  </div>
</div>
{% endblock %}