{% extends 'base.html' %}
{% load static %}
{% block title %}Financial Report - Rapha-Bethel BNPS{% endblock %}
{% block content %}
<div class="container-fluid">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <div><h1 class="h3 mb-0">Financial Report</h1><p class="text-muted">{{ from_date }} to {{ to_date }}</p></div>
        <a href="{% url 'reports:export_financial_report' %}?from_date={{ from_date }}&to_date={{ to_date }}" class="btn btn-outline-primary"><i class="fas fa-download me-2"></i>Export CSV</a>
    </div>

    <div class="card shadow mb-4">
        <div class="card-body">
            <form method="get" class="row g-3 align-items-end">
                <div class="col-md-4"><label class="form-label">From Date</label><input type="date" name="from_date" class="form-control" value="{{ from_date }}"></div>
                <div class="col-md-4"><label class="form-label">To Date</label><input type="date" name="to_date" class="form-control" value="{{ to_date }}"></div>
                <div class="col-md-4"><button type="submit" class="btn btn-primary w-100"><i class="fas fa-filter me-1"></i>Filter</button></div>
            </form>
        </div>
    </div>

    <div class="row mb-4">
        <div class="col-md-4"><div class="card border-left-success shadow h-100 py-2"><div class="card-body"><div class="text-xs font-weight-bold text-success text-uppercase mb-1">Total Revenue</div><div class="h4 fw-bold">{{ total_revenue|floatformat:0 }} XAF</div></div></div></div>
        <div class="col-md-4"><div class="card border-left-danger shadow h-100 py-2"><div class="card-body"><div class="text-xs font-weight-bold text-danger text-uppercase mb-1">Total Expenses</div><div class="h4 fw-bold">{{ total_expenses|floatformat:0 }} XAF</div></div></div></div>
        <div class="col-md-4"><div class="card border-left-{% if net_profit >= 0 %}primary{% else %}warning{% endif %} shadow h-100 py-2"><div class="card-body"><div class="text-xs font-weight-bold text-uppercase mb-1">Net Profit</div><div class="h4 fw-bold {% if net_profit >= 0 %}text-primary{% else %}text-warning{% endif %}">{{ net_profit|floatformat:0 }} XAF</div></div></div></div>
    </div>

    <div class="row">
        <div class="col-md-6">
            <div class="card shadow mb-4">
                <div class="card-header py-3"><h6 class="m-0 font-weight-bold text-success">Revenue by Payment Method</h6></div>
                <div class="card-body p-0">
                    <table class="table mb-0">
                        <thead class="table-light"><tr><th>Method</th><th class="text-end">Amount (XAF)</th></tr></thead>
                        <tbody>
                            {% for item in by_method %}
                            <tr><td>{{ item.method }}</td><td class="text-end fw-bold text-success">{{ item.total|floatformat:0 }}</td></tr>
                            {% empty %}
                            <tr><td colspan="2" class="text-center text-muted py-3">No data</td></tr>
                            {% endfor %}
                            <tr class="table-success fw-bold"><td>Total</td><td class="text-end">{{ total_revenue|floatformat:0 }}</td></tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
        <div class="col-md-6">
            <div class="card shadow mb-4">
                <div class="card-header py-3"><h6 class="m-0 font-weight-bold text-danger">Expenses by Category</h6></div>
                <div class="card-body p-0">
                    <table class="table mb-0">
                        <thead class="table-light"><tr><th>Category</th><th class="text-end">Amount (XAF)</th></tr></thead>
                        <tbody>
                            {% for item in by_category %}
                            <tr><td>{{ item.category }}</td><td class="text-end fw-bold text-danger">{{ item.total|floatformat:0 }}</td></tr>
                            {% empty %}
                            <tr><td colspan="2" class="text-center text-muted py-3">No expenses recorded</td></tr>
                            {% endfor %}
                            <tr class="table-danger fw-bold"><td>Total</td><td class="text-end">{{ total_expenses|floatformat:0 }}</td></tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}