{% extends 'layouts/base.html' %}

{% block content %}

<div class="page-head">
    <h1>Sales Orders</h1>

    <div class="action-buttons">
        <button class="btn" type="button" data-sales-search-toggle aria-expanded="false">Show Search</button>
        {% if is_super_admin %}
        <button class="btn" type="button" onclick="document.getElementById('sales-column-panel').hidden = !document.getElementById('sales-column-panel').hidden">Customize Columns</button>
        {% endif %}
        {% if is_super_admin %}
        <a class="btn" href="{{ url_for('sales.export', **dict(filters.to_dict(), format='xlsx')) }}">Export XLSX</a>
        <a class="btn" href="{{ url_for('sales.export', **dict(filters.to_dict(), format='csv')) }}">Export CSV</a>
        <a class="btn" href="{{ url_for('sales.bulk_import') }}">Import</a>
        {% endif %}
        <a class="btn" href="{{ url_for('sales.create') }}">Create Order</a>
    </div>
</div>

{% if is_super_admin %}
<div class="panel" id="sales-column-panel" hidden>
    <form method="get">
        {% for key in filters.keys() if key != 'display_columns' %}
            {% for value in filters.getlist(key) %}<input type="hidden" name="{{ key }}" value="{{ value }}">{% endfor %}
        {% endfor %}
        <div class="table-wrap">
            <table class="modern-table column-picker-table">
                <thead><tr><th>Show</th><th>Column</th><th>Current State</th></tr></thead>
                <tbody>
                    {% for column in available_columns %}
                    <tr>
                        <td><input type="checkbox" name="display_columns" value="{{ column }}" {% if column in display_columns %}checked{% endif %}></td>
                        <td>{{ column.replace('_', ' ').title() }}</td>
                        <td><span class="badge {{ 'badge-success' if column in display_columns else 'badge-warning' }}">{{ 'Visible' if column in display_columns else 'Hidden' }}</span></td>
                    </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
        <div class="form-actions full-width">
            <button class="btn" type="submit">Apply Column Selection</button>
            <a class="btn btn-sm" href="{{ url_for('sales.index') }}">Reset</a>
        </div>
    </form>
</div>
{% endif %}

<div class="lead-search-strip">
    <div class="saved-searches">
        <strong>Saved searches</strong>
        {% for saved in saved_searches %}
        <span class="saved-search-item">
            <a href="{{ url_for('sales.run_saved_search', search_id=saved.id) }}">{{ saved.name }}</a>
            <form method="post" action="{{ url_for('sales.delete_saved_search', search_id=saved.id) }}">
                <button type="submit" title="Delete saved search" aria-label="Delete {{ saved.name }}">&times;</button>
            </form>
        </span>
        {% else %}
        <span class="muted">None yet</span>
        {% endfor %}
    </div>
    {% if active_filters %}
    <div class="active-search-summary"><strong>Showing:</strong> {{ active_filters|join(' · ') }}</div>
    <form method="post" action="{{ url_for('sales.save_search') }}" class="save-search-form">
        {% for key in filters.keys() if key in saved_search_keys %}
            {% for value in filters.getlist(key) %}<input type="hidden" name="{{ key }}" value="{{ value }}">{% endfor %}
        {% endfor %}
        <input name="name" placeholder="Name this search" maxlength="120" required>
        <button class="btn btn-sm" type="submit">Save Search</button>
    </form>
    {% endif %}
</div>

{% if team_totals %}
<section class="panel">
    <h2>Team Sales This Month</h2>
    <p class="muted">Sales booked in the current month by each member reporting to you.</p>
    <div class="table-wrap">
        <table class="modern-table">
            <thead>
                <tr>
                    <th>Team Member</th>
                    <th>Orders</th>
                    <th>Approved Amount</th>
                    <th>Pending Approval</th>
                    <th>Orders</th>
                </tr>
            </thead>
            <tbody>
                {% for member in team_summary %}
                <tr>
                    <td><strong>{{ member.name }}</strong>{% if member.is_manager %} <span class="badge">You</span>{% endif %}</td>
                    <td>{{ member.count }}</td>
                    <td>₹{{ '%.2f'|format(member.approved) }}</td>
                    <td>₹{{ '%.2f'|format(member.pending) }}</td>
                    <td><a class="btn btn-sm" href="{{ url_for('sales.index', owner_id=member.id) }}">View</a></td>
                </tr>
                {% endfor %}
            </tbody>
            <tfoot>
                <tr>
                    <th>Total Group Sales</th>
                    <th>{{ team_totals.count }}</th>
                    <th>₹{{ '%.2f'|format(team_totals.approved) }}</th>
                    <th>₹{{ '%.2f'|format(team_totals.pending) }}</th>
                    <th><a class="btn btn-sm" href="{{ url_for('sales.index') }}">All</a></th>
                </tr>
            </tfoot>
        </table>
    </div>
