forked from marquez.juan/clase-10-ejercicios-de-repaso
ejercicio 6: tabla dinamica de empleados
This commit is contained in:
@@ -1 +1,50 @@
|
||||
// Agregar aquí el código javascript
|
||||
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();
|
||||
|
||||
Reference in New Issue
Block a user