registration

This commit is contained in:
Mikola 2023-11-03 16:23:49 +03:00
parent 7304b01a5d
commit baf353d7cd
5 changed files with 66 additions and 46 deletions

View File

@ -4,18 +4,19 @@ import close from "assets/icons/closeProjectPersons.svg";
import "./acceptModal.scss"; import "./acceptModal.scss";
export const AcceptModal = ({title, closeModal, agreeHandler }) => { export const AcceptModal = ({ title, closeModal, agreeHandler }) => {
return ( return (
<div className="backDrop"> <div className="backDrop">
<div className="acceptModal"> <div className="acceptModal">
<h3 className="acceptModal__title"> <h3 className="acceptModal__title">{title}</h3>
{title}
</h3>
<div className="acceptModal__buttons"> <div className="acceptModal__buttons">
<button className="agree" onClick={() => { <button
agreeHandler() className="agree"
closeModal() onClick={() => {
}}> agreeHandler();
closeModal();
}}
>
Да Да
</button> </button>
<button className="cancel" onClick={closeModal}> <button className="cancel" onClick={closeModal}>

View File

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

View File

@ -1011,7 +1011,7 @@ export const ModalTiсket = ({
</div> </div>
{acceptModalOpen && ( {acceptModalOpen && (
<AcceptModal <AcceptModal
title={'Вы точно хотите переместить задачу в архив?'} title={"Вы точно хотите переместить задачу в архив?"}
closeModal={closeAcceptModal} closeModal={closeAcceptModal}
agreeHandler={deleteTask} agreeHandler={deleteTask}
/> />

View File

@ -1208,9 +1208,10 @@ export const TicketFullScreen = () => {
</div> </div>
{acceptModalOpen && ( {acceptModalOpen && (
<AcceptModal <AcceptModal
title={'Вы точно хотите переместить задачу в архив?'} title={"Вы точно хотите переместить задачу в архив?"}
closeModal={closeAcceptModal} closeModal={closeAcceptModal}
agreeHandler={deleteTask} /> agreeHandler={deleteTask}
/>
)} )}
<Footer /> <Footer />
</section> </section>

View File

@ -33,13 +33,13 @@ import { useNotification } from "@hooks/useNotification";
import BaseButton from "@components/Common/BaseButton/BaseButton"; import BaseButton from "@components/Common/BaseButton/BaseButton";
import { Footer } from "@components/Common/Footer/Footer"; import { Footer } from "@components/Common/Footer/Footer";
import { Loader } from "@components/Common/Loader/Loader"; import { Loader } from "@components/Common/Loader/Loader";
import AcceptModal from "@components/Modal/AcceptModal/AcceptModal";
import ModalTicket from "@components/Modal/Tracker/ModalTicket/ModalTicket"; import ModalTicket from "@components/Modal/Tracker/ModalTicket/ModalTicket";
import TrackerModal from "@components/Modal/Tracker/TrackerModal/TrackerModal"; import TrackerModal from "@components/Modal/Tracker/TrackerModal/TrackerModal";
import { Navigation } from "@components/Navigation/Navigation"; import { Navigation } from "@components/Navigation/Navigation";
import { ProfileBreadcrumbs } from "@components/ProfileBreadcrumbs/ProfileBreadcrumbs"; import { ProfileBreadcrumbs } from "@components/ProfileBreadcrumbs/ProfileBreadcrumbs";
import { ProfileHeader } from "@components/ProfileHeader/ProfileHeader"; import { ProfileHeader } from "@components/ProfileHeader/ProfileHeader";
import TrackerSelectColumn from "@components/TrackerSelectColumn/TrackerSelectColumn"; import TrackerSelectColumn from "@components/TrackerSelectColumn/TrackerSelectColumn";
import AcceptModal from "@components/Modal/AcceptModal/AcceptModal";
import arrow from "assets/icons/arrows/arrowCalendar.png"; import arrow from "assets/icons/arrows/arrowCalendar.png";
import arrowDown from "assets/icons/arrows/selectArrow.png"; import arrowDown from "assets/icons/arrows/selectArrow.png";
@ -76,7 +76,7 @@ export const ProjectTracker = () => {
edit: false, edit: false,
}); });
const [acceptModalOpen, setAcceptModalOpen] = useState(false); const [acceptModalOpen, setAcceptModalOpen] = useState(false);
const [currentColumnDelete, setCurrentColumnDelete] = useState(null) const [currentColumnDelete, setCurrentColumnDelete] = useState(null);
const [color, setColor] = useState("#aabbcc"); const [color, setColor] = useState("#aabbcc");
const [tagInfo, setTagInfo] = useState({ description: "", name: "" }); const [tagInfo, setTagInfo] = useState({ description: "", name: "" });
const [checkBoxParticipateTasks, setCheckBoxParticipateTasks] = const [checkBoxParticipateTasks, setCheckBoxParticipateTasks] =
@ -913,14 +913,13 @@ export const ProjectTracker = () => {
<div <div
className="column__select__item" className="column__select__item"
onClick={() => { onClick={() => {
if (column.tasks.length) { if (column.tasks.length) {
setAcceptModalOpen(true) setAcceptModalOpen(true);
setCurrentColumnDelete(column) setCurrentColumnDelete(column);
} else { } else {
deleteColumn(column) deleteColumn(column);
}
} }
} }}
> >
<img src={del} alt="delete" /> <img src={del} alt="delete" />
<span>Удалить</span> <span>Удалить</span>
@ -1067,11 +1066,11 @@ export const ProjectTracker = () => {
</div> </div>
</div> </div>
{acceptModalOpen && ( {acceptModalOpen && (
<AcceptModal <AcceptModal
title={'В колонке еще есть задачи, Вы точно хотите удалить её ?'} title={"В колонке еще есть задачи, Вы точно хотите удалить её ?"}
closeModal={closeAcceptModal} closeModal={closeAcceptModal}
agreeHandler={() => deleteColumn(currentColumnDelete)} agreeHandler={() => deleteColumn(currentColumnDelete)}
/> />
)} )}
<Footer /> <Footer />
</div> </div>