Staff router

.gitignore

@@ -34,4 +34,7 @@ built
 package-lock.json
 
 ### MAC ##
-.DS_Store
+.DS_Store
+
+### VSCODE ###
+.vscode

src/main/java/ca/mcgill/ecse428/potatopeeps/config/DatabaseLoader.java

@@ -4,6 +4,7 @@
 import ca.mcgill.ecse428.potatopeeps.diningsession.DiningSessionRepository;
 import ca.mcgill.ecse428.potatopeeps.menuitem.MenuItem;
 import ca.mcgill.ecse428.potatopeeps.menuitem.MenuItemRepository;
+import ca.mcgill.ecse428.potatopeeps.order.Order;
 import ca.mcgill.ecse428.potatopeeps.order.OrderRepository;
 import ca.mcgill.ecse428.potatopeeps.tag.Tag;
 import ca.mcgill.ecse428.potatopeeps.tag.TagRepository;
@@ -95,6 +96,25 @@ public void run(String... strings) {
                     menuItemRepository.save(menuItem);
                 }
             }
+
+            // FILL ORDER TABLE
+            Order[] orders = new Order[10];
+            orders[0] = new Order(menuItems[0].getPrice(), 1, menuItems[0], diningSessions[0]);
+            orders[1] = new Order(menuItems[3].getPrice(), 2, menuItems[3], diningSessions[0]);
+            orders[2] = new Order(menuItems[7].getPrice(), 1, menuItems[7], diningSessions[0]);
+            orders[3] = new Order(menuItems[13].getPrice(), 4, menuItems[13], diningSessions[0]);
+            orders[4] = new Order(menuItems[25].getPrice(), 1, menuItems[25], diningSessions[1]);
+            orders[5] = new Order(menuItems[19].getPrice(), 1, menuItems[19], diningSessions[1]);
+            orders[6] = new Order(menuItems[2].getPrice(), 1, menuItems[2], diningSessions[2]);
+            orders[7] = new Order(menuItems[15].getPrice(), 1, menuItems[15], diningSessions[3]);
+            orders[8] = new Order(menuItems[11].getPrice(), 1, menuItems[11], diningSessions[4]);
+            orders[9] = new Order(menuItems[9].getPrice(), 1, menuItems[9], diningSessions[4]);
+            for (Order order : orders) {
+            	orderRepository.save(order);
+//                if(!orderRepository.existsById(order.getId())){
+//                	orderRepository.save(order);
+//                }
+            }
     }
 
 }

src/main/js/components/App.js

@@ -11,6 +11,7 @@ import {Login, SelectTask} from "./Login";
 import {Staff, StaffOrders, StaffRequests} from "./Staff";
 import {Manager} from "./Manager";
 import {Customer, CustomerMenu, CustomerLandingPage} from "./Customer";
+import {DiningSessionOrders} from "./subcomponents/Order"
 
 /** ----- TUTORIAL API IMPORTS -----**/
 import follow from "../follow";
@@ -572,6 +573,27 @@ export class App extends React.Component {
                                                    selectedView={'Customer'}
                                                    filterMenuItemList={this.filterMenuItemList}
                                                    {...props}/>)}/>
+                                    {/* <Route path={"/tables"} component={DiningSessionOrders} />  */}
+                                <Route exact path={"/orders"} render={(props) =>
+                                    (<DiningSessionOrders loadResourceFromServer={this.loadResourceFromServer}
+                                                   onCreate={this.onCreate}
+                                                   onUpdate={this.onUpdate}
+                                                   onDelete={this.onDelete}
+                                                   onNavigate={this.onNavigate}
+                                                //    diningSession={this.props.diningSession}
+                                                //    diningSessions={this.state.diningSessions}
+                                                //    diningSessionLinks={this.state.diningSessionLinks}
+                                                //    diningSessionAttributes={this.state.diningSessionAttributes}
+                                                //    orders={this.state.orders}
+                                                //    orderLinks={this.state.orderLinks}
+                                                //    orderAttributes={this.state.orderAttributes}
+                                                //    menuItems={this.props.menuItems}
+                                                //    menuItemTags={this.state.menuItemTags}
+                                                //    tags={this.state.tags}
+                                                   selectedView={'Staff'}
+                                                   filterMenuItemList={this.filterMenuItemList}
+                                                   location={this.props.location}
+                                                   {...props}/>)}/>                   
                                 <Route exact path={"/selectTask"} component={SelectTask}/>
                                 <Route exact path={"/staff-requests"} component={StaffRequests}/>
                                 <Route exact path={"/staff-orders"} component={StaffOrders}/>

src/main/js/components/Staff.js

@@ -3,6 +3,7 @@ import React from "react";
 import {FontAwesomeIcon} from "@fortawesome/react-fontawesome";
 
 /** ----- COMPONENT IMPORTS -----**/
+import {CustomerDiningSessionSelect, StaffDiningSessionPage, StaffDiningSession} from "./subcomponents/DiningSession";
 
 /** ----- CSS/STYLING IMPORTS -----**/
 import "../../resources/static/css/staff.css";
