98 lines
3.1 KiB
TypeScript
98 lines
3.1 KiB
TypeScript
|
import { FilledCard } from "../../components/FilledCard";
|
||
|
|
import { For } from "solid-js";
|
||
|
|
// import { subjects } from "src/views/subjects";
|
||
|
|
import { XIcon } from "../../icons/XIcon";
|
||
|
|
|
||
|
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||
|
|
const subjects: () => Array<any> = () => [];
|
||
|
|
|
||
|
|
function isoDateToLocalDate(date: string): string {
|
||
|
|
const [,month, day] = /\d{4}-(\d{2})-(\d{2})/.exec(date) ?? "";
|
||
|
|
return `${day}/${month}`;
|
||
|
|
}
|
||
|
|
|
||
|
|
export function RegisterPreview(props: {selections: Array<[number, string]>, personId: number | null, onDelete: (v: number) => void, onRegister: () => void}) {
|
||
|
|
const submit = async() => {
|
||
|
|
console.log("Submit...");
|
||
|
|
|
||
|
|
for (const [courseId, date] of props.selections) {
|
||
|
|
const result = await defaultNewRegisterFn(
|
||
|
|
props.personId ?? -1,
|
||
|
|
courseId,
|
||
|
|
date,
|
||
|
|
);
|
||
|
|
|
||
|
|
if (result === null) {
|
||
|
|
console.log("Success");
|
||
|
|
} else {
|
||
|
|
console.log(`error. ${result}`);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
props.onRegister();
|
||
|
|
};
|
||
|
|
|
||
|
|
return (
|
||
|
|
<FilledCard class="border border-c-outline overflow-hidden">
|
||
|
|
<h2 class="p-4 font-bold text-xl">Confirmar registro</h2>
|
||
|
|
<div class="bg-c-surface p-4">
|
||
|
|
<For each={props.selections}>
|
||
|
|
{([courseId, date]) => <Register courseId={courseId} date={date} onDelete={props.onDelete} />}
|
||
|
|
</For>
|
||
|
|
|
||
|
|
<button
|
||
|
|
class="bg-c-primary text-c-on-primary px-4 py-2 rounded-full cursor-pointer mt-4
|
||
|
|
disabled:opacity-50 disabled:cursor-not-allowed"
|
||
|
|
type="button"
|
||
|
|
disabled={props.selections.length === 0}
|
||
|
|
onclick={submit}
|
||
|
|
>
|
||
|
|
Registrar los {props.selections.length} cursos
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
</FilledCard>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
|
||
|
|
function Register(props: {courseId: number, date: string, onDelete: (v: number) => void}) {
|
||
|
|
const courseName = () => {
|
||
|
|
const courses = subjects();
|
||
|
|
return courses.find((c) => c.id === props.courseId)?.nombre ?? "!";
|
||
|
|
};
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div class="grid grid-cols-[auto_4rem_1.5rem] py-1 px-2 rounded-md border border-c-outline my-1">
|
||
|
|
{courseName()}
|
||
|
|
<span class="font-mono">{isoDateToLocalDate(props.date)}</span>
|
||
|
|
<button
|
||
|
|
class="hover:bg-c-surface-variant rounded-md"
|
||
|
|
onclick={() => props.onDelete(props.courseId)}
|
||
|
|
>
|
||
|
|
<XIcon fill="var(--c-on-surface)" />
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
async function defaultNewRegisterFn(personId: number, subjectId: number, date: string): Promise<null | string> {
|
||
|
|
const response = await fetch("/certificate", {
|
||
|
|
method: "POST",
|
||
|
|
headers: {
|
||
|
|
"Content-Type": "application/json",
|
||
|
|
},
|
||
|
|
body: JSON.stringify({
|
||
|
|
personId,
|
||
|
|
subjectId,
|
||
|
|
date,
|
||
|
|
}),
|
||
|
|
});
|
||
|
|
|
||
|
|
if (response.ok) {
|
||
|
|
return null;
|
||
|
|
} else {
|
||
|
|
const data = await response.json();
|
||
|
|
return JSON.stringify(data);
|
||
|
|
}
|
||
|
|
}
|