Compare commits
3 Commits
695cc690d9
...
209c2e0a70
Author | SHA1 | Date | |
---|---|---|---|
|
209c2e0a70 | ||
|
9a7d71e8fb | ||
|
0b48eb739e |
22
src/App.jsx
22
src/App.jsx
@ -22,14 +22,14 @@ const App = () => {
|
|||||||
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));
|
||||||
@ -40,12 +40,12 @@ 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);
|
||||||
} else {
|
globalRender(window.location.pathname, response.data, navigate);
|
||||||
console.log(response);
|
|
||||||
}
|
}
|
||||||
|
else {
|
||||||
|
globalRender(window.location.pathname, false, navigate);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -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;
|
||||||
|
padding: 5px;
|
||||||
|
border-bottom: 1px solid rgb(200, 200, 200);
|
||||||
|
}
|
||||||
|
&__item {
|
||||||
|
padding: 0 5px;
|
||||||
|
// border-bottom: 1px solid rgb(200, 200, 200);
|
||||||
|
font-size: 15px;
|
||||||
|
font-family: "Montserrat", sans-serif;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
height: 20%;
|
||||||
|
width: 100%;
|
||||||
|
&:hover {
|
||||||
|
background-color: rgba(230, 230, 230, 0.6);
|
||||||
|
}
|
||||||
|
&__user {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
// &__question {
|
&:hover {
|
||||||
// &__text {
|
text-decoration: underline;
|
||||||
// font-size: 15px;
|
}
|
||||||
// font-family: "Montserrat", sans-serif;
|
}
|
||||||
// }
|
&__date {
|
||||||
// &__comment {
|
|
||||||
// font-size: 11px;
|
}
|
||||||
// font-family: "Montserrat", sans-serif;
|
|
||||||
// font-style: italic;
|
|
||||||
// color: rgb(200, 200, 200);
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
// &__answer {
|
|
||||||
// &__text {
|
|
||||||
// font-size: 15px;
|
|
||||||
// font-family: "Montserrat", sans-serif;
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -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;
|
||||||
|
@ -4,41 +4,25 @@ 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(() => {
|
|
||||||
console.log("nav", auth);
|
|
||||||
});
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={classes.main}>
|
<div className={classes.main}>
|
||||||
<div className={classes.wrapper}>
|
<div className={classes.wrapper}>
|
||||||
<div className={classes.menu}>
|
<div className={classes.menu}>
|
||||||
<div className={classes.menu__authorized}>
|
<div className={classes.menu__authorized}>
|
||||||
<span onClick={() => navigate("/")}>Главная</span>
|
<span onClick={() => navigate("/")}>Главная</span>
|
||||||
{auth ? (
|
{auth ?
|
||||||
auth.is_admin ? (
|
auth.is_admin ? <span onClick={() => navigate("/forms")}>Мои формы</span> : <span></span> :
|
||||||
<span onClick={() => navigate("/forms")}>Мои формы</span>
|
<span></span>}
|
||||||
) : (
|
|
||||||
<span></span>
|
|
||||||
)
|
|
||||||
) : (
|
|
||||||
<span></span>
|
|
||||||
)}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className={classes.profile}>
|
<div className={classes.profile}>
|
||||||
{auth ? (
|
{auth ?
|
||||||
<div className={classes.profile__authorized}>
|
<div className={classes.profile__authorized}>
|
||||||
<span onClick={() => navigate("/profile")}>
|
<span onClick={() => navigate("/profile")}>Профиль ({auth.login})</span>
|
||||||
Профиль ({auth.login})
|
</div> :
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
) : (
|
|
||||||
<div className={classes.profile__nonAuthorized}>
|
<div className={classes.profile__nonAuthorized}>
|
||||||
<span onClick={() => navigate("/enter")}>
|
<span onClick={() => navigate("/enter")}>Вход <i class="fa-solid fa-arrow-right-to-bracket"></i></span>
|
||||||
Вход <i class="fa-solid fa-arrow-right-to-bracket"></i>
|
</div>}
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -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>
|
||||||
|
@ -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>
|
||||||
|
@ -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>
|
||||||
|
@ -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>
|
||||||
|
@ -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
|
||||||
|
@ -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 }
|
@ -16,16 +16,15 @@ const constructorAnswerValidate = (
|
|||||||
|
|
||||||
const totalRegisterValidate = (data) => {
|
const totalRegisterValidate = (data) => {
|
||||||
const listValidation = [
|
const listValidation = [
|
||||||
constructorAnswerValidate(data.login.length, "Обязательное поле."),
|
constructorAnswerValidate(data.login.length, "Введите логин."),
|
||||||
|
constructorAnswerValidate(data.password.length, "Введите пароль."),
|
||||||
|
constructorAnswerValidate(data.repiedPassword.length, "Введите повторно пароль."),
|
||||||
// constructorAnswerValidate(data.surname.length, "Обязательное поле."),
|
// constructorAnswerValidate(data.surname.length, "Обязательное поле."),
|
||||||
// constructorAnswerValidate(data.email.length, "Обязательное поле."),
|
// constructorAnswerValidate(data.email.length, "Обязательное поле."),
|
||||||
// constructorAnswerValidate(data.phone.length, "Обязательное поле."),
|
// constructorAnswerValidate(data.phone.length, "Обязательное поле."),
|
||||||
constructorAnswerValidate(
|
constructorAnswerValidate(data.password === data.repiedPassword, "Введенные пароли не совпадают."),
|
||||||
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) {
|
||||||
|
@ -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,27 +112,14 @@ 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> */}
|
|
||||||
{/* {data ?
|
|
||||||
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>
|
||||||
<div className={classes.answers__wrapper__body__item__answer}>
|
</div>}
|
||||||
<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>
|
||||||
</div>
|
</div>
|
||||||
|
@ -26,6 +26,9 @@ const EnterAccount = () => {
|
|||||||
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("");
|
||||||
setPhone("");
|
setPhone("");
|
||||||
@ -49,35 +52,30 @@ const EnterAccount = () => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
if (response.status === 200) {
|
if (response.status === 200) {
|
||||||
// setUser({
|
const responseMe = await verifyUserApi(response.data.token)
|
||||||
// email: email,
|
|
||||||
// phone: phone,
|
|
||||||
// login: login,
|
|
||||||
// surname: surname,
|
|
||||||
// patronymic: patronymic,
|
|
||||||
// password: password,
|
|
||||||
// });
|
|
||||||
const responseMe = await verifyUserApi(response.data.token);
|
|
||||||
setUser(responseMe.data);
|
setUser(responseMe.data);
|
||||||
setCookie("token", response.data.token);
|
setCookie("token", response.data.token);
|
||||||
cleanState();
|
cleanState();
|
||||||
navigate("/");
|
navigate("/");
|
||||||
} else {
|
|
||||||
console.log("Error");
|
|
||||||
}
|
}
|
||||||
|
else {
|
||||||
|
setRegsterError(response)
|
||||||
}
|
}
|
||||||
|
};
|
||||||
|
|
||||||
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();
|
cleanState();
|
||||||
navigate("/");
|
navigate("/")
|
||||||
} else {
|
}
|
||||||
console.log(response);
|
else {
|
||||||
|
setLoginError(true);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -87,47 +85,25 @@ const EnterAccount = () => {
|
|||||||
<div className={classes.tabs}>
|
<div className={classes.tabs}>
|
||||||
<ul class="nav nav-tabs">
|
<ul class="nav nav-tabs">
|
||||||
<li class="nav-item" onClick={() => selectTag("login")}>
|
<li class="nav-item" onClick={() => selectTag("login")}>
|
||||||
<a
|
<a className={enter === "login" ? "nav-link active" : "nav-link"} aria-current="page">Авторизация</a>
|
||||||
className={enter === "login" ? "nav-link active" : "nav-link"}
|
|
||||||
aria-current="page"
|
|
||||||
>
|
|
||||||
Авторизация
|
|
||||||
</a>
|
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item" onClick={() => selectTag("register")}>
|
<li class="nav-item" onClick={() => selectTag("register")}>
|
||||||
<a
|
<a className={enter === "register" ? "nav-link active" : "nav-link"}>Регитрация</a>
|
||||||
className={
|
|
||||||
enter === "register" ? "nav-link active" : "nav-link"
|
|
||||||
}
|
|
||||||
>
|
|
||||||
Регистрация
|
|
||||||
</a>
|
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div className={classes.content}>
|
<div className={classes.content}>
|
||||||
<div className={classes.content__wrapper}>
|
<div className={classes.content__wrapper}>
|
||||||
{enter === "login" ? (
|
{enter === 'login' ? <div className={classes.content__wrapper__login}>
|
||||||
<div className={classes.content__wrapper__login}>
|
|
||||||
<div className={classes.content__wrapper__login__header}>
|
<div className={classes.content__wrapper__login__header}>
|
||||||
<h3>Войти в аккаунт</h3>
|
<h3>Войти в аккаунт</h3>
|
||||||
</div>
|
</div>
|
||||||
<div className={classes.content__wrapper__login__body}>
|
<div className={classes.content__wrapper__login__body}>
|
||||||
<MyInput
|
{loginError ? <span className={classes.content__wrapper__login__body__error}>
|
||||||
placeholder={"Логин"}
|
Ошибка. Проверте корректность ввода логина и пароля.
|
||||||
otherMainStyle={{ width: "100%", height: "20%" }}
|
</span> : <span className={classes.content__wrapper__login__body__error}></span>}
|
||||||
otherInputStyle={{ width: "100%" }}
|
<MyInput placeholder={"Логин"} otherMainStyle={{width: "100%", height: "20%"}} otherInputStyle={{width: "100%"}} value={login} change={setLogin}/>
|
||||||
value={login}
|
<MyInput type={"password"} placeholder={"Пароль"} otherMainStyle={{width: "100%", height: "20%"}} otherInputStyle={{width: "100%"}} value={password} change={setPassword}/>
|
||||||
change={setLogin}
|
|
||||||
/>
|
|
||||||
<MyInput
|
|
||||||
type={"password"}
|
|
||||||
placeholder={"Пароль"}
|
|
||||||
otherMainStyle={{ width: "100%", height: "20%" }}
|
|
||||||
otherInputStyle={{ width: "100%" }}
|
|
||||||
value={password}
|
|
||||||
change={setPassword}
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
<div className={classes.content__wrapper__login__footer}>
|
<div className={classes.content__wrapper__login__footer}>
|
||||||
<MyButton
|
<MyButton
|
||||||
@ -136,36 +112,18 @@ const EnterAccount = () => {
|
|||||||
click={logInToAccount}
|
click={logInToAccount}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div> :
|
||||||
) : (
|
|
||||||
<div className={classes.content__wrapper__register}>
|
<div className={classes.content__wrapper__register}>
|
||||||
<div className={classes.content__wrapper__register__header}>
|
<div className={classes.content__wrapper__register__header}>
|
||||||
<h3>Зарегистрировать учетную запись</h3>
|
<h3>Зарегистрировать учетную запись</h3>
|
||||||
</div>
|
</div>
|
||||||
<div className={classes.content__wrapper__register__body}>
|
<div className={classes.content__wrapper__register__body}>
|
||||||
<MyInput
|
{regsterError ? <span className={classes.content__wrapper__register__body__error}>
|
||||||
placeholder={"Логин"}
|
{regsterError}
|
||||||
otherMainStyle={{ width: "100%", height: "15%" }}
|
</span> : <span className={classes.content__wrapper__register__body__error}></span>}
|
||||||
otherInputStyle={{ width: "100%" }}
|
<MyInput placeholder={"Логин"} otherMainStyle={{width: "100%", height: "15%"}} otherInputStyle={{width: "100%"}} value={login} change={setLogin}/>
|
||||||
value={login}
|
<MyInput type={"password"} placeholder={"Пароль"} otherMainStyle={{width: "100%", height: "15%"}} otherInputStyle={{width: "100%"}} value={password} change={setPassword}/>
|
||||||
change={setLogin}
|
<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={password}
|
|
||||||
change={setPassword}
|
|
||||||
/>
|
|
||||||
<MyInput
|
|
||||||
type={"password"}
|
|
||||||
placeholder={"Повторите пароль"}
|
|
||||||
otherMainStyle={{ width: "100%", height: "15%" }}
|
|
||||||
otherInputStyle={{ width: "100%" }}
|
|
||||||
value={repiedPassword}
|
|
||||||
change={setRepiedPassword}
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
{/* <div className={classes.content__wrapper__register__body}>
|
{/* <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}/>
|
||||||
@ -186,7 +144,7 @@ const EnterAccount = () => {
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)}
|
}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -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();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -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, {
|
||||||
|
@ -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 }
|
Loading…
Reference in New Issue
Block a user