diff --git a/frontend/index.html b/frontend/index.html index 48c59fc..df462a7 100644 --- a/frontend/index.html +++ b/frontend/index.html @@ -1,16 +1,20 @@ - - + + - Solid App - - + EEGSAC - internal tool + + + + + +
- - + + \ No newline at end of file diff --git a/frontend/src/certs/NewRegister/ManualRegistration.tsx b/frontend/src/certs/NewRegister/ManualRegistration.tsx new file mode 100644 index 0000000..8b7ef7b --- /dev/null +++ b/frontend/src/certs/NewRegister/ManualRegistration.tsx @@ -0,0 +1,100 @@ +import { JSX, createSignal } from "solid-js"; +import { SearchableSelect } from "./SearchableSelect"; + +type HTMLEventFn = JSX.EventHandlerUnion; + +export function ManualRegistration(props: {personId: number | null, onAdd: (v: [number, string]) => void}) { + // Used to update SearchableSelect.tsx manually + const [count, setCount] = createSignal(0); + const [error, setError] = createSignal(""); + + const [selectedCourseId, seSelectedCourseId] = createSignal(null); + + let datePicker: HTMLInputElement | undefined; + + const register: HTMLEventFn = async(ev) => { + ev.preventDefault(); + + const subject = selectedCourseId(); + + if (datePicker === undefined) { + return; + } + + const date = datePicker.value; + + if (subject === null) { + setError("Selecciona un curso"); + + setTimeout(() => setError(""), 5000); + return; + } + if (date === "") { + setError("Selecciona una fecha"); + + setTimeout(() => setError(""), 5000); + return; + } + + props.onAdd([subject, date]); + // This is used to update & refresh the component + setCount((x) => x + 1); + }; + + console.log(`Person ID: ${props.personId}`); + + return ( + <> +
+
+ +
+ +
+
+ + +
+
+ + +
+
+ + +
+ +

+ {error()}  +

+ + ); +} diff --git a/frontend/src/certs/NewRegister/RegisterPresets.tsx b/frontend/src/certs/NewRegister/RegisterPresets.tsx index 0b27273..74a0037 100644 --- a/frontend/src/certs/NewRegister/RegisterPresets.tsx +++ b/frontend/src/certs/NewRegister/RegisterPresets.tsx @@ -1,18 +1,40 @@ import { Chip } from "../../components/Chip"; export function RegisterPresets() { + let datePicker: HTMLInputElement | undefined; + return ( -
-

Las fechas se colocan automáticamente según la duración del curso.

-
-
- - - - - - + <> +
+

Las fechas se colocan automáticamente según la duración del curso.

+
+
+ + + + + + +
-
+
+
+ + +
+
+ + ); } diff --git a/frontend/src/certs/NewRegister/SearchableSelect.tsx b/frontend/src/certs/NewRegister/SearchableSelect.tsx index 935026e..621a888 100644 --- a/frontend/src/certs/NewRegister/SearchableSelect.tsx +++ b/frontend/src/certs/NewRegister/SearchableSelect.tsx @@ -43,7 +43,7 @@ export function SearchableSelect(props: { id="create-subject" class={`bg-c-background text-c-on-background ${selected() !== null ? "border-c-green" : "border-c-outline"} - border-2 rounded px-2 py-1 + border-2 rounded-tl rounded-tr px-2 py-1 w-full invalid:border-c-error invalid:text-c-error focus:border-c-primary outline-none @@ -85,7 +85,8 @@ export function SearchableSelect(props: { {inputElement}
{(s) => ( diff --git a/frontend/src/certs/NewRegister/index.tsx b/frontend/src/certs/NewRegister/index.tsx index 12702f1..d99cb71 100644 --- a/frontend/src/certs/NewRegister/index.tsx +++ b/frontend/src/certs/NewRegister/index.tsx @@ -1,15 +1,10 @@ import { createSignal, Show } from "solid-js"; -import { SearchableSelect } from "./SearchableSelect"; -import { JSX } from "solid-js/jsx-runtime"; import { FilledCard } from "../../components/FilledCard"; import { RegisterPreview } from "./RegisterPreview"; import { RegisterPresets } from "./RegisterPresets"; +import { ManualRegistration } from "./ManualRegistration"; -type HTMLEventFn = JSX.EventHandlerUnion; - type TabType = "Presets" | "Manual"; @@ -37,7 +32,10 @@ export function NewRegister(props: { - setSelections((x) => [...x, v])} /> + setSelections((x) => [...x, v])} + />
@@ -75,98 +73,5 @@ function RegisterTabs(props: {active: TabType, setActive: (v: TabType) => void}) ); } -function ManualCerts(props: {personId: number | null, onAdd: (v: [number, string]) => void}) { - // Used to update SearchableSelect.tsx manually - const [count, setCount] = createSignal(0); - const [error, setError] = createSignal(""); - - const [selectedCourseId, seSelectedCourseId] = createSignal(null); - - let datePicker: HTMLInputElement | undefined; - - const register: HTMLEventFn = async(ev) => { - ev.preventDefault(); - - const subject = selectedCourseId(); - - if (datePicker === undefined) { - return; - } - - const date = datePicker.value; - - if (subject === null) { - setError("Selecciona un curso"); - - setTimeout(() => setError(""), 5000); - return; - } - if (date === "") { - setError("Selecciona una fecha"); - - setTimeout(() => setError(""), 5000); - return; - } - - props.onAdd([subject, date]); - // This is used to update & refresh the component - setCount((x) => x + 1); - }; - - console.log(`Person ID: ${props.personId}`); - - return ( - <> -
-
- -
- -
-
- - -
-
- - -
-
- - -
- -

- {error()}  -

- - ); -} diff --git a/frontend/src/certs/Registers.tsx b/frontend/src/certs/Registers.tsx index f3efe4f..fbf2075 100644 --- a/frontend/src/certs/Registers.tsx +++ b/frontend/src/certs/Registers.tsx @@ -8,16 +8,17 @@ export function Registers() {
-
+
-
+

Matpel 2

12/08/2023 - 6486

+
); diff --git a/frontend/src/certs/index.tsx b/frontend/src/certs/index.tsx index 1727f3c..e695155 100644 --- a/frontend/src/certs/index.tsx +++ b/frontend/src/certs/index.tsx @@ -4,7 +4,7 @@ import { Search } from "./Search"; export function Certs() { return ( -
+
{}} /> {}} /> diff --git a/frontend/tailwind.config.js b/frontend/tailwind.config.js index 061b19a..49ce53e 100644 --- a/frontend/tailwind.config.js +++ b/frontend/tailwind.config.js @@ -5,7 +5,9 @@ module.exports = { ], theme: { extend: { - + fontFamily: { + "mono": ["Inconsolata", "monospace"], + }, }, colors: { "c-primary": "var(--c-primary)",