Enable the creation of new orders

controllers/orderData.js

@@ -1,4 +1,5 @@
 const Order = require("../models/order.js");
+const Merchant = require("../models/merchant.js");
 
 module.exports = {
     getOrders: function(){
@@ -18,5 +19,35 @@ module.exports = {
             .catch((err)=>{
                 return res.json("Error: unable to retrieve your orders");
             });
+    },
+
+    //POST - Creates a new order from the site
+    // req.body = {
+    //     orderId: user created order id
+    //     date: creation date
+    //     ingredients: [{
+    //         ingredient: id of the ingredient
+    //         quantity: amount of the ingredient purchased
+    //         price: price per unit for ingredient
+    //     }]
+    // }  
+    createOrder: function(req, res){
+        if(!req.session.user){
+            req.session.error = "Must be logged in to do that";
+            return res.redirect("/");
+        }
+        console.log("something here");
+
+        let newOrder = new Order(req.body);
+        newOrder.merchant = req.session.user;
+        newOrder.save()
+            .then((response)=>{
+                console.log("responsing");
+                return res.json({});
+            })
+            .catch((err)=>{
+                console.log(err);
+                return res.json("Error: unable to save the new order");
+            });
     }
 }

models/order.js

@@ -6,6 +6,7 @@ const OrderSchema = new mongoose.Schema({
         ref: "Merchant",
         required: true
     },
+    orderId: String,
     date: {
         type: Date,
         default: Date.now,

routes.js

@@ -37,6 +37,7 @@ module.exports = function(app){
 
     //Orders
     app.get("/order", orderData.getOrders);
+    app.post("/order", orderData.createOrder);
 
     //Other
     // app.post("/purchases/create", otherData.createOrder);

views/dashboardPage/components/addIngredients.ejs

@@ -36,7 +36,6 @@
 
     <template id="addIngredientsIngredient">
         <div class="addIngredientsIngredient">
-            <input type="checkbox">
             <p></p>
             <input type="number" min="0" step="0.01">
         </div>

views/dashboardPage/components/components.css

@@ -410,5 +410,8 @@
 }
 
     #newOrderCategories{
+        display: flex;
+        flex-direction: column;
+        align-items: center;
         width: 100%;
     }

views/dashboardPage/components/components.js

@@ -152,36 +152,97 @@ let recipeDetailsComp = {
 }
 
 let newOrderComp = {
+    isPopulated: false,
+
     display: function(){
         openSidebar(document.querySelector("#newOrder"));
 
-        console.log(merchant.inventory);
-        let categories = categorizeIngredients(merchant.inventory);
-        let categoriesList = document.querySelector("#newOrderCategories");
-        let template = document.querySelector("#addIngredientsCategory").content.children[0];
-        let ingredientTemplate = document.querySelector("#addIngredientsIngredient").content.children[0];
+        if(!this.isPopulated){
+            let categories = categorizeIngredients(merchant.inventory);
+            let categoriesList = document.querySelector("#newOrderCategories");
+            let template = document.querySelector("#addIngredientsCategory").content.children[0];
+            let ingredientTemplate = document.querySelector("#addIngredientsIngredient").content.children[0];
+
+            for(let i = 0; i < categories.length; i++){
+                let category = template.cloneNode(true);
+
+                category.children[0].children[0].innerText = categories[i].name;
+                category.children[0].children[1].onclick = ()=>{addIngredientsComp.toggleAddIngredient(category)};
+                category.children[0].children[1].children[1].style.display = "none";
+                category.children[1].style.display = "none";
+                
+                categoriesList.appendChild(category);
+
+                for(let j = 0; j < categories[i].ingredients.length; j++){
+                    let ingredientDiv = ingredientTemplate.cloneNode(true);
+
+                    ingredientDiv.children[0].innerText = categories[i].ingredients[j].name;
+                    ingredientDiv.children[1].placeholder = categories[i].ingredients[j].unit;
+                    ingredientDiv._id = categories[i].ingredients[j].id;
+                    ingredientDiv._name = categories[i].ingredients[j].name;
+                    ingredientDiv._unit = categories[i].ingredients[j].unit;
+                    ingredientDiv._category = categories[i].name;
+                    
+                    let priceInput = document.createElement("input");
+                    priceInput.type = "number";
+                    priceInput.min = "0";
+                    priceInput.step = "0.01";
+                    priceInput.placeholder = "Total Cost";
+                    ingredientDiv.appendChild(priceInput);
+
+                    category.children[1].appendChild(ingredientDiv);
+                }
+            }
 
-        for(let i = 0; i < categories.length; i++){
-            let category = template.cloneNode(true);
+            this.isPopulated = true;
+        }
+    },
 
-            category.children[0].children[0].innerText = categories[i].name;
-            category.children[0].children[1].onclick = ()=>{addIngredientsComp.toggleAddIngredient(category)};
-            category.children[0].children[1].children[1].style.display = "none";
-            category.children[1].style.display = "none";
-            
-            categoriesList.appendChild(category);
+    submit: function(){
+        let categoriesList = document.querySelector("#newOrderCategories");
 
-            for(let j = 0; j < categories[i].ingredients.length; j++){
-                let ingredientDiv = ingredientTemplate.cloneNode(true);
+        let newOrder = {
+            orderId: "none",
+            date: new Date(),
+            ingredients: []
+        }
+
+        for(let i = 0; i < categoriesList.children.length; i++){
+            for(let j = 0; j < categoriesList.children[i].children[1].children.length; j++){
+                let ingredientDiv = categoriesList.children[i].children[1].children[j];
+                let quantity = ingredientDiv.children[1].value;
 
-                ingredientDiv.children[1].innerText = categories[i].ingredients[j].name;
-                ingredientDiv._id = categories[i].ingredients[j].id;
-                ingredientDiv._name = categories[i].ingredients[j].name;
-                ingredientDiv._unit = categories[i].ingredients[j].unit;
-                ingredientDiv._category = categories[i].name;
+                if(quantity !== ""){
+                    let newIngredient = {
+                        ingredient: ingredientDiv._id,
+                        quantity: quantity,
+                        price: ingredientDiv.children[2].value
+                    }
 
-                category.children[1].appendChild(ingredientDiv);
+                    newOrder.ingredients.push(newIngredient);
+                }
             }
         }
+
+        fetch("/order", {
+            method: "POST",
+            headers: {
+                "Content-Type": "application/json;charset=utf-8"
+            },
+            body: JSON.stringify(newOrder)
+        })
+            .then(response => response.json())
+            .then((response)=>{
+                if(typeof(response) === "string"){
+                    banner.createError(response);
+                }else{
+                    banner.createNotification("New order created");
+                    //update orders list
+                }
+            })
+            .catch((err)=>{
+                console.log(err);
+                banner.createError("Something went wrong.  Try refreshing the page");
+            });
     }
 }

views/dashboardPage/components/newOrder.ejs

@@ -11,4 +11,6 @@
     <h1>New Order</h1>
 
     <div id=newOrderCategories></div>
+
+    <button class="button" onclick="newOrderComp.submit()">Create</button>
 </div>