fernando/eeg_certs
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[FE][Certs] Replace global course list with context

Browse Source
This commit is contained in:
Araozu 2023-12-16 09:32:40 -05:00
parent 89dc57daa8
commit a97690c518
7 changed files with 51 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
frontend/src/certs/NewRegister/ManualRegistration.tsx
View File

@ -1,9 +1,9 @@
import { JSX, Show, createSignal } from "solid-js";
import { SearchableSelect } from "./SearchableSelect";
import { CustomLabelSelect } from "./CustomLabelSelect";
import { courseMap } from "../../utils/allCourses";
import { RegistrationPreview } from ".";
import { customLabelsMap } from "../../utils/allCustomLabels";
import { useCourses } from "..";
type HTMLEventFn = JSX.EventHandlerUnion<HTMLFormElement, Event & {
submitter: HTMLElement;
@ -21,15 +21,21 @@ export function ManualRegistration(props: {
const [customLabel, setCustomLabel] = createSignal("");
const [isPreview, setIsPreview] = createSignal(false);
const courses = useCourses();
let datePicker: HTMLInputElement | undefined;
const courseHasCustomLabel = () => {
if (courses === undefined) {
return false;
}
const courseId = selectedCourseId();
if (courseId === null) {
return false;
}
const course = courseMap()[courseId];
const course = courses.idMap()[courseId];
return course?.course_has_custom_label === true;
};

2
frontend/src/certs/NewRegister/RegisterPresets.tsx
View File

@ -21,7 +21,7 @@ export function RegisterPresets(props: {
return {};
}
const coursesMap = courses.map();
const coursesMap = courses.nameMap();
const matpel1 = coursesMap["Matpel 1"];
const matpel2 = coursesMap["Matpel 2"];

17
frontend/src/certs/Registers/RegisterElement.tsx
View File

@ -2,7 +2,6 @@ import { Show, createMemo } from "solid-js";
import { certGenerator } from "../../certGenerator";
import { Person } from "../../types/Person";
import { Register } from "../../types/Register";
import { courseMap } from "../../utils/allCourses";
import { customLabelsMap } from "../../utils/allCustomLabels";
import { DownloadSimpleIcon } from "../../icons/DownloadSimpleIcon";
import { CaretRight } from "../../icons/CaretRight";
@ -13,6 +12,8 @@ import QR from "qrcode";
import saveAs from "file-saver";
import { genMatpelCarnet } from "../../carnetGenerator/matpel";
import { genMachineryCarnet } from "../../carnetGenerator/machinery";
import { useCourses } from "..";
import { Course } from "../../types/Course";
const carnetEnabled = [
"Matpel 3",
@ -25,6 +26,7 @@ const carnetEnabled = [
];
export function RegisterElement(props: {register: Register, person: Person, onClick: () => void}) {
const courses = useCourses();
const dateComponents = () => {
const [, year, month, day] = /(\d{4})-(\d{2})-(\d{2})/.exec(props.register.register_display_date) ?? [];
@ -37,7 +39,7 @@ export function RegisterElement(props: {register: Register, person: Person, onCl
};
const courseName = () => {
const course = courseMap()[props.register.register_course_id];
const course = courses?.idMap()[props.register.register_course_id];
return course?.course_name ?? "Curso no encontrado";
};
@ -48,10 +50,15 @@ export function RegisterElement(props: {register: Register, person: Person, onCl
};
const genCert = () => {
if (courses === undefined) {
alert("Error. La lista de cursos no esta cargada.");
return;
}
const person = props.person;
const register = props.register;
generateCert(person, register);
generateCert(person, register, courses.idMap());
};
const generateable = () => {
@ -157,8 +164,8 @@ export function RegisterElement(props: {register: Register, person: Person, onCl
);
}
export function generateCert(person: Person, register: Register) {
const courseN = courseMap()[register.register_course_id]?.course_name ?? "Curso no encontrado";
export function generateCert(person: Person, register: Register, coursesMap: {[course_id: number]: Course}) {
const courseN = coursesMap[register.register_course_id]?.course_name ?? "Curso no encontrado";
const generator = certGenerator[courseN];
if (generator === undefined) {

7
frontend/src/certs/Registers/RegisterSidebar.tsx
View File

@ -1,5 +1,6 @@
import { createMemo } from "solid-js";
import { useCourses } from "..";
import { Register } from "../../types/Register";
import { courseMap } from "../../utils/allCourses";
import { formatDate } from "../../utils/functions";
export function RegisterSidebar(props: {
@ -7,6 +8,8 @@ export function RegisterSidebar(props: {
close: () => void,
onDelete: () => void,
}) {
const courses = useCourses();
const deleteRegister = async() => {
const res = await fetch(`${import.meta.env.VITE_BACKEND_URL}/api/register/${props.register.register_id}`,{
@ -19,7 +22,7 @@ export function RegisterSidebar(props: {
}
};
const courseName = () => courseMap()[props.register.register_course_id]?.course_name ?? "<curso no encontrado>";
const courseName = createMemo(() => courses?.idMap()[props.register.register_course_id]?.course_name ?? "<curso no encontrado>");
return (
<div class="absolute top-0 bg-c-surface-variant right-0

6
frontend/src/certs/Registers/index.tsx
View File

@ -7,6 +7,7 @@ import { backend, wait } from "../../utils/functions";
import { JsonResult } from "../../types/JsonResult";
import { LoadingIcon } from "../../icons/LoadingIcon";
import { RegisterElement, generateCert } from "./RegisterElement";
import { useCourses } from "..";
export function Registers(props: {person: Person | null, count: number}) {
const [registers, setRegisters] = createSignal<Array<Register>>([]);
@ -14,6 +15,7 @@ export function Registers(props: {person: Person | null, count: number}) {
const [sidebarRegister, setSidebarRegister] = createSignal<Register | null>(null);
const [loading, setLoading] = createSignal(false);
const [error, setError] = createSignal("");
const courses = useCourses();
const loadRegisters = async() => {
setLoading(true);
@ -101,10 +103,10 @@ export function Registers(props: {person: Person | null, count: number}) {
const [downButtonBg, setDownButtonBg] = createSignal("bg-c-primary text-c-on-primary");
const downloadTodayCerts = () => {
if (props.person === null) return;
if (props.person === null || courses === undefined) return;
todayRegisters().forEach((register) => {
generateCert(props.person!, register);
generateCert(props.person!, register, courses.idMap());
});
setDownButtonBg("bg-c-success text-c-on-success");

24
frontend/src/certs/index.tsx
View File

@ -53,7 +53,8 @@ export function Certs() {
const CoursesContext = createContext<{
data: Resource<Course[]>,
map: () => {[course_name: string]: Course},
nameMap: () => {[course_name: string]: Course},
idMap: () => {[course_name: string]: Course},
}>();
function CoursesProvider(props: {courses: Resource<Course[]>, children: JSX.Element}) {
@ -64,7 +65,7 @@ function CoursesProvider(props: {courses: Resource<Course[]>, children: JSX.Elem
const data = props.courses();
type CourseMap = {[k: string]: Course};
type CourseMap = {[course_name: string]: Course};
const map: CourseMap = {};
for (const course of data) {
map[course.course_name] = course;
@ -73,9 +74,26 @@ function CoursesProvider(props: {courses: Resource<Course[]>, children: JSX.Elem
return map;
});
const courseIdMapMemo = createMemo(() => {
if (props.courses === undefined || props.courses?.state !== "ready") {
return {};
}
const data = props.courses();
type CourseMap = {[course_id: number]: Course};
const map: CourseMap = {};
for (const course of data) {
map[course.course_id] = course;
}
return map;
});
const coursesData = {
data: props.courses,
map: courseMapMemo,
nameMap: courseMapMemo,
idMap: courseIdMapMemo,
};
return (

33
frontend/src/utils/allCourses.ts
View File

@ -1,33 +0,0 @@
import { Accessor, createMemo, createSignal } from "solid-js";
import { Course } from "../types/Course";
type CourseMap = {[k: number]: Course};
const [allCourses, setAllCourses] = createSignal<Array<Course>>([]);
export const [courseMap, setCourseMap] = createSignal<CourseMap>({});
(() => {
// Get all courses from the API
fetch(`${import.meta.env.VITE_BACKEND_URL}/api/course`)
.then((res) => res.json())
.then((data: Array<Course>) => {
setAllCourses(data);
const map: CourseMap = {};
for (const course of data) {
map[course.course_id] = course;
}
setCourseMap(map);
});
})();
export function getCourseMemo(name: string): Accessor<Course | null> {
return createMemo(() => {
const course = allCourses().find((course) => course.course_name === name);
if (course) {
return course;
}
return null;
});
}