Merge branch 'Santiago' of https://git.gumoio.com/benito.rodriguez/SIDAC into roberto
This commit is contained in:
SirRobert-1
commit
f848f4ec11
diplomas/src
|
|
@ -1,9 +0,0 @@
|
|||
import React from 'react'
|
||||
|
||||
function CursosArchivo() {
|
||||
return (
|
||||
<div>CursosArchivo</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default CursosArchivo
|
||||
|
|
@ -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;
|
||||
|
|
@ -0,0 +1,100 @@
|
|||
import React, { useState } from 'react';
|
||||
import Papa from 'papaparse';
|
||||
|
||||
const CursosArchivo = () => {
|
||||
const [modoManual, setModoManual] = useState(true);
|
||||
const [archivo, setArchivo] = useState(null);
|
||||
const [datosCSV, setDatosCSV] = useState([]);
|
||||
|
||||
const manejarArchivo = (e) => {
|
||||
const file = e.target.files[0];
|
||||
setArchivo(file);
|
||||
};
|
||||
|
||||
const manejarSoltar = (e) => {
|
||||
e.preventDefault();
|
||||
const file = e.dataTransfer.files[0];
|
||||
setArchivo(file);
|
||||
};
|
||||
|
||||
const manejarArrastrar = (e) => {
|
||||
e.preventDefault();
|
||||
};
|
||||
|
||||
const extraerContenido = () => {
|
||||
if (!archivo) return;
|
||||
|
||||
Papa.parse(archivo, {
|
||||
header: true,
|
||||
skipEmptyLines: true,
|
||||
complete: (result) => {
|
||||
console.log('Contenido CSV:', result.data);
|
||||
setDatosCSV(result.data);
|
||||
},
|
||||
error: (error) => {
|
||||
console.error('Error al leer el CSV:', error.message);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="p-8 font-sans text-center">
|
||||
<div className="mb-6">
|
||||
<button
|
||||
onClick={() => setModoManual(true)}
|
||||
className={`px-4 py-2 rounded-md mr-2 ${
|
||||
modoManual ? 'bg-blue-300' : 'bg-gray-300'
|
||||
}`}
|
||||
>
|
||||
Añadir curso manualmente
|
||||
</button>
|
||||
<button
|
||||
onClick={() => setModoManual(false)}
|
||||
className={`px-4 py-2 rounded-md ${
|
||||
!modoManual ? 'bg-blue-300' : 'bg-gray-300'
|
||||
}`}
|
||||
>
|
||||
Añadir curso desde archivo
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{!modoManual && (
|
||||
<div className="flex flex-col items-center">
|
||||
<label
|
||||
htmlFor="archivo"
|
||||
onDrop={manejarSoltar}
|
||||
onDragOver={manejarArrastrar}
|
||||
className="border-2 border-gray-300 rounded-md p-8 text-gray-600 cursor-pointer w-80 text-center mb-4"
|
||||
>
|
||||
Arrastra y suelta un archivo o busca un archivo
|
||||
<input
|
||||
type="file"
|
||||
id="archivo"
|
||||
accept=".csv"
|
||||
onChange={manejarArchivo}
|
||||
className="hidden"
|
||||
/>
|
||||
</label>
|
||||
|
||||
<button
|
||||
onClick={extraerContenido}
|
||||
className="bg-green-400 hover:bg-green-500 text-white font-bold py-2 px-4 rounded-md"
|
||||
>
|
||||
Extraer contenido
|
||||
</button>
|
||||
|
||||
{datosCSV.length > 0 && (
|
||||
<div className="mt-6 text-left w-full max-w-md">
|
||||
<h3 className="font-bold mb-2">Contenido extraído:</h3>
|
||||
<pre className="bg-gray-100 p-2 rounded overflow-x-auto text-sm">
|
||||
{JSON.stringify(datosCSV, null, 2)}
|
||||
</pre>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default CursosArchivo;
|
||||
|
|
@ -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 { supabase } from "@/lib/supabaseClient";
|
||||
|
||||
|
|
@ -85,7 +74,7 @@ const CursosManual = () => {
|
|||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</Layout>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue