Skip to content

Commit

Permalink
Merge pull request #10 from moevm/koroleva/filtration
Browse files Browse the repository at this point in the history
Add warehouses page, cell page, addition component
  • Loading branch information
polinaKoroleva05 authored Nov 8, 2024
2 parents b9b970c + 9db304a commit 65741c1
Show file tree
Hide file tree
Showing 13 changed files with 443 additions and 73 deletions.
6 changes: 6 additions & 0 deletions client/src/App.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,9 @@ import AllEventsPage from './pages/manyEntity/AllEventsPage';
import EventPage from './pages/oneEntity/EventPage';
import PaymentPage from './pages/PaymentPage';
import AuthPage from './pages/AuthPage';
import AllWarehousesPage from './pages/manyEntity/AllWarehousesPage';
import WarehousePage from './pages/oneEntity/WarehousePage';
import CellPage from './pages/oneEntity/CellPage';

function App() {
return (
Expand All @@ -27,11 +30,14 @@ function App() {
<Route path="/rentCell" element={<RentCellPage />}></Route>
<Route path="/help" element={<HelpPage />}></Route>
<Route path="/allCells" element={<AllCellsPage />}></Route>
<Route path="/cell" element={<CellPage />}></Route>
<Route path="/allUsers" element={<AllUsersPage />}></Route>
<Route path="/user" element={<UserPage />}></Route>
<Route path="/allEvents" element={<AllEventsPage />}></Route>
<Route path="/event" element={<EventPage />}></Route>
<Route path="/paymentCell" element={<PaymentPage />}></Route>
<Route path="/allWarehouses" element={<AllWarehousesPage />}></Route>
<Route path="/warehouse" element={<WarehousePage/>}></Route>
</Routes>
</BrowserRouter>
);
Expand Down
70 changes: 70 additions & 0 deletions client/src/components/Addition.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,70 @@
import { useState } from "react";
import { Button, Form, InputGroup, Modal } from "react-bootstrap";

export default function Addition<Type>(props: { handleSend: any, obj: any }) {
const [state, setState] = useState(props.obj);
const [show, setShow] = useState(false);

function handleShow() {
setShow(true);
}

function handleClose() {
setShow(false);
}

function handleSubmit(e: React.ChangeEvent<HTMLFormElement>) {
e.preventDefault();
const formData = new FormData(e.target);
const formDataObj = Object.fromEntries(formData.entries());
props.handleSend(formDataObj);
setShow(false);

}
const data = []
for (let key in props.obj) {
data.push(
<InputGroup className="mb-3">
<InputGroup.Text id="basic-addon1">{props.obj[key].name}</InputGroup.Text>
{props.obj[key].type == "b" && <InputGroup.Checkbox name={key} />}
{
props.obj[key].type == "s" && <Form.Control
placeholder={props.obj[key].name} name={key}
/>
}
{
props.obj[key].type == "d" && <Form.Control
placeholder={props.obj[key].name} name={key}
/>
}

</InputGroup>
)

}
return (
<>
<Button onClick={handleShow}>Добавить элемент</Button>
<Modal show={show} onHide={handleClose}>
<Modal.Header closeButton>
<Modal.Title>Добавление нового элемента</Modal.Title>
</Modal.Header>
<Modal.Body>
<Form onSubmit={handleSubmit}>
{data}
<Button type="submit">
Добавить
</Button>

</Form>
</Modal.Body>
</Modal>
</>
)

}

// {
// data: "Дата",
// FIO: "Фамилия Имя Отчество"
// }
7 changes: 6 additions & 1 deletion client/src/components/CellsTable.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,10 @@ export default function CellsTable(props: { isForRent: boolean, isForAdmin: bool
setShowPayment(!showPayment);
}

function handleCellClick(cell: Cell) {
navigate("/cell", { state: cell })
}

const listCells = props.cells.map((cell: Cell, index) =>
<tr key={cell.cellId}>
<td>
Expand All @@ -33,11 +37,12 @@ export default function CellsTable(props: { isForRent: boolean, isForAdmin: bool
{cell.endOfRent}
</td>
<td>
{cell.warehouse}
{cell.warehouseId}
</td>
{props.isForRent && <td> <Button type="button" className="btn" onClick={() => handleRent(cell)}> Арендовать </Button></td>}
{props.isForAdmin && <td> {cell.needService ? "Требует" : "Не требует"}</td>}
{props.isForAdmin && <td> <Button type="button" className="btn" > Обслужить </Button> </td>}
<td> <Button type="button" className="btn" onClick={() => handleCellClick(cell)}> Подробнее </Button></td>
</tr>
)
return (<>
Expand Down
35 changes: 35 additions & 0 deletions client/src/components/Filter.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
import { useState } from "react";
import { Form, InputGroup } from "react-bootstrap";

export default function Filter<Type>(props: { handleSend: any, obj: any }) {
const [state, setState] = useState(props.obj);
const filters = []
for (let key in props.obj) {
filters.push(
<>
<InputGroup.Text id="basic-addon1">{props.obj[key].name}</InputGroup.Text>
{props.obj[key].type == "b" && <InputGroup.Checkbox/>}
{props.obj[key].type == "s" && <Form.Control
placeholder={props.obj[key].name}
/>}
{props.obj[key].type == "d" && <Form.Control
placeholder={props.obj[key].name}
/>}

</>
)

}
return (<>
<InputGroup className="mb-3">
{filters}
</InputGroup>

</>)

}

// {
// data: "Дата",
// FIO: "Фамилия Имя Отчество"
// }
4 changes: 4 additions & 0 deletions client/src/pages/PersonalAccountPage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,10 @@ export default function PersonalAccount() {
<li><Link to="/myCells">Мои ячейки</Link></li>
<li><Link to="/rentCell">Арендовать ячейку</Link></li>
<li><Link to="/help">Служба поддержки</Link></li>
<li><Link to="/allCells">Все ячейки</Link></li>
<li><Link to="/allEvents">Все события</Link></li>
<li><Link to="/allUsers">Все пользователи</Link></li>
<li><Link to="/allWarehouses">Все склады</Link></li>
<li><Link to="/">Выход</Link></li>
</ul>
</main>
Expand Down
29 changes: 27 additions & 2 deletions client/src/pages/manyEntity/AllCellsPage.tsx
Original file line number Diff line number Diff line change
@@ -1,10 +1,35 @@
import { useState } from "react";
import { useEffect, useState } from "react";
import CellsTable from "../../components/CellsTable";
import { cellsInit } from "../../serviceFiles/constants";
import { cellsInit, GET_ALL_CELLS_URL, POST_NEW_CELL_URL } from "../../serviceFiles/constants";
import { Cell, cellFields } from "../../serviceFiles/types";
import Filter from "../../components/Filter";
import Addition from "../../components/Addition";
import axios from "axios";
import { useNavigate } from "react-router-dom";

export default function AllCellsPage() {
const [cells, setCells] = useState(cellsInit);
const [filters, setFilters] = useState({});
let navigate = useNavigate();
function handleSendFilters(obj: Cell){
setFilters(obj)
}
function handleSendNewData(newObj: Cell){
console.log("Получен объект в AllCellsPage", newObj);
axios.post(POST_NEW_CELL_URL, newObj).then(response => { setCells(response.data) }).catch(error => {
console.error('Ошибка при получении ячеек. Взяты дефолтные ячейки', error);
setCells(cellsInit);
});
}
useEffect(() => {
axios.post(GET_ALL_CELLS_URL, filters).then(response => { setCells(response.data) }).catch(error => {
console.error('Ошибка при получении ячеек. Взяты дефолтные ячейки', error);
setCells(cellsInit);
});
})
return (<>
{/* <Filter handleSend={handleSendFilters} obj={cellFields}></Filter> */}
<Addition handleSend={handleSendNewData} obj={cellFields}></Addition>
<CellsTable isForRent={false} isForAdmin={true} cells={cells} ></CellsTable>
</>
)
Expand Down
68 changes: 44 additions & 24 deletions client/src/pages/manyEntity/AllEventsPage.tsx
Original file line number Diff line number Diff line change
@@ -1,19 +1,37 @@
import { useState } from "react";
import { useEffect, useState } from "react";
import { useNavigate } from "react-router-dom";
import { Event } from "../../serviceFiles/types";
import { Event, eventFields } from "../../serviceFiles/types";
import Table from "react-bootstrap/Table";
import { Tab } from "react-bootstrap";
import { eventsInit } from "../../serviceFiles/constants";
import { Button, Tab } from "react-bootstrap";
import { eventsInit, GET_ALL_EVENTS_URL, POST_NEW_EVENT_URL } from "../../serviceFiles/constants";
import Addition from "../../components/Addition";
import axios from "axios";

export default function AllEventsPage() {
let navigate = useNavigate();

const [events, setEvent] = useState(eventsInit);
function handleUserClick(event: Event) {
const [filters, setFilters] = useState({});

useEffect(() => {
axios.post(GET_ALL_EVENTS_URL, filters).then(response => { setEvent(response.data) }).catch(error => {
console.error('Ошибка при получении событий. Взяты дефолтные события', error);
setEvent(eventsInit);
});
})
function handleSendNewData(newObj: Event) {
console.log("Получен объект в AllEventssPage", newObj);
axios.post(POST_NEW_EVENT_URL, newObj).then(response => { setEvent(response.data) }).catch(error => {
console.error('Ошибка при получении событий. Взяты дефолтные события', error);
setEvent(eventsInit);
});
}

function handleEventClick(event: Event) {
navigate("/event", { state: event })
}
const listUsers = events.map((event: Event, index) =>
<tr key={event.eventId} onClick={() => handleUserClick(event)}>
<tr key={event.eventId} >
<td>
{event.eventId}
</td>
Expand All @@ -32,30 +50,32 @@ export default function AllEventsPage() {
<td>
{event.description}
</td>
<td> <Button type="button" className="btn" onClick={() => handleEventClick(event)}> Подробнее </Button></td>
</tr>
)
return (<>
<Addition handleSend={handleSendNewData} obj={eventFields}></Addition>
<Table striped bordered hover>
<thead>
<tr>
<th>
eventId
</th>
<th>
cellId
</th>
<th>
userId
</th>
<th>
action
</th>
<th>
dateAndTime
</th>
<th>
description
</th>
<th>
eventId
</th>
<th>
cellId
</th>
<th>
userId
</th>
<th>
action
</th>
<th>
dateAndTime
</th>
<th>
description
</th>
</tr>
</thead>
<tbody>
Expand Down
Loading

0 comments on commit 65741c1

Please sign in to comment.