KRBL/MinervaFrontend
9
0
Fork 0
Code Issues 7 Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: KRBL:695cc690d98e32092db532c38a818065c6212f1e
Branches Tags
KRBL:main
...
compare: KRBL:209c2e0a701637d62be02cfb19b91f0973e61b3c
Branches Tags
KRBL:main

3 Commits
695cc690d9 ... 209c2e0a70

Author SHA1 Message Date
kuwsh1n
209c2e0a70 pull krbl
All checks were successful
publish-main / release-image (push) Successful in 3m30s
Details
2024-04-15 00:38:11 +03:00
kuwsh1n
9a7d71e8fb fix one 2024-04-15 00:15:26 +03:00
kuwsh1n
0b48eb739e reg modify 2024-04-14 14:17:15 +03:00
16 changed files with 287 additions and 282 deletions
Show Stats Expand all files Collapse all files

42
src/App.jsx
View File

@ -17,20 +17,20 @@ import DropDownList from "./components/typeAnswer/DropDownList.jsx";
import InputFile from "./components/typeAnswer/InputFile.jsx"; import InputFile from "./components/typeAnswer/InputFile.jsx";
const App = () => { const App = () => {
const navigate = useNavigate(); const navigate = useNavigate();
const [forms, setForms] = useState([]); const [forms, setForms] = useState([]);
const [user, setUser] = useState(false); const [user, setUser] = useState(false);
const [answersList, setAnswersList] = useState([]); const [answersList, setAnswersList] = useState([]);
const [listTypeAnswer, setListTypeAnswer] = useState([ const [listTypeAnswer, setListTypeAnswer] = useState([
{ id: 1, text: "Краткий ответ", typeTag: InputText }, {id: 1, text: 'Краткий ответ', typeTag: InputText},
{ id: 2, text: "Расширенный ответ", typeTag: TextArea }, {id: 2, text: 'Расширенный ответ', typeTag: TextArea},
{ id: 3, text: "Выбор из вариантов", typeTag: InputRadio }, {id: 3, text: 'Выбор из вариантов', typeTag: InputRadio},
{ id: 4, text: "Множественный выбор", typeTag: InputMultipleRadio }, {id: 4, text: 'Множественный выбор', typeTag: InputMultipleRadio},
{ id: 5, text: "Выпадающий список", typeTag: DropDownList }, {id: 5, text: 'Выпадающий список', typeTag: DropDownList},
{ id: 6, text: "Да/Нет", typeTag: YesNo }, {id: 6, text: 'Да/Нет', typeTag: YesNo},
{ id: 7, text: "Файл", typeTag: InputFile }, // {id: 7, text: 'Файл', typeTag: InputFile},
{ id: 8, text: "Дата", typeTag: InputDate }, {id: 8, text: 'Дата', typeTag: InputDate}
]); ]);
// useEffect(() => globalRender(window.location.pathname, user, navigate)); // useEffect(() => globalRender(window.location.pathname, user, navigate));
const [cookies, _, __] = useCookies(["user"]); const [cookies, _, __] = useCookies(["user"]);
@ -40,14 +40,14 @@ const App = () => {
const response = await verifyUserApi(cookies.token); const response = await verifyUserApi(cookies.token);
console.log("app", user); console.log("app", user);
if (response) { if (response.status === 200) {
if (response.status === 200) { setUser(response.data);
setUser(response.data); globalRender(window.location.pathname, response.data, navigate);
} else { }
console.log(response); else {
globalRender(window.location.pathname, false, navigate);
}
} }
}
}
verifyUser(); verifyUser();
}, []); }, []);

78
src/assets/styles/answersForm.module.scss
View File

