Initial commit

front/src/components/bar/BarItem.js

@@ -0,0 +1,40 @@
+import {Card} from "@mui/material";
+import Stack from "@mui/material/Stack";
+import Box from "@mui/material/Box";
+import React from "react";
+import Typography from "@mui/material/Typography";
+import Button from "@mui/material/Button";
+
+const role = (myRole) => {
+    switch (myRole) {
+        case "ADMIN":
+            return "Администратор";
+        case "ADMIN_NOT_BARMEN":
+            return "Управляющий";
+        default:
+            return null;
+    }
+}
+
+export function BarItem({row, changeHandler, all, enterExist}) {
+    return (
+        <Card sx={{mb: 1, height: '100px', display: 'relative', p: 1}}>
+            <Stack direction='row' justifyContent='start' alignItems='start'>
+                <Box sx={{width: '75%', pr: 2}}>
+                    <Typography variant='h6'>{row.name}</Typography>
+                    <Typography>{role(row.myRole)}</Typography>
+                </Box>
+                <Stack sx={{width: '25%'}} spacing={1} justifyContent='flex-end' display='flex'>
+                    <Typography color={row.open ? 'green' : 'red'}>{row.open ? "Бар открыт" : "Бар закрыт"}</Typography>
+                    <Button variant='contained'
+                            color={row.enter ? 'error' : 'success'}
+                            onClick={() => changeHandler(row, !row.enter)}
+                            disabled={!row.enter && enterExist}
+                    >
+                        {all ? "Добавить" : row.enter ? "Выйти" : "Войти"}
+                    </Button>
+                </Stack>
+            </Stack>
+        </Card>
+    )
+}

front/src/components/bar/BarList.js

@@ -0,0 +1,70 @@
+import Box from "@mui/material/Box";
+import {useEffect, useMemo, useState} from "react";
+import {api} from "../../lib/clients/api";
+import {requests} from "../../requests";
+import {useAlert} from "../../hooks/useAlert";
+import {BarItem} from "./BarItem";
+import {Loading} from "../core/Loading";
+import * as React from "react";
+import {useUser} from "../../hooks/useUser";
+
+export function BarList({all}) {
+    const {getError, createError} = useAlert();
+    const {refresh} = useUser();
+    const [bars, setBars] = useState([]);
+    const [loading, setLoading] = useState(true);
+
+    useEffect(() => {
+        setLoading(true);
+        api().get(`${requests.bar.list}?my=${!all}`)
+            .then((r) => {
+                setBars(r.data)
+                setLoading(false);
+            })
+            .catch(() => getError())
+        // eslint-disable-next-line
+    }, []);
+    const enterExist = useMemo(() => bars.find((b) => b.enter), [bars])
+    const changeHandler = (row, value) => {
+        let request;
+        let newState;
+        if (!all) {
+            if (value && enterExist) {
+                //todo: добавить переключение
+                createError("Нельзя войти более чем в один бар одновременно")
+                return;
+            }
+            request = api().patch(`${requests.bar.enter}${row.id}&value=${value}`);
+            newState = bars.map((b) => {
+                if (b.id !== row.id) {
+                    return b;
+                }
+                return {
+                    ...b,
+                    enter: value
+                }
+            })
+        } else {
+            request = api().post(requests.bar.addToMyList, row);
+            newState = bars.filter((b) => b.id !== row.id);
+        }
+        request.then(() => {
+            setBars(newState)
+            refresh();
+        }).catch(() => getError())
+    }
+    return (
+        <Box mt={2}>
+            {
+                bars.map((row) => {
+                    return (
+                        <BarItem key={row.id} row={row} changeHandler={changeHandler}
+                        all={all} enterExist={enterExist}/>
+                    )
+                })
+            }
+            {/*Загрузчик*/}
+            <Loading loading={loading}/>
+        </Box>
+    )
+}