Zakharov_Rostislav/Internet-programming_PIbd-23_ZakharovRA
1
1
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

lab4 some minor fixes

Browse Source
This commit is contained in:
Zakharov_Rostislav 2023-12-05 00:10:23 +04:00
parent 7e72b340da
commit 98fe38ecb4
8 changed files with 91 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
ReactLibrary/src/components/navigation/Navigation.jsx
View File

@ -10,7 +10,7 @@ const Navigation = ({ routes }) => {
const pages = routes.filter((route) => Object.prototype.hasOwnProperty.call(route, 'title'));
return (
<header>
<Navbar expand='md' bg='light' data-bs-theme='light' className='my-navbar'>
<Navbar expand='lg' bg='light' data-bs-theme='light' className='my-navbar'>
<Container fluid>
<Navbar.Brand as={Link} to={indexPageLink?.path ?? '/'} className='logo'>
<BookHalf className='d-inline-block align-top me-1 logoImage' />
@ -18,7 +18,7 @@ const Navigation = ({ routes }) => {
</Navbar.Brand>
<Navbar.Toggle aria-controls='main-navbar' />
<Navbar.Collapse id='main-navbar'>
<Nav className='me-auto link' activeKey={location.pathname}>
<Nav className='ms-auto link' activeKey={location.pathname}>
{
pages.map((page) =>
<Nav.Link as={Link} key={page.path} eventKey={page.path} to={page.path ?? '/'}>
@ -28,7 +28,7 @@ const Navigation = ({ routes }) => {
</Nav>
</Navbar.Collapse>
</Container>
</Navbar >
</Navbar>
</header>
);
};

11
ReactLibrary/src/main.jsx
View File

@ -18,6 +18,8 @@ import LoginPage from './pages/LoginPage.jsx';
import BookEdit from './pages/BookEdit.jsx';
import CategoryEdit from './pages/CategoryEdit.jsx';
import AuthorEdit from './pages/AuthorEdit.jsx';
import SearchForm from './pages/SearchForm.jsx';
import SearchResults from './pages/SearchResults.jsx';
const routes = [
{
@ -36,6 +38,11 @@ const routes = [
element: <UserPage/>,
title: 'Личный кабинет',
},
{
path: '/search-form',
element: <SearchForm/>,
title: 'Поиск',
},
{
path: '/admin-page',
element: <AdminPage/>,
@ -76,6 +83,10 @@ const routes = [
path: '/author-edit',
element: <AuthorEdit/>,
},
{
path: '/search-results',
element: <SearchResults/>,
},
];
const router = createBrowserRouter([

2
ReactLibrary/src/pages/AuthorEdit.jsx
View File

@ -49,7 +49,7 @@ const AuthorEdit = () => {
</Form.Group>
<div className="d-grid gap-2 mt-4 d-md-flex justify-content-md-center">
<Button className="lib-btn" onClick={() => navigate(-1)}>Назад</Button>
<Button className="lib-btn" type="submit" variant="primary">Сохранить</Button>
<Button className="lib-btn" type="submit">Сохранить</Button>
</div>
</Form>
</>

2
ReactLibrary/src/pages/BookEdit.jsx
View File

@ -46,7 +46,7 @@ const BookEdit = () => {
</Form.Group>
<div className="d-grid gap-2 mt-4 d-md-flex justify-content-md-center">
<Button className="lib-btn" onClick={() => navigate(-1)}>Назад</Button>
<Button className="lib-btn" type="submit" variant="primary">Сохранить</Button>
<Button className="lib-btn" type="submit">Сохранить</Button>
</div>
</Form>
</>

2
ReactLibrary/src/pages/CategoryEdit.jsx
View File

@ -29,7 +29,7 @@ const CategoryEdit = () => {
</Form.Group>
<div className="d-grid gap-2 mt-4 d-md-flex justify-content-md-center">
<Button className="lib-btn" onClick={() => navigate(-1)}>Назад</Button>
<Button className="lib-btn" type="submit" variant="primary">Сохранить</Button>
<Button className="lib-btn" type="submit">Сохранить</Button>
</div>
</Form>
</>

2
ReactLibrary/src/pages/MainPage.jsx
View File

@ -16,7 +16,7 @@ const MainPage = () => {
</p>
<div className="d-grid gap-2 mt-2 d-md-flex justify-content-md-start">
<Button as={Link} to="/user-page" className='lib-btn'>Личный кабинет</Button>
<Button as={Link} to="/search" className='lib-btn'>Поиск</Button>
<Button as={Link} to="/search-form" className='lib-btn'>Поиск</Button>
</div>
</>
);

45
ReactLibrary/src/pages/SearchForm.jsx Normal file
View File

@ -0,0 +1,45 @@
import { useState } from 'react';
import { Button, Form } from 'react-bootstrap';
import { useNavigate } from 'react-router-dom';
const SearchForm = () => {
const [validated, setValidated] = useState(false);
const navigate = useNavigate();
const handleSubmit = (event) => {
const form = event.currentTarget;
if (form.checkValidity() === false) {
event.preventDefault();
event.stopPropagation();
}
setValidated(true);
};
return (
<>
<h1 className='mt-2 text-center'>
Параметры поиска.
</h1>
<Form id="books-form" noValidate validated={validated} onSubmit={handleSubmit}>
<Form.Group className="mb-2" controlId="author">
<Form.Label htmlFor="author" className="form-label">Автор</Form.Label>
<Form.Select name='selected' required>
</Form.Select>
</Form.Group>
<Form.Group className="mb-2" controlId="name">
<Form.Label>Название</Form.Label>
<Form.Control type="text" name="name" required/>
</Form.Group>
<Form.Group className="mb-2" controlId="category">
<Form.Label htmlFor="category" className="form-label">Категория</Form.Label>
<Form.Select name='selected' required>
</Form.Select>
</Form.Group>
<div className="d-grid gap-2 mt-4 d-md-flex justify-content-md-center">
<Button className="lib-btn" onClick={() => navigate(-1)}>Назад</Button>
<Button className="lib-btn" type="submit">Поиск</Button>
</div>
</Form>
</>
);
};
export default SearchForm;

28
ReactLibrary/src/pages/SearchResults.jsx Normal file
View File

@ -0,0 +1,28 @@
import { Button, Table } from 'react-bootstrap';
import { useNavigate } from 'react-router-dom';
const SearchResults = () => {
const navigate = useNavigate();
return (
<>
<h1 className='mt-2 text-md-start text-center'>
Результаты поиска.
</h1>
<Button className="lib-btn" onClick={() => navigate(-1)}>Назад</Button>
<Table className="mt-2 lib-table" striped>
<thead>
<th scope="col">№</th>
<th scope="col" className="w-25">Автор</th>
<th scope="col" className="w-25">Название</th>
<th scope="col" className="w-25">Категория</th>
<th scope="col" className="w-25">Год издания</th>
<th scope="col"></th>
<th scope="col"></th>
</thead>
<tbody></tbody>
</Table>
</>
);
};
export default SearchResults;