Housekeeping, added order history page for customer. Needs work.

api/order.py

@@ -123,4 +123,15 @@ def inProgress():
             return { 'response': ordersInProgress }
         except Exception as e:
             print('error: ', e, '\n')
-            abort(500)   
+            abort(500)
+
+@orderBlueprint.route('/fromcustomer', methods=['GET'])
+def byCustomer():    
+    if request.method == 'GET':
+        if not (isLoggedIn() and isCustomer()): abort(403)
+        try:
+            ordersfromCustomer = orders.getOrdersBycustomerID(session['customerID'])
+            return {'response' : ordersfromCustomer}
+        except Exception as e:
+            print('error: ', e, '\n')
+            abort(500)

app.py

@@ -64,6 +64,12 @@ def orderstatus(id):
         return render_template("dashboard-chefprogress-order.html", currentUrl = "/chefprogress", nav = helpers.getSidebarNav())
     else: return abort(403)
 
+@app.route('/dashboard/order-history')
+def order_history(): 
+    if helpers.isLoggedIn() and (helpers.isCustomer()):
+        return render_template("dashboard-customerorders.html", currentUrl = "/order-history", nav = helpers.getSidebarNav())
+    else: return abort(403)
+
 @app.route('/login')
 def login():
     if helpers.isLoggedIn(): return redirect('/') 

build/dashboard-customerorders.html

@@ -0,0 +1,53 @@
+{% extends 'dashboard-layout.html' %}
+{% block head %}
+    <title>Dashboard: Active Orders</title>
+    <link href="/styles/dashboard-customerorders.css" rel="stylesheet" type="text/css">
+    <link href="/styles/order-page-orders.css" rel="stylesheet" type="text/css">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css"/>
+{% endblock %}
+
+{% block body %}
+    <div class="title">
+        <h2>Order History</h2>
+        <!-- will prob display different stuff here based on employee -->
+    </div>
+    <div class="orderlist" id="orderlist"></div>
+    <div class="displayblock" id="displayblock" onclick="closeModel()">
+    </div>
+    <div class="ordermodel" id="ordermodel" onclick="">
+        <div class="order-container">
+            <h1 class="order-id"></h1>
+            <div class="order-items" id="order-items"></div>
+            <div class="order-cost" id="order-cost"></div>
+            <div class="order-status" id="order-status"></div>
+            <div class="ratingscontainer">
+                <div class ="stars">
+                    <input type="radio" name="rate" id ="rate5">
+                    <label for="rate5" class="fas fa-star"></label>
+                    <input type="radio" name="rate" id ="rate4">
+                    <label for="rate4" class="fas fa-star"></label>
+                    <input type="radio" name="rate" id ="rate3">
+                    <label for="rate3" class="fas fa-star"></label>
+                    <input type="radio" name="rate" id ="rate2">
+                    <label for="rate2" class="fas fa-star"></label>
+                    <input type="radio" name="rate" id ="rate1">
+                    <label for="rate1" class="fas fa-star"></label>
+                </div>
+                <form action="#">
+                    <div class="textarea">
+                        <textarea cols="30"></textarea>
+                    </div>
+                    <div class="btn">
+                        <button type="submit">Submit Rating</button>
+                    </div>
+                </form>
+            </div> 
+        </div>
+        <div>
+            <button onclick="closeModel()">Close</button>
+        </div>
+    </div>
+<!-- <script src="/scripts/showstatus.js"></script> -->
+<script src="/scripts/dashboard-customerorders.js"></script>
+<script src="/scripts/order-page-orders.js"></script>
+{% endblock %}

build/dashboard-settings.html

@@ -55,4 +55,5 @@ <h3>Create Employee Account:</h3>
     </div>
     <script src="/scripts/dashboard-settings.js"></script>
     {% if session.get('employeeType') == 'manager' %}<script src="/scripts/dashboard-settings-createAccount.js"></script> {% endif %}
+    {% if session.get('userType') == 'customer' %}<script src="/scripts/dashboard-settings-customer.js"></script> {% endif %}
 {% endblock %}

build/dashboard-wallet.html

@@ -20,12 +20,11 @@
                 <t1 id="balance" class="balance">$0.00</t1>
             </div>
             <div class='accountinfo'>
-                <p>Account #:</p>
-                <p>Name: </p>
+                <p>Account #: {{session.get('customerID')}}</p>
+                <p>Name: {{session.get('customerName')}}</p>
             </div>
             <div class="options">
                 <button onclick="openModel('depositmodel')">Make a deposit</button>
-                <button>Use a coupon</button>
             </div>
         </div>
     </div>
@@ -35,8 +34,8 @@
         <label for="depositamount">Amount to deposit:</label>
         <input type="number" name="depositamount" placeholder="1.00" min="1.00" step="0.01" max="1000" id="depositamount">
         <div>
-            <p>Account #: </p>
-            <p>Name: </p>
+            <p>Account #: {{session.get('customerID')}}</p>
+            <p>Name: {{session.get('customerName')}}</p>
             <p class="success">Your transfer was successful</p>
             <p class="success">Reloading...</p>
         </div>

build/scripts/chefprogress-orders.js

