diff --git a/package.json b/package.json index 96ba5af..ee51d2b 100755 --- a/package.json +++ b/package.json @@ -15,7 +15,7 @@ "jest": "^29.1.2", "normalize.css": "^8.0.1", "solid-app-router": "^0.3.2", - "solid-js": "^1.3.12", + "solid-js": "1.5.7", "ts-jest": "^29.0.3", "typescript": "^4.6.2", "vite": "^2.8.6", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 5ae8019..6abd7ff 100755 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -13,7 +13,7 @@ specifiers: jest: ^29.1.2 normalize.css: ^8.0.1 solid-app-router: ^0.3.2 - solid-js: ^1.3.12 + solid-js: 1.5.7 swiper: ^8.4.4 ts-jest: ^29.0.3 typescript: ^4.6.2 @@ -37,8 +37,8 @@ devDependencies: eslint-plugin-react: 7.23.1_eslint@7.22.0 jest: 29.1.2_@types+node@14.14.20 normalize.css: 8.0.1 - solid-app-router: 0.3.2_solid-js@1.3.13 - solid-js: 1.3.13 + solid-app-router: 0.3.2_solid-js@1.5.7 + solid-js: 1.5.7 ts-jest: 29.0.3_u3tawnhld4dxccrvbviil55jbq typescript: 4.6.3 vite: 2.9.0 @@ -1409,6 +1409,10 @@ packages: isobject: 3.0.1 dev: true + /csstype/3.1.1: + resolution: {integrity: sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw==} + dev: true + /debug/4.3.1: resolution: {integrity: sha512-doEwdvm4PCeK4K3RQN2ZC2BYUBaxwLARCqZmMjtF8a51J2Rb0xpVloFRnCODwqjpwnAoao4pelN8l3RJdv3gRQ==} engines: {node: '>=6.0'} @@ -3392,19 +3396,21 @@ packages: is-fullwidth-code-point: 3.0.0 dev: true - /solid-app-router/0.3.2_solid-js@1.3.13: + /solid-app-router/0.3.2_solid-js@1.5.7: resolution: {integrity: sha512-zh6Ui87xy23JUxrH0z1xAROJPpiuxa3JRx9jP2qqjr07q2EKQOjn9BrmTFvQd/azQWzLjSMU+hN2fy6kLh5Bdw==} peerDependencies: solid-js: ^1.3.5 dependencies: - solid-js: 1.3.13 + solid-js: 1.5.7 dev: true - /solid-js/1.3.13: - resolution: {integrity: sha512-1EBEIW9u2yqT5QNjFdvz/tMAoKsDdaRA2Jbgykd2Dt13Ia0D4mV+BFvPkOaseSyu7DsMKS23+ZZofV8BVKmpuQ==} + /solid-js/1.5.7: + resolution: {integrity: sha512-L1UuyMuZZARAwzXo5NZDhE6yxc14aqNbVOUoGzvlcxRZo1Cm4ExhPV0diEfwDyiKG/igqNNLkNurHkXiI5sVEg==} + dependencies: + csstype: 3.1.1 dev: true - /solid-refresh/0.4.0_solid-js@1.3.13: + /solid-refresh/0.4.0_solid-js@1.5.7: resolution: {integrity: sha512-5XCUz845n/sHPzKK2i2G2EeV61tAmzv6SqzqhXcPaYhrgzVy7nKTQaBpKK8InKrriq9Z2JFF/mguIU00t/73xw==} peerDependencies: solid-js: ^1.3.0 @@ -3412,7 +3418,7 @@ packages: '@babel/generator': 7.17.7 '@babel/helper-module-imports': 7.16.7 '@babel/types': 7.17.0 - solid-js: 1.3.13 + solid-js: 1.5.7 dev: true /source-map-js/1.0.2: @@ -3746,8 +3752,8 @@ packages: '@babel/preset-typescript': 7.16.7_@babel+core@7.17.8 babel-preset-solid: 1.3.13_@babel+core@7.17.8 merge-anything: 5.0.2 - solid-js: 1.3.13 - solid-refresh: 0.4.0_solid-js@1.3.13 + solid-js: 1.5.7 + solid-refresh: 0.4.0_solid-js@1.5.7 vite: 2.9.0 transitivePeerDependencies: - less diff --git a/src/API/CargaHorarios.ts b/src/API/CargaHorarios.ts index 468e54e..2225354 100644 --- a/src/API/CargaHorarios.ts +++ b/src/API/CargaHorarios.ts @@ -159,7 +159,7 @@ export const getHorariosMock: GetHorariosFn = async(_) => { id_horario: 4, id_laboratorio: 2, hora_inicio: "0850", - hora_fin: "0940", + hora_fin: "1040", dia: "Jueves", }, ], @@ -174,7 +174,7 @@ export const getHorariosMock: GetHorariosFn = async(_) => { id_horario: 5, id_laboratorio: 3, hora_inicio: "1740", - hora_fin: "1830", + hora_fin: "1920", dia: "Martes", }, ], diff --git a/src/Views/pc/Sistemas.tsx b/src/Views/pc/Sistemas.tsx index 0aaa6d8..4d8a1ce 100644 --- a/src/Views/pc/Sistemas.tsx +++ b/src/Views/pc/Sistemas.tsx @@ -37,6 +37,7 @@ function listaCursosADatos(cursosEntrada: ListaCursosCompleto): Cursos { const gruposLab: {[grupo: string]: DatosGrupo} = {}; for (const lab of curso.laboratorios) { gruposLab[lab.grupo] = { + id_laboratorio: lab.id_laboratorio, Docente: lab.docente, Horas: infoDiaAListaHoras(lab.horario), seleccionado: false, diff --git a/src/Views/pc/Sistemas/ContenedorHorarios.tsx b/src/Views/pc/Sistemas/ContenedorHorarios.tsx index e6ac248..61cf7e7 100755 --- a/src/Views/pc/Sistemas/ContenedorHorarios.tsx +++ b/src/Views/pc/Sistemas/ContenedorHorarios.tsx @@ -1,7 +1,6 @@ import YAML from "yaml"; import { css, StyleSheet } from "aphrodite"; import { MiHorario } from "./ContenedorHorarios/MiHorario"; -import { Horarios } from "./ContenedorHorarios/Horarios"; import { Anios, Cursos, @@ -20,18 +19,17 @@ const { } = useListaCursos(); export function ContenedorHorarios(props: {datos: Cursos}) { - const [datos, setDatos] = createSignal({}); createEffect(async() => { - const datos = props.datos; + const d2 = props.datos; batch(() => { - setDatos(datos); + Object.entries(d2).forEach(([_, curso]) => agregarCursoUsuario(curso)); }); }); return ( diff --git a/src/Views/pc/Sistemas/ContenedorHorarios/CursosElem.tsx b/src/Views/pc/Sistemas/ContenedorHorarios/CursosElem.tsx index 766556c..d9ca607 100755 --- a/src/Views/pc/Sistemas/ContenedorHorarios/CursosElem.tsx +++ b/src/Views/pc/Sistemas/ContenedorHorarios/CursosElem.tsx @@ -4,6 +4,7 @@ import { produce, SetStoreFunction } from "solid-js/store"; import { StyleSheet, css } from "aphrodite"; import { estilosGlobales } from "../../../../Estilos"; import { TablaObserver } from "./TablaObserver"; +import { setGruposSeleccionados } from "../../../../Store"; const e = StyleSheet.create({ inline: { @@ -47,7 +48,6 @@ interface Props { dataAnio: Cursos, anioActual: () => string, fnAgregarCurso: (c: Curso) => void, - listaCursosUsuario: ListaCursosUsuario, esCursoMiHorario: boolean, setCursosUsuarios: SetStoreFunction, tablaObserver: TablaObserver, @@ -93,17 +93,7 @@ const agruparProfesores = ( profesores[nombreProfesor].push([ grupo, () => { - setCursosUsuarios("cursos", Number(indiceCurso), "Teoria", produce<{ [p: string]: DatosGrupo }>((x) => { - const grupoActualSeleccionado = x[grupo].seleccionado; - - if (grupoActualSeleccionado) { - x[grupo].seleccionado = false; - } else { - for (const xKey in x) { - x[xKey].seleccionado = xKey === grupo; - } - } - })); + setGruposSeleccionados(datosGrupo.id_laboratorio, (x) => !x); }, ]); } @@ -119,26 +109,11 @@ function CursoE( ) { const idCurso = `${props.version}_${anio()}_${datosCurso.abreviado}`; - const cursoAgregadoMemo = createMemo( - () => props.listaCursosUsuario.cursos.find((x) => x.nombre === datosCurso.nombre && !x.oculto) !== undefined, - undefined, - { - equals: - (x, y) => x === y, - }, - ); - - const tituloMemo = createMemo(() => (cursoAgregadoMemo() - ? "Remover de mi horario" - : "Agregar a mi horario")); - const claseMemo = createMemo(() => { if (props.esCursoMiHorario && datosCurso.oculto) { return claseCursoOculto; } - return cursoAgregadoMemo() - ? claseCursoAgregado - : claseCursoNoAgregado; + return claseCursoNoAgregado; }); const profesoresTeoria = createMemo(() => agruparProfesores( @@ -197,12 +172,6 @@ function CursoE( - ); } diff --git a/src/Views/pc/Sistemas/ContenedorHorarios/Horarios.tsx b/src/Views/pc/Sistemas/ContenedorHorarios/Horarios.tsx deleted file mode 100755 index f8ab6d8..0000000 --- a/src/Views/pc/Sistemas/ContenedorHorarios/Horarios.tsx +++ /dev/null @@ -1,139 +0,0 @@ -import { Curso, Cursos, DatosHorario, ListaCursosUsuario } from "../../../../types/DatosHorario"; -import { batch, createMemo, createSignal, For, Match, Switch, untrack } from "solid-js"; -import {SetStoreFunction} from "solid-js/store"; -import { css } from "aphrodite"; -import { estilosGlobales } from "../../../../Estilos"; -import { Tabla } from "./Tabla"; -import { CursosElem } from "./CursosElem"; -import { EstadoLayout } from "../ContenedorHorarios"; -import { BotonMaxMin } from "./BotonMaxMin"; -import { useListaCursos } from "./useListaCursos"; -import { TablaObserver } from "./TablaObserver"; - -interface HorariosProps { - data: DatosHorario, - estadoLayout: EstadoLayout, - setEstadoLayout: (v: EstadoLayout) => EstadoLayout, - fnAgregarCurso: (c: Curso) => void, - listaCursosUsuario: ListaCursosUsuario, - setCursosUsuarios: SetStoreFunction -} - -const { - setListaCursos, - agregarCursoALista, - eliminarCursosDeLista, -} = useListaCursos(); - -export function Horarios(props: HorariosProps) { - const [anioActual, setAnioActual] = createSignal("1er año"); - - const tablaObserver = new TablaObserver(); - - const elAnios = ( - - {([nombre]) => { - const clases = createMemo(() => { - const vAnio = anioActual(); - return css( - estilosGlobales.contenedor, - estilosGlobales.inlineBlock, - estilosGlobales.contenedorCursor, - estilosGlobales.contenedorCursorSoft, - nombre === vAnio && estilosGlobales.contenedorCursorActivo, - ); - }); - - return ( - - ); - }} - - ); - - const dataTabla = createMemo(() => { - const anio = anioActual(); - const obj: Cursos = {}; - untrack(() => { - const cursos = props.data.años[anio]; - batch(() => { - eliminarCursosDeLista(); - - let i = 0; - for (const [, curso] of Object.entries(cursos)) { - // El curso devuelto por esta fun. es reactivo - obj[i] = agregarCursoALista(curso); - i += 1; - } - }); - }); - - return obj; - }); - - const fnMaximizar = () => props.setEstadoLayout("MaxHorarios"); - const fnMinimizar = () => props.setEstadoLayout("Normal"); - const estadoActualLayout = () => props.estadoLayout; - - return ( -
- - -
-
- Horarios disponibles -
-
- {elAnios} - | - -
-
- -
-
- -
- - - {/* - - */} -
- - - -
- ); -} diff --git a/src/Views/pc/Sistemas/ContenedorHorarios/MiHorario.tsx b/src/Views/pc/Sistemas/ContenedorHorarios/MiHorario.tsx index 0227ad2..45f8042 100755 --- a/src/Views/pc/Sistemas/ContenedorHorarios/MiHorario.tsx +++ b/src/Views/pc/Sistemas/ContenedorHorarios/MiHorario.tsx @@ -11,7 +11,7 @@ import { CursosElem } from "./CursosElem"; import { TablaObserver } from "./TablaObserver"; interface MiHorarioProps { - cursosUsuario: ListaCursosUsuario, + cursos: Cursos, fnAgregarCurso: (c: Curso) => void, setCursosUsuarios: SetStoreFunction } @@ -34,7 +34,7 @@ export function MiHorario(props: MiHorarioProps) { const datosMiHorario = createMemo(() => { const obj: Cursos = {}; - props.cursosUsuario.cursos.forEach((x, i) => { + Object.entries(props.cursos).forEach(([_, x], i) => { obj[i] = x; }); return obj; @@ -69,7 +69,6 @@ export function MiHorario(props: MiHorarioProps) { anioActual={() => "Mi horario"} dataAnio={datosMiHorario()} fnAgregarCurso={props.fnAgregarCurso} - listaCursosUsuario={props.cursosUsuario} esCursoMiHorario setCursosUsuarios={props.setCursosUsuarios} tablaObserver={tablaObserver} diff --git a/src/Views/pc/Sistemas/ContenedorHorarios/Tabla.tsx b/src/Views/pc/Sistemas/ContenedorHorarios/Tabla.tsx index 02d4937..c310782 100755 --- a/src/Views/pc/Sistemas/ContenedorHorarios/Tabla.tsx +++ b/src/Views/pc/Sistemas/ContenedorHorarios/Tabla.tsx @@ -3,7 +3,7 @@ import { batch, createMemo, For } from "solid-js"; import { produce, SetStoreFunction } from "solid-js/store"; import {estilosGlobales} from "../../../../Estilos"; import { Cursos, ListaCursosUsuario, DataProcesada, DatosGrupo } from "../../../../types/DatosHorario"; -import { Dia, dias, horas } from "../../../../Store"; +import { Dia, dias, gruposSeleccionados, horas, setGruposSeleccionados } from "../../../../Store"; import { FilaTabla } from "./Tabla/FilaTabla"; import { TablaObserver } from "./TablaObserver"; @@ -117,17 +117,7 @@ const procesarAnio = (data: Cursos, anio: string, version: number, setCursosUsua esLab: false, datosGrupo: grupo, fnSeleccionar: () => { - setCursosUsuarios("cursos", Number(indiceCurso), "Teoria", produce<{ [p: string]: DatosGrupo }>((x) => { - const grupoActualSeleccionado = x[grupoStr].seleccionado; - if (grupoActualSeleccionado) { - x[grupoStr].seleccionado = false; - } else { - for (const xKey in x) { - x[xKey].seleccionado = xKey === grupoStr; - } - } - })); }, }); } @@ -157,23 +147,7 @@ const procesarAnio = (data: Cursos, anio: string, version: number, setCursosUsua esLab: true, datosGrupo: grupo, fnSeleccionar: () => { - setCursosUsuarios( - "cursos", - Number(indiceCurso), - "Laboratorio", - /// @ts-ignore - produce<{ [p: string]: DatosGrupo }>((x) => { - const grupoActualSeleccionado = x[grupoStr].seleccionado; - - if (grupoActualSeleccionado) { - x[grupoStr].seleccionado = false; - } else { - for (const xKey in x) { - x[xKey].seleccionado = xKey === grupoStr; - } - } - }), - ); + setGruposSeleccionados(grupo.id_laboratorio, (x) => !x); }, }); } diff --git a/src/Views/pc/Sistemas/ContenedorHorarios/TablaObserver.ts b/src/Views/pc/Sistemas/ContenedorHorarios/TablaObserver.ts index 77cd3b4..9b5274c 100644 --- a/src/Views/pc/Sistemas/ContenedorHorarios/TablaObserver.ts +++ b/src/Views/pc/Sistemas/ContenedorHorarios/TablaObserver.ts @@ -1,6 +1,7 @@ import { createMemo, createEffect, untrack } from "solid-js"; import {createStore, SetStoreFunction, Store, produce} from "solid-js/store"; import { DatosGrupo } from "../../../../types/DatosHorario"; +import { gruposSeleccionados } from "../../../../Store"; const createMemoDefault = (f: () => T) => createMemo( f, @@ -73,6 +74,7 @@ export class TablaObserver { /** * Crea un memo que indica el estado de la celda + * @param id_laboratorio Id del laboratorio * @param anio El año * @param curso Curso abreviado * @param esLab Si es laboratorio @@ -80,6 +82,7 @@ export class TablaObserver { * @param datosGrupo Contiene `seleccionado`, se usa ese valor reactivo */ private registrar( + id_laboratorio: number, anio: string, curso: string, esLab: boolean, @@ -131,15 +134,7 @@ export class TablaObserver { } }); - const seleccionadoMemo = createMemoDefault(() => { - const gruposSeleccionados = this.seleccionado[anio][curso][esLab ? "Laboratorio" : "Teoria"]; - - if (gruposSeleccionados.length > 0) { - return gruposSeleccionados.find((x) => x === grupo) ? "Seleccionado" : "Oculto"; - } else { - return "Normal"; - } - }); + const seleccionadoMemo = createMemoDefault(() => ((gruposSeleccionados[id_laboratorio]) ? "Seleccionado" : "Normal")); return createMemoDefault((): EstadoCelda => { const resaltado = resaltadoMemo(); @@ -176,7 +171,7 @@ export class TablaObserver { } const [, anio, curso, lab, grupo] = id.split("_"); - const memo = this.registrar(anio, curso, lab === "L", grupo, datosGrupo); + const memo = this.registrar(datosGrupo.id_laboratorio, anio, curso, lab === "L", grupo, datosGrupo); this.memos[id] = memo; return memo; } diff --git a/src/Views/pc/Sistemas/ContenedorHorarios/useListaCursos.ts b/src/Views/pc/Sistemas/ContenedorHorarios/useListaCursos.ts index c234fc3..f14032f 100644 --- a/src/Views/pc/Sistemas/ContenedorHorarios/useListaCursos.ts +++ b/src/Views/pc/Sistemas/ContenedorHorarios/useListaCursos.ts @@ -9,27 +9,21 @@ interface ReturnType { } export const useListaCursos = (): ReturnType => { - const [listaCursos, setListaCursos] = createStore({ - sigIndice: 0, - cursos: [], - }); + const [listaCursos, setListaCursos] = createStore({}); const agregarCursoALista = (curso: Curso): Curso => { // Si el horario ya se habia agregado, ocultarlo - const cursoActualIndex = listaCursos.cursos.findIndex((x) => x.nombre === curso.nombre); - if (cursoActualIndex !== -1) { - setListaCursos("cursos", cursoActualIndex, "oculto", (x) => !x); - return listaCursos.cursos[cursoActualIndex]; + if (listaCursos[curso.nombre]) { + setListaCursos(curso.nombre, "oculto", (x) => !x); + return listaCursos[curso.nombre]; } else { - setListaCursos("cursos", listaCursos.sigIndice, curso); - setListaCursos("sigIndice", (x) => x + 1); - return listaCursos.cursos[listaCursos.sigIndice - 1]; + setListaCursos(curso.nombre, curso); + return listaCursos[curso.nombre]; } }; const eliminarCursosDeLista = () => { - setListaCursos("cursos", []); - setListaCursos("sigIndice", 0); + setListaCursos({}); }; return { diff --git a/src/types/DatosHorario.ts b/src/types/DatosHorario.ts index 3eb6c34..91210a0 100755 --- a/src/types/DatosHorario.ts +++ b/src/types/DatosHorario.ts @@ -27,6 +27,7 @@ export interface DatosHorarioRaw { } export interface DatosGrupo { + id_laboratorio: number, Docente: string, Horas: string[] seleccionado: boolean @@ -44,9 +45,8 @@ export interface Curso { } } -export interface ListaCursosUsuario { - sigIndice: number, - cursos: Curso[] +export type ListaCursosUsuario = { + [key: string]: Curso } export interface Cursos {