From 84ce4f237ec427e8c3ccc1d62b56600a83c46ef2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Raynel=20S=C3=A1nchez?= <raynelfss@hotmail.com>
Date: Fri, 13 May 2022 07:57:24 -0400
Subject: [PATCH] Started work for chef order management

---
 app.py                                        | 11 +++-
 build/dashboard-chefprogress-order.html       | 13 +++++
 ...gress.html => dashboard-chefprogress.html} | 20 ++++---
 build/dashboard-layout.html                   |  2 +-
 build/scripts/bids.js                         |  8 +--
 build/scripts/chefprogress-orders.js          | 52 +++++++++++++++++++
 build/scripts/order-page-bidpicking.js        |  3 +-
 build/scripts/order-page.js                   |  6 ++-
 build/scripts/sidebar.js                      |  4 +-
 build/styles/chefprogress.css                 | 37 ++++++++++++-
 build/styles/dashboard-layout.css             |  8 +--
 11 files changed, 139 insertions(+), 25 deletions(-)
 create mode 100644 build/dashboard-chefprogress-order.html
 rename build/{chefprogress.html => dashboard-chefprogress.html} (73%)
 create mode 100644 build/scripts/chefprogress-orders.js

diff --git a/app.py b/app.py
index 6867205..205bc89 100644
--- a/app.py
+++ b/app.py
@@ -53,7 +53,16 @@ def deliverystatus():
         return render_template("dashboard-deliverystat.html", nav = helpers.getSidebarNav(), currentUrl = '/dashboard/deliverystatus')
 
 @app.route('/dashboard/chefprogress')
-def chefprogress(): return render_template("chefprogress.html", currentUrl = "/chefprogress", nav = helpers.getSidebarNav())
+def chefprogress(): 
+    if helpers.isLoggedIn() and (helpers.isChef() or helpers.isManager()):
+        return render_template("dashboard-chefprogress.html", currentUrl = "/chefprogress", nav = helpers.getSidebarNav())
+    else: return abort(403)
+
+@app.route('/dashboard/chefprogress/<id>')
+def orderstatus(id):
+    if helpers.isLoggedIn() and (helpers.isChef() or helpers.isManager()):
+        return render_template("dashboard-chefprogress-order.html", currentUrl = "/chefprogress", nav = helpers.getSidebarNav())
+    else: return abort(403)
 
 @app.route('/login')
 def login():
diff --git a/build/dashboard-chefprogress-order.html b/build/dashboard-chefprogress-order.html
new file mode 100644
index 0000000..c2411c8
--- /dev/null
+++ b/build/dashboard-chefprogress-order.html
@@ -0,0 +1,13 @@
+{% extends 'dashboard-layout.html' %}
+{% block head %}
+    <title>Dashboard: Home</title>
+    <link href="/styles/chefprogress.css" rel="stylesheet" type="text/css">
+{% endblock %}
+
+{% block body %}
+    <div class="title">
+        <h2>Welcome to Dashboard</h2>
+        <!-- will prob display different stuff here based on employee -->
+    </div>
+
+{% if session.get('employeeType') == 'chef' %}
\ No newline at end of file
diff --git a/build/chefprogress.html b/build/dashboard-chefprogress.html
similarity index 73%
rename from build/chefprogress.html
rename to build/dashboard-chefprogress.html
index c476b6b..154fb9b 100644
--- a/build/chefprogress.html
+++ b/build/dashboard-chefprogress.html
@@ -1,23 +1,18 @@
 {% extends 'dashboard-layout.html' %}
 {% block head %}
-    <title>Dashboard: Home</title>
+    <title>Dashboard: Active Orders</title>
     <link href="/styles/chefprogress.css" rel="stylesheet" type="text/css">
 {% endblock %}
 
 {% block body %}
     <div class="title">
-        <h2>Welcome to Dashboard</h2>
+        <h2>Active Orders</h2>
         <!-- will prob display different stuff here based on employee -->
     </div>
 
 {% if session.get('employeeType') == 'chef' %}
-    <div>
-        <div class="title">
-            <h2>You're a chef.</h2>
-        </div>
-
-        
-        <div class ="progresscontainer">
+    <div class="orderlist" id="orderlist">
+        <!-- <div class ="progresscontainer">
             <div class="progress" id="progress"></div>
             <div class="circle active"><i class="fa-solid fa-circle-check"></i></div>
             <div class="circle active"><i class="fa-solid fa-circle-check"></i></div>
