{% extends "pos/base.html" %}
{% load static %}

{% block title %}Bug Recovery — Duplicate Stock Entries{% endblock %}
{% block heading %}Bug Recovery — Duplicate Stock History Entries{% endblock %}

{% block stylesheets %}
<style>
    .badge-keep { background:#d1fae5; color:#065f46; padding:3px 8px; border-radius:4px; font-weight:600; font-size:.85rem; }
    .badge-delete { background:#fee2e2; color:#991b1b; padding:3px 8px; border-radius:4px; font-weight:600; font-size:.85rem; }
    .badge-unknown { background:#fef3c7; color:#92400e; padding:3px 8px; border-radius:4px; font-weight:600; font-size:.85rem; }
    .summary-card { background:#f8fafc; border:1px solid #e2e8f0; border-radius:8px; padding:16px 20px; margin-bottom:16px; }
    .summary-card h5 { margin:0 0 4px 0; }
    .summary-card .num { font-size:1.5rem; font-weight:700; }
    .row-delete { background:#fef2f2 !important; }
    .row-keep { background:#f0fdf4 !important; }
</style>
{% endblock %}

{% block content %}
<div class="row mb-3">
    <div class="col-md-4">
        <div class="summary-card">
            <h5 class="text-muted">Affected Bills</h5>
            <div class="num text-primary">{{ total_bills }}</div>
        </div>
    </div>
    <div class="col-md-4">
        <div class="summary-card">
            <h5 class="text-muted">Duplicate Entries to Delete</h5>
            <div class="num text-danger">{{ total_duplicates }}</div>
        </div>
    </div>
    <div class="col-md-4">
        <div class="summary-card d-flex align-items-center justify-content-center">
            {% if total_duplicates > 0 %}
                <button id="btnDelete" class="btn btn-danger btn-lg" onclick="doDelete()">
                    Delete {{ total_duplicates }} Duplicate Entries
                </button>
            {% else %}
                <span class="text-success fw-bold fs-5">No duplicates found!</span>
            {% endif %}
        </div>
    </div>
</div>

<div class="card">
    <div class="card-body p-2">
        <div class="table-responsive">
            <table class="table table-bordered table-hover table-sm mb-0">
                <thead>
                    <tr style="background:#f2f6fc;">
                        <th>Bill No</th>
                        <th>Product</th>
                        <th>Code</th>
                        <th>Date</th>
                        <th class="text-end">Changed Stock</th>
                        <th class="text-end">Bonus</th>
                        <th class="text-center">History Cat</th>
                        <th class="text-center">Payment Cat</th>
                        <th class="text-center">Action</th>
                    </tr>
                </thead>
                <tbody>
                    {% for r in rows %}
                    <tr class="{% if r.action == 'DELETE' %}row-delete{% elif r.action == 'KEEP' %}row-keep{% endif %}">
                        <td>{{ r.bill_no }}</td>
                        <td>{{ r.product_name }}</td>
                        <td>{{ r.product_code }}</td>
                        <td>{{ r.date }}</td>
                        <td class="text-end">{{ r.changed_stock }}</td>
                        <td class="text-end">{{ r.bonus_stock }}</td>
                        <td class="text-center">{{ r.sh_category }}</td>
                        <td class="text-center">{{ r.correct_category }}</td>
                        <td class="text-center">
                            {% if r.action == 'KEEP' %}
                                <span class="badge-keep">KEEP</span>
                            {% elif r.action == 'DELETE' %}
                                <span class="badge-delete">DELETE</span>
                            {% else %}
                                <span class="badge-unknown">{{ r.action }}</span>
                            {% endif %}
                        </td>
                    </tr>
                    {% empty %}
                    <tr><td colspan="9" class="text-center text-muted py-3">No duplicate entries found.</td></tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
    </div>
</div>
{% endblock %}

{% block javascripts %}
<script>
function getCookie(name){
    let c=null;
    document.cookie.split(';').forEach(v=>{
        v=v.trim();
        if(v.startsWith(name+'=')) c=decodeURIComponent(v.slice(name.length+1));
    });
    return c;
}

function doDelete(){
    const ids = {{ delete_ids|safe }};
    if(!ids.length){ alert('Nothing to delete'); return; }
    
    if(!confirm('Are you sure you want to delete ' + ids.length + ' duplicate entries?\n\nThis action cannot be undone.')){
        return;
    }

    const btn = document.getElementById('btnDelete');
    btn.disabled = true;
    btn.textContent = 'Deleting...';

    fetch("{% url 'reports:sale_stock_bug_recovery_delete' %}", {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
            'X-CSRFToken': getCookie('csrftoken'),
        },
        body: JSON.stringify({ids: ids})
    })
    .then(r => r.json())
    .then(data => {
        if(data.status === 'ok'){
            alert('Successfully deleted ' + data.deleted + ' duplicate entries.');
            location.reload();
        } else {
            alert('Error: ' + (data.message || 'Unknown error'));
            btn.disabled = false;
            btn.textContent = 'Delete ' + ids.length + ' Duplicate Entries';
        }
    })
    .catch(err => {
        alert('Request failed: ' + err);
        btn.disabled = false;
        btn.textContent = 'Delete ' + ids.length + ' Duplicate Entries';
    });
}
</script>
{% endblock %}