@ -11,12 +11,26 @@
align-items: center; align-items: center;
} }
.loading__wrapper {
width: 100%;
height: 80%;
display: flex;
justify-content: center;
align-items: center;
&__body {
// margin-top: 100px;
span {
}
}
}
.answers { .answers {
width: 70%; width: 70%;
height: 70%; height: 70%;
box-shadow: 0 0 5px 1px rgb(200, 200, 200); box-shadow: 0 0 5px 1px rgb(200, 200, 200);
padding: 1.5%; padding: 1.5%;
position: relative;
&__linkAdmin { &__linkAdmin {
position: absolute; position: absolute;
bottom: 103%; bottom: 103%;
@ -33,6 +47,8 @@
} }
} }
&__wrapper { &__wrapper {
width: 100%;
height: 100%;
&__header { &__header {
width: 100%; width: 100%;
height: 15%; height: 15%;
@ -40,6 +56,7 @@
justify-content: start; justify-content: start;
align-items: center; align-items: center;
margin-bottom: 10px; margin-bottom: 10px;
// border-bottom: 1px solid rgb(200, 200, 200);
h3 { h3 {
font-size: 25px; font-size: 25px;
font-family: "Montserrat", sans-serif; font-family: "Montserrat", sans-serif;
@ -49,30 +66,45 @@
&__body { &__body {
width: 100%; width: 100%;
height: 85%; height: 85%;
&__item { overflow-y: auto;
padding: 5px; border-bottom: 1px solid rgb(200, 200, 200);
border-bottom: 1px solid rgb(200, 200, 200); &::-webkit-scrollbar {
width: 7px;
}
&::-webkit-scrollbar-thumb {
background-color: rgb(200, 200, 200);
}
&__column {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 15px; font-size: 15px;
font-family: "Montserrat", sans-serif; font-family: "Montserrat", sans-serif;
cursor: pointer; padding: 5px;
// &__question { border-bottom: 1px solid rgb(200, 200, 200);
// &__text { }
// font-size: 15px; &__item {
// font-family: "Montserrat", sans-serif; padding: 0 5px;
// } // border-bottom: 1px solid rgb(200, 200, 200);
// &__comment { font-size: 15px;
// font-size: 11px; font-family: "Montserrat", sans-serif;
// font-family: "Montserrat", sans-serif; display: flex;
// font-style: italic; justify-content: space-between;
// color: rgb(200, 200, 200); align-items: center;
// } height: 20%;
// } width: 100%;
// &__answer { &:hover {
// &__text { background-color: rgba(230, 230, 230, 0.6);
// font-size: 15px; }
// font-family: "Montserrat", sans-serif; &__user {
// } cursor: pointer;
// } &:hover {
text-decoration: underline;
}
}
&__date {
}
} }
} }
} }

20
src/assets/styles/enterAccount.module.scss
View File

@ -28,7 +28,6 @@
.content { .content {
width: 100%; width: 100%;
height: 100%; height: 100%;
// box-shadow: 0 3px 5px 1px rgb(200, 200, 200);
border: 1px solid rgb(220, 220, 220); border: 1px solid rgb(220, 220, 220);
border-top: none; border-top: none;
&__wrapper { &__wrapper {
@ -58,6 +57,15 @@
display: flex; display: flex;
justify-content: space-around; justify-content: space-around;
flex-direction: column; flex-direction: column;
position: relative;
&__error {
position: absolute;
font-size: 13px;
font-family: "Montserrat", sans-serif;
top: 0;
left: 10px;
color: rgb(224, 75, 75);
}
} }
&__footer { &__footer {
width: 100%; width: 100%;
@ -87,7 +95,15 @@
justify-content: space-around; justify-content: space-around;
flex-direction: column; flex-direction: column;
padding-bottom: 5px; padding-bottom: 5px;
position: relative;
&__error {
position: absolute;
font-size: 13px;
font-family: "Montserrat", sans-serif;
top: 0;
left: 10px;
color: rgb(224, 75, 75);
}
&__fio { &__fio {
height: 15%; height: 15%;
display: flex; display: flex;

60
src/components/NavBar.jsx
View File

@ -3,46 +3,30 @@ import { useCookies } from "react-cookie";
import classes from "../assets/styles/components/navbar.module.scss"; import classes from "../assets/styles/components/navbar.module.scss";
import { verifyUserApi } from "../hooks/api/enterAccountApi"; import { verifyUserApi } from "../hooks/api/enterAccountApi";
const NavBar = ({ navigate, auth, setAuth }) => { const NavBar = ({navigate, auth, setAuth}) => {
useEffect(() => { return (
console.log("nav", auth); <div className={classes.main}>
}); <div className={classes.wrapper}>
<div className={classes.menu}>
return ( <div className={classes.menu__authorized}>
<div className={classes.main}> <span onClick={() => navigate("/")}>Главная</span>
<div className={classes.wrapper}> {auth ?
<div className={classes.menu}> auth.is_admin ? <span onClick={() => navigate("/forms")}>Мои формы</span> : <span></span> :
<div className={classes.menu__authorized}> <span></span>}
<span onClick={() => navigate("/")}>Главная</span> </div>
{auth ? ( </div>
auth.is_admin ? ( <div className={classes.profile}>
<span onClick={() => navigate("/forms")}>Мои формы</span> {auth ?
) : ( <div className={classes.profile__authorized}>
<span></span> <span onClick={() => navigate("/profile")}>Профиль ({auth.login})</span>
) </div> :
) : ( <div className={classes.profile__nonAuthorized}>
<span></span> <span onClick={() => navigate("/enter")}>Вход <i class="fa-solid fa-arrow-right-to-bracket"></i></span>
)} </div>}
</div> </div>
</div>
<div className={classes.profile}>
{auth ? (
<div className={classes.profile__authorized}>
<span onClick={() => navigate("/profile")}>
Профиль ({auth.login})
</span>
</div> </div>
) : (
<div className={classes.profile__nonAuthorized}>
<span onClick={() => navigate("/enter")}>
Вход <i class="fa-solid fa-arrow-right-to-bracket"></i>
</span>
</div>
)}
</div> </div>
</div> );
</div>
);
}; };
export default NavBar; export default NavBar;

6
src/components/typeAnswer/DropDownList.jsx
View File

@ -7,11 +7,11 @@ const DropDownList = ({postfix, optionAnswer, answers, updateAnswersForm}) => {
<div className={classes.main}> <div className={classes.main}>
<select <select
value={answers ? answers[postfix].answer : ""} value={answers ? answers[postfix].answer : ""}
onChange={updateAnswersForm ? (e) => updateAnswersForm(Number(e.target.value), postfix) : () => {}} onChange={updateAnswersForm ? (e) => updateAnswersForm(e.target.value, postfix) : () => {}}
> >
<option selected disabled></option>
{optionAnswer.map((item, i) => {optionAnswer.map((item, i) =>
// <option value={item.id ? item.id : item[0].Value} key={i}>{item.text ? item.text : item[1].Value}</option> <option value={item.text} key={i}>{item.text}</option>
<option value={item.id} key={i}>{item.text}</option>
)} )}
</select> </select>
</div> </div>

18
src/components/typeAnswer/InputMultipleRadio.jsx
View File

@ -2,20 +2,20 @@ import React from "react";
import classes from "../../assets/styles/components/typeAnswer/inputMultiple.module.scss" import classes from "../../assets/styles/components/typeAnswer/inputMultiple.module.scss"
const InputMultipleRadio = ({postfix, optionAnswer, answers, updateAnswersForm}) => { const InputMultipleRadio = ({postfix, optionAnswer, answers, updateAnswersForm}) => {
function checkRadio(i) { function checkRadio(value) {
if (answers[postfix].answer) { if (answers[postfix].answer) {
return answers[postfix].answer.some(item => item === Number(i)) return answers[postfix].answer.some(item => item === value)
} }
return false return false
} }
function updateStateCheckbox(i) { function updateStateCheckbox(value) {
if (updateAnswersForm) { if (updateAnswersForm) {
if (answers[postfix].answer.some((item) => item === Number(i))) { if (answers[postfix].answer.some((item) => item === value)) {
answers[postfix].answer.splice(answers[postfix].answer.indexOf(i), 1) answers[postfix].answer.splice(answers[postfix].answer.indexOf(value), 1)
} }
else { else {
answers[postfix].answer.push(i) answers[postfix].answer.push(value)
} }
updateAnswersForm(answers[postfix].answer, postfix) updateAnswersForm(answers[postfix].answer, postfix)
} }
@ -30,9 +30,9 @@ const InputMultipleRadio = ({postfix, optionAnswer, answers, updateAnswersForm})
type="checkbox" type="checkbox"
name={`inputMultiple_${postfix}`} name={`inputMultiple_${postfix}`}
id={`inputMultiple_${postfix}`} id={`inputMultiple_${postfix}`}
value={i} value={item.text}
checked={answers ? checkRadio(i) : false} checked={answers ? checkRadio(item.text) : false}
onChange={() => updateStateCheckbox(i)} onChange={() => updateStateCheckbox(item.text)}
/> />
{/* <label class="form-check-label" for={`inputMultiple_${postfix}`}>{item.text ? item.text : item[1].Value}</label> */} {/* <label class="form-check-label" for={`inputMultiple_${postfix}`}>{item.text ? item.text : item[1].Value}</label> */}
<label class="form-check-label" for={`inputMultiple_${postfix}`}>{item.text}</label> <label class="form-check-label" for={`inputMultiple_${postfix}`}>{item.text}</label>

6
src/components/typeAnswer/InputRadio.jsx
View File

@ -11,9 +11,9 @@ const InputRadio = ({postfix, optionAnswer, answers, updateAnswersForm}) => {
type="radio" type="radio"
name={`inputRadio_${postfix}`} name={`inputRadio_${postfix}`}
id={`choice_${item.id}`} id={`choice_${item.id}`}
value={i} value={item.text}
checked={answers ? answers[postfix].answer === i : false} checked={answers ? answers[postfix].answer === item.text : false}
onChange={updateAnswersForm ? (e) => updateAnswersForm(Number(e.target.value), postfix) : () => {}} onChange={updateAnswersForm ? (e) => updateAnswersForm(item.text, postfix) : () => {}}
/> />
{/* <label class="form-check-label" for={`inputRadio_${postfix}`}>{item.text ? item.text : item[1].Value}</label> */} {/* <label class="form-check-label" for={`inputRadio_${postfix}`}>{item.text ? item.text : item[1].Value}</label> */}
<label class="form-check-label" for={`inputRadio_${postfix}`}>{item.text}</label> <label class="form-check-label" for={`inputRadio_${postfix}`}>{item.text}</label>

8
src/components/typeAnswer/YesNo.jsx
View File

@ -11,8 +11,8 @@ const YesNo = ({postfix, optionAnswer, answers, updateAnswersForm}) => {
name={`YesOrNo_${postfix}`} name={`YesOrNo_${postfix}`}
id="choiceYes" id="choiceYes"
value="1" value="1"
checked={answers ? answers[postfix].answer === "1" : false} checked={answers ? answers[postfix].answer === "Да" : false}
onChange={updateAnswersForm ? () => updateAnswersForm("1", postfix) : () => {}} onChange={updateAnswersForm ? () => updateAnswersForm("Да", postfix) : () => {}}
/> />
<label class="form-check-label" for="choiceYes">Да</label> <label class="form-check-label" for="choiceYes">Да</label>
</div> </div>
@ -23,8 +23,8 @@ const YesNo = ({postfix, optionAnswer, answers, updateAnswersForm}) => {
name={`YesOrNo_${postfix}`} name={`YesOrNo_${postfix}`}
id="choiceNo" id="choiceNo"
value="2" value="2"
checked={answers ? answers[postfix].answer === "2" : false} checked={answers ? answers[postfix].answer === "Нет" : false}
onChange={updateAnswersForm ? () => updateAnswersForm("2", postfix) : () => {}} onChange={updateAnswersForm ? () => updateAnswersForm("Нет", postfix) : () => {}}
/> />
<label class="form-check-label" for="choiceNo">Нет</label> <label class="form-check-label" for="choiceNo">Нет</label>
</div> </div>

2
src/hooks/api/enterAccountApi.js
View File

@ -23,7 +23,7 @@ async function completeRegistration(data) {
return response return response
} }
catch (e) { catch (e) {
return e return "Ошибка. Проверте корректность введенных данных."
} }
} }
return validate.message return validate.message

20
src/hooks/sundry/parseListBlock.js
View File

@ -31,4 +31,22 @@ function responseDataToListBlock(data) {
return result.sort((itemOne, itemTwo) => itemOne.order - itemTwo.order) return result.sort((itemOne, itemTwo) => itemOne.order - itemTwo.order)
}; };
export { responseDataToListBlock } function dateTimeParse(date) {
let newDate = "";
for (let symbol of date) {
if (symbol === "T") {
newDate += " ";
}
else if (symbol === ".") {
break;
}
else {
newDate += symbol;
}
}
return newDate
}
export { responseDataToListBlock, dateTimeParse }

21
src/hooks/validation/enterAccountValidate.js
View File

@ -15,17 +15,16 @@ const constructorAnswerValidate = (
}; };
const totalRegisterValidate = (data) => { const totalRegisterValidate = (data) => {
const listValidation = [ const listValidation = [
constructorAnswerValidate(data.login.length, "Обязательное поле."), constructorAnswerValidate(data.login.length, "Введите логин."),
// constructorAnswerValidate(data.surname.length, "Обязательное поле."), constructorAnswerValidate(data.password.length, "Введите пароль."),
// constructorAnswerValidate(data.email.length, "Обязательное поле."), constructorAnswerValidate(data.repiedPassword.length, "Введите повторно пароль."),
// constructorAnswerValidate(data.phone.length, "Обязательное поле."), // constructorAnswerValidate(data.surname.length, "Обязательное поле."),
constructorAnswerValidate( // constructorAnswerValidate(data.email.length, "Обязательное поле."),
data.password === data.repiedPassword, // constructorAnswerValidate(data.phone.length, "Обязательное поле."),
"Введенные пароли не совпадают." constructorAnswerValidate(data.password === data.repiedPassword, "Введенные пароли не совпадают."),
), // constructorAnswerValidate(data.password >= 8, "Пароль должен иметь более 8 символов.")
// constructorAnswerValidate(data.password >= 8, "Пароль должен иметь более 8 символов.") ]
];
for (let value of listValidation) { for (let value of listValidation) {
if (!value.status) { if (!value.status) {

42
src/pages/AnswersForm.jsx
View File

@ -3,7 +3,7 @@ import { useCookies } from "react-cookie";
import { useNavigate, useParams } from 'react-router-dom'; import { useNavigate, useParams } from 'react-router-dom';
import { answersData } from "../context"; import { answersData } from "../context";
import classes from "../assets/styles/answersForm.module.scss"; import classes from "../assets/styles/answersForm.module.scss";
import { responseDataToListBlock } from "../hooks/sundry/parseListBlock"; import { responseDataToListBlock, dateTimeParse } from "../hooks/sundry/parseListBlock";
import { listFormBlockApi, getAnswersApi } from "../hooks/api/formApi"; import { listFormBlockApi, getAnswersApi } from "../hooks/api/formApi";
import { listUsersApi } from "../hooks/api/adminApi"; import { listUsersApi } from "../hooks/api/adminApi";
@ -29,6 +29,7 @@ const AnswersForm = () => {
for (let item of responseAnswers.data) { for (let item of responseAnswers.data) {
const blocks = { const blocks = {
user: listUsers.data.find(user => user.id === item.user_id).login, user: listUsers.data.find(user => user.id === item.user_id).login,
date: dateTimeParse(item.date),
block: [] block: []
} }
@ -67,12 +68,20 @@ const AnswersForm = () => {
<h3>Ответы</h3> <h3>Ответы</h3>
</div> </div>
<div className={classes.answers__wrapper__body}> <div className={classes.answers__wrapper__body}>
<div className={classes.answers__wrapper__body__column}>
<div>Логин</div>
<div>Дата</div>
</div>
{data ? {data ?
data.map((item, i) => data.map((item, i) =>
<div className={classes.answers__wrapper__body__item} key={i}> <div className={classes.answers__wrapper__body__item} key={i}>
<div className={classes.answers__wrapper__body__item__user} data-bs-toggle={"modal"} data-bs-target={`#answersModal${i}`}> <div className={classes.answers__wrapper__body__item__user} data-bs-toggle={"modal"} data-bs-target={`#answersModal${i}`}>
{item.user} {item.user}
</div> </div>
<div className={classes.answers__wrapper__body__item__date}>
{item.date}
</div>
<div class="modal fade myModal" className={classes.myModal} id={`answersModal${i}`} tabIndex="-1" aria-labelledby="exampleModalLabel" data-bs-backdrop="static" aria-hidden="true"> <div class="modal fade myModal" className={classes.myModal} id={`answersModal${i}`} tabIndex="-1" aria-labelledby="exampleModalLabel" data-bs-backdrop="static" aria-hidden="true">
<div class="modal-dialog myModal__dialog" className={classes.myModal__dialog}> <div class="modal-dialog myModal__dialog" className={classes.myModal__dialog}>
@ -87,7 +96,11 @@ const AnswersForm = () => {
<p className={classes.myModal__item__question__comment}>{block.question.comment}</p> <p className={classes.myModal__item__question__comment}>{block.question.comment}</p>
</div> </div>
<div className={classes.myModal__item__answer}> <div className={classes.myModal__item__answer}>
<p className={classes.myModal__item__question__text}>Ответ: {block.answers.answer}</p> <p className={classes.myModal__item__question__text}>Ответ: {
Array.isArray(block.answers.answer) ?
block.answers.answer.map(item => <span>{item}; </span>) :
block.answers.answer
}</p>
</div> </div>
</div>)} </div>)}
</div> </div>
@ -99,26 +112,13 @@ const AnswersForm = () => {
</div> </div>
</div> </div>
) )
: <div>Ответов нет</div>} :
<div className={classes.loading__wrapper}>
<div class="spinner-border text-dark" className={classes.loading__wrapper__body} role="status">
{/* <MyButton text={'Предпросмотр'} backgroundColor={'rgb(225, 225, 225)'} toggle={"modal"} target={"#previewModal"}/> <span class="visually-hidden">Загрузка...</span>
{data ? <div className={classes.answers__wrapper__body__item}></div> */} </div>
{/* {data ? </div>}
data.map((item, i) =>
<div className={classes.answers__wrapper__body__item} key={i}>
<div className={classes.answers__wrapper__body__item__question}>
<p className={classes.answers__wrapper__body__item__question__text}>{i + 1}) {item.question.question}</p>
<p className={classes.item__question__comment}>{item.question.comment}</p>
</div>
<div className={classes.answers__wrapper__body__item__answer}>
<p className={classes.answers__wrapper__body__item__question__text}>Ответ: {item.answers.answer}</p>
</div>
</div>
)
: <div>Ответов нет</div>} */}
</div> </div>
</div> </div>
</div> </div>
</div> </div>

216
src/pages/EnterAccount.jsx
View File

@ -23,8 +23,11 @@ const EnterAccount = () => {
const [password, setPassword] = useState(""); const [password, setPassword] = useState("");
const [repiedPassword, setRepiedPassword] = useState(""); const [repiedPassword, setRepiedPassword] = useState("");
const { user, setUser } = useContext(UserData); const {user, setUser} = useContext(UserData);
const [cookies, setCookie, removeCookie] = useCookies(["user"]); const [cookies, setCookie, removeCookie] = useCookies(["user"]);
const [loginError, setLoginError] = useState(false);
const [regsterError, setRegsterError] = useState(false);
function cleanState() { function cleanState() {
setEmail(""); setEmail("");
@ -48,126 +51,81 @@ const EnterAccount = () => {
repiedPassword: repiedPassword, repiedPassword: repiedPassword,
}); });
if (response.status === 200) { if (response.status === 200) {
// setUser({ const responseMe = await verifyUserApi(response.data.token)
// email: email, setUser(responseMe.data);
// phone: phone, setCookie("token", response.data.token);
// login: login, cleanState();
// surname: surname, navigate("/");
// patronymic: patronymic, }
// password: password, else {
// }); setRegsterError(response)
const responseMe = await verifyUserApi(response.data.token); }
setUser(responseMe.data); };
setCookie("token", response.data.token);
cleanState();
navigate("/");
} else {
console.log("Error");
}
}
async function logInToAccount() { async function logInToAccount() {
const response = await logIn(login, password); const response = await logIn(login, password);
if (response.status === 200) { if (response.status === 200) {
setCookie("token", response.data.token); setCookie("token", response.data.token);
const responseMe = await verifyUserApi(response.data.token); const responseMe = await verifyUserApi(response.data.token)
setUser(responseMe.data); setUser(responseMe.data)
cleanState();
navigate("/");
} else {
console.log(response);
}
}
return ( cleanState();
<div className={classes.main}> navigate("/")
<div className={classes.wrapper}> }
<div className={classes.tabs}> else {
<ul class="nav nav-tabs"> setLoginError(true);
<li class="nav-item" onClick={() => selectTag("login")}> }
<a }
className={enter === "login" ? "nav-link active" : "nav-link"}
aria-current="page" return (
> <div className={classes.main}>
Авторизация <div className={classes.wrapper}>
</a> <div className={classes.tabs}>
</li> <ul class="nav nav-tabs">
<li class="nav-item" onClick={() => selectTag("register")}> <li class="nav-item" onClick={() => selectTag("login")}>
<a <a className={enter === "login" ? "nav-link active" : "nav-link"} aria-current="page">Авторизация</a>
className={ </li>
enter === "register" ? "nav-link active" : "nav-link" <li class="nav-item" onClick={() => selectTag("register")}>
} <a className={enter === "register" ? "nav-link active" : "nav-link"}>Регитрация</a>
> </li>
Регистрация </ul>
</a>
</li>
</ul>
</div>
<div className={classes.content}>
<div className={classes.content__wrapper}>
{enter === "login" ? (
<div className={classes.content__wrapper__login}>
<div className={classes.content__wrapper__login__header}>
<h3>Войти в аккаунт</h3>
</div> </div>
<div className={classes.content__wrapper__login__body}> <div className={classes.content}>
<MyInput <div className={classes.content__wrapper}>
placeholder={"Логин"} {enter === 'login' ? <div className={classes.content__wrapper__login}>
otherMainStyle={{ width: "100%", height: "20%" }} <div className={classes.content__wrapper__login__header}>
otherInputStyle={{ width: "100%" }} <h3>Войти в аккаунт</h3>
value={login} </div>
change={setLogin} <div className={classes.content__wrapper__login__body}>
/> {loginError ? <span className={classes.content__wrapper__login__body__error}>
<MyInput Ошибка. Проверте корректность ввода логина и пароля.
type={"password"} </span> : <span className={classes.content__wrapper__login__body__error}></span>}
placeholder={"Пароль"} <MyInput placeholder={"Логин"} otherMainStyle={{width: "100%", height: "20%"}} otherInputStyle={{width: "100%"}} value={login} change={setLogin}/>
otherMainStyle={{ width: "100%", height: "20%" }} <MyInput type={"password"} placeholder={"Пароль"} otherMainStyle={{width: "100%", height: "20%"}} otherInputStyle={{width: "100%"}} value={password} change={setPassword}/>
otherInputStyle={{ width: "100%" }} </div>
value={password} <div className={classes.content__wrapper__login__footer}>
change={setPassword} <MyButton
/> text={"Войти"}
</div> otherStyle={{height: "50%", width: "20%"}}
<div className={classes.content__wrapper__login__footer}> click={logInToAccount}
<MyButton />
text={"Войти"} </div>
otherStyle={{ height: "50%", width: "20%" }} </div> :
click={logInToAccount} <div className={classes.content__wrapper__register}>
/> <div className={classes.content__wrapper__register__header}>
</div> <h3>Зарегистрировать учетную запись</h3>
</div> </div>
) : ( <div className={classes.content__wrapper__register__body}>
<div className={classes.content__wrapper__register}> {regsterError ? <span className={classes.content__wrapper__register__body__error}>
<div className={classes.content__wrapper__register__header}> {regsterError}
<h3>Зарегистрировать учетную запись</h3> </span> : <span className={classes.content__wrapper__register__body__error}></span>}
</div> <MyInput placeholder={"Логин"} otherMainStyle={{width: "100%", height: "15%"}} otherInputStyle={{width: "100%"}} value={login} change={setLogin}/>
<div className={classes.content__wrapper__register__body}> <MyInput type={"password"} placeholder={"Пароль"} otherMainStyle={{width: "100%", height: "15%"}} otherInputStyle={{width: "100%"}} value={password} change={setPassword}/>
<MyInput <MyInput type={'password'} placeholder={"Повторите пароль"} otherMainStyle={{width: "100%", height: "15%"}} otherInputStyle={{width: "100%"}} value={repiedPassword} change={setRepiedPassword}/>
placeholder={"Логин"} </div>
otherMainStyle={{ width: "100%", height: "15%" }} {/* <div className={classes.content__wrapper__register__body}>
otherInputStyle={{ width: "100%" }}
value={login}
change={setLogin}
/>
<MyInput
type={"password"}
placeholder={"Пароль"}
otherMainStyle={{ width: "100%", height: "15%" }}
otherInputStyle={{ width: "100%" }}
value={password}
change={setPassword}
/>
<MyInput
type={"password"}
placeholder={"Повторите пароль"}
otherMainStyle={{ width: "100%", height: "15%" }}
otherInputStyle={{ width: "100%" }}
value={repiedPassword}
change={setRepiedPassword}
/>
</div>
{/* <div className={classes.content__wrapper__register__body}>
<MyInput placeholder={"Email"} otherMainStyle={{width: "100%", height: "15%"}} otherInputStyle={{width: "100%"}} value={email} change={setEmail}/> <MyInput placeholder={"Email"} otherMainStyle={{width: "100%", height: "15%"}} otherInputStyle={{width: "100%"}} value={email} change={setEmail}/>
<MyInput placeholder={"Номер телефона"} otherMainStyle={{width: "100%", height: "15%"}} otherInputStyle={{width: "100%"}} value={phone} change={setPhone}/> <MyInput placeholder={"Номер телефона"} otherMainStyle={{width: "100%", height: "15%"}} otherInputStyle={{width: "100%"}} value={phone} change={setPhone}/>
<div className={classes.content__wrapper__register__body__fio}> <div className={classes.content__wrapper__register__body__fio}>
@ -178,20 +136,20 @@ const EnterAccount = () => {
<MyInput type={'password'} placeholder={"Пароль"} otherMainStyle={{width: "100%", height: "15%"}} otherInputStyle={{width: "100%"}} value={password} change={setPassword}/> <MyInput type={'password'} placeholder={"Пароль"} otherMainStyle={{width: "100%", height: "15%"}} otherInputStyle={{width: "100%"}} value={password} change={setPassword}/>
<MyInput type={'password'} placeholder={"Повторите пароль"} otherMainStyle={{width: "100%", height: "15%"}} otherInputStyle={{width: "100%"}} value={repiedPassword} change={setRepiedPassword}/> <MyInput type={'password'} placeholder={"Повторите пароль"} otherMainStyle={{width: "100%", height: "15%"}} otherInputStyle={{width: "100%"}} value={repiedPassword} change={setRepiedPassword}/>
</div> */} </div> */}
<div className={classes.content__wrapper__register__footer}> <div className={classes.content__wrapper__register__footer}>
<MyButton <MyButton
text={"Создать"} text={"Создать"}
otherStyle={{ height: "100%", width: "20%" }} otherStyle={{ height: "100%", width: "20%" }}
click={() => createUser()} click={() => createUser()}
/> />
</div>
</div>
}
</div>
</div> </div>
</div> </div>
)}
</div>
</div> </div>
</div> );
</div> };
);
};
export default EnterAccount; export default EnterAccount;

7
src/pages/NewForm.jsx
View File

@ -119,13 +119,6 @@ const NewForm = () => {
console.log(response) console.log(response)
} }
// setListBlock(listBlock.map(item => {
// if (item.id === stateModal) {
// item = data
// }
// return item
// }))
cleanStates(); cleanStates();
}; };

7
src/pages/ViewForm.jsx
View File

@ -19,11 +19,9 @@ const ViewForm = () => {
const [cookies, setCookies, __] = useCookies(["user"]); const [cookies, setCookies, __] = useCookies(["user"]);
const [questions, setQuestions] = useState([]); const [questions, setQuestions] = useState([]);
const [answers, setAnswers] = useState([]); const [answers, setAnswers] = useState([]);
// const [title, setTitle] = useState("");
useEffect(() => { useEffect(() => {
async function getForm() { async function getForm() {
// const responseForms = await listFormsApi(cookies.token);
const responseBlocks = await listFormBlockByTokenApi(cookies.token, formId); const responseBlocks = await listFormBlockByTokenApi(cookies.token, formId);
if (responseBlocks.status === 200 && responseBlocks.data) { if (responseBlocks.status === 200 && responseBlocks.data) {
@ -33,10 +31,8 @@ const ViewForm = () => {
setAnswers(listBlocks.map(item => ( setAnswers(listBlocks.map(item => (
{id: item.id, answer: []} {id: item.id, answer: []}
))) )))
// setTitle(responseForms.data.find(item => item.id === formId).title)
} }
else { else {
// console.log(responseForms)
console.log(responseBlocks) console.log(responseBlocks)
} }
}; };
@ -45,6 +41,7 @@ const ViewForm = () => {
}, []); }, []);
function updateAnswersForm(value, id) { function updateAnswersForm(value, id) {
console.log(value)
setAnswers( setAnswers(
answers.map((item, i) => { answers.map((item, i) => {
if (id === i) { if (id === i) {
@ -56,8 +53,8 @@ const ViewForm = () => {
}; };
async function saveAnswers() { async function saveAnswers() {
console.log(answers)
const response = await saveAnswersApi(cookies.token, formId, answers); const response = await saveAnswersApi(cookies.token, formId, answers);
console.log(response)
if (response.status === 200) { if (response.status === 200) {
setAnswersList([...answersList, { setAnswersList([...answersList, {

12
src/router/protectedRouting.js
View File

@ -5,10 +5,10 @@ const protectedUrl = {
"/profile" "/profile"
], ],
Authorized: [ Authorized: [
"enter" "/enter"
], ],
notRights: [ notRights: [
"/forms"
] ]
} }
@ -16,6 +16,14 @@ function globalRender(url, user, navigate) {
if (!user && protectedUrl.notAuthorized.some(item => item === url)) { if (!user && protectedUrl.notAuthorized.some(item => item === url)) {
navigate("/enter") navigate("/enter")
} }
else if (user && protectedUrl.Authorized.some(item => item === url)) {
navigate("/")
}
else if (user && protectedUrl.notRights.some(item => item === url)) {
if (!user.is_admin) {
navigate("/")
}
}
} }
export { globalRender } export { globalRender }