webseite/frontend/assets/js/build.js

@@ -5179,6 +5179,7 @@
       templateRow: module.querySelector(".template-row"),
       // Modal
       modalEdit: module.querySelector(".modal-edit"),
+      formEdit: module.querySelector(".form-product-edit"),
       inputEditName: module.querySelector(".input-edit-name"),
       inputEditPrice: module.querySelector(".input-edit-price"),
       inputEditId: module.querySelector(".input-edit-id"),
@@ -5194,6 +5195,23 @@
       console.log("init");
       initProducts();
       DOM.btnAdd.addEventListener("click", onClickAdd);
+      DOM.formEdit.addEventListener("submit", onSubmitEdit);
+    };
+    const onSubmitEdit = (e) => {
+      e.preventDefault();
+      const product = {
+        name: DOM.inputEditName.value,
+        price: Number(DOM.inputEditPrice.value),
+        _id: DOM.inputEditId.value,
+        position: DOM.inputEditPosition.value
+      };
+      updateProduct(product).then((data) => {
+        console.log(data);
+        if (data.success) {
+          loadProducts();
+          bsModalEdit.hide();
+        }
+      });
     };
     const onClickAdd = (e) => {
       console.log("click");
@@ -5201,7 +5219,13 @@
         name: DOM.inputName.value,
         price: Number(DOM.inputPrice.value)
       };
-      addProduct(product);
+      createProduct(product).then((data) => {
+        console.log(data);
+        if (data.success) {
+          console.log("add");
+          loadProducts();
+        }
+      });
       disableNonFunctionalButtons();
     };
     const onClickEdit = (e) => {
@@ -5268,7 +5292,26 @@
       }
       disableNonFunctionalButtons();
     };
-    const fetchProducts = async () => {
+    const createProduct = async (product) => {
+      try {
+        const response = await fetch(`${BASE_URL}/api/products`, {
+          method: "POST",
+          headers: {
+            "Content-Type": "application/json"
+          },
+          body: JSON.stringify(product)
+        });
+        if (!response.ok) {
+          throw new Error("Fetch went wrong.");
+        }
+        const data = await response.json();
+        return data;
+      } catch (error) {
+        console.error(error);
+        return error;
+      }
+    };
+    const getProducts = async () => {
       try {
         const response = await fetch(`${BASE_URL}/api/products`);
         if (!response.ok) {
@@ -5294,14 +5337,42 @@
         return error;
       }
     };
+    const updateProduct = async (product) => {
+      try {
+        const response = await fetch(`${BASE_URL}/api/products`, {
+          method: "PUT",
+          headers: {
+            "Content-Type": "application/json"
+          },
+          body: JSON.stringify(product)
+        });
+        if (!response.ok) {
+          throw new Error("Fetch went wrong.");
+        }
+        const data = await response.json();
+        return data;
+      } catch (error) {
+        console.error(error);
+        return error;
+      }
+    };
     const initProducts = () => {
-      fetchProducts().then((products) => {
+      getProducts().then((products) => {
         products.forEach((product) => {
           addProduct(product);
         });
         disableNonFunctionalButtons();
       });
     };
+    const loadProducts = () => {
+      DOM.tBody.innerHTML = "";
+      getProducts().then((data) => {
+        data.forEach((product) => {
+          addProduct(product);
+        });
+        disableNonFunctionalButtons();
+      });
+    };
     const addProduct = (product) => {
       const { name, price, _id: id, position } = product;
       const trEl = DOM.templateRow.content.firstElementChild.cloneNode(true);