@@ -31,8 +26,10 @@ <h2>Order ready for delivery.</h2>
 
         </div>
 
-        <button class="stepbtn" id="prev" diabled>Previous Step</button>
-        <button class="stepbtn" id="next" diabled>Next Step</button>
+        <button class="stepbtn" id="prev" disabled>Previous Step</button>
+        <button class="stepbtn" id="next" disabled>Next Step</button> -->
+
+    </div>
 
 
 {% else %}
@@ -42,4 +39,5 @@ <h2>Order ready for delivery.</h2>
 {% endif %}
 <!-- <script src="/scripts/showstatus.js"></script> -->
 <script src="/scripts/updateprogress.js"></script>
+<script src="/scripts/chefprogress-orders.js"></script>
 {% endblock %}
\ No newline at end of file
diff --git a/build/dashboard-layout.html b/build/dashboard-layout.html
index 8f4960b..9178c83 100644
--- a/build/dashboard-layout.html
+++ b/build/dashboard-layout.html
@@ -17,7 +17,7 @@
             <img src="/imgs/hamburger.svg"  class="sidebarIcon" onclick="displaySidebar()"/>
             <a href="/"><img src="/imgs/Logo.png" class="logo"></a>
         </header>
-        <div class="sidebar sidebarHide">
+        <div class="sidebar" id="sidebar">
             <div class="sidebarHeader">
                 <h1>Dashboard</h1>
                 <img src="/imgs/close.svg" class="sidebarClose" onclick="hideSidebar()"/>
