document.getElementById("year").addEventListener("change", function () {
    const year = this.value;

    const downloadBtn = document.getElementById("downloadBtn");
    const previewDiv = document.getElementById("preview");
    const contentDiv = document.getElementById("previewContent");

    if (!year) {
        downloadBtn.style.display = "none";
        previewDiv.style.display = "none";
        contentDiv.innerHTML = "";
        return;
    }

    downloadBtn.href = `/summary/download?year=${year}`;
    downloadBtn.style.display = "inline-block";

    fetch(`/summary/preview?year=${year}`)
        .then(res => res.json())
        .then(data => {
            let html = `<table>
                            <thead>
                                <tr>
                                    <th>Particular</th>
                                    <th>ITR</th>
                                    <th>AO</th>
                                    <th>CIT</th>
                                    <th>ITAT</th>
                                </tr>
                            </thead>
                            <tbody>`;

            data.forEach(row => {
                html += `<tr>
                            <td>${row.Particular}</td>
                            <td>${row.ITR}</td>
                            <td>${row.AO}</td>
                            <td>${row.CIT}</td>
                            <td>${row.ITAT}</td>
                         </tr>`;
            });

            html += `</tbody></table>`;
            contentDiv.innerHTML = html;

            // Show preview
            previewDiv.style.display = "block";
        })
        .catch(err => console.error("Preview load error:", err));
});