document.addEventListener("DOMContentLoaded", function () {
    cargarAtenciones();
    document.getElementById("formAtencion").addEventListener("submit", function (e) {
        e.preventDefault();
        agregarAtencion();
    });
});

function cargarAtenciones() {
    fetch("php/backend.php?action=listar")
        .then(response => response.json())
        .then(data => {
            let tbody = document.getElementById("tablaAtenciones");
            tbody.innerHTML = "";

            data.forEach(atencion => {
                tbody.innerHTML += `
                    <tr>
                        <td>${atencion.id_atencion}</td>
                        <td>${atencion.fecha_atencion}</td>
                        <td>${atencion.hora_atencion}</td>
                        <td>${atencion.diagnostico_cie10}</td>
                        <td>${atencion.tratamiento}</td>
                        <td>
                            <button class="btn btn-danger btn-sm" onclick="eliminarAtencion(${atencion.id_atencion})">🗑</button>
                        </td>
                    </tr>`;
            });
        });
}

function agregarAtencion() {
    let data = { fecha_atencion: document.getElementById("fecha_atencion").value };
    
    fetch("php/backend.php?action=agregar", { method: "POST", body: JSON.stringify(data) })
        .then(() => cargarAtenciones());
}
