Merge pull request #24 from Emanuel-Palestino/application-for-makeup-…

…exam-page Application for makeup exam page
Emanuel-Palestino · Jan 21, 2024 · 534fd22 · 534fd22
2 parents dd77bf3 + 700a54d
commit 534fd22
Show file tree

Hide file tree

Showing 6 changed files with 334 additions and 1 deletion.
diff --git a/app/extraordinario/page.tsx b/app/extraordinario/page.tsx
@@ -0,0 +1,13 @@
+import { Form } from "../ui/makeup_exam/Form"
+
+const Extraordinario = () => {
+
+	return (
+		<div className="container mx-auto pt-5 px-3 sm:px-0">
+			<Form />
+		</div>
+	)
+
+}
+
+export default Extraordinario
diff --git a/app/printingFormats/makeup_exam/Format.tsx b/app/printingFormats/makeup_exam/Format.tsx
@@ -0,0 +1,88 @@
+import { formatedDate } from '@/app/utils/format'
+import logo from '@/public/UTMEscudo.png'
+import { MakeUpExam } from '@/src/models/MakeUpExam'
+import Image from 'next/image'
+import { FC } from 'react'
+
+
+export const Format: FC<{ data: MakeUpExam, date: Date }> = ({ data, date }) => {
+
+	return (
+		<section className="w-full h-full text-[15px] px-6 flex flex-col justify-between">
+			<Section to="Servicios Escolares" data={data} date={date} />
+			<Section to="el alumno" data={data} date={date} />
+		</section>
+	)
+
+}
+
+const Section: FC<{ to: string, data: MakeUpExam, date: Date }> = ({ to, data, date }) => {
+
+	return (
+		<div>
+			<div className="h-28">
+				<Image width={90} height={90} src={logo} alt="logo" className="inline-block align-top" />
+				<div className="ml-16 pl-4 inline-block align-top text-center mt-4 text-[18px]">
+					<p className="leading-none">UNIVERSIDAD TECNOLÓGICA DE LA MIXTECA</p>
+					<p className="font-semibold leading-none">DEPTO. DE SERVICIOS ESCOLARES</p>
+					<p className="font-bold">SOLICITUD DE EXAMEN EXTRAORDINARIO</p>
+				</div>
+			</div>
+
+			<div className="flex flex-col gap-3">
+				<div className="flex gap-4">
+					<p className="font-semibold">NOMBRE DEL ALUMNO:</p>
+					<p>{data.paternalSurname} {data.maternalSurname} {data.name}</p>
+				</div>
+
+				<div className="flex gap-6">
+					<div className="flex gap-4">
+						<p className="font-semibold">MATRÍCULA:</p>
+						<p>{data.enrollment}</p>
+					</div>
+					<div className="flex gap-4">
+						<p className="font-semibold">GRUPO ACTUAL:</p>
+						<p>{data.group}</p>
+					</div>
+					<div className="flex gap-4">
+						<p className="font-semibold">PORCENTAJE DE BECA:</p>
+						<p>{data.percentageOfScholarship}%</p>
+					</div>
+				</div>
+
+				<div className="flex gap-4 items-center">
+					<p className="font-semibold">MATERIA(S):</p>
+					<p>{data.makeupExamCourses}</p>
+				</div>
+
+				<div className="flex gap-4">
+					<p className="font-semibold">SEMESTRE AL QUE CORRESPONDE(N) LAS MATERIA(S):</p>
+					<p>{data.semester}</p>
+				</div>
+
+				<div className="flex gap-4">
+					<p>1° Extraordinario ({data.makeUpExamNumber == 1 ? '✔' : null})</p>
+					<p>2° Extraordinario ({data.makeUpExamNumber == 2 ? '✔' : null})</p>
+					<div className="flex gap-4">
+						<p>Número de materias cursadas y/o recursadas:</p>
+						<p>{data.courses}</p>
+					</div>
+				</div>
+			</div>
+
+			<div className="mt-4 text-center">
+				<p>HUAJUAPAN DE LEÓN, OAX, A {formatedDate(date)}</p>
+			</div>
+
+			<p className="font-bold mt-2 leading-none text-[14px]">En caso de que el alumno no tenga derecho a presentar el examen de acuerdo al Reglamento de alumnos de Licenciatura vigente, la calificación obtenida en el examen no tendrá validez.</p>
+
+			<div className="flex gap-16 justify-center mt-11 text-[14px]">
+				<p className="border-black border-t w-56 text-center leading-none">FIRMA DEL ALUMNO</p>
+				<p className="border-black border-t w-56 text-center leading-none">DEPTO. DE SERVICIOS ESCOLARES</p>
+			</div>
+
+			<small className="block mt-3">Comprobante para {to}.</small>
+		</div>
+	)
+
+}
diff --git a/app/ui/Navigation.tsx b/app/ui/Navigation.tsx
@@ -12,7 +12,8 @@ import { GitHubIcon, EmailIcon } from "@/app/icons"
 
 const routerTitles: { [key: string]: string } = {
 	'/internship': 'Prácticas Profesionales',
-	'/social_service': 'Servicio Social'
+	'/social_service': 'Servicio Social',
+	'/extraordinario': 'Extraordinario'
 }
 
 

