quiz

src/components/features/quiz/HeaderQuiz.js

@@ -25,8 +25,6 @@ export const HeaderQuiz = ({header}) => {
       })
    }, [dispatch])
 
-   console.log('render header quiz')
-
    return (
      <div className="header-quiz">
         <div className="header-quiz__container">

src/components/features/quiz/Instructions.js

@@ -9,7 +9,7 @@ import {fetchGet} from "../../../server/server";
 
 export const Instruction = () => {
 
-   const [countQuestions, setCountQuestions] = useState()
+   const [countQuestions, setCountQuestions] = useState(null)
    const test = useSelector(selectedTest)
 
    useEffect(async () => {
@@ -26,21 +26,26 @@ export const Instruction = () => {
    return (
      <div className="instruction">
         <div className="instruction__container">
-           <h3 className="instruction__title quiz-title_h3">Инструкция к тесту</h3>
-           <div className="instruction__text">
-              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempoLorem ipsum dolor sit
-              amet,Lo
-              rem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempo consectetur adipisicing e
-              lit, sed do eiusmod tempo
-           </div>
-           <Link to="/quiz-test" className='instruction__btn quiz-btn quiz-btn_restriction'>Далее</Link>
-           <div className="instruction__info">
-              <div className="instruction__icon">
-                 <img src={comment} alt=""/>
-              </div>
-              <div className="instruction__text instruction__text_info">Количество вопросов в
-                 тесте: <span>{countQuestions}</span></div>
-           </div>
+           {!countQuestions ? <h2>Loading...</h2> :
+             <>
+                <h3 className="instruction__title quiz-title_h3">Инструкция к тесту</h3>
+                <div className="instruction__text">
+                   Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempoLorem ipsum dolor sit
+                   amet,Lo
+                   rem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempo consectetur adipisicing
+                   e
+                   lit, sed do eiusmod tempo
+                </div>
+                <Link to="/quiz-test" className='instruction__btn quiz-btn quiz-btn_restriction'>Далее</Link>
+                <div className="instruction__info">
+                   <div className="instruction__icon">
+                      <img src={comment} alt=""/>
+                   </div>
+                   <div className="instruction__text instruction__text_info">Количество вопросов в
+                      тесте: <span>{countQuestions}</span></div>
+                </div>
+             </>
+           }
         </div>
      </div>
    )

src/components/features/quiz/Results.js

@@ -0,0 +1,37 @@
+import React, {useEffect, useState} from 'react';
+import {useDispatch, useSelector} from "react-redux";
+import {fetchResultTest, selectedTest, selectResult} from "../../../redux/quizSlice";
+import {fetchGet} from "../../../server/server";
+
+
+export const Results = () => {
+   const result = useSelector(selectResult)
+   const test = useSelector(selectedTest)
+   const [maxScore, setMaxScore] = useState('')
+   const dispatch = useDispatch()
+
+   useEffect(async () => {
+      dispatch(fetchResultTest(test.uuid))
+      const response = await fetchGet({
+           link: `${process.env.REACT_APP_API_URL}/api/user-questionnaire/get-points-number?user_questionnaire_uuid=${test.uuid}`,
+           Origin: `${process.env.REACT_APP_BASE_URL}`,
+        }
+      )
+      setMaxScore(response.sum_point)
+   }, [])
+
+   return (
+     <div className={'result _container'}>
+        {
+           !result ? <h1 style={{display: "block"}}>Ожидайте результата...</h1> :
+
+             <div className="result__body">
+                <div className="result__text">Благодарим за прохождение теста</div>
+                <div className="result__text">Ваш Результат: <span
+                  className="result__score">{result.score}</span> из {maxScore} </div>
+             </div>
+        }
+     </div>
+   );
+};
+

src/components/features/quiz/Task.js

@@ -29,8 +29,6 @@ export const TaskQuiz = () => {
    const id = localStorage.getItem('id');
    const [questions, setQuestions] = useState([])
 
-   console.log("render task");
-
    useEffect(async () => {
       const response = await fetchGet({
            link: `${process.env.REACT_APP_API_URL}/api/question/get-questions?uuid=${dataTest.uuid}`,
@@ -50,12 +48,12 @@ export const TaskQuiz = () => {
       if (checkedValues.length || inputValue) {
          switch (questions[index].question_type_id) {
             case '3':
-               // await dispatch(fetchUserAnswersMany(checkedValues))
+               await dispatch(fetchUserAnswersMany(checkedValues))
                break;
             case '2':
             case '1':
             case '4':
-               //   await dispatch(fetchUserAnswerOne(checkedValues))
+               await dispatch(fetchUserAnswerOne(checkedValues))
                break;
             default:
                break;
@@ -70,7 +68,7 @@ export const TaskQuiz = () => {
             setInputValue('')
          } else {
             history.push(`/quiz-result`)
-            // alert("Тест пройден!")
+            alert("Тест пройден!")
          }
 
       } else {
@@ -133,7 +131,6 @@ export const TaskQuiz = () => {
                                answer={answer}
                              />
                            ))
-
                       }
                       <div className="form-task__buttons">
                          {questions.length !== index + 1 &&