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

fix one

Browse Source
This commit is contained in:
kuwsh1n 2024-04-15 00:15:26 +03:00
parent 0b48eb739e
commit 9a7d71e8fb
16 changed files with 169 additions and 100 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/App.jsx
View File

@ -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);
}
}

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

@ -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 {
}
}
}
}

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

@ -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;

4
src/components/NavBar.jsx
View File

@ -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 (
<div className={classes.main}>
<div className={classes.wrapper}>

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

@ -7,11 +7,11 @@ const DropDownList = ({postfix, optionAnswer, answers, updateAnswersForm}) => {
<div className={classes.main}>
<select
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) =>
// <option value={item.id ? item.id : item[0].Value} key={i}>{item.text ? item.text : item[1].Value}</option>
<option value={item.id} key={i}>{item.text}</option>
<option value={item.text} key={i}>{item.text}</option>
)}
</select>
</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"
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)}
/>
{/* <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>

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

@ -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) : () => {}}
/>
{/* <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>

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

@ -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) : () => {}}
/>
<label class="form-check-label" for="choiceYes">Да</label>
</div>
@ -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) : () => {}}
/>
<label class="form-check-label" for="choiceNo">Нет</label>
</div>

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

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

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

@ -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, "Обязательное поле."),

44
src/pages/AnswersForm.jsx
View File

@ -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 = () => {
<h3>Ответы</h3>
</div>
<div className={classes.answers__wrapper__body}>
<div className={classes.answers__wrapper__body__column}>
<div>Логин</div>
<div>Дата</div>
</div>
{data ?
data.map((item, 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}`}>
{item.user}
</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-dialog myModal__dialog" className={classes.myModal__dialog}>
@ -87,7 +96,11 @@ const AnswersForm = () => {
<p className={classes.myModal__item__question__comment}>{block.question.comment}</p>
</div>
<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>
@ -99,26 +112,13 @@ const AnswersForm = () => {
</div>
</div>
)
: <div>Ответов нет</div>}
{/* <MyButton text={'Предпросмотр'} backgroundColor={'rgb(225, 225, 225)'} toggle={"modal"} target={"#previewModal"}/>
{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 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 className={classes.loading__wrapper}>
<div class="spinner-border text-dark" className={classes.loading__wrapper__body} role="status">
<span class="visually-hidden">Загрузка...</span>
</div>
</div>}
</div>
</div>
</div>
</div>

15
src/pages/EnterAccount.jsx
View File

@ -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 = () => {
<h3>Войти в аккаунт</h3>
</div>
<div className={classes.content__wrapper__login__body}>
{loginError ? <span className={classes.content__wrapper__login__body__error}>
Ошибка. Проверте корректность ввода логина и пароля.
</span> : <span className={classes.content__wrapper__login__body__error}></span>}
<MyInput placeholder={"Логин"} otherMainStyle={{width: "100%", height: "20%"}} otherInputStyle={{width: "100%"}} value={login} change={setLogin}/>
<MyInput type={"password"} placeholder={"Пароль"} otherMainStyle={{width: "100%", height: "20%"}} otherInputStyle={{width: "100%"}} value={password} change={setPassword}/>
</div>
@ -105,9 +111,12 @@ const EnterAccount = () => {
</div> :
<div className={classes.content__wrapper__register}>
<div className={classes.content__wrapper__register__header}>
<h3>Зарегестрировать учетную запись</h3>
<h3>Зарегистрировать учетную запись</h3>
</div>
<div className={classes.content__wrapper__register__body}>
{regsterError ? <span className={classes.content__wrapper__register__body__error}>
{regsterError}
</span> : <span className={classes.content__wrapper__register__body__error}></span>}
<MyInput placeholder={"Логин"} otherMainStyle={{width: "100%", height: "15%"}} 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}/>

7
src/pages/NewForm.jsx
View File

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

7
src/pages/ViewForm.jsx
View File

@ -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, {

14
src/router/protectedRouting.js
View File

@ -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 }