registration

src/components/Modal/ModalRegistration/ModalRegistration.jsx

@@ -1,8 +1,10 @@
-import React from "react";
+import React, { useState } from "react";
 
 import BaseButton from "@components/Common/BaseButton/BaseButton";
 import ModalLayout from "@components/Common/ModalLayout/ModalLayout";
 
+import { apiRequest } from "@api/request";
+
 import anyMoment from "assets/icons/anyMoment.svg";
 import doc from "assets/icons/doc.svg";
 import telegramLogo from "assets/icons/tgLogo.svg";
@@ -10,6 +12,24 @@ import telegramLogo from "assets/icons/tgLogo.svg";
 import "./modalRegistration.scss";
 
 export const ModalRegistration = ({ active, setActive }) => {
+  const [inputsValue, setInputsValue] = useState({
+    userName: '',
+    email: '',
+    password: ''
+  })
+
+  const submitHandler = () => {
+    apiRequest("/register/sign-up", {
+      method: "POST",
+      data: {
+        username: inputsValue.userName,
+        email: inputsValue.email,
+        password: inputsValue.password
+      }
+    }).then((data) => {
+      console.log(data)
+    })
+  }
   return (
     <ModalLayout active={active} setActive={setActive} styles={"registration"}>
       <div className="registration-body__left">
@@ -24,28 +44,39 @@ export const ModalRegistration = ({ active, setActive }) => {
         <div className="input-body">
           <div className="input-body__box">
             <h5>Ваше имя</h5>
-            <input></input>
+            <input
+              onChange={(e) => setInputsValue((prevValue) => ({...prevValue, userName: e.target.value}))}
+              placeholder='Name'
+            />
             <h5>E-mail</h5>
-            <input></input>
+            <input
+              type='email'
+              onChange={(e) => setInputsValue((prevValue) => ({...prevValue, email: e.target.value}))}
+              placeholder='Email'
+            />
           </div>
 
           <div className="input-body__box">
-            <h5>Название компании</h5>
-            <input></input>
+            {/*<h5>Название компании</h5>*/}
+            {/*<input></input>*/}
             <h5>Пароль</h5>
-            <input></input>
+            <input
+              type='password'
+              onChange={(e) => setInputsValue((prevValue) => ({...prevValue, password: e.target.value}))}
+              placeholder='Password'
+            />
           </div>
         </div>
         <div className="button-box">
           <BaseButton
-            onClick={(e) => e.preventDefault()}
-            styles={"button-box__submit"}
+            onClick={() => submitHandler()}
+            styles={inputsValue.userName && inputsValue.email && inputsValue.password ? "button-box__submit" : "button-box__submit disable"}
           >
             Отправить
           </BaseButton>
-          <h5>
-            У вас уже есть аккаунт? <p>Войти</p>
-          </h5>
+          {/*<h5>*/}
+          {/*  У вас уже есть аккаунт? <p>Войти</p>*/}
+          {/*</h5>*/}
         </div>
       </div>
       <div className="registration-body__right">