diff --git a/app/ui/makeup_exam/Form.tsx b/app/ui/makeup_exam/Form.tsx
@@ -0,0 +1,207 @@
+'use client'
+
+import { MakeUpExam } from "@/src/models/MakeUpExam"
+import { Card, CardBody } from "@nextui-org/card"
+import { Input } from "@nextui-org/input"
+import { Radio, RadioGroup } from "@nextui-org/radio"
+import { Button } from "@nextui-org/button"
+import { Select, SelectItem } from "@nextui-org/select"
+import { Controller, useForm } from "react-hook-form"
+import { PDFWrapper } from "../PDFWrapper"
+import { Format } from "@/app/printingFormats/makeup_exam/Format"
+import { usePDF } from "@/src/hooks/usePDF"
+import { useState } from "react"
+
+
+export const Form = () => {
+
+	const { target, createPDF } = usePDF('Solicitud de Examen Extraordinario')
+	const [data, setData] = useState<MakeUpExam>()
+
+	const updateData = async (data: MakeUpExam) => setData(data)
+
+	const {
+		handleSubmit,
+		control
+	} = useForm<MakeUpExam>({
+		defaultValues: {
+			name: '',
+			paternalSurname: '',
+			maternalSurname: '',
+			enrollment: '',
+			group: '',
+			percentageOfScholarship: 100,
+			makeupExamCourses: '',
+			semester: 'Primero',
+			makeUpExamNumber: 1,
+			courses: 0,
+
+		}
+	})
+
+	const onSubmit = handleSubmit(async data => {
+		data.makeUpExamNumber = Number(data.makeUpExamNumber)
+		data.courses = Number(data.courses)
+		await updateData(data)
+
+		createPDF()
+	})
+
+	return (
+		<>
+			<Card>
+				<CardBody>
+					<form onSubmit={onSubmit} className="grid grid-cols-1 gap-5 md:grid-cols-3 md:gap-4 p-1">
+						<h3 className="col-span-3 text-xl">Datos Escolares</h3>
+
+						<Controller
+							name="name"
+							control={control}
+							render={({ field }) => (
+								<Input type="text" {...field} label="Nombre(s)" isRequired />
+							)}
+						/>
+
+						<Controller
+							name="paternalSurname"
+							control={control}
+							render={({ field }) => (
+								<Input type="text" {...field} label="Apellido Paterno" isRequired />
+							)}
+						/>
+
+
+						<Controller
+							name="maternalSurname"
+							control={control}
+							render={({ field }) => (
+								<Input type="text" {...field} label="Apellido Materno" isRequired />
+							)}
+						/>
+
+						<Controller
+							name="enrollment"
+							control={control}
+							render={({ field }) => (
+								<Input
+									type="text"
+									label="Matrícula"
+									isRequired
+									{...field}
+								/>
+							)}
+						/>
+
+						<Controller
+							name="group"
+							control={control}
+							render={({ field }) => (
+								<Input
+									type="text"
+									label="Grupo Actual"
+									isRequired
+									{...field}
+								/>
+							)}
+						/>
+
+						<Controller
+							name="percentageOfScholarship"
+							control={control}
+							render={({ field }) => (
+								<Input
+									type="number"
+									label="Porcentaje de beca"
+									isRequired
+									{...field}
+									value={String(field.value)}
+								/>
+							)}
+						/>
+
+
+						<h3 className="col-span-3 text-xl">Solicitud</h3>
+						<Controller
+							name="makeupExamCourses"
+							control={control}
+							render={({ field }) => (
+								<Input
+									type="text"
+									label="Materias"
+									isRequired
+									{...field}
+								/>
+							)}
+						/>
+
+						<Controller
+							name="semester"
+							control={control}
+							render={({ field }) => (
+								<Select
+									label="Semestre de la(s) materia(s)"
+									isRequired
+									{...field}
+									selectedKeys={[field.value]}
+								>
+									<SelectItem key="Primero" value="Primero">Primero</SelectItem>
+									<SelectItem key="Segundo" value="Segundo">Segundo</SelectItem>
+									<SelectItem key="Tercero" value="Tercero">Tercero</SelectItem>
+									<SelectItem key="Cuarto" value="Cuarto">Cuarto</SelectItem>
+									<SelectItem key="Quinto" value="Quinto">Quinto</SelectItem>
+									<SelectItem key="Sexto" value="Sexto">Sexto</SelectItem>
+									<SelectItem key="Séptimo" value="Séptimo">Séptimo</SelectItem>
+									<SelectItem key="Octavo" value="Octavo">Octavo</SelectItem>
+									<SelectItem key="Noveno" value="Noveno">Noveno</SelectItem>
+									<SelectItem key="Décimo" value="Décimo">Décimo</SelectItem>
+								</Select>
+							)}
+						/>
+
+						<Controller
+							name="makeUpExamNumber"
+							control={control}
+							render={({ field }) => (
+								<RadioGroup
+									label="Solicitud para:"
+									orientation="horizontal"
+									{...field}
+									value={String(field.value)}
+								>
+									<Radio value="1">Primer Extraordinario</Radio>
+									<Radio value="2">Segundo Extraordinario</Radio>
+								</RadioGroup>
+							)}
+						/>
+
+						<Controller
+							name="courses"
+							control={control}
+							render={({ field }) => (
+								<Input
+									type="number"
+									label="Número de materias cursadas y/o recursadas"
+									isRequired
+									{...field}
+									value={String(field.value)}
+								/>
+							)}
+						/>
+
+						<div className="flex justify-center mt-2 md:col-span-3">
+							<Button className="w-32" color="primary" type="submit">Descargar Solicitud</Button>
+						</div>
+					</form>
+				</CardBody>
+			</Card>
+
+			{data ? (
+				<PDFWrapper target={target}>
+					<Format data={data} date={new Date()} />
+				</PDFWrapper>
+			) : null}
+		</>
+
+	)
+
+}
diff --git a/public/tools.json b/public/tools.json
@@ -31,5 +31,17 @@
 		],
 		"date": "2023-11-10",
 		"link": "/social_service"
+	},
+	{
+		"id": "application_makeup_exam",
+		"type": "Solicitud",
+		"name": "Examen Extraordinario",
+		"description": "El examen extraordinario lo tienes que realizar si no has aprobado una materia de tu semestre. Tienes dos oportunidades para presentar exámenes extraordinarios y aprobar la materia. Si ambos intentos no son exitosos, podrás optar por un examen especial.",
+		"subtitle": "Lo que se generará es:",
+		"documentation": [
+			"Formato con datos rellenados para estudiante y servicios escolares."
+		],
+		"date": "2024-01-16",
+		"link": "/extraordinario"
 	}
 ]
diff --git a/src/models/MakeUpExam.ts b/src/models/MakeUpExam.ts
@@ -0,0 +1,12 @@
+export interface MakeUpExam {
+	name: string
+	paternalSurname: string
+	maternalSurname: string
+	enrollment: string
+	group: string
+	percentageOfScholarship: number
+	makeupExamCourses: string
+	semester: string
+	makeUpExamNumber: number
+	courses: number
+}