const empleados = [
    { nombre: 'Ana', sector: 'Desarrollo', sueldo: 150000 },
    { nombre: 'Luis', sector: 'Diseño', sueldo: 120000 },
    { nombre: 'Marta', sector: 'Desarrollo', sueldo: 160000 },
    { nombre: 'Carlos', sector: 'RRHH', sueldo: 110000 },
    { nombre: 'Julia', sector: 'Diseño', sueldo: 130000 }
];

const tablaEmpleados = document.getElementById('tabla-empleados');
const cuerpoTabla = tablaEmpleados.querySelector('tbody');
const pieTabla = tablaEmpleados.querySelector('tfoot');

function formatearSueldo(valor) {
    return `$${valor.toLocaleString('es-AR')}`;
}

function renderizarTabla() {
    cuerpoTabla.innerHTML = '';
    let totalSueldo = 0;

    empleados.forEach((empleado) => {
        const fila = document.createElement('tr');

        const celdaNombre = document.createElement('td');
        celdaNombre.textContent = empleado.nombre;

        const celdaSector = document.createElement('td');
        celdaSector.textContent = empleado.sector;

        const celdaSueldo = document.createElement('td');
        celdaSueldo.textContent = formatearSueldo(empleado.sueldo);

        fila.appendChild(celdaNombre);
        fila.appendChild(celdaSector);
        fila.appendChild(celdaSueldo);
        cuerpoTabla.appendChild(fila);

        totalSueldo += empleado.sueldo;
    });

    const promedio = Math.round(totalSueldo / empleados.length);
    pieTabla.innerHTML = `
        <tr>
            <td colspan="2"><strong>Sueldo promedio</strong></td>
            <td><strong>${formatearSueldo(promedio)}</strong></td>
        </tr>
    `;
}

renderizarTabla();