</section>
{% endif %}

<div class="panel" data-sales-search-panel hidden>
    <form method="get" class="form-grid">
        <div class="form-group">
            <label>Search</label>
            <input name="q" value="{{ filters.get('q', '') }}" placeholder="Customer, bank or notes">
        </div>

        <div class="form-group">
            <label>Payment Status</label>
            <select name="payment_status">
                <option value="">All</option>
                {% for s in payment_statuses %}
                <option value="{{ s }}" {% if filters.get('payment_status') == s %}selected{% endif %}>{{ s|title }}</option>
                {% endfor %}
            </select>
        </div>

        <div class="form-group">
            <label>Approval Status</label>
            <select name="approval_status">
                <option value="">All</option>
                {% for status in approval_statuses %}
                <option value="{{ status }}" {% if filters.get('approval_status') == status %}selected{% endif %}>{{ status|title }}</option>
                {% endfor %}
            </select>
        </div>

        {% if is_super_admin %}
        <div class="form-group">
            <label>Owner</label>
            <select name="owner_id">
                <option value="">All</option>
                {% for u in users %}
                <option value="{{ u.id }}" {% if filters.get('owner_id') == u.id|string %}selected{% endif %}>{{ u.name }}</option>
                {% endfor %}
            </select>
        </div>
        {% endif %}

        <div class="form-group">
            <label>Sale Date From</label>
            <input type="date" name="date_from" value="{{ filters.get('date_from', '') }}">
        </div>

        <div class="form-group">
            <label>Sale Date To</label>
            <input type="date" name="date_to" value="{{ filters.get('date_to', '') }}">
        </div>

        <div class="form-group">
            <label>Per Page</label>
            <select name="per_page">
                {% for n in per_page_choices %}
                <option value="{{ n }}" {% if per_page == n %}selected{% endif %}>{{ n }}</option>
                {% endfor %}
            </select>
        </div>

        <div class="form-actions full-width">
            <button class="btn" type="submit">Apply Filters</button>
            <a class="btn btn-sm" href="{{ url_for('sales.index') }}">Reset</a>
        </div>
    </form>
</div>

