{% extends "base.html" %}

{% block title %}Customers{% endblock %}
{% block page_title %}Customers{% endblock %}
{% block page_subtitle %}Manage customer records for {{ SHOP_NAME }}{% endblock %}

{% block content %}
{% include "partials/breadcrumb.html" %}

<div class="toolbar-tablet">
    <form method="get" class="toolbar-tablet-filters">
        {{ form.q }}
        {{ form.active }}
        <button type="submit" class="btn-secondary">Filter</button>
        <a href="{% url 'customers:list' %}" class="btn-secondary">Clear</a>
    </form>
    {% if can_manage %}
    <div class="toolbar-tablet-actions">
        <a href="{% url 'customers:export' %}?{{ request.GET.urlencode }}" class="btn-secondary">Export CSV</a>
        <a href="{% url 'customers:create' %}" class="btn-primary">Add Customer</a>
    </div>
    {% endif %}
</div>

<div class="table-scroll-card card">
    {% if page_obj.object_list %}
    <div class="table-scroll">
    <table>
        <thead>
            <tr>
                <th>Name</th><th>Mobile</th><th>WhatsApp</th><th>Alternate</th><th>Address</th>
                <th>Orders</th><th>Active</th><th>Created</th><th>Actions</th>
            </tr>
        </thead>
        <tbody>
            {% for customer in page_obj %}
            <tr>
                <td>{{ customer.name }}</td>
                <td>{{ customer.mobile_number }}</td>
                <td>{{ customer.whatsapp_number }}</td>
                <td>{{ customer.alternate_number|default:"—" }}</td>
                <td>{{ customer.address_preview }}</td>
                <td>{{ customer.order_count }}</td>
                <td>{% if customer.active %}Yes{% else %}No{% endif %}</td>
                <td>{{ customer.created_at|date:"d M Y" }}</td>
                <td>
                    <a href="{% url 'customers:detail' customer.pk %}" class="table-action-link text-brand-600">View</a>
                    {% if can_manage %}
                    <a href="{% url 'customers:edit' customer.pk %}" class="table-action-link text-brand-600">Edit</a>
                    {% endif %}
                    {% if can_book_order and customer.active %}
                    <a href="{% url 'orders:create' %}?customer_id={{ customer.pk }}" class="table-action-link text-brand-600">Book Order</a>
                    {% endif %}
                    {% if can_manage %}
                    {% if customer.active %}
                    <a href="{% url 'customers:deactivate' customer.pk %}" class="table-action-link text-red-600">Deactivate</a>
                    {% endif %}
                    {% endif %}
                </td>
            </tr>
            {% endfor %}
        </tbody>
    </table>
    </div>
    {% else %}
    {% include "partials/empty_state.html" with title="No customers found" message="Add your first customer to get started." action_url="/customers/create/" action_label="Add Customer" %}
    {% endif %}
</div>
{% include "partials/pagination.html" %}
{% endblock %}