- Dish name
+const useStyles = makeStyles((theme) => ({
+ root: {
+ backgroundColor: "#262626",
+ color: "#bbbbbb",
+ width: "100%",
+ marginBottom: "24px",
+ },
+ expandIcon: {
+ color: "#bbbbbb",
+ },
+ textInputFullWidth: {
+ marginTop: theme.spacing(2),
+ marginBottom: theme.spacing(2),
+ flexGrow: 5,
+ "& .MuiInputBase-root": {
+ color: "#bbbbbb",
+ },
+ "& .MuiInputLabel-root": {
+ color: "#bbbbbb",
+ },
+ "$ .MuiFormHelperText-root": {
+ color: "#bbbbbb",
+ },
+ },
+}));
+
+export default function EditCategoriesList(props) {
+ const [open, setOpen] = useState(false);
+ const [newSet, setNewSet] = useState("");
+ const classes = useStyles();
+ const handleDeleteButton = (set) => {
+ setOpen(true);
+ };
+ const onCancel = () => {
+ setOpen(false);
+ };
+ const onAccept = () => {
+ setOpen(false);
+ };
+ const SetList = props.lunchMenu.map((set) => {
+ return (
+
+ }
+ >
+ {set.name}
+
handleDeleteButton(set)}
>
-
- );
- });
- } else {
- return Lunch menu puste;
- }
- };
+
+
+
+ );
+ });
- return {LunchDishes}
;
+ return (
+
+
+ {props.lunchMenu.length === 0 ?
Lunch menu puste
: SetList}
+
+ }
+ >
+ Dodaj zestaw
+
+
+ setNewSet(event.target.value)}
+ label="Nazwa zestawu"
+ variant="outlined"
+ >
+ {}} text="Dodaj" />
+
+
+
+ );
}
diff --git a/src/components/Input/ButtonPrimary.js b/src/components/Input/ButtonPrimary.js
index ee4ab6e..5dafbfd 100644
--- a/src/components/Input/ButtonPrimary.js
+++ b/src/components/Input/ButtonPrimary.js
@@ -6,7 +6,7 @@ const StyledButton = withStyles({
root: {
backgroundColor: "#696969",
color: "#262626",
- margin: "16px 16px 16px 0px",
+ margin: "16px 16px 16px 16px",
padding: "8px 12px 8px 12px",
"&:hover": {
backgroundColor: "#808080",
diff --git a/src/components/Input/Checkboxes.js b/src/components/Input/Checkboxes.js
new file mode 100644
index 0000000..8b7be57
--- /dev/null
+++ b/src/components/Input/Checkboxes.js
@@ -0,0 +1,175 @@
+import React, { useState } from "react";
+import { makeStyles } from "@material-ui/core/styles";
+import FormLabel from "@material-ui/core/FormLabel";
+import FormControl from "@material-ui/core/FormControl";
+import FormGroup from "@material-ui/core/FormGroup";
+import FormControlLabel from "@material-ui/core/FormControlLabel";
+import Checkbox from "@material-ui/core/Checkbox";
+import FormHelperText from "@material-ui/core/FormHelperText";
+
+const useStyles = makeStyles((theme) => ({
+ root: {
+ "& .MuiFormLabel-root": {
+ color: "#e99800",
+ marginBottom: theme.spacing(2),
+ marginLeft: "auto",
+ marginRight: "auto",
+ },
+ "& .MuiFormHelperText-root": {
+ color: "#7e7e7e",
+ },
+ "& .MuiFormGroup-root": {
+ display: "inline",
+ },
+ border: "1px solid #1c1c1c",
+ borderRadius: "6px",
+ marginBottom: theme.spacing(2),
+ },
+ formControl: {
+ margin: theme.spacing(2),
+ alignItems: "center",
+ },
+}));
+
+export default function Checkboxes(props) {
+ const classes = useStyles();
+ const initialState = {
+ gluten: props.allergens.gluten,
+ lactose: props.allergens.lactose,
+ soy: props.allergens.soy,
+ eggs: props.allergens.eggs,
+ seaFood: props.allergens.seaFood,
+ peanuts: props.allergens.peanuts,
+ sesame: props.allergens.sesame,
+ };
+ const [state, setState] = useState(initialState);
+
+ return (
+
+
+ Alergeny
+
+ {
+ setState({ ...state, gluten: !state.gluten });
+ props.onUpdate(state);
+ }}
+ name="gluten"
+ />
+ }
+ label="Gluten"
+ />
+ {
+ setState({ ...state, lactose: !state.lactose });
+ props.onUpdate(state);
+ }}
+ name="lactose"
+ />
+ }
+ label="Laktoza"
+ />
+ {
+ setState({ ...state, soy: !state.soy });
+ props.onUpdate(state);
+ }}
+ name="soy"
+ />
+ }
+ label="Soja"
+ />
+ {
+ setState({ ...state, eggs: !state.eggs });
+ props.onUpdate(state);
+ }}
+ name="eggs"
+ />
+ }
+ label="Jaja"
+ />
+ {
+ setState({ ...state, seaFood: !state.seaFood });
+ props.onUpdate(state);
+ }}
+ name="seaFood"
+ />
+ }
+ label="Owoce morza"
+ />
+ {
+ setState({ ...state, peanuts: !state.peanuts });
+ props.onUpdate(state);
+ }}
+ name="peanuts"
+ />
+ }
+ label="Orzechy"
+ />
+ {
+ setState({ ...state, sesame: !state.sesame });
+ props.onUpdate(state);
+ }}
+ name="sesame"
+ />
+ }
+ label="Sezam"
+ />
+
+
+ Jeżeli nie masz pewności, czy danie zawiera alergen, zaznacz go :)
+
+
+
+ Inne
+
+ props.onVegan()}
+ name="vegan"
+ />
+ }
+ label="Danie wegańskie"
+ />
+ props.onVegetarian()}
+ name="vegetarian"
+ />
+ }
+ label="Danie wegetariańskie"
+ />
+
+
+
+ );
+}
diff --git a/src/components/Output/EditCategoriesList.js b/src/components/Output/EditCategoriesList.js
new file mode 100644
index 0000000..9ca970c
--- /dev/null
+++ b/src/components/Output/EditCategoriesList.js
@@ -0,0 +1,78 @@
+import React, { useState } from "react";
+import Accordion from "@material-ui/core/Accordion";
+import AccordionSummary from "@material-ui/core/AccordionSummary";
+import ExpandMoreIcon from "@material-ui/icons/ExpandMore";
+import IconButton from "@material-ui/core/IconButton";
+import DeleteIcon from "@material-ui/icons/Delete";
+import EditDishList from "./EditDishList";
+import { makeStyles } from "@material-ui/core/styles";
+import YesNo from "../Dialogs/YesNo";
+
+const useStyles = makeStyles((theme) => ({
+ root: {
+ backgroundColor: "#262626",
+ color: "#bbbbbb",
+ width: "100%",
+ },
+ expandIcon: {
+ color: "#bbbbbb",
+ },
+ textInputFullWidth: {
+ marginTop: theme.spacing(2),
+ marginBottom: theme.spacing(2),
+ "& .MuiInputBase-root": {
+ color: "#bbbbbb",
+ },
+ "& .MuiInputLabel-root": {
+ color: "#bbbbbb",
+ },
+ "$ .MuiFormHelperText-root": {
+ color: "#bbbbbb",
+ },
+ },
+}));
+
+export default function EditCategoriesList(props) {
+ const [open, setOpen] = useState(false);
+ const [selectedCategory, selectCategory] = useState("");
+ const classes = useStyles();
+ const handleDeleteButton = (category) => {
+ selectCategory(category);
+ setOpen(true);
+ };
+ const onCancel = () => {
+ setOpen(false);
+ };
+ const onAccept = () => {
+ setOpen(false);
+ props.deleteCategory(selectedCategory);
+ };
+ const CategoriesList = props.categories.map((category) => {
+ return (
+
+ }
+ >
+ {category}
+
+ handleDeleteButton(category)}
+ >
+
+
+
+
+
+
+ );
+ });
+
+ return (
+
+
+ {CategoriesList}
+
+ );
+}
diff --git a/src/components/Output/EditDishList.js b/src/components/Output/EditDishList.js
new file mode 100644
index 0000000..048f296
--- /dev/null
+++ b/src/components/Output/EditDishList.js
@@ -0,0 +1,33 @@
+import React from "react";
+import { useSelector } from "react-redux";
+import List from "@material-ui/core/List";
+import ListItem from "@material-ui/core/ListItem";
+
+export default function EditDishList(props) {
+ const filterDishes = (dishes, category) => {
+ var result = [];
+ dishes.map((dish) => {
+ if (dish.category === category) {
+ result.push(dish);
+ }
+ return true;
+ });
+ return result;
+ };
+
+ const allDishes = useSelector((state) => state.dishes);
+ const thisCategoryDishes = filterDishes(allDishes, props.category);
+ const Dishes = thisCategoryDishes.map((dish) => {
+ return {dish.name};
+ });
+
+ return (
+
+ {thisCategoryDishes.length === 0 ? (
+ Kategoria pusta
+ ) : (
+ Dishes
+ )}
+
+ );
+}
diff --git a/src/styles/Dialogs.scss b/src/styles/Dialogs.scss
index 0d4284c..05c3283 100644
--- a/src/styles/Dialogs.scss
+++ b/src/styles/Dialogs.scss
@@ -11,6 +11,13 @@
}
}
+.yesno-dialog-buttons {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ flex-direction: row;
+}
+
.register-dialog-actions {
display: flex;
justify-content: center;
diff --git a/src/styles/EditRestaurant.scss b/src/styles/EditRestaurant.scss
index b888b33..948921a 100644
--- a/src/styles/EditRestaurant.scss
+++ b/src/styles/EditRestaurant.scss
@@ -1,7 +1,8 @@
.editRestaurant-container {
min-width: 70%;
min-height: 600px;
- max-width: 100%;
+ max-height: 80vh;
+ max-width: 80%;
background-color: $dark-gray;
border-radius: 15px;
display: flex;
@@ -27,7 +28,6 @@
justify-content: space-between;
align-items: center;
width: 100%;
- max-height: 600px;
overflow: auto;
h3 {
font-weight: 400;
@@ -53,6 +53,7 @@
grid-column-start: 1;
grid-column-end: 3;
margin-bottom: 16px;
+ width: 100%;
}
.workingHours-container {