{% extends "base.html" %}
{% block title %}Dashboard - Cable Operator{% endblock %}

{% block content %}
<div class="jumbotron pt-4 pb-4"> <!-- Reduced padding for jumbotron -->
    <!-- Greeting removed -->
    <p class="lead mb-0">Quick overview of your customer payments.</p> <!-- Adjusted lead text -->
</div>

<div class="row">
    <div class="col-md-3">
        <div class="card text-white bg-primary mb-3">
            <div class="card-header"><i class="fas fa-users"></i> Total Customers</div> <!-- Icon Added -->
            <div class="card-body">
                <h5 class="card-title">{{ total_customers_count }}</h5>
            </div>
        </div>
    </div>
    <div class="col-md-3">
        <div class="card text-white bg-success mb-3">
            <div class="card-header"><i class="fas fa-user-check"></i> Active Customers</div> <!-- Icon Added -->
            <div class="card-body">
                <h5 class="card-title">{{ active_customers_count }}</h5>
            </div>
        </div>
    </div>
    <div class="col-md-3">
        <div class="card text-white bg-warning mb-3">
            <div class="card-header"><i class="fas fa-exclamation-triangle"></i> Outstanding ({{ current_billing_period_display }})</div> <!-- Icon Added -->
            <div class="card-body">
                <h5 class="card-title">{{ outstanding_payments_count }}</h5>
            </div>
        </div>
    </div>
    <div class="col-md-3">
        <div class="card text-white bg-info mb-3">
            <div class="card-header"><i class="fas fa-rupee-sign"></i> Collections Today</div> <!-- Icon Added -->
            <div class="card-body">
                <h5 class="card-title">₹ {{ "%.2f"|format(collections_today) }}</h5>
            </div>
        </div>
    </div>
</div>

<div class="mt-4">
    <h3>Quick Actions</h3>
    <a href="{{ url_for('add_customer') }}" class="btn btn-lg btn-primary mr-2 mb-2"><i class="fas fa-user-plus"></i> Add Customer</a>
    <a href="{{ url_for('record_payment') }}" class="btn btn-lg btn-success mr-2 mb-2"><i class="fas fa-file-invoice-dollar"></i> Record Payment</a>
    <a href="{{ url_for('reports_page') }}" class="btn btn-lg btn-secondary mb-2"><i class="fas fa-chart-line"></i> View Reports</a>
</div>
<hr>

<!-- Customer Payment Status List -->
<div class="mt-4">
    <div class="d-flex justify-content-between align-items-center mb-3">
        <h3>Customer Payment Status (for {{ current_billing_period_display }})</h3>
        <!-- Search Form for Homepage List -->
        <form method="GET" action="{{ url_for('index') }}" class="form-inline">
            <div class="input-group">
                <input type="text" class="form-control form-control-sm" name="search_home" placeholder="Search Name or STB No." value="{{ search_term_home if search_term_home }}">
                <div class="input-group-append">
                    <button class="btn btn-sm btn-outline-secondary" type="submit"><i class="fas fa-search"></i></button>
                </div>
            </div>
             {% if search_term_home %}
                <a href="{{ url_for('index') }}" class="btn btn-sm btn-outline-info ml-2">Clear</a>
            {% endif %}
        </form>
        <!-- END Search Form -->
    </div>

    {% if customers_list_on_home %}
    <div class="table-responsive">
        <table class="table table-striped table-hover table-sm">
            <thead>
                <tr>
                    <th>Name</th>
                    <th>STB No.</th>
                    <th>Monthly Charge</th>
                    <th>Account Status</th>
                    <th>Payment ({{ current_billing_period_display }})</th>
                    <th>Actions</th>
                </tr>
            </thead>
            <tbody>
                {% for customer_info in customers_list_on_home %}
                <tr>
                    <td>{{ customer_info.name }}</td>
                    <td>{{ customer_info.set_top_box_number }}</td>
                    <td>₹ {{ "%.2f"|format(customer_info.monthly_charge) }}</td>
                    <td>
                        <span class="badge badge-{% if customer_info.status == 'Active' %}success{% elif customer_info.status == 'Inactive' %}secondary{% else %}warning{% endif %}">
                            {{ customer_info.status }}
                        </span>
                    </td>
                    <td>
                        {% if customer_info.paid_current_month %}
                            <span class="badge badge-success"><i class="fas fa-check-circle"></i> Received</span>
                        {% else %}
                            {% if customer_info.status == 'Active' %}
                                <span class="badge badge-danger"><i class="fas fa-times-circle"></i> Pending</span>
                            {% else %}
                                <span class="badge badge-secondary">- (Inactive) -</span>
                            {% endif %}
                        {% endif %}
                    </td>
                    <td>
                        {% if customer_info.status == 'Active' and not customer_info.paid_current_month %}
                         <a href="{{ url_for('record_payment', customer_id_prefill=customer_info.id) }}" class="btn btn-xs btn-success" title="Record Payment"><i class="fas fa-dollar-sign"></i></a>
                        {% endif %}
                        <a href="{{ url_for('edit_customer', customer_id=customer_info.id) }}" class="btn btn-xs btn-info ml-1" title="Edit Customer"><i class="fas fa-edit"></i></a>
                    </td>
                </tr>
                {% endfor %}
            </tbody>
        </table>
    </div>
    {% else %}
        {% if search_term_home %}
            <p>No customers found matching "<strong>{{ search_term_home }}</strong>". <a href="{{ url_for('index') }}">Clear search</a>.</p>
        {% else %}
            <p>No customers found. <a href="{{ url_for('add_customer') }}">Add one now!</a></p>
        {% endif %}
    {% endif %}
</div>
{% endblock %}