From 9a7d71e8fb379a2bedec2877b3a78a7d2d49d9a6 Mon Sep 17 00:00:00 2001 From: kuwsh1n Date: Mon, 15 Apr 2024 00:15:26 +0300 Subject: [PATCH] fix one --- src/App.jsx | 16 ++-- src/assets/styles/answersForm.module.scss | 78 +++++++++++++------ src/assets/styles/enterAccount.module.scss | 20 ++++- src/components/NavBar.jsx | 4 - src/components/typeAnswer/DropDownList.jsx | 6 +- .../typeAnswer/InputMultipleRadio.jsx | 18 ++--- src/components/typeAnswer/InputRadio.jsx | 6 +- src/components/typeAnswer/YesNo.jsx | 8 +- src/hooks/api/enterAccountApi.js | 2 +- src/hooks/sundry/parseListBlock.js | 20 ++++- src/hooks/validation/enterAccountValidate.js | 4 +- src/pages/AnswersForm.jsx | 44 +++++------ src/pages/EnterAccount.jsx | 15 +++- src/pages/NewForm.jsx | 7 -- src/pages/ViewForm.jsx | 7 +- src/router/protectedRouting.js | 14 +++- 16 files changed, 169 insertions(+), 100 deletions(-) diff --git a/src/App.jsx b/src/App.jsx index 7dd4742..7f65446 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -28,7 +28,7 @@ const App = () => { {id: 4, text: 'Множественный выбор', typeTag: InputMultipleRadio}, {id: 5, text: 'Выпадающий список', typeTag: DropDownList}, {id: 6, text: 'Да/Нет', typeTag: YesNo}, - {id: 7, text: 'Файл', typeTag: InputFile}, + // {id: 7, text: 'Файл', typeTag: InputFile}, {id: 8, text: 'Дата', typeTag: InputDate} ]); @@ -38,15 +38,13 @@ const App = () => { useEffect(() => { async function verifyUser() { const response = await verifyUserApi(cookies.token); - console.log("app", user) - if (response) { - if (response.status === 200) { - setUser(response.data); - } - else { - console.log(response) - } + if (response.status === 200) { + setUser(response.data); + globalRender(window.location.pathname, response.data, navigate); + } + else { + globalRender(window.location.pathname, false, navigate); } } diff --git a/src/assets/styles/answersForm.module.scss b/src/assets/styles/answersForm.module.scss index 62a00f9..cf73951 100644 --- a/src/assets/styles/answersForm.module.scss +++ b/src/assets/styles/answersForm.module.scss @@ -11,12 +11,26 @@ align-items: center; } +.loading__wrapper { + width: 100%; + height: 80%; + display: flex; + justify-content: center; + align-items: center; + &__body { + // margin-top: 100px; + span { + + } + } +} + + .answers { width: 70%; height: 70%; box-shadow: 0 0 5px 1px rgb(200, 200, 200); padding: 1.5%; - position: relative; &__linkAdmin { position: absolute; bottom: 103%; @@ -33,6 +47,8 @@ } } &__wrapper { + width: 100%; + height: 100%; &__header { width: 100%; height: 15%; @@ -40,6 +56,7 @@ justify-content: start; align-items: center; margin-bottom: 10px; + // border-bottom: 1px solid rgb(200, 200, 200); h3 { font-size: 25px; font-family: "Montserrat", sans-serif; @@ -49,30 +66,45 @@ &__body { width: 100%; height: 85%; - &__item { - padding: 5px; - border-bottom: 1px solid rgb(200, 200, 200); + overflow-y: auto; + 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-family: "Montserrat", sans-serif; - cursor: pointer; - // &__question { - // &__text { - // font-size: 15px; - // font-family: "Montserrat", sans-serif; - // } - // &__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; - // } - // } + 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; + &:hover { + text-decoration: underline; + } + } + &__date { + + } } } } diff --git a/src/assets/styles/enterAccount.module.scss b/src/assets/styles/enterAccount.module.scss index 4ed78a8..fb4063d 100644 --- a/src/assets/styles/enterAccount.module.scss +++ b/src/assets/styles/enterAccount.module.scss @@ -28,7 +28,6 @@ .content { width: 100%; height: 100%; - // box-shadow: 0 3px 5px 1px rgb(200, 200, 200); border: 1px solid rgb(220, 220, 220); border-top: none; &__wrapper { @@ -58,6 +57,15 @@ display: flex; justify-content: space-around; 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 { width: 100%; @@ -87,7 +95,15 @@ justify-content: space-around; flex-direction: column; 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 { height: 15%; display: flex; diff --git a/src/components/NavBar.jsx b/src/components/NavBar.jsx index d613514..75bc149 100644 --- a/src/components/NavBar.jsx +++ b/src/components/NavBar.jsx @@ -4,10 +4,6 @@ import classes from "../assets/styles/components/navbar.module.scss"; import { verifyUserApi } from "../hooks/api/enterAccountApi"; const NavBar = ({navigate, auth, setAuth}) => { - useEffect(() => { - console.log("nav", auth) - }) - return (
diff --git a/src/components/typeAnswer/DropDownList.jsx b/src/components/typeAnswer/DropDownList.jsx index cefb364..89cba66 100644 --- a/src/components/typeAnswer/DropDownList.jsx +++ b/src/components/typeAnswer/DropDownList.jsx @@ -7,11 +7,11 @@ const DropDownList = ({postfix, optionAnswer, answers, updateAnswersForm}) => {
diff --git a/src/components/typeAnswer/InputMultipleRadio.jsx b/src/components/typeAnswer/InputMultipleRadio.jsx index ff94949..456b60f 100644 --- a/src/components/typeAnswer/InputMultipleRadio.jsx +++ b/src/components/typeAnswer/InputMultipleRadio.jsx @@ -2,20 +2,20 @@ import React from "react"; import classes from "../../assets/styles/components/typeAnswer/inputMultiple.module.scss" const InputMultipleRadio = ({postfix, optionAnswer, answers, updateAnswersForm}) => { - function checkRadio(i) { + function checkRadio(value) { if (answers[postfix].answer) { - return answers[postfix].answer.some(item => item === Number(i)) + return answers[postfix].answer.some(item => item === value) } return false } - function updateStateCheckbox(i) { + function updateStateCheckbox(value) { if (updateAnswersForm) { - if (answers[postfix].answer.some((item) => item === Number(i))) { - answers[postfix].answer.splice(answers[postfix].answer.indexOf(i), 1) + if (answers[postfix].answer.some((item) => item === value)) { + answers[postfix].answer.splice(answers[postfix].answer.indexOf(value), 1) } else { - answers[postfix].answer.push(i) + answers[postfix].answer.push(value) } updateAnswersForm(answers[postfix].answer, postfix) } @@ -30,9 +30,9 @@ const InputMultipleRadio = ({postfix, optionAnswer, answers, updateAnswersForm}) type="checkbox" name={`inputMultiple_${postfix}`} id={`inputMultiple_${postfix}`} - value={i} - checked={answers ? checkRadio(i) : false} - onChange={() => updateStateCheckbox(i)} + value={item.text} + checked={answers ? checkRadio(item.text) : false} + onChange={() => updateStateCheckbox(item.text)} /> {/* */} diff --git a/src/components/typeAnswer/InputRadio.jsx b/src/components/typeAnswer/InputRadio.jsx index 5e2e274..64c3dce 100644 --- a/src/components/typeAnswer/InputRadio.jsx +++ b/src/components/typeAnswer/InputRadio.jsx @@ -11,9 +11,9 @@ const InputRadio = ({postfix, optionAnswer, answers, updateAnswersForm}) => { type="radio" name={`inputRadio_${postfix}`} id={`choice_${item.id}`} - value={i} - checked={answers ? answers[postfix].answer === i : false} - onChange={updateAnswersForm ? (e) => updateAnswersForm(Number(e.target.value), postfix) : () => {}} + value={item.text} + checked={answers ? answers[postfix].answer === item.text : false} + onChange={updateAnswersForm ? (e) => updateAnswersForm(item.text, postfix) : () => {}} /> {/* */} diff --git a/src/components/typeAnswer/YesNo.jsx b/src/components/typeAnswer/YesNo.jsx index dc411ab..a719b22 100644 --- a/src/components/typeAnswer/YesNo.jsx +++ b/src/components/typeAnswer/YesNo.jsx @@ -11,8 +11,8 @@ const YesNo = ({postfix, optionAnswer, answers, updateAnswersForm}) => { name={`YesOrNo_${postfix}`} id="choiceYes" value="1" - checked={answers ? answers[postfix].answer === "1" : false} - onChange={updateAnswersForm ? () => updateAnswersForm("1", postfix) : () => {}} + checked={answers ? answers[postfix].answer === "Да" : false} + onChange={updateAnswersForm ? () => updateAnswersForm("Да", postfix) : () => {}} />
@@ -23,8 +23,8 @@ const YesNo = ({postfix, optionAnswer, answers, updateAnswersForm}) => { name={`YesOrNo_${postfix}`} id="choiceNo" value="2" - checked={answers ? answers[postfix].answer === "2" : false} - onChange={updateAnswersForm ? () => updateAnswersForm("2", postfix) : () => {}} + checked={answers ? answers[postfix].answer === "Нет" : false} + onChange={updateAnswersForm ? () => updateAnswersForm("Нет", postfix) : () => {}} />
diff --git a/src/hooks/api/enterAccountApi.js b/src/hooks/api/enterAccountApi.js index eeab6ea..99c7a22 100644 --- a/src/hooks/api/enterAccountApi.js +++ b/src/hooks/api/enterAccountApi.js @@ -23,7 +23,7 @@ async function completeRegistration(data) { return response } catch (e) { - return e + return "Ошибка. Проверте корректность введенных данных." } } return validate.message diff --git a/src/hooks/sundry/parseListBlock.js b/src/hooks/sundry/parseListBlock.js index 197c3fb..70acbcd 100644 --- a/src/hooks/sundry/parseListBlock.js +++ b/src/hooks/sundry/parseListBlock.js @@ -31,4 +31,22 @@ function responseDataToListBlock(data) { return result.sort((itemOne, itemTwo) => itemOne.order - itemTwo.order) }; -export { responseDataToListBlock } \ No newline at end of file +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 } \ No newline at end of file diff --git a/src/hooks/validation/enterAccountValidate.js b/src/hooks/validation/enterAccountValidate.js index c5381e9..90e6c41 100644 --- a/src/hooks/validation/enterAccountValidate.js +++ b/src/hooks/validation/enterAccountValidate.js @@ -12,7 +12,9 @@ const constructorAnswerValidate = (state, messageReject = "Ошибка", messag const totalRegisterValidate = (data) => { const listValidation = [ - constructorAnswerValidate(data.login.length, "Обязательное поле."), + constructorAnswerValidate(data.login.length, "Введите логин."), + constructorAnswerValidate(data.password.length, "Введите пароль."), + constructorAnswerValidate(data.repiedPassword.length, "Введите повторно пароль."), // constructorAnswerValidate(data.surname.length, "Обязательное поле."), // constructorAnswerValidate(data.email.length, "Обязательное поле."), // constructorAnswerValidate(data.phone.length, "Обязательное поле."), diff --git a/src/pages/AnswersForm.jsx b/src/pages/AnswersForm.jsx index de58a80..d14498d 100644 --- a/src/pages/AnswersForm.jsx +++ b/src/pages/AnswersForm.jsx @@ -3,7 +3,7 @@ import { useCookies } from "react-cookie"; import { useNavigate, useParams } from 'react-router-dom'; import { answersData } from "../context"; 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 { listUsersApi } from "../hooks/api/adminApi"; @@ -29,6 +29,7 @@ const AnswersForm = () => { for (let item of responseAnswers.data) { const blocks = { user: listUsers.data.find(user => user.id === item.user_id).login, + date: dateTimeParse(item.date), block: [] } @@ -67,12 +68,20 @@ const AnswersForm = () => {

Ответы

+
+
Логин
+
Дата
+
+ {data ? data.map((item, i) =>
{item.user}
+
+ {item.date} +
)}
@@ -99,26 +112,13 @@ const AnswersForm = () => {
) - :
Ответов нет
} - - - {/* - {data ?
*/} - {/* {data ? - data.map((item, i) => -
-
-

{i + 1}) {item.question.question}

-

{item.question.comment}

-
-
-

Ответ: {item.answers.answer}

-
-
- ) - :
Ответов нет
} */} - - + : +
+
+ Загрузка... +
+
} + diff --git a/src/pages/EnterAccount.jsx b/src/pages/EnterAccount.jsx index 6060be1..c244537 100644 --- a/src/pages/EnterAccount.jsx +++ b/src/pages/EnterAccount.jsx @@ -22,6 +22,9 @@ const EnterAccount = () => { const {user, setUser} = useContext(UserData); const [cookies, setCookie, removeCookie] = useCookies(["user"]); + const [loginError, setLoginError] = useState(false); + const [regsterError, setRegsterError] = useState(false); + function cleanState() { setEmail(""); setPhone(""); @@ -52,7 +55,7 @@ const EnterAccount = () => { navigate("/"); } else { - console.log("Error") + setRegsterError(response) } }; @@ -68,7 +71,7 @@ const EnterAccount = () => { navigate("/") } else { - console.log(response) + setLoginError(true); } } @@ -92,6 +95,9 @@ const EnterAccount = () => {

Войти в аккаунт

+ {loginError ? + Ошибка. Проверте корректность ввода логина и пароля. + : }
@@ -105,9 +111,12 @@ const EnterAccount = () => { :
-

Зарегестрировать учетную запись

+

Зарегистрировать учетную запись

+ {regsterError ? + {regsterError} + : } diff --git a/src/pages/NewForm.jsx b/src/pages/NewForm.jsx index 6aa4da5..cf155ff 100644 --- a/src/pages/NewForm.jsx +++ b/src/pages/NewForm.jsx @@ -118,13 +118,6 @@ const NewForm = () => { else { console.log(response) } - - // setListBlock(listBlock.map(item => { - // if (item.id === stateModal) { - // item = data - // } - // return item - // })) cleanStates(); }; diff --git a/src/pages/ViewForm.jsx b/src/pages/ViewForm.jsx index 5a34746..77d3509 100644 --- a/src/pages/ViewForm.jsx +++ b/src/pages/ViewForm.jsx @@ -19,11 +19,9 @@ const ViewForm = () => { const [cookies, setCookies, __] = useCookies(["user"]); const [questions, setQuestions] = useState([]); const [answers, setAnswers] = useState([]); - // const [title, setTitle] = useState(""); useEffect(() => { async function getForm() { - // const responseForms = await listFormsApi(cookies.token); const responseBlocks = await listFormBlockByTokenApi(cookies.token, formId); if (responseBlocks.status === 200 && responseBlocks.data) { @@ -33,10 +31,8 @@ const ViewForm = () => { setAnswers(listBlocks.map(item => ( {id: item.id, answer: []} ))) - // setTitle(responseForms.data.find(item => item.id === formId).title) } else { - // console.log(responseForms) console.log(responseBlocks) } }; @@ -45,6 +41,7 @@ const ViewForm = () => { }, []); function updateAnswersForm(value, id) { + console.log(value) setAnswers( answers.map((item, i) => { if (id === i) { @@ -56,8 +53,8 @@ const ViewForm = () => { }; async function saveAnswers() { + console.log(answers) const response = await saveAnswersApi(cookies.token, formId, answers); - console.log(response) if (response.status === 200) { setAnswersList([...answersList, { diff --git a/src/router/protectedRouting.js b/src/router/protectedRouting.js index 24f3491..530f204 100644 --- a/src/router/protectedRouting.js +++ b/src/router/protectedRouting.js @@ -5,17 +5,25 @@ const protectedUrl = { "/profile" ], Authorized: [ - "enter" + "/enter" ], notRights: [ - + "/forms" ] } function globalRender(url, user, navigate) { if (!user && protectedUrl.notAuthorized.some(item => item === url)) { 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 } \ No newline at end of file