Merge pull request #15 from kbindra/K-xoxo-commits

Hotel app/frontend/package.json

@@ -8,6 +8,7 @@
     "material-table": "^1.54.2",
     "react": "^16.12.0",
     "react-dom": "^16.12.0",
+    "react-qr-reader": "^2.2.1",
     "react-scripts": "0.9.5",
     "semantic-ui-react-form-validator": "^1.0.2"
   },

Hotel app/frontend/src/App.js

@@ -1,26 +1,40 @@
 import React, { Component } from 'react';
 import {BrowserRouter , Route , Switch} from 'react-router-dom';
 import { PrivateRoute } from './components/PrivateRoute';
+import { PrivateRouteCustomer } from './components/PrivateRouteCustomer';
 import Registerform  from './components/Registerform';
 import Loginform from './components/Loginform';
 import Main from './components/Main';
 import Menumanagement from './components/Menumanagement';
 import Additem from './components/Additem';
 import Updateitem from './components/Updateitem';
-import {isLoggedIn} from './components/auth';
+import Customerform from './components/Customer_details';
+import {isLoggedInManager} from './components/auth';
+import {isLoggedInCustomer} from './components/auth';
+import Example from './components/QRscanner';
+import Customermenu from './components/Customermenu';
+import Checkout from './components/Checkout';
+import Pay from './components/Pay';
+import Home from './components/Home';
 
 class App extends Component {
 
   render() {
     return (
           <BrowserRouter>
            <Switch>
-             <Route exact path="/" component={Registerform} />
+             <Route exact path="/" component={Home} />
+             <Route exact path="/register" component={Registerform} />
              <Route exact path="/login" component={Loginform} />
-             <PrivateRoute exact isloggedin={isLoggedIn()} path="/main" component={Main} />
+             <PrivateRoute exact isloggedin={isLoggedInManager()} path="/main" component={Main} />
              <PrivateRoute exact path="/menu" component={Menumanagement} />
              <PrivateRoute exact path="/add" component={Additem} />
              <PrivateRoute exact path="/update" component={Updateitem} />
+             <Route exact  path="/customer" component={Customerform} />
+             <PrivateRouteCustomer exact isloggedin={isLoggedInCustomer()} path="/scan" component={Example} />
+             <PrivateRouteCustomer exact path="/place_order" component={Customermenu} />
+             <PrivateRouteCustomer exact path="/pay" component={Pay} />
+             <PrivateRouteCustomer exact path="/checkout" component={Checkout} />
            </Switch>
           </BrowserRouter>
     );

Hotel app/frontend/src/components/Additem.js

@@ -62,13 +62,7 @@ const additem = () => {
   window.location.replace("/add")
 }
 
-const updateitem = () => {
- window.location.replace("/update")
-}
 
-const deleteitem = () => {
- window.location.replace("/delete")
-}
 
 
 export default function ClippedDrawer(props) {
@@ -120,7 +114,7 @@ export default function ClippedDrawer(props) {
         <div className={classes.toolbar} />
         <List>
         <ListItem button>
-          <ListItemText primary="Order" />
+          <ListItemText primary="Order" onClick={homepage} />
         </ListItem>
         <ListItem button onClick={handleClick}>
         <ListItemText primary="Menu" />
@@ -134,12 +128,6 @@ export default function ClippedDrawer(props) {
           <ListItem button className={classes.nested}>
             <ListItemText primary="Add Item" onClick={additem} />
           </ListItem>
-          <ListItem button className={classes.nested}>
-            <ListItemText primary="Update Item" onClick={updateitem} />
-          </ListItem>
-          <ListItem button className={classes.nested}>
-            <ListItemText primary="Delete Item" onClick={deleteitem} />
-          </ListItem>
          </List>
          </Collapse>
         <ListItem button>

Hotel app/frontend/src/components/Card.js

@@ -0,0 +1,63 @@
+import React,{useState, useEffect} from 'react';
+import { makeStyles } from '@material-ui/core/styles';
+import Card from '@material-ui/core/Card';
+import CardActions from '@material-ui/core/CardActions';
+import CardContent from '@material-ui/core/CardContent';
+import Button from '@material-ui/core/Button';
+import Typography from '@material-ui/core/Typography';
+
+
+
+const useStyles = makeStyles({
+  card: {
+    minWidth: 300,
+    maxWidth: 1000,
+    margin: "auto",
+    marginTop: 20,
+    marginBottom: 20,
+    borderRadius: 10
+  },
+  bullet: {
+    display: 'inline-block',
+    margin: '0 2px',
+    transform: 'scale(0.8)',
+  },
+  title: {
+    fontSize: 14,
+  },
+  pos: {
+    marginBottom: 12,
+  },
+});
+
+
+export default function SimpleCard(props) {
+  const classes = useStyles();
+  const bull = <span className={classes.bullet}>•</span>;
+  const additem = props.additem
+  return (
+      <div >
+          {props.data.map((x,i) => (
+           <Card className={classes.card}>
+           <CardContent >
+             <Typography className={classes.title} color="textSecondary" gutterBottom>
+               FoodItem-ID: {x.id}
+             </Typography>
+             <Typography variant="h5" component="h2">
+               {x.name}
+             </Typography>
+             <Typography variant="body2" component="p">
+               {x.description}
+             </Typography>
+             <Typography className={classes.title} color="textSecondary" gutterBottom>
+               Price: Rs.{x.amount}
+             </Typography>
+           </CardContent>
+           <CardActions>
+            <Button variant="outlined" style={{backgroundColor:"lightblue"}} onClick={() => additem(x,i)}>Add to Cart</Button>
+           </CardActions>
+         </Card>
+          ))} 
+      </div>
+  );
+}

Hotel app/frontend/src/components/Cart.js

@@ -0,0 +1,83 @@
+import React from 'react';
+import { makeStyles } from '@material-ui/core/styles';
+import Button from '@material-ui/core/Button';
+import Dialog from '@material-ui/core/Dialog';
+import ListItemText from '@material-ui/core/ListItemText';
+import ListItem from '@material-ui/core/ListItem';
+import List from '@material-ui/core/List';
+import Divider from '@material-ui/core/Divider';
+import AppBar from '@material-ui/core/AppBar';
+import Toolbar from '@material-ui/core/Toolbar';
+import IconButton from '@material-ui/core/IconButton';
+import Typography from '@material-ui/core/Typography';
+import CloseIcon from '@material-ui/icons/Close';
+import Slide from '@material-ui/core/Slide';
+import AddIcon from '@material-ui/icons/Add';
+import RemoveIcon from '@material-ui/icons/Remove';
+
+const useStyles = makeStyles(theme => ({
+  appBar: {
+    position: 'relative',
+    backgroundColor: 'black'
+  },
+  title: {
+    marginLeft: theme.spacing(2),
+    flex: 1,
+  },
+  but: {
+      margin: "auto"
+  }
+}));
+
+const Transition = React.forwardRef(function Transition(props, ref) {
+  return <Slide direction="up" ref={ref} {...props} />;
+});
+
+
+
+export default function FullScreenDialog(props) {
+  const classes = useStyles();
+  const [open, setOpen] = React.useState(false);
+  const handleClickOpen = () => {
+    setOpen(true);
+  };
+
+  const handleClose = () => {
+    setOpen(false);
+  };
+
+  return (
+    <div>
+      <Button  variant="outlined"  onClick={handleClickOpen} style={{display: "block" ,margin: "auto", border: "white", color:"white", fontSize: 12}}>
+        Go to Cart
+      </Button>
+      <Dialog fullScreen open={open} onClose={handleClose} TransitionComponent={Transition}>
+        <AppBar className={classes.appBar}>
+          <Toolbar>
+            <IconButton edge="start" color="inherit" onClick={handleClose} aria-label="close">
+              <CloseIcon />
+            </IconButton>
+            <Typography variant="h6" className={classes.title}>
+              Cart
+            </Typography>
+          </Toolbar>
+        </AppBar>
+        <List>
+          {Object.keys(props.food).map((key,i) => (
+          <ListItem >
+            <ListItemText primary={props.food[key].name} secondary={props.food[key].price} />
+            <RemoveIcon fontSize="large" onClick={() => props.handleRemove(key,i)} />
+            <Typography fontSize="large">{props.food[key].quantity}</Typography>
+            <AddIcon fontSize="large" onClick={() => props.handleAdd(key,i)} />
+          </ListItem>
+          ))}
+          <Divider />
+            <ListItem >
+                <ListItemText primary="Subtotal: " secondary={props.grandtotal}/>
+                <Button style={{backgroundColor: "black", color:"white", }} onClick={() => props.handleConfirm()}>Confirm Order</Button>
+            </ListItem>
+        </List>
+      </Dialog>
+    </div>
+  );
+}

Hotel app/frontend/src/components/Checkout.js

@@ -0,0 +1,28 @@
+import React, { useEffect } from 'react';
+import {deleteTokensCustomer} from './auth';
+import './customer.css'
+
+export default function Checkout(){
+
+
+    const handleOrder = () => {
+        window.location.replace("/place_order");
+    }
+
+    const handleCheckout = () => {
+        deleteTokensCustomer();
+        window.location.replace("/customer")
+    }
+
+    return (
+        <div className="bg3" style={{textAlign: "center"}}>
+            <h1>Thank You For your Visit</h1>
+          <div  style={{border: "2px solid black", textAlign: "center" ,minWidth: 300, maxWidth: 700,margin: "auto", marginTop: "200px", backgroundColor:"white",height: "300px"}}>
+            <h3 style={{marginTop: "50px"}}>Wanna Order Again??</h3>
+           <button style={{display:"block", width: "100%", backgroundColor:'blue',color:"white", padding:" 15px 32px",fontSize:"16px", pointerEvents: "cursor" }} onClick={() => handleOrder()}>Order Again</button>
+           <h3>See You Next Time :))</h3>
+            <button style={{display:"block", width: "100%", padding:" 15px 32px",fontSize:"16px", backgroundColor:'red', color: "white", pointer: "cursor", marginBottom: "20px"}} onClick={() => handleCheckout()}>Checkout</button>
+        </div>
+        </div>
+    )
+}