@@ -15,17 +16,33 @@ import "../../resources/static/css/staff.css";
  */
 
 export class Staff extends React.Component {
+
+    constructor(props){
+        super(props);
+        this.state = {pageSize: 30, selectedView: 'Staff'};
+    }
     render() {
         return (
             <div className={"page staff-page"}>
-                <StaffLanding orders={this.props.orders}
-                              orderAttributes={this.props.orderAttributes}
-                              diningSessions={this.props.diningSessions}
-                              diningSessionsAttributes={this.props.diningSessionAttributes}
-                              selectedView={this.props.selectedView}/>
+                <StaffDiningSessionPage
+                            selectedView={this.props.selectedView}
+                            diningSessions={this.props.diningSessions}
+                            // pageSize={this.state.pageSize}
+                            diningSessionAttributes={this.props. diningSessionAttributes}
+                            diningSessionLinks={this.props.diningSessionLinks}
+                            // onNavigate={this.props.onNavigate}
+                            // updatePageSize={this.props.updatePageSize}
+                            onUpdate={this.props.onUpdate}
+                            onDelete={this.props.onDelete}
+                            history={this.props.history}/>
+
             </div>
         )
     }
+
+    componentDidMount() {
+        this.props.loadResourceFromServer('diningSessions', this.state.pageSize);
+    }
 }
 
 class StaffLanding extends React.Component {
@@ -66,22 +83,26 @@ class StaffLanding extends React.Component {
                         </header>
                         <div className="content-wrap full-width">
                             /* Deleted the sample list of menu items as we do not need to see the menu items from staff*/
+
                             <footer>
                                 <div className="signature">
                                     <h6>Sushi</h6>
                                     <h5>PotatoPeeps</h5>
                                 </div>
                             </footer>
                         </div>
+
                     </main>
                 </div>
+
                 <ul id="slideshow">
                     <li id="staff-slideshow-element-first" className="staff-slideshow-elements"/>
                     <li id="staff-slideshow-element-second" className="staff-slideshow-elements"/>
                     <li id="staff-slideshow-element-third" className="staff-slideshow-elements"/>
                     <li id="staff-slideshow-element-fourth" className="staff-slideshow-elements"/>
                     <li id="staff-slideshow-element-fifth" className="staff-slideshow-elements"/>
                 </ul>
+
             </div>
         )
     }

src/main/js/components/subcomponents/DiningSession.js

@@ -2,8 +2,20 @@
 
 /** ----- NPM PACKAGE IMPORTS -----**/
 import React from "react";
+import ReactDOM from "react-dom";
+import Select from "react-select";
+import Modal from "react-bootstrap/Modal";
+import Button from "react-bootstrap/Button";
+import {FontAwesomeIcon} from "@fortawesome/react-fontawesome";
+import {
+    faTrash, faEdit, faAngleDoubleLeft,
+    faAngleDoubleRight, faAngleLeft, faAngleRight,
+    faPlus
+} from "@fortawesome/free-solid-svg-icons";
 
-
+/** ----- CSS/STYLING IMPORTS -----**/
+import "../../../resources/static/css/staff.css"
+//TODO filter for active
 export class CustomerDiningSessionSelect extends React.Component {
     constructor(props) {
         super(props);
@@ -23,4 +35,109 @@ export class CustomerDiningSessionSelect extends React.Component {
             </select>
         );
     }
+}
+
+export class StaffDiningSessionPage extends React.Component{
+
+    constructor(props) {
+        super(props);
+        this.state = {
+            show : false,
+            orders : []
+        }
+    }
+
+    render(){
+        const sessions = this.props.diningSessions.map(session =>
+            <StaffDiningSession
+                key={session.entity._links.self.href}
+                diningSession={session}
+                diningSessionAttributes={this.props.diningSessionAttributes}
+                history = {this.props.history}
+                onCreate={this.onCreate}
+                onUpdate={this.onUpdate}
+                onDelete={this.onDelete}
+                onNavigate={this.onNavigate}
+            />)
+
+        //TODO review how to get number of diningSessions. Test whether this.props.diningSessions.size returns a number or undefined
+        return  (
+            <div>
+                <title>All Orders</title>
+                {sessions}
+
+            </div>
+        )
+    }
+
+    handleClose(){
+        //load orders
+        // const orders;
+    }
+
+}
+
+export class StaffDiningSession extends React.Component{
+
+    constructor(props){
+        super(props);
+        this.handleListOrders = this.handleListOrders.bind(this);
+    }
+
+    requestOrders(){
+        fetch(this.props.diningSession.entity._links.orders.href, {method: 'GET', headers: {'Content-Type': 'application/json'}})
+            .then(
+                response => {
+                    if (!response.ok) {
+                        console.log('Looks like there was a problem. Status Code: ' +
+                            response.status);
+                        return;
+                    }
+
+                    // Examine the text in the response
+                    response.json().then((data) => {
+                        console.log(data._embedded.orders);
+                        this.setState(
+                            {
+                                orders : data._embedded.orders
+                            }
+                        );
+                    });
+                }
+            )
+            .catch(function(err) {
+                console.log('Fetch Error :-S', err);
+            });
+   }
+    render(){
+        // console.log("Individual session:");
+        // console.log(this.props.diningSession);
+        return (
+            <div className="gridViewItem">               
+                    <img className="itemImage" draggable="false" src="./img/3.jpg" />               
+                    <div className="overlay">
+                        <div className="text">Table {this.props.diningSession.entity.tableNumber}</div>
+                        <div className="text">{this.props.diningSession.entity.price}</div>
+                        <div style={{display: 'flex', justifyContent: 'center'}}>
+                            <button className="view-detail-button" title="View details">
+                                <i className="view-order" style={{fontSize: '20px'}} onClick={this.handleListOrders}>View</i>
+                            </button>
+                        </div>
+
+                    </div> 
+            </div>
+        )
+    }
+
+    handleListOrders(){
+        this.props.history.push
+        (
+            {
+            pathname: ('/orders/'),
+            state: {diningSession : this.props.diningSession},
+            diningSession : this.props.diningSession
+            } 
+        );
+
+    }
 }