webseite/frontend/dev/scripts/modules/ProductManager.js

@@ -26,6 +26,10 @@ const ProductManager = (el = null) => {
     btnAdd: module.querySelector('.button-product-add'),
     templateRow: module.querySelector('.template-row'),
 
+    // Nav Actions
+    btnSave: module.querySelector('.button-products-save'),
+    btnReset: module.querySelector('.button-products-reset'),
+
     // Modal Edit
     modalEdit: module.querySelector('.modal-edit'),
     formEdit: module.querySelector('.form-product-edit'),
@@ -59,6 +63,9 @@ const ProductManager = (el = null) => {
     initProducts();
 
     // Event-Lauscher zu beginn der Anwendung
+    DOM.btnReset.addEventListener('click', onClickReset);
+    DOM.btnSave.addEventListener('click', onClickSave);
+
     DOM.btnAdd.addEventListener('click', onClickAdd);
     DOM.btnAdd.disabled = true;
     DOM.btnConfirmDelete.addEventListener('click', onClickConfirmDelete);
@@ -76,6 +83,35 @@ const ProductManager = (el = null) => {
     DOM.btnAdd.disabled = (DOM.inputName.value === '' || DOM.inputPrice.value === ''); // prettier-ignore
   };
 
+  const onClickReset = (e) => {
+    const btnEl = e.currentTarget;
+
+    // async process
+    resetProducts().then((data) => {
+      if (data.success) {
+        Toast(data.msg, 'success').show();
+        loadProducts();
+      }
+    });
+  };
+
+  const onClickSave = (e) => {
+    const btnEl = e.currentTarget;
+    const icon = btnEl.querySelector('i');
+
+    icon.classList.add('fa-jello');
+
+    // async process
+    saveProducts().then((data) => {
+      if (data.success) {
+        setTimeout(() => {
+          icon.classList.remove('fa-jello');
+        }, 500);
+        Toast(data.msg, 'success').show();
+      }
+    });
+  };
+
   const onSubmitEdit = (e) => {
     e.preventDefault(); // Standardverhalten unterbinden (Formular nicht an action versenden)
 
@@ -264,6 +300,56 @@ const ProductManager = (el = null) => {
 
   // === XHR/FETCH ========
 
+  // HTTP - Methode - PATCH
+  // reset products
+  const resetProducts = async () => {
+    try {
+      const response = await fetch(`${BASE_URL}/api/products/reset`, {
+        method: 'PATCH',
+        headers: {
+          'Content-Type': 'application/json',
+        },
+        body: JSON.stringify({ reset: true }),
+      }); // HTTP Request URL
+      if (!response.ok) {
+        throw new Error('Fetch went wrong.');
+      }
+      const data = await response.json(); // HTTP-Response
+
+      return data;
+    } catch (error) {
+      Toast(error, 'error').show();
+
+      console.error(error);
+      return error;
+    }
+  };
+
+  // HTTP - Methode - PATCH
+  // save products
+  const saveProducts = async () => {
+    try {
+      const response = await fetch(`${BASE_URL}/api/products/save`, {
+        method: 'PATCH',
+        headers: {
+          'Content-Type': 'application/json',
+        },
+        body: JSON.stringify({ save: true }),
+      }); // HTTP Request URL
+      if (!response.ok) {
+        throw new Error('Fetch went wrong.');
+      }
+      const data = await response.json(); // HTTP-Response
+
+      return data;
+    } catch (error) {
+      Toast(error, 'error').show();
+
+      console.error(error);
+      return error;
+    }
+  };
+
   // HTTP - Methode - POST
   // (C)RUD - create
   // BRE(A)D - add - neues Produkt hinzufügen