Use api for DB

This commit is contained in:
Clayzxr
2025-01-20 16:33:06 +01:00
parent 4057bb488c
commit a49683c10e
11 changed files with 106 additions and 128 deletions
@@ -0,0 +1,33 @@
// @deno-types="https://cdn.sheetjs.com/xlsx-0.20.3/package/types/index.d.ts"
import * as XLSX from "https://cdn.sheetjs.com/xlsx-0.20.3/package/xlsx.mjs";
import { useSignal } from "@preact/signals";
import handleUpload from "../api/insert_students.ts";
export default function UploadStudents() {
const statusMessage = useSignal<string>("");
const fileData = useSignal<File | null>(null);
const handleFileChange = (event: Event) => {
const input = event.target as HTMLInputElement;
if (input.files && input.files.length > 0) {
fileData.value = input.files[0];
statusMessage.value = "File selected: " + input.files[0].name;
} else {
fileData.value = null;
statusMessage.value = "No file selected";
}
};
const confirmUpload = () => {
statusMessage.value = handleUpload(fileData.value);
};
return (
<div>
<h2>Upload Students</h2>
<input type="file" accept=".xlsx, .xls" onChange={handleFileChange} />
<button onClick={confirmUpload}>Confirm Upload</button>
<p>{statusMessage.value}</p>
</div>
);
}
@@ -1,78 +0,0 @@
// @deno-types="https://cdn.sheetjs.com/xlsx-0.20.3/package/types/index.d.ts"
import * as XLSX from "https://cdn.sheetjs.com/xlsx-0.20.3/package/xlsx.mjs";
import { useSignal } from "@preact/signals";
import insertIntoMobility from "../../../../databases/mobility.ts";
export default function UploadStudents() {
const statusMessage = useSignal<string>("");
const fileData = useSignal<File | null>(null);
const handleFileChange = (event: Event) => {
const input = event.target as HTMLInputElement;
if (input.files && input.files.length > 0) {
fileData.value = input.files[0];
statusMessage.value = "File selected: " + input.files[0].name;
} else {
fileData.value = null;
statusMessage.value = "No file selected";
}
};
const handleUpload = () => {
if (!fileData.value) {
statusMessage.value = "Please select a file before confirming upload.";
return;
}
try {
const reader = new FileReader();
reader.onload = async (e) => {
try {
const arrayBuffer = e.target?.result as ArrayBuffer;
const workbook = XLSX.read(arrayBuffer, { type: "array" });
for (const sheetName of workbook.SheetNames) {
const sheet = workbook.Sheets[sheetName];
const data = XLSX.utils.sheet_to_json(sheet, {
header: ["firstName", "lastName", "email"],
range: 1, // Ignorer les en-têtes
});
console.log(`Data from sheet ${sheetName}:`, data);
await insertIntoMobility(
data as Array<
{ firstName: string; lastName: string; email: string }
>,
sheetName,
);
}
statusMessage.value = "File uploaded and data inserted successfully!";
} catch (error) {
console.error("Error reading or inserting file:", error);
statusMessage.value =
"Error processing the file. Please check its format.";
}
};
reader.onerror = (e) => {
console.error("FileReader error:", e);
statusMessage.value = "Error reading the file.";
};
reader.readAsArrayBuffer(fileData.value);
} catch (error) {
console.error("Error uploading file:", error);
statusMessage.value = "An unexpected error occurred during upload.";
}
};
return (
<div>
<h2>Upload Students</h2>
<input type="file" accept=".xlsx, .xls" onChange={handleFileChange} />
<button onClick={handleUpload}>Confirm Upload</button>
<p>{statusMessage.value}</p>
</div>
);
}
@@ -0,0 +1,69 @@
// @deno-types="https://cdn.sheetjs.com/xlsx-0.20.3/package/types/index.d.ts"
import * as XLSX from "https://cdn.sheetjs.com/xlsx-0.20.3/package/xlsx.mjs";
import { Database } from "@db/sqlite";
export default function handleUpload(file: File | null): string {
if (!file) {
return "Please select a file before confirming upload.";
}
try {
const reader = new FileReader();
let statusMessage = "";
reader.onload = async (e) => {
try {
const arrayBuffer = e.target?.result as ArrayBuffer;
const workbook = XLSX.read(arrayBuffer, { type: "array" });
const db = new Database("databases/data/mobility.db");
db.execute(`
CREATE TABLE IF NOT EXISTS students (
id INTEGER PRIMARY KEY AUTOINCREMENT,
firstName TEXT NOT NULL,
lastName TEXT NOT NULL,
email TEXT NOT NULL,
promotion TEXT NOT NULL
);
`);
for (const sheetName of workbook.SheetNames) {
const sheet = workbook.Sheets[sheetName];
const data = XLSX.utils.sheet_to_json(sheet, {
header: ["firstName", "lastName", "email"],
range: 1, // Ignorer les en-têtes
});
const insertQuery =
"INSERT INTO students (firstName, lastName, email, promotion) VALUES (?, ?, ?, ?)";
for (const student of data) {
db.query(insertQuery, [
student.firstName,
student.lastName,
student.email,
sheetName,
]);
}
}
db.close();
statusMessage = "Data uploaded and inserted successfully!";
} catch (error) {
console.error("Error reading or inserting file:", error);
statusMessage = "Error processing the file. Please check its format.";
}
};
reader.onerror = (e) => {
console.error("FileReader error:", e);
statusMessage = "Error reading the file.";
};
reader.readAsArrayBuffer(file);
return statusMessage;
} catch (error) {
console.error("Error uploading file:", error);
return "An unexpected error occurred during upload.";
}
}
+1 -1
View File
@@ -1,5 +1,5 @@
import { RouteConfig } from "$fresh/server.ts";
import UploadStudents from "../(_islands)/UploadStudents.tsx";
import UploadStudents from "../(_components)/UploadStudents.tsx";
//import ConsultStudents from "../(_islands)/ConsultStudents.tsx";
//import EditStudents from "../(_islands)/EditStudents.tsx";