Add updating of ingredients for merchant

controllers/merchantData.js

@@ -302,10 +302,9 @@ module.exports = {
 
     //POST - Update the quantity for a merchant inventory item
     //Inputs:
-    //  req.body.ingredients: array of ingredient data
+    //  req.body: array of ingredient data
     //      id: id of ingredient to update
     //      quantity: New value for the ingredient
-    //Returns: Nothing
     updateMerchantIngredient: function(req, res){
         if(!req.session.user){
             req.session.error = "Must be logged in to do that";
@@ -346,6 +345,7 @@ module.exports = {
                     })
             })
             .catch((err)=>{
+                console.log(err);
                 return res.json("Error: your data could not be retrieved");
             });        
     },

views/dashboardPage/components/addIngredients.ejs

@@ -1,10 +1,12 @@
 <div id="addIngredients">
-    <button class="sidebarIconButton" onclick="closeSidebar()">
-        <svg width="30" height="30" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-            <line x1="5" y1="12" x2="19" y2="12"></line>
-            <polyline points="12 5 19 12 12 19"></polyline>
-        </svg>
-    </button>
+    <div class="sidebarIconButtons">
+        <button onclick="closeSidebar()">
+            <svg width="30" height="30" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                <line x1="5" y1="12" x2="19" y2="12"></line>
+                <polyline points="12 5 19 12 12 19"></polyline>
+            </svg>
+        </button>
+    </div>
     
     <h1>Add New Ingredients</h1>
 

views/dashboardPage/components/ingredientDetails.ejs

@@ -7,7 +7,7 @@
             </svg>
         </button>
 
-        <button>
+        <button onclick="ingredientDetailsComp.edit()">
             <svg width="30" height="30" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                 <path d="M12 20h9"></path>
                 <path d="M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4L16.5 3.5z"></path>
@@ -28,6 +28,7 @@
 
     <label>Current Stock
         <p id="ingredientStock"></p>
+        <input id="ingredientInput" type="number" min="0" step="0.01" style="display: none;">
     </label>
 
     <div class="lineBorder"></div>
@@ -36,6 +37,8 @@
         <p id="dailyUse"></p>
     </label>
 
+    <button id="editSubmitButton" class="button" onclick="ingredientDetailsComp.editSubmit()" style="display: none;">Save Changes</button>
+
     <script>
         let ingredientDetailsComp = {
             ingredient: {},
@@ -49,6 +52,7 @@
                 document.querySelector("#ingredientDetails p").innerText = category.name;
                 document.querySelector("#ingredientDetails h1").innerText = ingredient.name;
                 document.querySelector("#ingredientStock").innerText = `${ingredient.quantity} ${ingredient.unit}`;
+                document.querySelector("#ingredientInput").placeholder = `${ingredient.quantity} ${ingredient.unit}`;
 
                 let quantities = [];
                 let now = new Date();
@@ -89,6 +93,41 @@
                         }
                     })
                     .catch((err)=>{});
+            },
+
+            edit: function(){
+                document.querySelector("#ingredientStock").style.display = "none";
+                document.querySelector("#ingredientInput").style.display = "block";
+                document.querySelector("#editSubmitButton").style.display = "block";
+            },
+
+            editSubmit: function(){
+                let data = [{
+                    id: this.ingredient.id,
+                    quantity: Number(document.querySelector("#ingredientInput").value)
+                }];
+
+                if(validator.ingredient.quantity(data[0].quantity)){
+                    fetch("/merchant/ingredients/update", {
+                        method: "PUT",
+                        headers: {
+                            "Content-Type": "application/json;charset=utf-8"
+                        },
+                        body: JSON.stringify(data)
+                    })
+                        .then((response) => response.json())
+                        .then((response)=>{
+                            if(typeof(response) === "string"){
+                                banner.createError(response);
+                            }else{
+                                updateInventory(data);
+                                banner.createNotification("Ingredient updated");
+                            }
+                        })
+                        .catch((err)=>{
+                            banner.createError("Something went wrong, try refreshing the page");
+                        });
+                }
             }
         }
     </script>

views/shared/validation.js

@@ -6,7 +6,7 @@ let validator = {
                 if(createBanner){
                     banner.createError("Your inputs contain illegal characters");
                 }
-                return false
+                return false;
             }
 
             //Check for length