Compare commits
3 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 Tyrannuss
|
525c64dd74 | ||
|
Tyrannuss
|
512e22e78c | ||
 santiago
|
1cc2637b25 |
@@ -1,44 +1,42 @@
|
||||
'use client';
|
||||
"use client";
|
||||
import BotonRegresar from "@/components/boton-regresar";
|
||||
import CasoEspecialForm from "@/components/casoEspecial/caso-especial-form";
|
||||
import { useState } from "react";
|
||||
|
||||
export default function Nuevo() {
|
||||
const [isLoading, setIsLoading] = useState<boolean>(false);
|
||||
const [isLoading, setIsLoading] = useState<boolean>(false);
|
||||
|
||||
const imprimirError = (error: unknown) => {
|
||||
alert(`Error: ${JSON.stringify(error)}`)
|
||||
const imprimirError = (error: unknown) => {
|
||||
alert(`Error: ${JSON.stringify(error)}`);
|
||||
};
|
||||
|
||||
const imprimirMensaje = (message: string) => {
|
||||
alert(`${message}`);
|
||||
};
|
||||
|
||||
const imprimirWarning = (message: string, onConfirm: () => void) => {
|
||||
if (confirm(`${message}\n¿Desea continuar?`)) {
|
||||
onConfirm();
|
||||
}
|
||||
};
|
||||
|
||||
const imprimirMensaje = (message: string) => {
|
||||
alert(`${message}`);
|
||||
}
|
||||
const updateIsLoading = (value: boolean) => {
|
||||
setIsLoading(value);
|
||||
};
|
||||
|
||||
const imprimirWarning = (message: string, onConfirm: () => void) => {
|
||||
if (confirm(`${message}\n¿Desea continuar?`)) {
|
||||
onConfirm();
|
||||
}
|
||||
}
|
||||
return (
|
||||
<div>
|
||||
<BotonRegresar />
|
||||
|
||||
const updateIsLoading = (value: boolean) => {
|
||||
setIsLoading(value);
|
||||
}
|
||||
<h2 style={{ marginLeft: "19rem" }}>Agregar un Servicio Social</h2>
|
||||
|
||||
return (
|
||||
<div>
|
||||
<BotonRegresar />
|
||||
|
||||
<h2>Agregar un Servicio Social</h2>
|
||||
|
||||
<CasoEspecialForm
|
||||
imprimirError={imprimirError}
|
||||
imprimirMensaje={imprimirMensaje}
|
||||
imprimirWarning={imprimirWarning}
|
||||
updateIsLoading={updateIsLoading}
|
||||
/>
|
||||
{/* <CasoEspecialForm /> */}
|
||||
|
||||
|
||||
</div>
|
||||
)
|
||||
}
|
||||
<CasoEspecialForm
|
||||
imprimirError={imprimirError}
|
||||
imprimirMensaje={imprimirMensaje}
|
||||
imprimirWarning={imprimirWarning}
|
||||
updateIsLoading={updateIsLoading}
|
||||
/>
|
||||
{/* <CasoEspecialForm /> */}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -4,58 +4,90 @@ import React, { useEffect, useState } from "react";
|
||||
import { useRouter } from "next/navigation";
|
||||
import LiberarCasoEspecial from "@/components/casoEspecial/liberacion-caso-especial";
|
||||
|
||||
type LocalResponsable = { idUsuario?: number; idTipoUsuario?: number; tipoUsuario?: string | null; token?: string };
|
||||
type LocalResponsable = {
|
||||
idUsuario?: number;
|
||||
idTipoUsuario?: number;
|
||||
tipoUsuario?: string | null;
|
||||
token?: string;
|
||||
};
|
||||
|
||||
export default function Page() {
|
||||
const router = useRouter();
|
||||
const [responsable, setResponsable] = useState<LocalResponsable>({});
|
||||
const router = useRouter();
|
||||
const [responsable, setResponsable] = useState<LocalResponsable>({});
|
||||
|
||||
const getMessageFromUnknown = (err: unknown) => {
|
||||
if (typeof err === 'string') return err;
|
||||
if (err instanceof Error) return err.message;
|
||||
try { return JSON.stringify(err); } catch (_) { return String(err); }
|
||||
};
|
||||
const getMessageFromUnknown = (err: unknown) => {
|
||||
if (typeof err === "string") return err;
|
||||
if (err instanceof Error) return err.message;
|
||||
try {
|
||||
return JSON.stringify(err);
|
||||
} catch (_) {
|
||||
return String(err);
|
||||
}
|
||||
};
|
||||
|
||||
const imprimirError = (err: unknown = {}, title = '¡Hubo un error!', onConfirm: () => void = () => {}) => {
|
||||
const msg = getMessageFromUnknown(err);
|
||||
// eslint-disable-next-line no-alert
|
||||
alert(`${title}\n\n${msg}`);
|
||||
onConfirm();
|
||||
if (typeof err === 'object' && err !== null && (err as { err?: unknown }).err === 'token error') {
|
||||
try { localStorage.clear(); } catch (_) {}
|
||||
router.push('/');
|
||||
}
|
||||
};
|
||||
const imprimirError = (
|
||||
err: unknown = {},
|
||||
title = "¡Hubo un error!",
|
||||
onConfirm: () => void = () => {}
|
||||
) => {
|
||||
const msg = getMessageFromUnknown(err);
|
||||
// eslint-disable-next-line no-alert
|
||||
alert(`${title}\n\n${msg}`);
|
||||
onConfirm();
|
||||
if (
|
||||
typeof err === "object" &&
|
||||
err !== null &&
|
||||
(err as { err?: unknown }).err === "token error"
|
||||
) {
|
||||
try {
|
||||
localStorage.clear();
|
||||
} catch (_) {}
|
||||
router.push("/");
|
||||
}
|
||||
};
|
||||
|
||||
const getLocalhostInfo = () => {
|
||||
const idUsuario = Number(localStorage.getItem('idUsuario'));
|
||||
const idTipoUsuario = Number(localStorage.getItem('idTipoUsuario'));
|
||||
const tipoUsuario = localStorage.getItem('tipoUsuario');
|
||||
const token = localStorage.getItem('token') || undefined;
|
||||
setResponsable({ idUsuario: Number.isNaN(idUsuario) ? undefined : idUsuario, idTipoUsuario: Number.isNaN(idTipoUsuario) ? undefined : idTipoUsuario, tipoUsuario, token: token ?? undefined });
|
||||
};
|
||||
const getLocalhostInfo = () => {
|
||||
const idUsuario = Number(localStorage.getItem("idUsuario"));
|
||||
const idTipoUsuario = Number(localStorage.getItem("idTipoUsuario"));
|
||||
const tipoUsuario = localStorage.getItem("tipoUsuario");
|
||||
const token = localStorage.getItem("token") || undefined;
|
||||
setResponsable({
|
||||
idUsuario: Number.isNaN(idUsuario) ? undefined : idUsuario,
|
||||
idTipoUsuario: Number.isNaN(idTipoUsuario) ? undefined : idTipoUsuario,
|
||||
tipoUsuario,
|
||||
token: token ?? undefined,
|
||||
});
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
getLocalhostInfo();
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, []);
|
||||
useEffect(() => {
|
||||
getLocalhostInfo();
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
if (responsable.idTipoUsuario === 1) router.push('/admin');
|
||||
if (responsable.idTipoUsuario === 2) router.push('/responsable');
|
||||
if (responsable.idTipoUsuario === 3) router.push('/alumno');
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, [responsable]);
|
||||
useEffect(() => {
|
||||
if (responsable.idTipoUsuario === 1) router.push("/admin");
|
||||
if (responsable.idTipoUsuario === 2) router.push("/responsable");
|
||||
if (responsable.idTipoUsuario === 3) router.push("/alumno");
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, [responsable]);
|
||||
|
||||
return (
|
||||
<section className="container px-2 pb-6">
|
||||
<div className="pb-5 pt-6 mt-5 mb-4 border-b border-gray-200">
|
||||
<button onClick={() => router.push('/casoEspecial/nuevo')}>Nuevo Caso Especial</button>
|
||||
</div>
|
||||
return (
|
||||
<section className="container px-2 pb-6">
|
||||
<div className="pb-5 pt-6 mt-5 mb-4 border-b border-gray-200">
|
||||
<button onClick={() => router.push("/casoEspecial/nuevo")}>
|
||||
Nuevo Caso Especial
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{responsable.idTipoUsuario !== undefined && responsable.token ? (
|
||||
<LiberarCasoEspecial responsable={{ idTipoUsuario: responsable.idTipoUsuario!, token: responsable.token! }} imprimirError={(msg: string) => imprimirError(msg)} />
|
||||
) : null}
|
||||
</section>
|
||||
);
|
||||
{responsable.idTipoUsuario !== undefined && responsable.token ? (
|
||||
<LiberarCasoEspecial
|
||||
responsable={{
|
||||
idTipoUsuario: responsable.idTipoUsuario!,
|
||||
token: responsable.token!,
|
||||
}}
|
||||
imprimirError={(msg: string) => imprimirError(msg)}
|
||||
/>
|
||||
) : null}
|
||||
</section>
|
||||
);
|
||||
}
|
||||
|
||||
+93
-69
@@ -1,85 +1,109 @@
|
||||
'use client'
|
||||
"use client";
|
||||
import { axiosInstance } from "@/api/config";
|
||||
import { useRouter } from "next/navigation";
|
||||
import React from "react";
|
||||
|
||||
export default function Home() {
|
||||
const router = useRouter();
|
||||
const router = useRouter();
|
||||
|
||||
const handleOnSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
|
||||
e.preventDefault();
|
||||
const formData = new FormData(e.currentTarget);
|
||||
const object = Object.fromEntries(formData);
|
||||
const handleOnSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
|
||||
e.preventDefault();
|
||||
const formData = new FormData(e.currentTarget);
|
||||
const object = Object.fromEntries(formData);
|
||||
|
||||
try {
|
||||
const res = await axiosInstance.post('/usuario/login', object);
|
||||
try {
|
||||
const res = await axiosInstance.post("/usuario/login", object);
|
||||
|
||||
// Extraer datos del backend
|
||||
const token = res?.data?.token ?? '';
|
||||
const usuarioObj = res?.data?.Usuario ?? res?.data ?? {};
|
||||
const idUsuario = usuarioObj.idUsuario ?? '';
|
||||
const usuario = usuarioObj.usuario ?? '';
|
||||
const nombre = usuarioObj.nombre ?? '';
|
||||
const idTipoUsuario = Number(usuarioObj.TipoUsuario?.idTipoUsuario ?? 0);
|
||||
//const idTipoUsuario = Number((usuarioObj as any).TipoUsuario?.idTipoUsuario ?? 0);
|
||||
// Extraer datos del backend
|
||||
const token = res?.data?.token ?? "";
|
||||
const usuarioObj = res?.data?.Usuario ?? res?.data ?? {};
|
||||
const idUsuario = usuarioObj.idUsuario ?? "";
|
||||
const usuario = usuarioObj.usuario ?? "";
|
||||
const nombre = usuarioObj.nombre ?? "";
|
||||
const idTipoUsuario = Number(usuarioObj.TipoUsuario?.idTipoUsuario ?? 0);
|
||||
//const idTipoUsuario = Number((usuarioObj as any).TipoUsuario?.idTipoUsuario ?? 0);
|
||||
|
||||
// Guardar en localStorage
|
||||
localStorage.setItem("token", String(token));
|
||||
localStorage.setItem("idUsuario", String(idUsuario));
|
||||
localStorage.setItem("usuario", String(usuario));
|
||||
localStorage.setItem("nombre", String(nombre));
|
||||
localStorage.setItem("idTipoUsuario", String(idTipoUsuario));
|
||||
|
||||
// Guardar en localStorage
|
||||
localStorage.setItem('token', String(token));
|
||||
localStorage.setItem('idUsuario', String(idUsuario));
|
||||
localStorage.setItem('usuario', String(usuario));
|
||||
localStorage.setItem('nombre', String(nombre));
|
||||
localStorage.setItem('idTipoUsuario', String(idTipoUsuario));
|
||||
|
||||
// Validar y redirigir según el idTipoUsuario
|
||||
if (token && idUsuario && idTipoUsuario) {
|
||||
switch (idTipoUsuario) {
|
||||
case 1:
|
||||
router.push('/administrador');
|
||||
break;
|
||||
case 2:
|
||||
router.push('/responsable');
|
||||
break;
|
||||
case 3:
|
||||
router.push('/alumno');
|
||||
break;
|
||||
case 4:
|
||||
router.push('/casoEspecial');
|
||||
break;
|
||||
default:
|
||||
console.warn(`Tipo de usuario desconocido: ${idTipoUsuario}`);
|
||||
localStorage.clear();
|
||||
break;
|
||||
}
|
||||
} else {
|
||||
localStorage.clear();
|
||||
console.error('Error: datos de usuario incompletos');
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error en el inicio de sesión:', error);
|
||||
// Validar y redirigir según el idTipoUsuario
|
||||
if (token && idUsuario && idTipoUsuario) {
|
||||
switch (idTipoUsuario) {
|
||||
case 1:
|
||||
router.push("/administrador");
|
||||
break;
|
||||
case 2:
|
||||
router.push("/responsable");
|
||||
break;
|
||||
case 3:
|
||||
router.push("/alumno");
|
||||
break;
|
||||
case 4:
|
||||
router.push("/casoEspecial");
|
||||
break;
|
||||
default:
|
||||
console.warn(`Tipo de usuario desconocido: ${idTipoUsuario}`);
|
||||
localStorage.clear();
|
||||
break;
|
||||
}
|
||||
};
|
||||
} else {
|
||||
localStorage.clear();
|
||||
console.error("Error: datos de usuario incompletos");
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error en el inicio de sesión:", error);
|
||||
localStorage.clear();
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="d-flex justify-content-center align-items-center bg-light" style={{ minHeight: 'calc(100vh - 200px)' }}>
|
||||
<form className="p-4 shadow rounded bg-white w-100" style={{ maxWidth: '400px' }} onSubmit={handleOnSubmit}>
|
||||
<h2 className="text-center mb-4 fw-bold">IRIS</h2>
|
||||
return (
|
||||
<div
|
||||
className="d-flex justify-content-center align-items-center bg-light"
|
||||
style={{ minHeight: "calc(100vh - 200px)" }}
|
||||
>
|
||||
<form
|
||||
className="p-4 shadow rounded bg-white w-100"
|
||||
style={{ maxWidth: "400px" }}
|
||||
onSubmit={handleOnSubmit}
|
||||
>
|
||||
<h2 className="text-center mb-4 fw-bold">IRIS</h2>
|
||||
|
||||
<div className="mb-3">
|
||||
<label htmlFor="usuario" className="form-label">Usuario</label>
|
||||
<input type="text" name="usuario" id="usuario" className="form-control" required />
|
||||
</div>
|
||||
|
||||
<div className="mb-4">
|
||||
<label htmlFor="password" className="form-label">Contraseña</label>
|
||||
<input type="password" name="password" id="password" className="form-control" required />
|
||||
</div>
|
||||
|
||||
<div className="d-grid">
|
||||
<button type="submit" className="btn btn-primary btn-lg">Iniciar Sesión</button>
|
||||
</div>
|
||||
</form>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="usuario" className="form-label">
|
||||
Usuario
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
name="usuario"
|
||||
id="usuario"
|
||||
className="form-control"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
|
||||
<div className="mb-4">
|
||||
<label htmlFor="password" className="form-label">
|
||||
Contraseña
|
||||
</label>
|
||||
<input
|
||||
type="password"
|
||||
name="password"
|
||||
id="password"
|
||||
className="form-control"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="d-grid">
|
||||
<button type="submit" className="btn btn-primary btn-lg">
|
||||
Iniciar Sesión
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -99,6 +99,12 @@ export default function TablaServicioSocial({ admin, imprimirError }: Props) {
|
||||
};
|
||||
|
||||
|
||||
<<<<<<< HEAD
|
||||
export default function TablaServicioSocial() {
|
||||
|
||||
|
||||
=======
|
||||
>>>>>>> origin/develop
|
||||
return (
|
||||
<section>
|
||||
<div className="columns">
|
||||
|
||||
@@ -1,22 +1,23 @@
|
||||
"use client"
|
||||
"use client";
|
||||
|
||||
import { useRouter } from "next/navigation";
|
||||
import React from "react"
|
||||
import React from "react";
|
||||
|
||||
const BotonRegresar: React.FC = () => {
|
||||
const router = useRouter();
|
||||
const router = useRouter();
|
||||
|
||||
const handleGoBack = () => {
|
||||
//window.history.back();
|
||||
router.back();
|
||||
};
|
||||
|
||||
const handleGoBack = () => {
|
||||
//window.history.back();
|
||||
router.back();
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="pb-5 pt-3">
|
||||
<button onClick={handleGoBack} className="btn-outline-primary">Regresar</button>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
return (
|
||||
<div style={{ marginLeft: "19rem" }} className="pb-5 pt-3">
|
||||
<button onClick={handleGoBack} className="btn-outline-primary">
|
||||
Regresar
|
||||
</button>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default BotonRegresar
|
||||
export default BotonRegresar;
|
||||
|
||||
@@ -1,460 +1,491 @@
|
||||
'use client';
|
||||
"use client";
|
||||
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import { axiosInstance } from '@/api/config';
|
||||
import moment from 'moment';
|
||||
import 'bootstrap/dist/css/bootstrap.min.css';
|
||||
import { Col, FormGroup, FormLabel, InputGroup } from 'react-bootstrap';
|
||||
import { FaRegCalendarAlt, FaUpload } from 'react-icons/fa';
|
||||
import DatePicker from 'react-datepicker';
|
||||
import BotonRegresar from '../boton-regresar';
|
||||
import React, { useState, useEffect } from "react";
|
||||
import { axiosInstance } from "@/api/config";
|
||||
import moment from "moment";
|
||||
import "bootstrap/dist/css/bootstrap.min.css";
|
||||
import { Col, FormGroup, FormLabel, InputGroup } from "react-bootstrap";
|
||||
import { FaRegCalendarAlt, FaUpload } from "react-icons/fa";
|
||||
import DatePicker from "react-datepicker";
|
||||
import BotonRegresar from "../boton-regresar";
|
||||
|
||||
// 🔹 Tipos estrictos
|
||||
interface Alumno {
|
||||
idUsuario?: number;
|
||||
idCarrera?: number;
|
||||
nombre?: string;
|
||||
carrera?: string;
|
||||
creditos?: string;
|
||||
idUsuario?: number;
|
||||
idCarrera?: number;
|
||||
nombre?: string;
|
||||
carrera?: string;
|
||||
creditos?: string;
|
||||
}
|
||||
|
||||
interface Responsable {
|
||||
//token: { headers: Record<string, string> };
|
||||
tokenArchivo: { headers: Record<string, string> };
|
||||
//token: { headers: Record<string, string> };
|
||||
tokenArchivo: { headers: Record<string, string> };
|
||||
}
|
||||
|
||||
interface Props {
|
||||
//responsable: Responsable;
|
||||
imprimirError: (msg: { message: string }) => void;
|
||||
imprimirMensaje: (msg: string) => void;
|
||||
imprimirWarning: (msg: string, callback: () => void) => void;
|
||||
updateIsLoading: (value: boolean) => void;
|
||||
//responsable: Responsable;
|
||||
imprimirError: (msg: { message: string }) => void;
|
||||
imprimirMensaje: (msg: string) => void;
|
||||
imprimirWarning: (msg: string, callback: () => void) => void;
|
||||
updateIsLoading: (value: boolean) => void;
|
||||
}
|
||||
|
||||
export default function CasoEspecialForm({
|
||||
//responsable,
|
||||
imprimirError,
|
||||
imprimirMensaje,
|
||||
imprimirWarning,
|
||||
updateIsLoading,
|
||||
//responsable,
|
||||
imprimirError,
|
||||
imprimirMensaje,
|
||||
imprimirWarning,
|
||||
updateIsLoading,
|
||||
}: Props) {
|
||||
// 🔹 Estados del formulario
|
||||
const [dependencia, setDependencia] = useState('');
|
||||
const [direccion, setDireccion] = useState('');
|
||||
const [correo, setCorreo] = useState('');
|
||||
const [idStatus, setIdStatus] = useState('');
|
||||
const [institucion, setInstitucion] = useState('');
|
||||
const [motivo, setMotivo] = useState('');
|
||||
const [numeroCuenta, setNumeroCuenta] = useState('');
|
||||
const [telefono, setTelefono] = useState('');
|
||||
const [alumno, setAlumno] = useState<Alumno>({});
|
||||
const [fechaInicio, setFechaInicio] = useState<Date>(new Date());
|
||||
const [fechaFin, setFechaFin] = useState<Date>(new Date());
|
||||
const [fechaNacimiento, setFechaNacimiento] = useState<Date>(new Date());
|
||||
const [file, setFile] = useState<File | null>(null);
|
||||
const [minDate, setMinDate] = useState<Date>(new Date('2020-01-02'));
|
||||
const [minDate2, setMinDate2] = useState<Date>(new Date());
|
||||
// 🔹 Estados del formulario
|
||||
const [dependencia, setDependencia] = useState("");
|
||||
const [direccion, setDireccion] = useState("");
|
||||
const [correo, setCorreo] = useState("");
|
||||
const [idStatus, setIdStatus] = useState("");
|
||||
const [institucion, setInstitucion] = useState("");
|
||||
const [motivo, setMotivo] = useState("");
|
||||
const [numeroCuenta, setNumeroCuenta] = useState("");
|
||||
const [telefono, setTelefono] = useState("");
|
||||
const [alumno, setAlumno] = useState<Alumno>({});
|
||||
const [fechaInicio, setFechaInicio] = useState<Date>(new Date());
|
||||
const [fechaFin, setFechaFin] = useState<Date>(new Date());
|
||||
const [fechaNacimiento, setFechaNacimiento] = useState<Date>(new Date());
|
||||
const [file, setFile] = useState<File | null>(null);
|
||||
const [minDate, setMinDate] = useState<Date>(new Date("2020-01-02"));
|
||||
const [minDate2, setMinDate2] = useState<Date>(new Date());
|
||||
const handleFechaInicioChange = (date: Date | null) => {
|
||||
setFechaInicio(date || new Date());
|
||||
};
|
||||
const handleFechaFinChange = (date: Date | null) => {
|
||||
setFechaFin(date || new Date());
|
||||
};
|
||||
const handleFechaNacimientoChange = (date: Date | null) => {
|
||||
setFechaNacimiento(date || new Date());
|
||||
};
|
||||
// Función para resetear campos
|
||||
const resetear = (): void => {
|
||||
setDependencia("");
|
||||
setDireccion("");
|
||||
setCorreo("");
|
||||
setIdStatus("");
|
||||
setInstitucion("");
|
||||
setMotivo("");
|
||||
setTelefono("");
|
||||
setAlumno({});
|
||||
setFechaInicio(new Date());
|
||||
setFechaFin(new Date());
|
||||
setFechaNacimiento(new Date());
|
||||
setFile(null);
|
||||
};
|
||||
|
||||
// Función para resetear campos
|
||||
const resetear = (): void => {
|
||||
setDependencia('');
|
||||
setDireccion('');
|
||||
setCorreo('');
|
||||
setIdStatus('');
|
||||
setInstitucion('');
|
||||
setMotivo('');
|
||||
setTelefono('');
|
||||
setAlumno({});
|
||||
setFechaInicio(new Date());
|
||||
setFechaFin(new Date());
|
||||
setFechaNacimiento(new Date());
|
||||
setFile(null);
|
||||
};
|
||||
// Validar extensión
|
||||
const validarExtencion = (archivo: File): void => {
|
||||
const permitidas = [/.zip$/i, /.rar$/i];
|
||||
const esValida = permitidas.some((regex) => regex.test(archivo.name));
|
||||
if (!esValida) {
|
||||
setFile(null);
|
||||
imprimirError({
|
||||
message:
|
||||
"Asegúrate de ingresar un archivo con la extensión correcta (.zip o .rar).",
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
// Validar extensión
|
||||
const validarExtencion = (archivo: File): void => {
|
||||
const permitidas = [/.zip$/i, /.rar$/i];
|
||||
const esValida = permitidas.some((regex) => regex.test(archivo.name));
|
||||
if (!esValida) {
|
||||
setFile(null);
|
||||
imprimirError({
|
||||
message: 'Asegúrate de ingresar un archivo con la extensión correcta (.zip o .rar).',
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
// Mostrar/ocultar botón de enviar
|
||||
const mostrarBoton = (): boolean => {
|
||||
return (
|
||||
!alumno.idUsuario ||
|
||||
!telefono ||
|
||||
!direccion ||
|
||||
!correo ||
|
||||
!idStatus ||
|
||||
(idStatus === '11' && !motivo) ||
|
||||
(idStatus === '12' && (!dependencia || !institucion)) ||
|
||||
!file
|
||||
);
|
||||
};
|
||||
|
||||
// Buscar alumno
|
||||
const buscarAlumno = async (): Promise<void> => {
|
||||
try {
|
||||
updateIsLoading(true);
|
||||
const res = await axiosInstance.get(`/usuario/escolares?numeroCuenta=${numeroCuenta}`);
|
||||
resetear();
|
||||
setAlumno(res.data);
|
||||
} catch (err: unknown) {
|
||||
resetear();
|
||||
setNumeroCuenta('');
|
||||
let msg = { message: 'Error al buscar alumno.' };
|
||||
if (typeof err === 'object' && err !== null && 'response' in err) {
|
||||
const anyErr = err as { response?: { data?: { message?: unknown } } };
|
||||
const m = anyErr.response?.data as { message?: unknown } | undefined;
|
||||
msg = { message: m?.message ? String(m.message) : msg.message };
|
||||
} else if (err instanceof Error) msg = { message: err.message };
|
||||
imprimirError(msg);
|
||||
} finally {
|
||||
updateIsLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
// Enviar formulario
|
||||
const enviar = async (): Promise<void> => {
|
||||
if (!file) return;
|
||||
|
||||
const data = {
|
||||
idUsuario: alumno.idUsuario,
|
||||
idCarrera: alumno.idCarrera,
|
||||
idStatus,
|
||||
numeroCuenta,
|
||||
creditos: alumno.creditos,
|
||||
correo,
|
||||
fechaInicio: moment(fechaInicio),
|
||||
fechaFin: moment(fechaFin),
|
||||
fechaNacimiento: moment(fechaNacimiento),
|
||||
direccion,
|
||||
telefono,
|
||||
institucion,
|
||||
dependencia,
|
||||
motivo,
|
||||
};
|
||||
|
||||
const formData = new FormData();
|
||||
formData.append('alumno', JSON.stringify(data));
|
||||
formData.append('archivos', file);
|
||||
|
||||
try {
|
||||
updateIsLoading(true);
|
||||
const res = await axiosInstance.post(`/caso_especial/nuevo`, formData);
|
||||
resetear();
|
||||
setNumeroCuenta('');
|
||||
imprimirMensaje(res.data.message);
|
||||
} catch (err: unknown) {
|
||||
let msg: { message: string } = { message: 'Error al enviar formulario.' };
|
||||
if (typeof err === 'object' && err !== null && 'response' in err) {
|
||||
const anyErr = err as { response?: { data?: unknown } };
|
||||
if (anyErr.response && typeof anyErr.response.data === 'object' && anyErr.response.data !== null) {
|
||||
const d = anyErr.response.data as { message?: unknown } | unknown;
|
||||
if (d && typeof d === 'object' && 'message' in d && typeof (d as { message?: unknown }).message === 'string') {
|
||||
msg = { message: (d as { message?: unknown }).message as string };
|
||||
}
|
||||
}
|
||||
} else if (err instanceof Error) {
|
||||
msg = { message: err.message };
|
||||
}
|
||||
imprimirError(msg);
|
||||
} finally {
|
||||
updateIsLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
// Actualizar fechas automáticamente
|
||||
const updateFechas = (): void => {
|
||||
const nuevaFin = new Date(
|
||||
fechaInicio.getFullYear(),
|
||||
fechaInicio.getMonth() + 6,
|
||||
fechaInicio.getDate()
|
||||
);
|
||||
setFechaFin(nuevaFin);
|
||||
setMinDate2(nuevaFin);
|
||||
};
|
||||
|
||||
// Efectos (equivalentes a watch)
|
||||
useEffect(() => {
|
||||
setMotivo('');
|
||||
setInstitucion('');
|
||||
setDependencia('');
|
||||
}, [idStatus]);
|
||||
|
||||
useEffect(() => {
|
||||
if (file && file.size >= 20_000_000) {
|
||||
imprimirError({ message: 'El tamaño del archivo excede los 20MB.' });
|
||||
setFile(null);
|
||||
} else if (file) {
|
||||
validarExtencion(file);
|
||||
}
|
||||
}, [file]);
|
||||
|
||||
useEffect(() => {
|
||||
updateFechas();
|
||||
}, [fechaInicio]);
|
||||
|
||||
useEffect(() => {
|
||||
const min = new Date('2020-01-02');
|
||||
min.setDate(min.getDate() - 1);
|
||||
setMinDate(min);
|
||||
updateFechas();
|
||||
}, []);
|
||||
|
||||
|
||||
{/* Validaciones del cuestionario */}
|
||||
|
||||
|
||||
// Render
|
||||
// Mostrar/ocultar botón de enviar
|
||||
const mostrarBoton = (): boolean => {
|
||||
return (
|
||||
<div className="container mt-4">
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Número de Cuenta</label>
|
||||
<div className="input-group">
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
placeholder="Número de Cuenta"
|
||||
maxLength={9}
|
||||
value={numeroCuenta}
|
||||
onChange={(e) => setNumeroCuenta(e.target.value)}
|
||||
onKeyDown={(e) => e.key === 'Enter' && buscarAlumno()}
|
||||
/>
|
||||
<button className="btn btn-info text-white" onClick={buscarAlumno}>
|
||||
Buscar
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
!alumno.idUsuario ||
|
||||
!telefono ||
|
||||
!direccion ||
|
||||
!correo ||
|
||||
!idStatus ||
|
||||
(idStatus === "11" && !motivo) ||
|
||||
(idStatus === "12" && (!dependencia || !institucion)) ||
|
||||
!file
|
||||
);
|
||||
};
|
||||
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Nombre</label>
|
||||
<p className="form-control">{alumno.nombre || ''}</p>
|
||||
</div>
|
||||
// Buscar alumno
|
||||
const buscarAlumno = async (): Promise<void> => {
|
||||
try {
|
||||
updateIsLoading(true);
|
||||
const res = await axiosInstance.get(
|
||||
`/usuario/escolares?numeroCuenta=${numeroCuenta}`
|
||||
);
|
||||
resetear();
|
||||
setAlumno(res.data);
|
||||
} catch (err: unknown) {
|
||||
resetear();
|
||||
setNumeroCuenta("");
|
||||
let msg = { message: "Error al buscar alumno." };
|
||||
if (typeof err === "object" && err !== null && "response" in err) {
|
||||
const anyErr = err as { response?: { data?: { message?: unknown } } };
|
||||
const m = anyErr.response?.data as { message?: unknown } | undefined;
|
||||
msg = { message: m?.message ? String(m.message) : msg.message };
|
||||
} else if (err instanceof Error) msg = { message: err.message };
|
||||
imprimirError(msg);
|
||||
} finally {
|
||||
updateIsLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Carrera</label>
|
||||
<p className="form-control">{alumno.carrera || ''}</p>
|
||||
</div>
|
||||
// Enviar formulario
|
||||
const enviar = async (): Promise<void> => {
|
||||
if (!file) return;
|
||||
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Créditos</label>
|
||||
<p className="form-control">
|
||||
{alumno.creditos ? parseInt(alumno.creditos) : ''}{' '}
|
||||
{alumno.creditos ? '%' : ''}
|
||||
</p>
|
||||
</div>
|
||||
const data = {
|
||||
idUsuario: alumno.idUsuario,
|
||||
idCarrera: alumno.idCarrera,
|
||||
idStatus,
|
||||
numeroCuenta,
|
||||
creditos: alumno.creditos,
|
||||
correo,
|
||||
fechaInicio: moment(fechaInicio),
|
||||
fechaFin: moment(fechaFin),
|
||||
fechaNacimiento: moment(fechaNacimiento),
|
||||
direccion,
|
||||
telefono,
|
||||
institucion,
|
||||
dependencia,
|
||||
motivo,
|
||||
};
|
||||
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Dirección</label>
|
||||
<input
|
||||
const formData = new FormData();
|
||||
formData.append("alumno", JSON.stringify(data));
|
||||
formData.append("archivos", file);
|
||||
|
||||
try {
|
||||
updateIsLoading(true);
|
||||
const res = await axiosInstance.post(`/caso_especial/nuevo`, formData);
|
||||
resetear();
|
||||
setNumeroCuenta("");
|
||||
imprimirMensaje(res.data.message);
|
||||
} catch (err: unknown) {
|
||||
let msg: { message: string } = { message: "Error al enviar formulario." };
|
||||
if (typeof err === "object" && err !== null && "response" in err) {
|
||||
const anyErr = err as { response?: { data?: unknown } };
|
||||
if (
|
||||
anyErr.response &&
|
||||
typeof anyErr.response.data === "object" &&
|
||||
anyErr.response.data !== null
|
||||
) {
|
||||
const d = anyErr.response.data as { message?: unknown } | unknown;
|
||||
if (
|
||||
d &&
|
||||
typeof d === "object" &&
|
||||
"message" in d &&
|
||||
typeof (d as { message?: unknown }).message === "string"
|
||||
) {
|
||||
msg = { message: (d as { message?: unknown }).message as string };
|
||||
}
|
||||
}
|
||||
} else if (err instanceof Error) {
|
||||
msg = { message: err.message };
|
||||
}
|
||||
imprimirError(msg);
|
||||
} finally {
|
||||
updateIsLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
// Actualizar fechas automáticamente
|
||||
const updateFechas = (): void => {
|
||||
const nuevaFin = new Date(
|
||||
fechaInicio.getFullYear(),
|
||||
fechaInicio.getMonth() + 6,
|
||||
fechaInicio.getDate()
|
||||
);
|
||||
setFechaFin(nuevaFin);
|
||||
setMinDate2(nuevaFin);
|
||||
};
|
||||
|
||||
// Efectos (equivalentes a watch)
|
||||
useEffect(() => {
|
||||
setMotivo("");
|
||||
setInstitucion("");
|
||||
setDependencia("");
|
||||
}, [idStatus]);
|
||||
|
||||
useEffect(() => {
|
||||
if (file && file.size >= 20_000_000) {
|
||||
imprimirError({ message: "El tamaño del archivo excede los 20MB." });
|
||||
setFile(null);
|
||||
} else if (file) {
|
||||
validarExtencion(file);
|
||||
}
|
||||
}, [file]);
|
||||
|
||||
useEffect(() => {
|
||||
updateFechas();
|
||||
}, [fechaInicio]);
|
||||
|
||||
useEffect(() => {
|
||||
const min = new Date("2020-01-02");
|
||||
min.setDate(min.getDate() - 1);
|
||||
setMinDate(min);
|
||||
updateFechas();
|
||||
}, []);
|
||||
|
||||
{
|
||||
/* Validaciones del cuestionario */
|
||||
}
|
||||
|
||||
// Render
|
||||
return (
|
||||
<div className="container mt-4">
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Número de Cuenta</label>
|
||||
<div className="input-group">
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
maxLength={200}
|
||||
value={direccion}
|
||||
onChange={(e) => setDireccion(e.target.value)}
|
||||
/>
|
||||
placeholder="Número de Cuenta"
|
||||
maxLength={9}
|
||||
value={numeroCuenta}
|
||||
onChange={(e) => setNumeroCuenta(e.target.value)}
|
||||
onKeyDown={(e) => e.key === "Enter" && buscarAlumno()}
|
||||
/>
|
||||
<button className="btn btn-info text-white" onClick={buscarAlumno}>
|
||||
Buscar
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Teléfono</label>
|
||||
<input
|
||||
type="tel"
|
||||
className="form-control"
|
||||
maxLength={10}
|
||||
value={telefono}
|
||||
onChange={(e) => setTelefono(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Correo electrónico</label>
|
||||
<input
|
||||
type="email"
|
||||
className="form-control"
|
||||
value={correo}
|
||||
onChange={(e) => setCorreo(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<Col>
|
||||
<FormGroup>
|
||||
<FormLabel>Fecha de inicio</FormLabel>
|
||||
<InputGroup>
|
||||
<InputGroup.Text>
|
||||
<FaRegCalendarAlt />
|
||||
</InputGroup.Text>
|
||||
|
||||
<DatePicker
|
||||
selected={fechaInicio}
|
||||
minDate={minDate}
|
||||
dateFormat="dd-MM-yyyy"
|
||||
className="form-control"
|
||||
wrapperClassName="flex-grow-1"
|
||||
calendarClassName="mi-calendario"
|
||||
/>
|
||||
</InputGroup>
|
||||
</FormGroup>
|
||||
</Col>
|
||||
|
||||
<Col>
|
||||
<FormGroup>
|
||||
<FormLabel>Fecha de fin</FormLabel>
|
||||
<InputGroup>
|
||||
<InputGroup.Text>
|
||||
<FaRegCalendarAlt />
|
||||
</InputGroup.Text>
|
||||
|
||||
<DatePicker
|
||||
selected={fechaFin}
|
||||
value={fechaFin.toISOString().substring(0,10)}
|
||||
minDate={minDate2}
|
||||
dateFormat="dd-MM-yyyy"
|
||||
className="form-control"
|
||||
wrapperClassName="flex-grow-1"
|
||||
calendarClassName="mi-calendario"
|
||||
/>
|
||||
</InputGroup>
|
||||
</FormGroup>
|
||||
</Col>
|
||||
|
||||
<Col>
|
||||
<FormGroup>
|
||||
<FormLabel>Fecha de nacimiento</FormLabel>
|
||||
<InputGroup>
|
||||
<InputGroup.Text>
|
||||
<FaRegCalendarAlt />
|
||||
</InputGroup.Text>
|
||||
|
||||
<DatePicker
|
||||
selected={fechaNacimiento}
|
||||
maxDate={new Date()}
|
||||
dateFormat="dd-MM-yyyy"
|
||||
className="form-control"
|
||||
wrapperClassName="flex-grow-1"
|
||||
calendarClassName="mi-calendario"
|
||||
/>
|
||||
</InputGroup>
|
||||
</FormGroup>
|
||||
</Col>
|
||||
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Fecha de inicio</label>
|
||||
<input
|
||||
type="date"
|
||||
className="form-control"
|
||||
value={fechaInicio.toISOString().substring(0, 10)}
|
||||
onChange={(e) => setFechaInicio(new Date(e.target.value))}
|
||||
min={minDate.toISOString().substring(0, 10)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{fechaInicio && (
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Fecha de fin</label>
|
||||
<input
|
||||
type="date"
|
||||
className="form-control"
|
||||
value={fechaFin.toISOString().substring(0, 10)}
|
||||
onChange={(e) => setFechaFin(new Date(e.target.value))}
|
||||
min={minDate2.toISOString().substring(0, 10)}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Fecha de nacimiento</label>
|
||||
<input
|
||||
type="date"
|
||||
className="form-control"
|
||||
max={new Date().toISOString().substring(0, 10)}
|
||||
value={fechaNacimiento.toISOString().substring(0, 10)}
|
||||
onChange={(e) => setFechaNacimiento(new Date(e.target.value))}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Artículo</label>
|
||||
<select
|
||||
className="form-select"
|
||||
value={idStatus}
|
||||
onChange={(e) => setIdStatus(e.target.value)}
|
||||
>
|
||||
<option value="">Selecciona una opción</option>
|
||||
<option value="11">Artículo 52</option>
|
||||
<option value="12">Artículo 91</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
{idStatus === '11' && (
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Motivo</label>
|
||||
<select
|
||||
className="form-select"
|
||||
value={motivo}
|
||||
onChange={(e) => setMotivo(e.target.value)}
|
||||
>
|
||||
<option value="">Selecciona una opción</option>
|
||||
<option value="1">Tercera edad</option>
|
||||
<option value="2">Capacidades diferentes</option>
|
||||
</select>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{idStatus === '12' && (
|
||||
<>
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Institución</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
maxLength={250}
|
||||
value={institucion}
|
||||
onChange={(e) => setInstitucion(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Dependencia</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
maxLength={250}
|
||||
value={dependencia}
|
||||
onChange={(e) => setDependencia(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
|
||||
<FormGroup className='mb-3'>
|
||||
<FormLabel>Archivo (.zip, .rar)</FormLabel>
|
||||
<div
|
||||
className='border p-4 text-center rounded'
|
||||
style={{ cursor: 'pointer' }}
|
||||
onClick={() => document.getElementById('fileInput')?.click()}
|
||||
>
|
||||
<FaUpload size={40} className='mb-2'/>
|
||||
<p className='mb-1'>
|
||||
{file?.name || 'Arrastra aquí tu archivo o da click aquí para buscar'}
|
||||
</p>
|
||||
<p className='is-size-6'>Tmaño máximo 20MB</p>
|
||||
<p className='is-size-6'>Si al momento de elegir un archivo este no se selecciona, haga click en cancelar en la ventana emergente e intente de nuevo.</p>
|
||||
</div>
|
||||
<input
|
||||
id='fileInput'
|
||||
type="file"
|
||||
style={{ display: 'none'}}
|
||||
onChange={e => setFile(e.target.files ? e.target.files[0] : null)}
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Nombre</label>
|
||||
<p className="form-control" style={{ padding: "1rem 1rem" }}>
|
||||
{alumno.nombre || ""}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Carrera</label>
|
||||
<p className="form-control" style={{ padding: "1rem 1rem" }}>
|
||||
{alumno.carrera || ""}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Créditos</label>
|
||||
<p className="form-control" style={{ padding: "1rem 1rem" }}>
|
||||
{alumno.creditos ? parseInt(alumno.creditos) : ""}{" "}
|
||||
{alumno.creditos ? "%" : ""}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Dirección</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
maxLength={200}
|
||||
value={direccion}
|
||||
onChange={(e) => setDireccion(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Teléfono</label>
|
||||
<input
|
||||
type="tel"
|
||||
className="form-control"
|
||||
maxLength={10}
|
||||
value={telefono}
|
||||
onChange={(e) => setTelefono(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Correo electrónico</label>
|
||||
<input
|
||||
type="email"
|
||||
className="form-control"
|
||||
value={correo}
|
||||
onChange={(e) => setCorreo(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<Col>
|
||||
<FormGroup>
|
||||
<FormLabel>Fecha de inicio</FormLabel>
|
||||
<InputGroup>
|
||||
<InputGroup.Text>
|
||||
<FaRegCalendarAlt />
|
||||
</InputGroup.Text>
|
||||
|
||||
<DatePicker
|
||||
selected={fechaInicio}
|
||||
onChange={handleFechaInicioChange}
|
||||
minDate={minDate}
|
||||
dateFormat="yyyy-MM-dd"
|
||||
className="form-control"
|
||||
wrapperClassName="flex-grow-1"
|
||||
calendarClassName="mi-calendario"
|
||||
/>
|
||||
</InputGroup>
|
||||
</FormGroup>
|
||||
</Col>
|
||||
|
||||
{/*
|
||||
<Col>
|
||||
<FormGroup>
|
||||
<FormLabel>Fecha de fin</FormLabel>
|
||||
<InputGroup>
|
||||
<InputGroup.Text>
|
||||
<FaRegCalendarAlt />
|
||||
</InputGroup.Text>
|
||||
|
||||
<DatePicker
|
||||
selected={fechaFin}
|
||||
onChange={handleFechaFinChange}
|
||||
value={fechaFin.toISOString().substring(0, 10)}
|
||||
minDate={minDate2}
|
||||
dateFormat="yyyy-MM-dd"
|
||||
className="form-control"
|
||||
wrapperClassName="flex-grow-1"
|
||||
calendarClassName="mi-calendario"
|
||||
/>
|
||||
</InputGroup>
|
||||
</FormGroup>
|
||||
</Col>
|
||||
|
||||
<Col>
|
||||
<FormGroup>
|
||||
<FormLabel>Fecha de nacimiento</FormLabel>
|
||||
<InputGroup>
|
||||
<InputGroup.Text>
|
||||
<FaRegCalendarAlt />
|
||||
</InputGroup.Text>
|
||||
|
||||
<DatePicker
|
||||
selected={fechaNacimiento}
|
||||
maxDate={new Date()}
|
||||
onChange={handleFechaNacimientoChange}
|
||||
dateFormat="yyyy-MM-dd"
|
||||
className="form-control"
|
||||
wrapperClassName="flex-grow-1"
|
||||
calendarClassName="mi-calendario"
|
||||
/>
|
||||
</InputGroup>
|
||||
</FormGroup>
|
||||
</Col>
|
||||
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Fecha de inicio</label>
|
||||
<input
|
||||
type="date"
|
||||
className="form-control"
|
||||
value={fechaInicio.toISOString().substring(0, 10)}
|
||||
onChange={(e) => setFechaInicio(new Date(e.target.value))}
|
||||
min={minDate.toISOString().substring(0, 10)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{fechaInicio && (
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Fecha de fin</label>
|
||||
<input
|
||||
type="date"
|
||||
className="form-control"
|
||||
value={fechaFin.toISOString().substring(0, 10)}
|
||||
onChange={(e) => setFechaFin(new Date(e.target.value))}
|
||||
min={minDate2.toISOString().substring(0, 10)}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Fecha de nacimiento</label>
|
||||
<input
|
||||
type="date"
|
||||
className="form-control"
|
||||
max={new Date().toISOString().substring(0, 10)}
|
||||
value={fechaNacimiento.toISOString().substring(0, 10)}
|
||||
onChange={(e) => setFechaNacimiento(new Date(e.target.value))}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Artículo</label>
|
||||
<select
|
||||
className="form-select"
|
||||
value={idStatus}
|
||||
onChange={(e) => setIdStatus(e.target.value)}
|
||||
>
|
||||
<option value="">Selecciona una opción</option>
|
||||
<option value="11">Artículo 52</option>
|
||||
<option value="12">Artículo 91</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
{idStatus === "11" && (
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Motivo</label>
|
||||
<select
|
||||
className="form-select"
|
||||
value={motivo}
|
||||
onChange={(e) => setMotivo(e.target.value)}
|
||||
>
|
||||
<option value="">Selecciona una opción</option>
|
||||
<option value="1">Tercera edad</option>
|
||||
<option value="2">Capacidades diferentes</option>
|
||||
</select>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{idStatus === "12" && (
|
||||
<>
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Institución</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
maxLength={250}
|
||||
value={institucion}
|
||||
onChange={(e) => setInstitucion(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Dependencia</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
maxLength={250}
|
||||
value={dependencia}
|
||||
onChange={(e) => setDependencia(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
|
||||
<FormGroup className="mb-3">
|
||||
<FormLabel>Archivo (.zip, .rar)</FormLabel>
|
||||
<div
|
||||
className="border p-4 text-center rounded"
|
||||
style={{ cursor: "pointer" }}
|
||||
onClick={() => document.getElementById("fileInput")?.click()}
|
||||
>
|
||||
<FaUpload size={40} className="mb-2" />
|
||||
<p className="mb-1">
|
||||
{file?.name ||
|
||||
"Arrastra aquí tu archivo o da click aquí para buscar"}
|
||||
</p>
|
||||
<p className="is-size-6">Tmaño máximo 20MB</p>
|
||||
<p className="is-size-6">
|
||||
Si al momento de elegir un archivo este no se selecciona, haga click
|
||||
en cancelar en la ventana emergente e intente de nuevo.
|
||||
</p>
|
||||
</div>
|
||||
<input
|
||||
id="fileInput"
|
||||
type="file"
|
||||
style={{ display: "none" }}
|
||||
onChange={(e) => setFile(e.target.files ? e.target.files[0] : null)}
|
||||
/>
|
||||
</FormGroup>
|
||||
|
||||
{/*
|
||||
<div className="mb-3">
|
||||
<label className="form-label">Archivo (.zip, .rar)</label>
|
||||
<input
|
||||
@@ -467,22 +498,22 @@ export default function CasoEspecialForm({
|
||||
</div>
|
||||
*/}
|
||||
|
||||
<div className="text-center mt-4 mb-3">
|
||||
<button
|
||||
className="btn btn-success"
|
||||
disabled={mostrarBoton()}
|
||||
onClick={() =>
|
||||
imprimirWarning(
|
||||
'¿Estás seguro(a) de querer crear un nuevo caso especial?',
|
||||
enviar
|
||||
)
|
||||
}
|
||||
>
|
||||
Enviar
|
||||
</button>
|
||||
</div>
|
||||
<div className="text-center mt-4 mb-3">
|
||||
<button
|
||||
className="btn btn-success"
|
||||
disabled={mostrarBoton()}
|
||||
onClick={() =>
|
||||
imprimirWarning(
|
||||
"¿Estás seguro(a) de querer crear un nuevo caso especial?",
|
||||
enviar
|
||||
)
|
||||
}
|
||||
>
|
||||
Enviar
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<BotonRegresar />
|
||||
</div>
|
||||
);
|
||||
<BotonRegresar />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -2,30 +2,28 @@ import { useRouter } from "next/navigation";
|
||||
import { useEffect, useState } from "react";
|
||||
|
||||
export default function Logout() {
|
||||
const router = useRouter();
|
||||
const [usuario, setUsuario] = useState<string | null>(null);
|
||||
const router = useRouter();
|
||||
const [usuario, setUsuario] = useState<string | null>(null);
|
||||
|
||||
useEffect(() => {
|
||||
const storedUsuario = localStorage.getItem("usuario")
|
||||
setUsuario(storedUsuario);
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
const storedUsuario = localStorage.getItem("usuario");
|
||||
setUsuario(storedUsuario);
|
||||
}, []);
|
||||
|
||||
const handleLogout = () => {
|
||||
localStorage.removeItem("token");
|
||||
localStorage.removeItem('usuario');
|
||||
router.push("/");
|
||||
}
|
||||
|
||||
return(
|
||||
<section className="bg-dorado">
|
||||
<div className="container d-flex justify-content-between align-items-center">
|
||||
<h2 className="m-2 text-white">{ usuario }</h2>
|
||||
<button onClick={handleLogout} className="m-2 bg-danger">
|
||||
Cerrar Sesion
|
||||
</button>
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
const handleLogout = () => {
|
||||
localStorage.removeItem("token");
|
||||
localStorage.removeItem("usuario");
|
||||
router.push("/");
|
||||
};
|
||||
|
||||
}
|
||||
return (
|
||||
<section className="bg-dorado">
|
||||
<div className="container d-flex justify-content-between align-items-center">
|
||||
<h2 className="m-2 text-white">{usuario}</h2>
|
||||
<button onClick={handleLogout} className="m-2 bg-danger">
|
||||
Cerrar Sesion
|
||||
</button>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user