diff --git a/frontend/src/components/authentication/Authentication.tsx b/frontend/src/components/authentication/Authentication.tsx index 06859e4..2ccf92c 100644 --- a/frontend/src/components/authentication/Authentication.tsx +++ b/frontend/src/components/authentication/Authentication.tsx @@ -1,11 +1,10 @@ import React, {useState} from 'react'; -import {useNavigate} from "react-router-dom"; import './../../styles/authentication.scss' import CustomButton from "../../UIComponents/customButton/CustomButton.tsx"; import CustomCheckbox from "../../UIComponents/customCheckbox/CustomCheckbox.tsx"; import authStore from "../../store/authStore.ts"; import {observer} from "mobx-react-lite"; -import axios from "axios"; +import {useNavigate} from "react-router-dom"; const Authentication: React.FC = observer(() => { const navigateTo = useNavigate() @@ -15,22 +14,6 @@ const Authentication: React.FC = observer(() => { setIsPasswordShow(!isPasswordShows) } - - const signIn = () => { - axios.post("http://localhost:8000/auth/login", { - username: "user@example.com", - password: "ashdjashdjsahjdhsadsa", - }) - .then(() => authStore.signInUser()) - .catch((reason) => alert(reason)) - - navigateTo('/map') - } - - const onHandleChangePassword = (target: string) => { - authStore.changeUserPassword(target) - } - return (
@@ -47,10 +30,10 @@ const Authentication: React.FC = observer(() => {
{isPasswordShows ? onHandleChangePassword(e.target.value)} + onChange={(e) => authStore.changeUserPassword(e.target.value)} placeholder="Пароль"/> : onHandleChangePassword(e.target.value)} + onChange={(e) => authStore.changeUserPassword(e.target.value)} placeholder="Пароль"/>}
@@ -58,7 +41,11 @@ const Authentication: React.FC = observer(() => { - + { + authStore.signIn().then(() => navigateTo('/map')) + }}/> + navigateTo('/')}>
diff --git a/frontend/src/routes/AppRouter.tsx b/frontend/src/routes/AppRouter.tsx index 9f6e4f0..5843c86 100644 --- a/frontend/src/routes/AppRouter.tsx +++ b/frontend/src/routes/AppRouter.tsx @@ -22,6 +22,11 @@ const AppRouter: React.FC = observer(() => { ] const privateRoutes: RouteType[] = [ + { + id: 2, + element: , + path: "/login", + }, { id: 3, element: , diff --git a/frontend/src/store/authStore.ts b/frontend/src/store/authStore.ts index e98388f..53ff120 100644 --- a/frontend/src/store/authStore.ts +++ b/frontend/src/store/authStore.ts @@ -1,4 +1,6 @@ import {makeAutoObservable} from "mobx"; +import axios from "axios"; + class AuthStore { isUserAuthorized: boolean = false @@ -24,6 +26,32 @@ class AuthStore { changeUserPassword(newPassword: string) { this.userPassword = newPassword } + + async signIn() { + this.signInUser() + axios.post("http://localhost:8000/auth/login", { + username: this.userLogin, + password: this.userPassword, + }) + .then((resp) => { + console.log(resp.data) + this.signInUser() + }) + .catch((reason) => { + alert(reason) + this.signOutUser() + }) + } + + signUp() { + axios.post("http://localhost:8000/auth/register", { + username: this.userLogin, + email: this.userLogin + "@example.com", + password: this.userPassword + }) + .then(r => console.log(r.data)) + .catch(reason => console.log(reason)) + } } export default new AuthStore()