diff --git a/build/scripts/bids.js b/build/scripts/bids.js
index 1241367..eab16c5 100644
--- a/build/scripts/bids.js
+++ b/build/scripts/bids.js
@@ -37,7 +37,7 @@ async function postBid(orderID) {
 function createOrder(order) {
     const orderDiv = createElement('div', { class: 'order' });
     ['address', 'datetime'].forEach(field => {
-        const element = createElement('p', { text: order[field] });
+        const element = createElement('p', { text: `${field.charAt(0).toUpperCase()+ field.slice(1)}: ${order[field]}` });
         orderDiv.appendChild(element);
     });
     const button = createElement('button', { text: 'Bid', onclick: `openBidModal(${order.orderID})` });
@@ -50,8 +50,10 @@ async function loadOrders() {
     const ordersDiv = document.getElementsByClassName('orders')[0];
     if (orders.length > 0) {
         orders.forEach(order => {
-            const orderDiv = createOrder(order);
-            ordersDiv.appendChild(orderDiv);
+            if (order.deliveryMethod == "delivery" && order.employeeID == null) {
+                const orderDiv = createOrder(order);
+                ordersDiv.appendChild(orderDiv);
+            }
         })
     }
     else {
diff --git a/build/scripts/chefprogress-orders.js b/build/scripts/chefprogress-orders.js
new file mode 100644
index 0000000..c34b081
--- /dev/null
+++ b/build/scripts/chefprogress-orders.js
@@ -0,0 +1,52 @@
+async function getCurrentOrders() {
+    const response = await fetch('/api/order/inprogress');
+    const data = await response.json();
+    console.log(data['response']);
+
+    return data['response'];
+}
+
+async function showOrders() {
+    let container = document.getElementById('orderlist');
+
+    let orders = await getCurrentOrders();
+
+    if (orders.length > 0) {
+        orders.forEach(order => {
+            if ((order.status != "cancelled" && order.status != "completed")  && ((order.deliveryMethod == "delivery" && order.employeeID != null) || (order.deliveryMethod == "pickup"))) {
+                let orderdiv = createElement("a", {class: "orderdiv", href: `/dashboard/chefprogress/${order.orderID}`});
+                Array.from(["orderID", "datetime", "deliveryMethod", "status", "cost"]).forEach(attrib => {
+                    let element = createElement("p", {text: `${attrib.charAt(0).toUpperCase() + attrib.slice(1)} : ${order[attrib]}`, class: attrib});
+                    orderdiv.appendChild(element);
+                });
+                container.appendChild(orderdiv);
+            }
+        });
+    }
+    else {
+        let textdiv = createElement("div", {class : "noOrders"});
+        let text = createElement("p", {text: "There are no active orders available. Please check back in a minute.", class: "noOrdersText"});
+        textdiv.appendChild(text);
+        container.appendChild(textdiv);
+    }
+}
+
+function eraseOrders() {
+    let orders = document.getElementsByClassName('orderdiv');
+    if (orders.length > 0){
+        Array.from(orders).forEach(element => {
+            element.remove();
+        });
+    }
+}
+
+function reload() {
+    eraseOrders();
+    showOrders();
+}
+
+reload();
+
+setInterval(() => {
+    reload();
+}, 10000);
\ No newline at end of file
diff --git a/build/scripts/order-page-bidpicking.js b/build/scripts/order-page-bidpicking.js
index f5737c7..f81ed03 100644
--- a/build/scripts/order-page-bidpicking.js
+++ b/build/scripts/order-page-bidpicking.js
@@ -1,7 +1,7 @@
 
 async function autoAssign(id) {
     const allbids = await getBids(id);
-    
+    doNotReload = true;
     if (allbids.length > 0) {   // Checks whether there are bids avalable.
         var smallest = selectSmallest(allbids);
         
@@ -15,6 +15,7 @@ async function autoAssign(id) {
             order.dishIDs = dishes;
             
             updateItem(order.orderID, order);
+            doNotReload = false;
             setTimeout(() => {
                 location.reload();
             }, 1000);
diff --git a/build/scripts/order-page.js b/build/scripts/order-page.js
index 73a1465..2a55403 100644
--- a/build/scripts/order-page.js
+++ b/build/scripts/order-page.js
@@ -1,3 +1,4 @@
+var doNotReload = false;
 // Functions for the clock
 function currentTime() {
     let clock = document.getElementById("currentTime");
@@ -76,7 +77,7 @@ function filltable(data) {
                         break;
                     case 'orderID':
                         column = createElement('td');
-                        let anchor = createElement('a', { onclick:`loadOrder(${order[key]})`/*href: `/orders/${order[key]}`*/, text: order[key] })
+                        let anchor = createElement('a', { onclick:`loadOrder(${order[key]})`, href: "javascript:void(0)", text: order[key] })
                         column.appendChild(anchor)
                         break;
                     default:
@@ -139,3 +140,6 @@ currentTime();
 
 setInterval(() => { currentTime() }, 1000);
 
+setInterval(() => {
+    location.reload();
+}, 10000);
diff --git a/build/scripts/sidebar.js b/build/scripts/sidebar.js
index e1ccbd2..1a4265a 100644
--- a/build/scripts/sidebar.js
+++ b/build/scripts/sidebar.js
@@ -1,7 +1,7 @@
 function displaySidebar() {
-    document.getElementsByClassName('sidebar')[0].classList.remove('sidebarHide');
+    document.getElementById('sidebar').style.width = "300px";
 }
 
 function hideSidebar() {
-    document.getElementsByClassName('sidebar')[0].classList.add('sidebarHide');
+    document.getElementById('sidebar').style.width = "0";
 }
\ No newline at end of file
diff --git a/build/styles/chefprogress.css b/build/styles/chefprogress.css
index 3432b8c..599384e 100644
--- a/build/styles/chefprogress.css
+++ b/build/styles/chefprogress.css
@@ -1,4 +1,4 @@
-.perinfo {
+/* .perinfo {
     text-align: left;
     font-size: 70%;
   
@@ -78,4 +78,37 @@
     background-color: rgb(179, 88, 138);
   }
   
-  
\ No newline at end of file
+   */
+
+.orderlist{
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  justify-content: center;
+  padding: 20px 80px;
+  
+}
+.orderdiv{
+  background-color: white;
+  border-radius: 10px;
+  box-shadow: 0 0 20px rgb(0,0,0,0.15);
+  margin: 10px;
+  width: 400px;
+  transition: 0.5s;
+  text-decoration: none;
+  color: black;
+}
+
+.orderdiv:hover{
+  background-color: pink;
+}
+
+.orderID{
+  font-size: 20px;
+  font-weight: 700;
+}
+
+.cost{
+  font-size: 17px;
+  font-weight: 600;
+}
\ No newline at end of file
diff --git a/build/styles/dashboard-layout.css b/build/styles/dashboard-layout.css
index 3182e20..6109abc 100644
--- a/build/styles/dashboard-layout.css
+++ b/build/styles/dashboard-layout.css
@@ -39,11 +39,13 @@ header {
     position: fixed;
     top: 0;
     left: 0;
-    width: 300px;
-    height: 100vh;
-    background-color: #3F829D;
+    width: 0;
+    height: 100%;
+    background-color: pink;
     box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
     z-index: 100;
+    transition: 0.5s;
+    overflow-x: hidden;
 }
 
 .sidebarHide {