Added a RessourceManager for uploading files

This commit is contained in:
2025-12-22 13:03:32 +01:00
parent 25037f4798
commit 7349624da9
3 changed files with 80 additions and 4 deletions

View File

@@ -0,0 +1,68 @@
<script lang="ts">
import { env } from "$env/dynamic/public";
import axios from "axios";
import Modal from "./Modal.svelte";
interface Props {
show: boolean;
}
let { show = $bindable(false) }: Props = $props();
let file: File | null = null;
let path: string = "/";
function handleFileChange(event: Event) {
const target = event.target as HTMLInputElement | null;
if (target?.files?.[0]) {
file = target.files[0];
}
}
function uploadData(event: SubmitEvent) {
event.preventDefault();
if (file === null) return;
const formData = new FormData();
formData.append("path", path);
formData.append("file", file);
axios.post(
`${env.PUBLIC_JEOPARDY_SERVER_PROTOCOL}://${env.PUBLIC_JEOPARDY_SERVER}/upload`,
formData,
{
withCredentials: true,
headers: {
"Content-Type": "multipart/form-data"
},
onUploadProgress: (event) => {
console.log(event);
}
}
);
}
</script>
<Modal
bind:showModal={show}
okFn={async () => {
console.log("ok");
return true;
}}
>
{#snippet header()}
<h2 class="text-3xl">Ressourcenmanager</h2>
{/snippet}
<div>Ressourcenmanager</div>
{#snippet actionButtons()}
<form
action={`${env.PUBLIC_JEOPARDY_SERVER_PROTOCOL}://${env.PUBLIC_JEOPARDY_SERVER}/upload`}
enctype="multipart/form-data"
method="post"
onsubmit={uploadData}
>
<input class="btn" type="file" name="file" onchange={handleFileChange} />
<input type="submit" value="Hochladen" class="btn" />
</form>
{/snippet}
</Modal>