feat: implement CursosArchivo component for CSV file upload and parsing

This commit is contained in:
RictalLime 2025-04-28 08:20:14 -06:00
parent 23bd0848ae
commit d9b51046d2
3 changed files with 33 additions and 94 deletions
diplomas/src

View File

@ -1,49 +0,0 @@
import React, { useState } from "react";
const CursosManual = () => {
const [nombre, setNombre] = useState("");
const [descripcion, setDescripcion] = useState("");
const [competencia, setCompetencia] = useState("");
const manejarGuardar = () => {
// Lógica para guardar el curso
console.log({ nombre, descripcion, competencia });
};
return (
<div className="p-8 font-sans text-center">
<div className="max-w-md mx-auto bg-white p-6 rounded-md shadow">
<h2 className="text-xl font-semibold mb-4">Nuevo curso</h2>
<input
type="text"
placeholder="Nombre del curso"
value={nombre}
onChange={(e) => setNombre(e.target.value)}
className="w-full px-3 py-2 border border-gray-300 rounded-md mb-3"
/>
<textarea
placeholder="Descripción"
value={descripcion}
onChange={(e) => setDescripcion(e.target.value)}
className="w-full px-3 py-2 border border-gray-300 rounded-md mb-3 h-24"
/>
<select
value={competencia}
onChange={(e) => setCompetencia(e.target.value)}
className="w-full px-3 py-2 border border-gray-300 rounded-md mb-4"
>
<option value="">Competencia</option>
<option value="competencia1">Competencia 1</option>
<option value="competencia2">Competencia 2</option>
</select>
<button
onClick={manejarGuardar}
className="bg-green-400 hover:bg-green-500 text-white font-bold py-2 px-4 rounded-md"
>
Guardar
</button>
</div>
</div>
);
};
export default CursosManual;

View File

@ -1,14 +1,3 @@
import Layout from "@/components/layout/Layout";
import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import {
Select,
SelectTrigger,
SelectContent,
SelectItem,
SelectValue,
} from "@/components/ui/select";
import { Textarea } from "@/components/ui/textarea";
import React, { useState } from "react"; import React, { useState } from "react";
const CursosManual = () => { const CursosManual = () => {
@ -16,45 +5,44 @@ const CursosManual = () => {
const [descripcion, setDescripcion] = useState(""); const [descripcion, setDescripcion] = useState("");
const [competencia, setCompetencia] = useState(""); const [competencia, setCompetencia] = useState("");
const manejarGuardar = () => { const manejarGuardar = () => {
// Lógica para guardar el curso
console.log({ nombre, descripcion, competencia }); console.log({ nombre, descripcion, competencia });
}; };
return ( return (
<Layout> <div className="p-8 font-sans text-center">
<div className="w-[60vw] pt-10 flex flex-col items-end justify-center"> <div className="max-w-md mx-auto bg-white p-6 rounded-md shadow">
<div className="bg-white p-8 font-sans text-center w-[70%]"> <h2 className="text-xl font-semibold mb-4">Nuevo curso</h2>
<h1 className="text-xl font-semibold mb-4 text-black">Nuevo curso</h1> <input
<Input type="text"
type="text" placeholder="Nombre del curso"
placeholder="Nombre del curso" value={nombre}
value={nombre} onChange={(e) => setNombre(e.target.value)}
onChange={(e) => setNombre(e.target.value)} className="w-full px-3 py-2 border border-gray-300 rounded-md mb-3"
className="w-full px-3 py-2 border border-gray-300 rounded-md mb-3" />
/> <textarea
<Textarea placeholder="Descripción"
placeholder="Descripción" value={descripcion}
value={descripcion} onChange={(e) => setDescripcion(e.target.value)}
onChange={(e) => setDescripcion(e.target.value)} className="w-full px-3 py-2 border border-gray-300 rounded-md mb-3 h-24"
className="w-full px-3 py-2 border border-gray-300 rounded-md mb-3 h-24" />
/> <select
<Select onValueChange={(value) => setCompetencia(value)}> value={competencia}
<SelectTrigger className="w-full px-3 py-2 border border-gray-300 rounded-md mb-4"> onChange={(e) => setCompetencia(e.target.value)}
<SelectValue placeholder="Competencia" /> className="w-full px-3 py-2 border border-gray-300 rounded-md mb-4"
</SelectTrigger> >
<SelectContent> <option value="">Competencia</option>
<SelectItem value="competencia1">Competencia 1</SelectItem> <option value="competencia1">Competencia 1</option>
<SelectItem value="competencia2">Competencia 2</SelectItem> <option value="competencia2">Competencia 2</option>
</SelectContent> </select>
</Select> <button
<Button onClick={manejarGuardar}
onClick={manejarGuardar} className="bg-green-400 hover:bg-green-500 text-white font-bold py-2 px-4 rounded-md"
className="bg-green-400 hover:bg-green-500 text-white font-bold py-2 px-4 rounded-md" >
> Guardar
Guardar </button>
</Button>
</div>
</div> </div>
</Layout> </div>
); );
}; };