apuc/guild_front
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

quiz

Browse Source
This commit is contained in:
Mikola 2023-12-12 15:18:04 +03:00
parent 2588a72b02
commit 7e5503e576
2 changed files with 63 additions and 67 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

69
src/components/features/quiz/Task.js
View File

@ -1,7 +1,7 @@
import moment from "moment";
import React, { useState } from "react";
import { useSelector } from "react-redux";
import { useParams } from "react-router-dom";
import { useParams, useNavigate } from "react-router-dom";
import { questionsSelector } from "@redux/quizSlice";
@ -18,15 +18,16 @@ import { GetOptionTask } from "./GetOptionTask";
import "./quiz.scss";
export const TaskQuiz = ({ timer }) => {
const navigate = useNavigate();
const { restart } = timer;
const { uuid } = useParams();
const userId = localStorage.getItem("id");
const questions = useSelector(questionsSelector);
const [index, setIndex] = useState(0);
const [isLoadingSendAnswers, setLoadingSendAnswers] = useState(false);
const [isLoadingSendAnswers] = useState(false);
const { showNotification } = useNotification();
const { values, handleChange, setValues } = useHandlerFieldTest({
uuid,
const { userResponses, handleChange } = useHandlerFieldTest({
questions,
indexQuestion: index,
});
@ -34,49 +35,59 @@ export const TaskQuiz = ({ timer }) => {
const nextQuestion = async (e) => {
e.preventDefault();
//Проверка на существование овтетов
if (!values.length) {
if (!userResponses[index]) {
alert("Вы не ответили на вопрос");
return;
}
// setLoadingSendAnswers(true);
// .finally(() => setLoadingSendAnswers(false));
// отправка ответов на сервер
setLoadingSendAnswers(true);
if (questions.length === userResponses.length) {
await apiRequest(`/user-response/set-responses`, {
method: "POST",
data: values,
data: {
user_id: userId,
user_questionnaire_uuid: uuid,
userResponses: JSON.stringify(userResponses)
},
})
.then((res) => {
if (String(res?.status)[0] !== "2") {
.then(() => {
showNotification({
show: true,
text: res?.message || "",
type: "error",
text: "Тест успешно пройден",
type: "success",
});
return;
navigate("/quiz");
// if (String(res?.status)[0] !== "2") {
// showNotification({
// show: true,
// text: res?.message || "",
// type: "error",
// });
// return;
// }
})
// .catch((e) => {
// showNotification({
// show: true,
// text: e?.message || "",
// type: "error",
// });
// })
}
if (index === questions.length - 1) return;
//установка таймера на вопрос если он существует
if (questions[index + 1]?.time_limit !== "00:00:00") setValueTimer();
// очищение полей и переход на следующий вопрос
setIndex((prev) => prev + 1);
setValues([]);
})
.catch((e) => {
showNotification({
show: true,
text: e?.message || "",
type: "error",
});
})
.finally(() => setLoadingSendAnswers(false));
// переход на следующий вопрос
setIndex((prev) => questions[prev + 1] ? prev + 1 : prev);
};
const complete = (e) => {
e.preventDefault();
console.log(values);
};
const setValueTimer = () => {
@ -89,7 +100,6 @@ export const TaskQuiz = ({ timer }) => {
);
};
console.log(questions);
return (
<div className="task">
{questions ? (
@ -111,7 +121,6 @@ export const TaskQuiz = ({ timer }) => {
<div className="form-task__group">
<textarea
className="form-task__field"
value={values[0]?.response_body}
onChange={handleChange}
/>
</div>
@ -128,7 +137,7 @@ export const TaskQuiz = ({ timer }) => {
<div className="form-task__buttons">
<button
onClick={nextQuestion}
disabled={isLoadingSendAnswers}
// disabled={isLoadingSendAnswers}
className="form-task__btn quiz-btn"
>
{isLoadingSendAnswers ? (

47
src/hooks/useHandlerFieldTest.js
View File

@ -1,42 +1,29 @@
import { useState } from "react";
export const useHandlerFieldTest = ({ uuid, questions, indexQuestion }) => {
const [values, setValues] = useState([]);
const id = localStorage.getItem("id");
export const useHandlerFieldTest = ({ questions, indexQuestion }) => {
const [userResponses, setUserResponses] = useState([]);
const handleChangeCheckbox = (e) => {
if (!e.target.checked) {
setValues((prev) => [
...prev.filter((item) => item.response_body !== e.target.value),
]);
return;
}
setValues((prev) => [
...prev,
setUserResponses((prev) =>
[...prev.filter((item) => item.question_id !== questions[indexQuestion].id),
{
user_id: id,
user_questionnaire_uuid: uuid,
question_id: questions[indexQuestion].id,
response_body: e.target.value,
},
]);
answer_id: e.target.id ? e.target.id : questions[indexQuestion].id
}])
};
const handleFieldsForm = (e) => {
setValues([
{
user_id: id,
user_questionnaire_uuid: uuid,
question_id: questions[indexQuestion].id,
response_body: e.target.value,
},
]);
};
// const handleFieldsForm = (e) => {
// setValues([
// {
// user_id: id,
// user_questionnaire_uuid: uuid,
// question_id: questions[indexQuestion].id,
// response_body: e.target.value,
// },
// ]);
// };
const handleChange = (e) => {
if (+questions[indexQuestion].question_type_id !== 3) {
handleFieldsForm(e);
return;
}
handleChangeCheckbox(e);
};
return { handleChange, values, setValues };
return { handleChange, userResponses};
};