diff --git a/ejercicio6/ejercicio6.js b/ejercicio6/ejercicio6.js index 6ce9e92..410d942 100644 --- a/ejercicio6/ejercicio6.js +++ b/ejercicio6/ejercicio6.js @@ -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 = ` + + Sueldo promedio + ${formatearSueldo(promedio)} + + `; +} + +renderizarTabla(); diff --git a/ejercicio6/estilo.css b/ejercicio6/estilo.css index 159b7f6..5afaa99 100644 --- a/ejercicio6/estilo.css +++ b/ejercicio6/estilo.css @@ -1,2 +1,28 @@ /* Agregar el código CSS necesario para el ejercicio */ +body { + font-family: Arial, sans-serif; + margin: 20px; +} + +table { + border-collapse: collapse; + width: 100%; + max-width: 600px; +} + +th, +td { + border: 1px solid #ccc; + padding: 8px 12px; + text-align: left; +} + +th { + background-color: #f4f4f4; +} + +tfoot td { + background-color: #fafafa; +} + diff --git a/ejercicio6/index.html b/ejercicio6/index.html index ea1f061..cfa9469 100644 --- a/ejercicio6/index.html +++ b/ejercicio6/index.html @@ -2,13 +2,25 @@ - + Ejercicio 6

Ejercicio 6

+ + + + + + + + + + +
NombreSectorSueldo
+