@@ -48,5 +48,5 @@ function reload() {
 reload();
 
 setInterval(() => {
-    reload();
+    if (!doNotReload) reload();
 }, 10000);

build/scripts/dashboard-customerorders.js

@@ -0,0 +1,51 @@
+async function getCurrentOrders() {
+    const response = await fetch('/api/order/fromcustomer');
+    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 => {
+            let orderdiv = createElement("a", {class: `orderdiv ${order['status']}`, href: "javascript:void(0)", onclick: `loadOrder(${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();
+        });
+    }
+}
+
+showOrders();
+// function reload() {
+//     eraseOrders();
+//     showOrders();
+// }
+
+// reload();
+
+// setInterval(() => {
+//     if (!doNotReload) reload();
+// }, 10000);

build/scripts/dashboard-settings-customer.js

@@ -0,0 +1,49 @@
+// Information update == customers Only for now.
+
+async function updateCustomerInfo(){
+    let data = parseInfo();
+    if (confirm("Are you sure you want to update your information?")) {
+        response = await updateInfoDB(data);
+        if (data['name'] == response['name'] && data['number'] == response['number']) {
+            alert("Your information has been updated successfuly!");
+        }
+        else{
+            alert("There's been an error updating your information, changes have been made.");
+        }
+        location.reload();
+    }
+}
+
+function parseInfo() {
+    let name = document.getElementById("fullname").value;
+    let number = document.getElementById("phone").value;
+
+    return {name, number};
+}
+
+async function filltextboxes() {
+    let data = await getCustomerInfo();
+    document.getElementById("fullname").value =  data['name'];
+    document.getElementById("phone").value = data['number'];
+}
+
+async function getCustomerInfo() {
+    const response = await fetch("/api/customer/editcustomer");
+    const data = await response.json();
+    return data['response'];
+}
+
+async function updateInfoDB(newinfo) {
+    const response = await fetch("/api/customer/editcustomer", {
+        method: 'PUT',
+        headers: {
+            'Accept': 'application/json',
+            'Content-Type': 'application/json',
+        },
+        body: JSON.stringify(newinfo),
+    });
+    const data = await response.json();
+    return data['response'];
+}
+
+filltextboxes();

build/scripts/dashboard-settings.js

@@ -44,54 +44,4 @@ async function postPassword(newpass) {
     });
     const data = await response.json();
     return data['response'];
-}
-
-// Information update == customers Only for now.
-
-async function updateCustomerInfo(){
-    let data = parseInfo();
-    if (confirm("Are you sure you want to update your information?")) {
-        response = await updateInfoDB(data);
-        if (data['name'] == response['name'] && data['number'] == response['number']) {
-            alert("Your information has been updated successfuly!");
-        }
-        else{
-            alert("There's been an error updating your information, changes have been made.");
-        }
-        location.reload();
-    }
-}
-
-function parseInfo() {
-    let name = document.getElementById("fullname").value;
-    let number = document.getElementById("phone").value;
-
-    return {name, number};
-}
-
-async function filltextboxes() {
-    let data = await getCustomerInfo();
-    document.getElementById("fullname").value =  data['name'];
-    document.getElementById("phone").value = data['number'];
-}
-
-async function getCustomerInfo() {
-    const response = await fetch("/api/customer/editcustomer");
-    const data = await response.json();
-    return data['response'];
-}
-
-async function updateInfoDB(newinfo) {
-    const response = await fetch("/api/customer/editcustomer", {
-        method: 'PUT',
-        headers: {
-            'Accept': 'application/json',
-            'Content-Type': 'application/json',
-        },
-        body: JSON.stringify(newinfo),
-    });
-    const data = await response.json();
-    return data['response'];
-}
-
-filltextboxes();
+}

build/scripts/dashboard-wallet.js

@@ -1,15 +1,12 @@
 async function displayAccountBalance() {      // Displays current balance availale in account
     const balance = document.getElementById("balance");
     const currBalance = await getBalance();
-    // console.log(balance);
-    console.log(parseBalance(currBalance['balance']))
     balance.innerText = parseBalance(currBalance['balance']);
 }
 
 async function getBalance() {   // Gets balance from the SQL Server
     const response = await fetch('/api/wallet/');
     const data = await response.json();
-    console.log(data['response']);
     return data['response'];
 }
 
@@ -21,7 +18,6 @@ function openModel(modelName) { // Opens a selected modal.
     const back = document.getElementById('displayblock');
     back.onclick = function() {closeModel(modelName);};
     back.style.display = "block";
-    console.log(back);
     const model = document.getElementById(modelName);
     model.style.display = "flex";
 }
@@ -40,7 +36,6 @@ async function deposit() {
             setTimeout(() => {
                 depositToDB(amount);
                 let success = document.getElementsByClassName('success');
-                console.log(success)
                 Array.from(success).forEach(element => {
                     element.style.display = 'block'
                 });
@@ -65,6 +60,5 @@ async function depositToDB(amount) {
         body: JSON.stringify({'balance' : amount}),
     });
     const data = await response.json();
-    console.log("New balance is:", data['response'])
 }
 displayAccountBalance()