From 6a4f965536605c9e408966769c1a5d11ebcf81a7 Mon Sep 17 00:00:00 2001 From: SimonFJ20 Date: Fri, 21 Mar 2025 12:05:09 +0100 Subject: [PATCH] kort coords --- backend/public/product_editor.html | 32 ++++++++++++++++++++++++++++++ backend/public/product_editor.js | 28 +++++++++++++++++++++++++- 2 files changed, 59 insertions(+), 1 deletion(-) diff --git a/backend/public/product_editor.html b/backend/public/product_editor.html index b5858a6..dd2f2ad 100644 --- a/backend/public/product_editor.html +++ b/backend/public/product_editor.html @@ -62,6 +62,7 @@ #wrapper { display: flex; justify-content: center; + flex-wrap: wrap; gap: 2rem; } #wrapper form { @@ -78,6 +79,13 @@ height: 150px; background-color: #fff; } + #coords { + display: flex; + flex-direction: column; + align-items: center; + justify-content: space-between; + height: 100%; + } @@ -150,6 +158,30 @@ +
+ Coords + +
+ + + + + + + + + + + + + +
+ +
+
+ +
+
diff --git a/backend/public/product_editor.js b/backend/public/product_editor.js index f295dc5..0ee8984 100644 --- a/backend/public/product_editor.js +++ b/backend/public/product_editor.js @@ -18,6 +18,13 @@ const imageUploader = { preview: document.querySelector("#image-uploader #preview"), fileInput: document.querySelector("#image-uploader #file"), }; +const coords = { + form: document.querySelector("#coords"), + idInput: document.querySelector("#coords #product-id"), + xInput: document.querySelector("#coords #coords-x"), + yInput: document.querySelector("#coords #coords-y"), + saveButton: document.querySelector("#coords #save"), +}; let products = []; @@ -32,6 +39,9 @@ function selectProduct(product) { editor.descriptionTextarea.value = product.description; editor.coordInput.value = product.coord_id.toString(); editor.barcodeInput.value = product.barcode.toString(); + + imageUploader.idInput.value = product.id; + coords.idInput.value = product.id; } function loadProduct() { @@ -146,7 +156,7 @@ imageUploader.form }); imageUploader.fileInput .addEventListener("input", (e) => { - console.log(e); + e.preventDefault(); const image = imageUploader.fileInput.files[0]; const data = URL.createObjectURL(image); imageUploader.preview.src = data; @@ -170,3 +180,19 @@ imageUploader.saveButton body: buffer, }).then((res) => res.json()); }); +coords.form + .addEventListener("submit", (e) => { + e.preventDefault(); + }); +coords.saveButton + .addEventListener("click", async (_e) => { + const product_id = parseInt(coords.idInput.value); + const x = parseInt(coords.xInput.value); + const y = parseInt(coords.yInput.value); + + await fetch(`/api/products/set_coords`, { + method: "post", + headers: { "Content-Type": "application/json" }, + body: JSON.stringify({ product_id, x, y }), + }).then((res) => res.json()); + });