{% if is_super_admin %}
<form method="post" action="{{ url_for('sales.mass_action') }}" class="panel">
    <div class="bulkbar sales-bulkbar">
        <select name="action" data-sales-bulk-action aria-label="Bulk action">
            <option value="payment_status">Update Payment Status</option>
            <option value="approval_status">Update Approval Status</option>
            <option value="owner">Change Owner</option>
            <option value="delete">Delete</option>
        </select>

        <select data-sales-sort title="Sort sales orders" aria-label="Sort sales orders">
            <option value="id" {% if sort == 'id' %}selected{% endif %}>Sort: Newest</option>
            <option value="customer_name" {% if sort == 'customer_name' %}selected{% endif %}>Sort: Customer</option>
            <option value="sale_date" {% if sort == 'sale_date' %}selected{% endif %}>Sort: Date</option>
            <option value="amount" {% if sort == 'amount' %}selected{% endif %}>Sort: Amount</option>
            <option value="approval_status" {% if sort == 'approval_status' %}selected{% endif %}>Sort: Approval</option>
            <option value="payment_status" {% if sort == 'payment_status' %}selected{% endif %}>Sort: Payment</option>
            <option value="owner_name" {% if sort == 'owner_name' %}selected{% endif %}>Sort: Owner</option>
        </select>

        <select name="bulk_payment_status" data-sales-bulk-value="payment_status" aria-label="Payment status">
            {% for s in payment_statuses %}<option value="{{ s }}">{{ s|title }}</option>{% endfor %}
        </select>

        <select name="bulk_approval_status" data-sales-bulk-value="approval_status" aria-label="Approval status" hidden>
            {% for status in approval_statuses %}<option value="{{ status }}">{{ status|title }}</option>{% endfor %}
        </select>

        <select name="bulk_owner_id" data-sales-bulk-value="owner" aria-label="New owner" hidden>
            <option value="">Select Owner</option>
            {% for u in users %}<option value="{{ u.id }}">{{ u.name }}</option>{% endfor %}
        </select>

        <button class="btn danger" type="submit" data-sales-bulk-submit>Apply</button>
    </div>

    <p class="muted sales-list-summary">{{ total }} sales orders found - page {{ page }} of {{ pages }}</p>

    <div class="table-wrap">
        <table class="modern-table">
            <thead>
                <tr>
                    <th><input type="checkbox" onclick="document.querySelectorAll('input[name=sale_ids]').forEach(cb => cb.checked = this.checked)"></th>
                    {% if 'id' in display_columns %}<th>ID</th>{% endif %}
                    {% if 'customer_name' in display_columns %}<th>Customer</th>{% endif %}
                    {% if 'client_type' in display_columns %}<th>Client Type</th>{% endif %}
                    {% if 'sale_date' in display_columns %}<th>Date</th>{% endif %}
                    {% if 'amount' in display_columns %}<th>Amount</th>{% endif %}
                    {% if 'approval_status' in display_columns %}<th>Approval</th>{% endif %}
                    {% if 'payment_status' in display_columns %}<th>Payment</th>{% endif %}
                    {% if 'owner_name' in display_columns %}<th>Owner</th>{% endif %}
                    <th>Actions</th>
                </tr>
            </thead>
            <tbody>
                {% for s in sales %}
                <tr>
                    <td><input type="checkbox" name="sale_ids" value="{{ s.id }}"></td>
                    {% if 'id' in display_columns %}<td>#{{ s.id }}</td>{% endif %}
                    {% if 'customer_name' in display_columns %}<td>
                        <strong>{{ s.customer_name }}</strong>
                        {% if s.lead_name %}<br><small>Lead: {{ s.lead_name }}</small>{% endif %}
                    </td>{% endif %}
                    {% if 'client_type' in display_columns %}<td>{{ s.client_type or '-' }}</td>{% endif %}
                    {% if 'sale_date' in display_columns %}<td>{{ s.sale_date or '-' }}</td>{% endif %}
                    {% if 'amount' in display_columns %}<td>₹{{ s.amount or 0 }}</td>{% endif %}
                    {% if 'approval_status' in display_columns %}<td>
                        <span class="badge {{ 'badge-success' if s.approval_status == 'approved' else 'badge-danger' if s.approval_status == 'rejected' else 'badge-warning' }}">{{ s.approval_status }}</span>
                    </td>{% endif %}
                    {% if 'payment_status' in display_columns %}<td><span class="badge">{{ s.payment_status }}</span></td>{% endif %}
                    {% if 'owner_name' in display_columns %}<td>{{ s.owner_name or '-' }}</td>{% endif %}
                    <td>
                        <a class="btn btn-sm" href="{{ url_for('sales.detail', sale_id=s.id) }}">View</a>
                        <a class="btn btn-sm" href="{{ url_for('sales.edit', sale_id=s.id) }}">Edit</a>
                    </td>
                </tr>
                {% else %}
                <tr><td colspan="{{ display_columns|length + 2 }}" style="text-align:center;">No sales orders found.</td></tr>
                {% endfor %}
            </tbody>
        </table>
    </div>

    {% if pages > 1 %}
    <div class="bulkbar">
        {% if page > 1 %}
        <a class="btn btn-sm" href="{{ url_for('sales.index', **dict(filters.to_dict(), page=page - 1)) }}">Previous</a>
        {% endif %}
        <span class="muted">Page {{ page }} of {{ pages }}</span>
        {% if page < pages %}
        <a class="btn btn-sm" href="{{ url_for('sales.index', **dict(filters.to_dict(), page=page + 1)) }}">Next</a>
        {% endif %}
    </div>
    {% endif %}
</form>
{% else %}
<div class="panel">
    <div class="table-wrap">
        <table class="modern-table">
            <thead>
                <tr><th>ID</th><th>Customer</th><th>Mobile</th><th>Date</th><th>Amount</th><th>Approval</th><th>Payment</th><th>Action</th></tr>
            </thead>
            <tbody>
                {% for s in sales %}
                <tr>
                    <td>#{{ s.id }}</td>
                    <td><strong>{{ s.customer_name }}</strong></td>
                    <td>{{ s.lead_mobile }}</td>
                    <td>{{ s.sale_date or '-' }}</td>
                    <td>₹{{ s.amount or 0 }}</td>
                    <td>
                        <span class="badge {{ 'badge-success' if s.approval_status == 'approved' else 'badge-danger' if s.approval_status == 'rejected' else 'badge-warning' }}">{{ s.approval_status }}</span>
                    </td>
                    <td><span class="badge">{{ s.payment_status }}</span></td>
                    <td><a class="btn btn-sm" href="{{ url_for('sales.detail', sale_id=s.id) }}">View</a></td>
                </tr>
                {% else %}
                <tr><td colspan="8" style="text-align:center;">You have not created any sales orders.</td></tr>
                {% endfor %}
            </tbody>
        </table>
    </div>
</div>
{% endif %}

{% endblock %}