{% extends "base.html" %}
{% block content %}
<div class="container py-4">
    <div class="d-flex justify-content-between align-items-center mb-3">
        <h2 class="mb-0"><i class="fas fa-file-invoice"></i> Bills</h2>
        <div>
            <a href="{{ url_for('reports.generate_bill') }}" class="btn btn-success me-2">+ New Bill</a>
            <a href="{{ url_for('reports.generate_jambo_bill') }}" class="btn btn-primary">+ New Jambo Bill</a>
        </div>
    </div>
    <!-- Roman Urdu: Real-time search input add kiya -->
    <div class="mb-3">
        <input type="text" id="billSearchInput" class="form-control" placeholder="Search Bill No, Date, Customer, Type...">
    </div>
    <div class="card">
        <div class="card-body">
            <table class="table table-bordered table-hover" id="billsTable">
                <thead>
                    <tr>
                        <th>Bill No</th>
                        <th>Type</th>
                        <th>Date</th>
                        <th>Customer Name</th>
                        <th>QTY</th>
                        <th>Actions</th>
                    </tr>
                </thead>
                <tbody>
                    {% for bill in bills %}
                    <tr>
                        <td>{{ bill.bill_no }}</td>
                        <td>
                            {% if bill.bill_type == 'Jambo' %}
                                <span class="badge bg-primary">{{ bill.bill_type }}</span>
                            {% else %}
                                <span class="badge bg-success">{{ bill.bill_type }}</span>
                            {% endif %}
                        </td>
                        <td>{{ bill.date }}</td>
                        <td>{{ bill.customer_name }}</td>
                        <td>{{ bill.qty_display }}</td>
                        <td>
                            {% if bill.bill_type == 'Jambo' %}
                                <!-- Jambo Bill Actions -->
                                <button class="btn btn-sm btn-info" onclick="viewJamboBill('{{ bill.bill_no }}')">
                                    <i class="fas fa-eye"></i> View
                                </button>
                                <button class="btn btn-sm btn-primary" onclick="printJamboBill('{{ bill.bill_no }}')">
                                    <i class="fas fa-print"></i> Print
                                </button>
                                <a href="{{ url_for('reports.edit_jambo_bill', bill_no=bill.bill_no) }}" class="btn btn-sm btn-warning text-white">
                                    <i class="fas fa-edit"></i> Edit
                                </a>
                                <button class="btn btn-sm btn-danger" onclick="deleteJamboBill('{{ bill.bill_no }}')">
                                    <i class="fas fa-trash"></i> Delete
                                </button>
                            {% else %}
                                <!-- Normal Bill Actions -->
                                <a href="{{ url_for('reports.view_bill', bill_no=bill.bill_no) }}" class="btn btn-sm btn-info">
                                    <i class="fas fa-eye"></i> View
                                </a>
                                <button class="btn btn-sm btn-primary" onclick="printBill('{{ bill.bill_no }}')">
                                    <i class="fas fa-print"></i> Print
                                </button>
                                <a href="{{ url_for('reports.edit_bill', bill_no=bill.bill_no) }}" class="btn btn-sm btn-warning text-white">
                                    <i class="fas fa-edit"></i> Edit
                                </a>
                                <button class="btn btn-sm btn-danger" onclick="deleteBill('{{ bill.bill_no }}')">
                                    <i class="fas fa-trash"></i> Delete
                                </button>
                            {% endif %}
                        </td>
                    </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
    </div>
</div>

<script>
// Roman Urdu: Real-time search function
const searchInput = document.getElementById('billSearchInput');
const table = document.getElementById('billsTable');
searchInput.addEventListener('input', function() {
    const filter = this.value.toLowerCase();
    const rows = table.querySelectorAll('tbody tr');
    rows.forEach(row => {
        const text = row.textContent.toLowerCase();
        row.style.display = text.includes(filter) ? '' : 'none';
    });
});

// Normal bill functions
function printBill(billNo) {
    window.open("{{ url_for('reports.view_bill', bill_no='') }}" + billNo, '_blank');
}

function deleteBill(billNo) {
    if (confirm('Are you sure you want to delete Bill ' + billNo + '?')) {
        window.location.href = '/reports/bills/delete/' + billNo;
    }
}

// Jambo bill functions
function viewJamboBill(billNo) {
    window.open('/reports/jambo-bills/' + billNo, '_blank');
}

function printJamboBill(billNo) {
    window.open('/reports/jambo-bills/' + billNo, '_blank');
}

function deleteJamboBill(billNo) {
    if (confirm('Are you sure you want to delete Jambo Bill ' + billNo + '?')) {
        if (confirm('This will permanently delete the jambo bill. Continue?')) {
            window.location.href = '/reports/jambo-bills/delete/' + billNo;
        }
    }
}
</script>
{% endblock %}