diff --git a/src/ContenedorHorarios/Cursos.tsx b/src/ContenedorHorarios/Cursos.tsx index c1b442a..c83758d 100755 --- a/src/ContenedorHorarios/Cursos.tsx +++ b/src/ContenedorHorarios/Cursos.tsx @@ -1,11 +1,23 @@ -import { AnioData, Curso, ListaCursosUsuario } from "../types/DatosHorario"; +import { AnioData, Curso, DatosVariante, ListaCursosUsuario } from "../types/DatosHorario"; import { createEffect, createMemo, For } from "solid-js"; import { StyleSheet, css } from "aphrodite"; import { estilosGlobales } from "../Estilos"; const e = StyleSheet.create({ - contenedorCurso: { + inline: { display: "inline-block" + }, + lineaTexto: { + marginBottom: "0.5rem" + }, + tablaGrupos: { + whiteSpace: "pre", + borderCollapse: "collapse", + borderSpacing: 0 + }, + contenedorCurso: { + display: "inline-block", + verticalAlign: "top" } }); @@ -15,20 +27,32 @@ interface Props { listaCursosUsuario: ListaCursosUsuario } +const agruparProfesores = (datos: { [k: string]: DatosVariante }) => { + const profesores: { [k: string]: string[] } = {}; + for (const [grupo, datosGrupo] of Object.entries(datos)) { + const nombreProfesor = datosGrupo.Docente; + if (!profesores[nombreProfesor]) { + profesores[nombreProfesor] = []; + } + profesores[nombreProfesor].push(grupo); + } + return profesores; +}; + export function Cursos(props: Props) { const claseCursoNoAgregado = css( e.contenedorCurso, estilosGlobales.contenedor, - estilosGlobales.contenedorCursor, - estilosGlobales.contenedorCursorSoft + // estilosGlobales.contenedorCursor, + // estilosGlobales.contenedorCursorSoft ); const claseCursoAgregado = css( e.contenedorCurso, estilosGlobales.contenedor, - estilosGlobales.contenedorCursor, - estilosGlobales.contenedorCursorSoft, + // estilosGlobales.contenedorCursor, + // estilosGlobales.contenedorCursorSoft, estilosGlobales.contenedorCursorActivo, ); @@ -45,8 +69,8 @@ export function Cursos(props: Props) { ); const tituloMemo = createMemo(() => cursoAgregadoMemo() - ? `Remover ${datosCurso.abreviado} de mi horario` - : `Agregar ${datosCurso.abreviado} a mi horario` + ? `Remover de mi horario` + : `Agregar a mi horario` ); const claseMemo = createMemo(() => @@ -55,20 +79,52 @@ export function Cursos(props: Props) { : claseCursoNoAgregado ); - const iconoMemo = createMemo(() => - cursoAgregadoMemo() - ? "ph-minus" - : "ph-plus" - ); + const profesoresTeoria = createMemo(() => agruparProfesores(datosCurso.Teoria)); + const profesoresLab = createMemo(() => agruparProfesores(datosCurso.Laboratorio ?? {})); - return props.fnAgregarCurso(datosCurso)} - > - - {datosCurso.abreviado} - {datosCurso.nombre} - + return
+
+ {datosCurso.abreviado} - {datosCurso.nombre} +
+ + + + + {([profesor, grupos]) => { + return + }} + + + + + {([profesor, grupos]) => { + return + }} + + + +
+ + {profesor}  + + + {grupos.reduce((x, y) => x + " " + y)}  + +
+ + {profesor}  + + + {grupos.map(x => `L${x}`).reduce((x, y) => x + " " + y)}  + +
+ props.fnAgregarCurso(datosCurso)} + > + {tituloMemo} + +
}} - - ; - } + + ; +}