From 055e5cff75868e326a6fe48bcf03850d031dec46 Mon Sep 17 00:00:00 2001
From: Desmarchelier Maxime <maxime.desmarchelier@ensiie.fr>
Date: Thu, 19 Jan 2023 23:07:04 +0100
Subject: [PATCH] Rework Javascript using Svelte feature
---
.../src/components/SoftwareInsert.svelte | 42 ++++++-------------
1 file changed, 13 insertions(+), 29 deletions(-)
diff --git a/sg-frontend/src/components/SoftwareInsert.svelte b/sg-frontend/src/components/SoftwareInsert.svelte
index ef89808..abb98b8 100644
--- a/sg-frontend/src/components/SoftwareInsert.svelte
+++ b/sg-frontend/src/components/SoftwareInsert.svelte
@@ -1,50 +1,34 @@
<script>
- import {onMount} from "svelte";
const BACKEND_URL = import.meta.env.VITE_BACKEND_URL;
+ let newNodeName = "";
- let softwares = [],
- result,
- node;
-
-
- onMount(async () => {
- const softwareName = document.getElementById("softwareName");
- const newNodeButton = document.getElementById("newNodeButton");
-
- newNodeButton.addEventListener("click", (e) => {
- postSoftwareInsert();
- e.preventDefault();
- window.location.reload();
- });
-
- async function postSoftwareInsert() {
- const res = await fetch(BACKEND_URL + "/software-insert", {
+ function postSoftwareInsert() {
+ if (newNodeName) {
+ fetch(BACKEND_URL + "/software-insert", {
method: "POST",
headers: {
"Content-Type": "application/json",
},
- body: JSON.stringify({"newNodeName": softwareName.value}),
- });
+ body: JSON.stringify({"newNodeName": newNodeName}),
+ }).then(() => window.location.reload());
}
-
- });
+ }
</script>
-<form class="form-inline">
- <label for="softwareName">Software Name :</label>
- <input type="text" id="softwareName" placeholder="" name="softwareName">
- <button id="newNodeButton">Submit</button>
-</form>
+<div class="form-inline">
+ <label>Software Name :</label>
+ <input type="text" bind:value={newNodeName} placeholder="">
+ <button on:click={postSoftwareInsert}>Submit</button>
+</div>
<style>
/* Style the form - display items horizontally */
.form-inline {
display: flex;
- flex-flow: row wrap;
align-items: center;
}
@@ -74,7 +58,7 @@
}
}
- form {
+ .form-inline {
max-width: 400px;
background: #f4f4f4;
padding: 20px;
--
GitLab