ЛогинПароли. Продолжение

Lab5/data.json

@@ -1,4 +1,11 @@
 {
+  "entrysData": [
+    {
+      "id": 0,
+      "login": "dyctator",
+      "password": "12345"
+    }
+  ],
   "directions": [
     {
       "id": 0,

Lab5/src/components/Directions/direct/Directions.jsx

@@ -24,10 +24,10 @@ const Directions = () => {
                             || item.things.toLowerCase().includes(searchValue.toLowerCase())
                             || item.code.toLowerCase().includes(searchValue.toLowerCase())) {
                             return <Direction key={item.id} item={item} />;
-            }
+                            }
-            return null;
+                        return null;
-        })
+                    })
-    }
+                }
                 </TableDirect>
             </div>
         </>

Lab5/src/components/logins/hooks/EntrysDataHook.js

@@ -1,34 +1,22 @@
 import { useEffect, useState } from 'react';
 import EntrysDataApiService from '../service/EntrysDataApiService';
 
-const useEntysDataItem = (id) => {
+const useEntrysData = () => {
-    const emptyItem = {
+    const [entrys, setEntrys] = useState([]);
-        id: '',
-        date: '',
-        name: '',
-        description: '',
-        image: '',
-    };
-    const [item, setItem] = useState({ ...emptyItem });
 
-    const getItem = async (itemId = undefined) => {
+    const getEntrysData = async () => {
-        if (itemId && itemId > 0) {
+        const data = await EntrysDataApiService.getAll();
-            const data = await EntrysDataApiService.get(itemId);
+        setEntrys(data ?? []);
-            setItem(data);
-        } else {
-            setItem({ ...emptyItem });
-        }
     };
 
     useEffect(() => {
-        getItem(id);
+        getEntrysData();
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [id]);
+    }, []);
 
     return {
-        item,
+        entrys,
-        setItem,
     };
 };
 
-export default useEntysDataItem;
+export default useEntrysData;

Lab5/src/components/logins/login/Entry.jsx

@@ -1,36 +1,59 @@
 import { useState } from 'react';
+import { Link } from 'react-router-dom';
 import toast from 'react-hot-toast';
-import { Button, Form, Label } from 'react-bootstrap';
+import { Button, Form } from 'react-bootstrap';
 import Input from '../../input/Input.jsx';
+import useEntrysData from '../hooks/EntrysDataHook';
 
 const Entry = () => {
+    const { entrys } = useEntrysData();
     const [validated, setValidated] = useState(false);
     const [login, setLogin] = useState('');
     const [password, setPassword] = useState('');
+    const isLoginValid = (value) => /^[a-zA-Z]+$/.test(value);
 
     const handleSubmit = (event) => {
         const form = event.currentTarget;
         event.preventDefault();
         event.stopPropagation();
         if (form.checkValidity() !== false) {
-            toast.success('Валидация прошла успешно');
+            if (isLoginValid(login)) {
+                entrys.map((item) => {
+                    if (login === item.login) {
+                        if (password === item.password) {
+                            toast.success('Вы вошли в аккаунт');
+                            return [];
+                        }
+                    }
+                    toast.error('Данный пользователь не найден, либо был введён неверный пароль');
+                    return [];
+                });
+            } else {
+                toast.error('Логин должен быть введён латинскими символами');
+                return;
+            }
         }
         setValidated(true);
     };
+
     return (
         <main className="container-fluid text-center">
             <span className="mainSt">
                 <b>Личный кабинет</b>
             </span>
             <div className="rectpage4 d-flex row justify-content-center">
+            <span className="EntrysSt">
+                <b></b>
+            </span>
                 <Form className="col-md-4 m-0 w-auto" onSubmit={ handleSubmit } noValidate validated={validated}>
-                    <Label className="form-label"><b>Логин</b></Label>
+                    <label className="form-label"><b>Логин</b></label>
                     <Input name="login" value = { login } onChange={(e) => setLogin(e.target.value)}
                         placeholder="dyctator" type="text" required />
-                    <Label className="form-label"><b>Пароль</b></Label>
+                    <label className="form-label"><b>Пароль</b></label>
                     <Input name="password" value = { password } onChange={(e) => setPassword(e.target.value)}
                         type="password" required />
                     <Button className="btn btn-primary w-auto" type="submit" >Войти</Button>
+                    <Button as={Link} to='/registrPage' variant = "danger" className="btn btn-primary w-auto" >Регистрация</Button>
                 </Form>
             </div>
         </main>

Lab5/src/index.css

@@ -37,6 +37,11 @@ h3 {
     color: #060647;
     font-size: 50px;
 }
+.EntrysSt{
+    font-weight: bold;
+    color: #060647;
+    font-size: 30px;
+}
 
 .rectPage2{
     color: #FFFFFF;

Lab5/src/main.jsx

@@ -10,6 +10,7 @@ import Page2 from './pages/Page2.jsx';
 import Page3 from './pages/Page3.jsx';
 import Page4 from './pages/Page4.jsx';
 import Page5 from './pages/Page5.jsx';
+import RegistrPage from './pages/RegistrPage.jsx';
 
 const routes = [
   {
@@ -38,6 +39,10 @@ const routes = [
     element: <Page5 />,
     title: 'Контакты',
   },
+  {
+    path: '/registrPage',
+    element: <RegistrPage />,
+  },
 ];
 
 const router = createBrowserRouter([

Lab5/src/pages/RegistrPage.jsx

@@ -0,0 +1,9 @@
+const RegistrPage = () => {
+    return (
+        <div>
+
+        </div>
+    );
+};
+
+export default RegistrPage;