Moving all images to assets
This commit is contained in:
MaxOvs19
@ -1,14 +1,16 @@
|
||||
import React from 'react'
|
||||
import medium_male from "../../../images/medium_male.png"
|
||||
import React from "react";
|
||||
|
||||
import medium_male from "../../../assets/images/medium_male.png";
|
||||
|
||||
export const HeadBottom = () => {
|
||||
return (
|
||||
<div className="bottom-head">
|
||||
<div className="bottom-head__container">
|
||||
<div className="bottom-head__title">Мои тесты</div>
|
||||
<div className="bottom-head__img"><img src={medium_male} alt="" /></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
)
|
||||
}
|
||||
<div className="bottom-head">
|
||||
<div className="bottom-head__container">
|
||||
<div className="bottom-head__title">Мои тесты</div>
|
||||
<div className="bottom-head__img">
|
||||
<img src={medium_male} alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@ -1,21 +1,33 @@
|
||||
import React from 'react'
|
||||
import suucessIcon from '../../../images/quiz/success.png'
|
||||
import React from "react";
|
||||
|
||||
import suucessIcon from "../../../assets/images/quiz/success.png";
|
||||
|
||||
export const AlertResult = () => {
|
||||
const successTest = false;
|
||||
|
||||
const successTest = false
|
||||
|
||||
return (
|
||||
<div className='alert-result'>
|
||||
<div className="alert-result__column">
|
||||
<img src={suucessIcon} alt="suucessIcon" className="alert-result__icon" />
|
||||
<div className='alert-result__text' style={{color: successTest ? '#52B709' : '#5B6871'}}>
|
||||
Благодарим Вас за прохождение теста "Junior разработчик". Ваши результаты проверены, готовы пригласить Вас в команду
|
||||
</div>
|
||||
</div>
|
||||
{!successTest && <div className="alert-result__column">
|
||||
<button className="alert-result__button quiz-btn">Запросить еще попытку</button>
|
||||
</div>}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
return (
|
||||
<div className="alert-result">
|
||||
<div className="alert-result__column">
|
||||
<img
|
||||
src={suucessIcon}
|
||||
alt="suucessIcon"
|
||||
className="alert-result__icon"
|
||||
/>
|
||||
<div
|
||||
className="alert-result__text"
|
||||
style={{ color: successTest ? "#52B709" : "#5B6871" }}
|
||||
>
|
||||
Благодарим Вас за прохождение теста "Junior разработчик". Ваши
|
||||
результаты проверены, готовы пригласить Вас в команду
|
||||
</div>
|
||||
</div>
|
||||
{!successTest && (
|
||||
<div className="alert-result__column">
|
||||
<button className="alert-result__button quiz-btn">
|
||||
Запросить еще попытку
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@ -1,24 +1,31 @@
|
||||
import React from 'react'
|
||||
import compltedImage from "../../../images/quiz/compltedImage.png"
|
||||
import { Link } from 'react-router-dom'
|
||||
import React from "react";
|
||||
import { Link } from "react-router-dom";
|
||||
|
||||
import compltedImage from "../../../assets/images/quiz/compltedImage.png";
|
||||
|
||||
export const BlockCompletedTest = () => {
|
||||
const id = localStorage.getItem('id')
|
||||
return (
|
||||
<div className='block-completed-test'>
|
||||
<div className="block-completed-test__container">
|
||||
<div className="block-completed-test__img">
|
||||
<img src={compltedImage} alt="" />
|
||||
</div>
|
||||
<div className="block-completed-test__title">
|
||||
Спасибо! <br />
|
||||
Ваши ответы получены
|
||||
</div>
|
||||
<div className="block-completed-test__text">
|
||||
В течении дня в вашем кабинете будет отображены данные о прохождении тестирования
|
||||
</div>
|
||||
<Link to={'/profile-candidate/' + id} className="block-completed-test__button quiz-btn">В кабинет</Link>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
const id = localStorage.getItem("id");
|
||||
return (
|
||||
<div className="block-completed-test">
|
||||
<div className="block-completed-test__container">
|
||||
<div className="block-completed-test__img">
|
||||
<img src={compltedImage} alt="" />
|
||||
</div>
|
||||
<div className="block-completed-test__title">
|
||||
Спасибо! <br />
|
||||
Ваши ответы получены
|
||||
</div>
|
||||
<div className="block-completed-test__text">
|
||||
В течении дня в вашем кабинете будет отображены данные о прохождении
|
||||
тестирования
|
||||
</div>
|
||||
<Link
|
||||
to={"/profile-candidate/" + id}
|
||||
className="block-completed-test__button quiz-btn"
|
||||
>
|
||||
В кабинет
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@ -1,19 +1,19 @@
|
||||
import React from 'react'
|
||||
import questionIcon from "../../../images/question.png"
|
||||
import './quiz.scss'
|
||||
import React from "react";
|
||||
|
||||
import questionIcon from "../../../assets/images/question.png";
|
||||
|
||||
import "./quiz.scss";
|
||||
|
||||
export const CardIntroduction = ({ title, description }) => {
|
||||
return (
|
||||
<div className="card-introduction">
|
||||
<div className="card-introduction__title">{title}</div>
|
||||
<div className="card-introduction__body">
|
||||
<div className="card-introduction__icon">
|
||||
<img src={questionIcon} alt="" />
|
||||
</div>
|
||||
<div className="card-introduction__text">
|
||||
{description}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
return (
|
||||
<div className="card-introduction">
|
||||
<div className="card-introduction__title">{title}</div>
|
||||
<div className="card-introduction__body">
|
||||
<div className="card-introduction__icon">
|
||||
<img src={questionIcon} alt="" />
|
||||
</div>
|
||||
<div className="card-introduction__text">{description}</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
import React from "react";
|
||||
import { Link } from "react-router-dom";
|
||||
|
||||
import rightArrow from "../../../images/arrowRight.svg";
|
||||
import rightArrow from "../../../assets/icons/arrows/arrowRight.svg";
|
||||
import StarRating from "../../StarRating/StarRating";
|
||||
|
||||
export const CardAvailableTest = ({ title, description, path, passedTest }) => {
|
||||
|
||||
@ -1,38 +1,49 @@
|
||||
import React, { useEffect } from 'react';
|
||||
import { useSelector } from 'react-redux';
|
||||
import { selectedAnswersSelector, selectedTest } from '../../../redux/quizSlice';
|
||||
import React from "react";
|
||||
import { useSelector } from "react-redux";
|
||||
import { selectedTest } from "../../../redux/quizSlice";
|
||||
|
||||
export const GetOptionTask = ({ type, answer, handleChange, inputValue}) => {
|
||||
export const GetOptionTask = ({ type, answer, handleChange, inputValue }) => {
|
||||
const id = localStorage.getItem("id");
|
||||
const dataTest = useSelector(selectedTest);
|
||||
|
||||
const id = localStorage.getItem('id');
|
||||
const dataTest = useSelector(selectedTest);
|
||||
switch (type) {
|
||||
case "1":
|
||||
return (
|
||||
<div className="form-task__group">
|
||||
<textarea
|
||||
className="form-task__field"
|
||||
value={inputValue}
|
||||
onChange={handleChange}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
case "3":
|
||||
return (
|
||||
<div className="form-task__group" key={answer.id}>
|
||||
<input
|
||||
className="form-task__check"
|
||||
type="checkbox"
|
||||
value={answer.answer_body}
|
||||
id={answer.id}
|
||||
onChange={handleChange}
|
||||
/>
|
||||
<label htmlFor={answer.id}>{answer.answer_body}</label>
|
||||
</div>
|
||||
);
|
||||
|
||||
|
||||
switch (type) {
|
||||
case "1":
|
||||
return (
|
||||
<div className="form-task__group">
|
||||
<textarea className='form-task__field' value={inputValue}
|
||||
onChange={handleChange} />
|
||||
</div>
|
||||
)
|
||||
case "3":
|
||||
return (
|
||||
<div className="form-task__group" key={answer.id}>
|
||||
<input className='form-task__check' type="checkbox"
|
||||
value={answer.answer_body} id={answer.id}
|
||||
onChange={handleChange} />
|
||||
<label htmlFor={answer.id}>{answer.answer_body}</label>
|
||||
</div>
|
||||
)
|
||||
|
||||
default:
|
||||
return (
|
||||
<div className="form-task__group" key={answer.id}>
|
||||
<input className='form-task__check' type="radio" value={answer.answer_body} name={'radio'} id={answer.id}
|
||||
onChange={handleChange} />
|
||||
<label htmlFor={answer.id}>{answer.answer_body}</label>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
default:
|
||||
return (
|
||||
<div className="form-task__group" key={answer.id}>
|
||||
<input
|
||||
className="form-task__check"
|
||||
type="radio"
|
||||
value={answer.answer_body}
|
||||
name={"radio"}
|
||||
id={answer.id}
|
||||
onChange={handleChange}
|
||||
/>
|
||||
<label htmlFor={answer.id}>{answer.answer_body}</label>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
@ -1,31 +1,43 @@
|
||||
import {Link} from 'react-router-dom'
|
||||
import './quiz.scss'
|
||||
import {useSelector} from "react-redux";
|
||||
import {selectedTest, selectUserInfo} from "../../../redux/quizSlice";
|
||||
import {urlForLocal} from "../../../helper";
|
||||
import { Link } from "react-router-dom";
|
||||
import { useSelector } from "react-redux";
|
||||
|
||||
import { selectedTest, selectUserInfo } from "../../../redux/quizSlice";
|
||||
import { urlForLocal } from "../../../helper";
|
||||
|
||||
export const HeaderPageTestsQuiz = ({isVisibilityButton}) => {
|
||||
import "./quiz.scss";
|
||||
|
||||
const test = useSelector(selectedTest);
|
||||
const userInfo = useSelector(selectUserInfo);
|
||||
export const HeaderPageTestsQuiz = ({ isVisibilityButton }) => {
|
||||
const test = useSelector(selectedTest);
|
||||
const userInfo = useSelector(selectUserInfo);
|
||||
|
||||
return (
|
||||
<div className="header-quiz">
|
||||
<div className="header-quiz__container">
|
||||
<div className="header-quiz__body">
|
||||
<div className="header-quiz__avatar">
|
||||
{userInfo.photo && <img src={urlForLocal(userInfo.photo)} alt={userInfo.photo}/>}
|
||||
</div>
|
||||
<div className="header-quiz__description">
|
||||
<div className="header-quiz__title-test title">{test.questionnaire_title}</div>
|
||||
<div className="header-quiz__subtitle subtitle">Тест на основе выступление
|
||||
"{test.questionnaire_title}" {userInfo.fio}</div>
|
||||
</div>
|
||||
</div>
|
||||
{isVisibilityButton &&
|
||||
<Link to={'/quiz/instruction'} className='quiz-btn quiz-btn_restriction'>Пройти</Link>}
|
||||
return (
|
||||
<div className="header-quiz">
|
||||
<div className="header-quiz__container">
|
||||
<div className="header-quiz__body">
|
||||
<div className="header-quiz__avatar">
|
||||
{userInfo.photo && (
|
||||
<img src={urlForLocal(userInfo.photo)} alt={userInfo.photo} />
|
||||
)}
|
||||
</div>
|
||||
<div className="header-quiz__description">
|
||||
<div className="header-quiz__title-test title">
|
||||
{test.questionnaire_title}
|
||||
</div>
|
||||
<div className="header-quiz__subtitle subtitle">
|
||||
Тест на основе выступление "{test.questionnaire_title}"{" "}
|
||||
{userInfo.fio}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
};
|
||||
{isVisibilityButton && (
|
||||
<Link
|
||||
to={"/quiz/instruction"}
|
||||
className="quiz-btn quiz-btn_restriction"
|
||||
>
|
||||
Пройти
|
||||
</Link>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@ -1,19 +1,19 @@
|
||||
import React, {useEffect} from 'react'
|
||||
import {useDispatch, useSelector} from 'react-redux'
|
||||
import {selectUserInfo, setQuestionnairesList, setUserInfo} from "../../../redux/quizSlice";
|
||||
import {apiRequest} from "../../../api/request";
|
||||
import {urlForLocal} from "../../../helper";
|
||||
import './quiz.scss'
|
||||
import React, { useEffect } from "react";
|
||||
import { useDispatch, useSelector } from "react-redux";
|
||||
|
||||
export const HeaderQuiz = ({header}) => {
|
||||
import { selectUserInfo, setUserInfo } from "../../../redux/quizSlice";
|
||||
import { apiRequest } from "../../../api/request";
|
||||
import { urlForLocal } from "../../../helper";
|
||||
|
||||
import "./quiz.scss";
|
||||
|
||||
export const HeaderQuiz = ({ header }) => {
|
||||
const dispatch = useDispatch();
|
||||
const userId = localStorage.getItem('id');
|
||||
const userId = localStorage.getItem("id");
|
||||
const userInfo = useSelector(selectUserInfo);
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
dispatch(setUserInfo(userId))
|
||||
dispatch(setUserInfo(userId));
|
||||
}, [userId, dispatch]);
|
||||
|
||||
useEffect(() => {
|
||||
@ -22,25 +22,38 @@ export const HeaderQuiz = ({header}) => {
|
||||
}, [userId, dispatch]);
|
||||
|
||||
return (
|
||||
<div>
|
||||
{userInfo?.status === 500 ? <div className="error-msg">{userInfo.message}</div> :
|
||||
<div className="header-quiz">
|
||||
<div className="header-quiz__container">
|
||||
{!userInfo ? <h2>Loading...</h2> :
|
||||
<>
|
||||
{header && <h2 className={'header-quiz__title-main'}>Добрый день, {userInfo.fio}</h2>}
|
||||
<div className="header-quiz__body header-quiz__body_interjacent">
|
||||
<div className="header-quiz__avatar">
|
||||
<img src={urlForLocal(userInfo.photo)} alt={userInfo.photo}/>
|
||||
</div>
|
||||
<div className="header-quiz__name-user">{userInfo.fio}</div>
|
||||
<div className="header-quiz__title">{userInfo.position_name}</div>
|
||||
</div>
|
||||
</>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
)
|
||||
<div>
|
||||
{userInfo?.status === 500 ? (
|
||||
<div className="error-msg">{userInfo.message}</div>
|
||||
) : (
|
||||
<div className="header-quiz">
|
||||
<div className="header-quiz__container">
|
||||
{!userInfo ? (
|
||||
<h2>Loading...</h2>
|
||||
) : (
|
||||
<>
|
||||
{header && (
|
||||
<h2 className={"header-quiz__title-main"}>
|
||||
Добрый день, {userInfo.fio}
|
||||
</h2>
|
||||
)}
|
||||
<div className="header-quiz__body header-quiz__body_interjacent">
|
||||
<div className="header-quiz__avatar">
|
||||
<img
|
||||
src={urlForLocal(userInfo.photo)}
|
||||
alt={userInfo.photo}
|
||||
/>
|
||||
</div>
|
||||
<div className="header-quiz__name-user">{userInfo.fio}</div>
|
||||
<div className="header-quiz__title">
|
||||
{userInfo.position_name}
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@ -1,53 +1,57 @@
|
||||
import {Link} from 'react-router-dom'
|
||||
import comment from './../../../images/comment.jpg'
|
||||
import './quiz.scss'
|
||||
import {useEffect, useState} from "react";
|
||||
import {useSelector} from "react-redux";
|
||||
import {selectedTest} from "../../../redux/quizSlice";
|
||||
import { Link } from "react-router-dom";
|
||||
import { apiRequest } from "../../../api/request";
|
||||
|
||||
import {apiRequest} from "../../../api/request";
|
||||
import { useEffect, useState } from "react";
|
||||
import { useSelector } from "react-redux";
|
||||
import { selectedTest } from "../../../redux/quizSlice";
|
||||
|
||||
import comment from "./../../../assets/icons/comment.jpg";
|
||||
|
||||
import "./quiz.scss";
|
||||
|
||||
export const Instruction = () => {
|
||||
const [countQuestions, setCountQuestions] = useState(null);
|
||||
const test = useSelector(selectedTest);
|
||||
|
||||
const [countQuestions, setCountQuestions] = useState(null);
|
||||
const test = useSelector(selectedTest);
|
||||
useEffect(() => {
|
||||
apiRequest("/user-questionnaire/get-question-number", {
|
||||
params: { user_questionnaire_uuid: test.uuid },
|
||||
}).then((res) => setCountQuestions(res.question_number));
|
||||
}, []);
|
||||
|
||||
|
||||
useEffect( () => {
|
||||
|
||||
apiRequest('/user-questionnaire/get-question-number', {
|
||||
params: {user_questionnaire_uuid: test.uuid},
|
||||
}
|
||||
).then((res)=> setCountQuestions(res.question_number))
|
||||
|
||||
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div className="instruction">
|
||||
<div className="instruction__container">
|
||||
{!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>
|
||||
)
|
||||
return (
|
||||
<div className="instruction">
|
||||
<div className="instruction__container">
|
||||
{!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>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
@ -1,74 +1,98 @@
|
||||
import {Link} from 'react-router-dom'
|
||||
import calendarImage from './../../../images/calendar.svg'
|
||||
import {useDispatch} from "react-redux";
|
||||
import {setSelectedTest} from "../../../redux/quizSlice";
|
||||
import {urlForLocal} from "../../../helper";
|
||||
import './quiz.scss'
|
||||
import { Link } from "react-router-dom";
|
||||
import { useDispatch } from "react-redux";
|
||||
|
||||
export const MyTestsQuiz = ({listTests}) => {
|
||||
import { setSelectedTest } from "../../../redux/quizSlice";
|
||||
import { urlForLocal } from "../../../helper";
|
||||
|
||||
import calendarImage from "./../../../assets/icons/calendar.svg";
|
||||
|
||||
import "./quiz.scss";
|
||||
|
||||
export const MyTestsQuiz = ({ listTests }) => {
|
||||
const formationEndingOfScore = (score) => {
|
||||
const lastNumber = score % 10;
|
||||
if(score === 11 ||score === 12 ||score === 13 ||score === 14 ){
|
||||
return 'баллов'
|
||||
}else if(lastNumber === 2 || lastNumber === 3 || lastNumber === 4 ){
|
||||
return 'балла'
|
||||
}else if(lastNumber === 1){
|
||||
return 'балл'
|
||||
}else{
|
||||
return 'баллов'
|
||||
}
|
||||
const lastNumber = score % 10;
|
||||
if (score === 11 || score === 12 || score === 13 || score === 14) {
|
||||
return "баллов";
|
||||
} else if (lastNumber === 2 || lastNumber === 3 || lastNumber === 4) {
|
||||
return "балла";
|
||||
} else if (lastNumber === 1) {
|
||||
return "балл";
|
||||
} else {
|
||||
return "баллов";
|
||||
}
|
||||
};
|
||||
|
||||
const dispatch = useDispatch();
|
||||
const recordSelectedTest = (item) => dispatch(setSelectedTest(item));
|
||||
const dispatch = useDispatch();
|
||||
const recordSelectedTest = (item) => dispatch(setSelectedTest(item));
|
||||
|
||||
return (
|
||||
<div className="my-tests">
|
||||
<div className="my-tests__container">
|
||||
<div className="my-tests__title">Мои тесты</div>
|
||||
<div className="my-tests__items">
|
||||
{listTests.map(item => {
|
||||
switch (item.status) {
|
||||
case 1:
|
||||
return <article className="my-tests__item item-test" key={item.questionnaire_title}>
|
||||
<h3 className="item-test__name-test">
|
||||
{item.questionnaire_title}
|
||||
</h3>
|
||||
<div className="item-test__body test-data">
|
||||
<Link to={'/quiz/interjacent'} className='quiz-btn'
|
||||
onClick={() => recordSelectedTest(item)}>Пройти</Link>
|
||||
</div>
|
||||
</article>;
|
||||
case 2:
|
||||
return <article className="my-tests__item item-test" key={item.questionnaire_title}>
|
||||
<h3 className="item-test__name-test">
|
||||
{item.questionnaire_title}
|
||||
</h3>
|
||||
<div className="item-test__body test-data">
|
||||
<div className="test-data__calendar ">
|
||||
<img src={urlForLocal(calendarImage)} alt=""/>
|
||||
{item.testing_date}
|
||||
</div>
|
||||
<div className="test-data__hr"></div>
|
||||
<div className="test-data__score quiz-text">{item.score} {formationEndingOfScore(item.score)}</div>
|
||||
</div>
|
||||
</article>;
|
||||
case 3:
|
||||
return <article className="my-tests__item item-test" key={item.questionnaire_title}>
|
||||
<h3 className="item-test__name-test">
|
||||
{item.questionnaire_title}
|
||||
</h3>
|
||||
<div className="item-test__body test-data">
|
||||
<div className='quiz-btn'>На проверке</div>
|
||||
</div>
|
||||
</article>;
|
||||
default:
|
||||
break
|
||||
}
|
||||
})}
|
||||
</div>
|
||||
return (
|
||||
<div className="my-tests">
|
||||
<div className="my-tests__container">
|
||||
<div className="my-tests__title">Мои тесты</div>
|
||||
<div className="my-tests__items">
|
||||
{listTests.map((item) => {
|
||||
switch (item.status) {
|
||||
case 1:
|
||||
return (
|
||||
<article
|
||||
className="my-tests__item item-test"
|
||||
key={item.questionnaire_title}
|
||||
>
|
||||
<h3 className="item-test__name-test">
|
||||
{item.questionnaire_title}
|
||||
</h3>
|
||||
<div className="item-test__body test-data">
|
||||
<Link
|
||||
to={"/quiz/interjacent"}
|
||||
className="quiz-btn"
|
||||
onClick={() => recordSelectedTest(item)}
|
||||
>
|
||||
Пройти
|
||||
</Link>
|
||||
</div>
|
||||
</article>
|
||||
);
|
||||
case 2:
|
||||
return (
|
||||
<article
|
||||
className="my-tests__item item-test"
|
||||
key={item.questionnaire_title}
|
||||
>
|
||||
<h3 className="item-test__name-test">
|
||||
{item.questionnaire_title}
|
||||
</h3>
|
||||
<div className="item-test__body test-data">
|
||||
<div className="test-data__calendar ">
|
||||
<img src={urlForLocal(calendarImage)} alt="" />
|
||||
{item.testing_date}
|
||||
</div>
|
||||
<div className="test-data__hr"></div>
|
||||
<div className="test-data__score quiz-text">
|
||||
{item.score} {formationEndingOfScore(item.score)}
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
);
|
||||
case 3:
|
||||
return (
|
||||
<article
|
||||
className="my-tests__item item-test"
|
||||
key={item.questionnaire_title}
|
||||
>
|
||||
<h3 className="item-test__name-test">
|
||||
{item.questionnaire_title}
|
||||
</h3>
|
||||
<div className="item-test__body test-data">
|
||||
<div className="quiz-btn">На проверке</div>
|
||||
</div>
|
||||
</article>
|
||||
);
|
||||
default:
|
||||
break;
|
||||
}
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
};
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@ -1,17 +1,16 @@
|
||||
import React from 'react'
|
||||
import './quiz.scss'
|
||||
import React from "react";
|
||||
|
||||
export const Progressbar = ({indexQuestion, width}) => {
|
||||
return (
|
||||
<div className="progressbar">
|
||||
<div className="progressbar__body">
|
||||
<div className="progressbar__value">
|
||||
{indexQuestion}
|
||||
</div>
|
||||
<div className="progressbar__strip" >
|
||||
<div style={{width: width+'%'}}></div>
|
||||
</div>
|
||||
</div>
|
||||
import "./quiz.scss";
|
||||
|
||||
export const Progressbar = ({ indexQuestion, width }) => {
|
||||
return (
|
||||
<div className="progressbar">
|
||||
<div className="progressbar__body">
|
||||
<div className="progressbar__value">{indexQuestion}</div>
|
||||
<div className="progressbar__strip">
|
||||
<div style={{ width: width + "%" }}></div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
};
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@ -1,80 +1,91 @@
|
||||
import React, { useEffect, useState } from 'react'
|
||||
import timer from '../../../images/quiz/timer.png'
|
||||
import accempt from '../../../images/quiz/accempt.png'
|
||||
import { useTimer } from 'react-timer-hook';
|
||||
import StarRating from '../../StarRating/StarRating';
|
||||
import { useSelector } from 'react-redux';
|
||||
import { completedTestSelector } from '../../../redux/quizSlice';
|
||||
import React, { useEffect } from "react";
|
||||
import { useSelector } from "react-redux";
|
||||
import { useTimer } from "react-timer-hook";
|
||||
|
||||
import StarRating from "../../StarRating/StarRating";
|
||||
import { completedTestSelector } from "../../../redux/quizSlice";
|
||||
|
||||
import timer from "../../../assets/images/quiz/timer.png";
|
||||
import accempt from "../../../assets/images/quiz/accempt.png";
|
||||
|
||||
export const QuizPassingInformation = ({ expiryTimestamp, setStartTest }) => {
|
||||
const {
|
||||
seconds,
|
||||
minutes,
|
||||
isRunning,
|
||||
start,
|
||||
pause,
|
||||
resume,
|
||||
restart
|
||||
} = useTimer({
|
||||
expiryTimestamp, autoStart: false, onExpire: () => {
|
||||
console.warn('onExpire called')
|
||||
}
|
||||
});
|
||||
const completedTest = useSelector(completedTestSelector)
|
||||
const { seconds, minutes, isRunning, start, pause, resume, restart } =
|
||||
useTimer({
|
||||
expiryTimestamp,
|
||||
autoStart: false,
|
||||
onExpire: () => {
|
||||
console.warn("onExpire called");
|
||||
},
|
||||
});
|
||||
const completedTest = useSelector(completedTestSelector);
|
||||
|
||||
const startTesting = () => {
|
||||
setStartTest(true);
|
||||
start();
|
||||
};
|
||||
|
||||
const startTesting = () => {
|
||||
setStartTest(true)
|
||||
start()
|
||||
}
|
||||
useEffect(() => {
|
||||
if (completedTest) {
|
||||
const time = new Date();
|
||||
time.setSeconds(time.getSeconds() + 0); //600 - кол-во секунд для прохождения теста
|
||||
restart(time, false);
|
||||
}
|
||||
}, [completedTest]);
|
||||
|
||||
useEffect(() => {
|
||||
if (completedTest) {
|
||||
const time = new Date();
|
||||
time.setSeconds(time.getSeconds() + 0);//600 - кол-во секунд для прохождения теста
|
||||
restart(time, false)
|
||||
}
|
||||
}, [completedTest])
|
||||
return (
|
||||
<div className="quiz-passing-information">
|
||||
<div className="quiz-passing-information__container">
|
||||
<div className="quiz-passing-information__main">
|
||||
<div className="quiz-passing-information__specialization">
|
||||
<StarRating
|
||||
color={"#52B709"}
|
||||
countStars={1}
|
||||
countActiveStars={0.5}
|
||||
size={61}
|
||||
/>
|
||||
<div className="quiz-passing-information__specialization-title">
|
||||
Junior <br />
|
||||
разработчик
|
||||
</div>
|
||||
</div>
|
||||
<div className="quiz-passing-information__timer timer-quiz">
|
||||
<div className="quiz-passing-information__icon">
|
||||
<img src={timer} alt="" />
|
||||
</div>
|
||||
<div className="quiz-passing-information__text">
|
||||
{completedTest ? "Время вышло" : "Время на прохождение теста:"}{" "}
|
||||
<br />
|
||||
<span>
|
||||
{minutes.toString().padStart(2, "0") +
|
||||
":" +
|
||||
seconds.toString().padStart(2, "0")}{" "}
|
||||
секунд
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="quiz-passing-information__attempt">
|
||||
<div className="quiz-passing-information__icon">
|
||||
<img src={accempt} alt="" />
|
||||
</div>
|
||||
<div className="quiz-passing-information__text">
|
||||
Попыток прохождения: <br />
|
||||
<span>1 попытка</span>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
{!completedTest && !isRunning && (
|
||||
<button
|
||||
className="quiz-passing-information__button btn-green"
|
||||
onClick={startTesting}
|
||||
>
|
||||
Начать
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
return (
|
||||
<div className='quiz-passing-information'>
|
||||
<div className="quiz-passing-information__container">
|
||||
<div className="quiz-passing-information__main">
|
||||
<div className="quiz-passing-information__specialization">
|
||||
<StarRating color={'#52B709'} countStars={1} countActiveStars={0.5} size={61} />
|
||||
<div className='quiz-passing-information__specialization-title'>
|
||||
Junior <br />
|
||||
разработчик
|
||||
</div>
|
||||
</div>
|
||||
<div className="quiz-passing-information__timer timer-quiz">
|
||||
<div className="quiz-passing-information__icon">
|
||||
<img src={timer} alt="" />
|
||||
</div>
|
||||
<div className="quiz-passing-information__text">
|
||||
{completedTest ? 'Время вышло' : 'Время на прохождение теста:'} <br />
|
||||
<span>{minutes.toString().padStart(2, '0') + ':' + seconds.toString().padStart(2, '0')} секунд</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="quiz-passing-information__attempt">
|
||||
<div className="quiz-passing-information__icon">
|
||||
<img src={accempt} alt="" />
|
||||
</div>
|
||||
<div className="quiz-passing-information__text">
|
||||
Попыток прохождения: <br />
|
||||
<span>1 попытка</span>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
{(!completedTest && !isRunning) && <button className="quiz-passing-information__button btn-green" onClick={startTesting}>Начать</button>}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
{/* {isRunning && <button className="quiz-passing-information__button quiz-btn" onClick={pause}>Завершить</button>} */}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
{/* {isRunning && <button className="quiz-passing-information__button quiz-btn" onClick={pause}>Завершить</button>} */}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@ -1,27 +1,35 @@
|
||||
import React from 'react'
|
||||
import StarRating from '../../StarRating/StarRating'
|
||||
import React from "react";
|
||||
|
||||
import StarRating from "../../StarRating/StarRating";
|
||||
|
||||
export const QuizReport = () => {
|
||||
return (
|
||||
<div className='report'>
|
||||
<div className="report__row">
|
||||
<div className="report__column">
|
||||
<StarRating color={'#52B709'} countStars={1} countActiveStars={0.5} size={61} />
|
||||
<div className="report__job-title">Junior <br /> разработчик</div>
|
||||
</div>
|
||||
<div className="report__column">
|
||||
<div className="report__value">22</div>
|
||||
<div className="report__text">Правильных ответов</div>
|
||||
</div>
|
||||
<div className="report__column">
|
||||
<div className="report__value report__value_false">02</div>
|
||||
<div className="report__text">Не правильных ответов</div>
|
||||
</div>
|
||||
<div className="report__column">
|
||||
<div className="report__status-text">Статус:</div>
|
||||
<div className="report__status">Пройдено!</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
<div className="report">
|
||||
<div className="report__row">
|
||||
<div className="report__column">
|
||||
<StarRating
|
||||
color={"#52B709"}
|
||||
countStars={1}
|
||||
countActiveStars={0.5}
|
||||
size={61}
|
||||
/>
|
||||
<div className="report__job-title">
|
||||
Junior <br /> разработчик
|
||||
</div>
|
||||
</div>
|
||||
<div className="report__column">
|
||||
<div className="report__value">22</div>
|
||||
<div className="report__text">Правильных ответов</div>
|
||||
</div>
|
||||
<div className="report__column">
|
||||
<div className="report__value report__value_false">02</div>
|
||||
<div className="report__text">Не правильных ответов</div>
|
||||
</div>
|
||||
<div className="report__column">
|
||||
<div className="report__status-text">Статус:</div>
|
||||
<div className="report__status">Пройдено!</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@ -1,34 +1,39 @@
|
||||
import React, {useEffect, useState} from 'react';
|
||||
import {useDispatch, useSelector} from "react-redux";
|
||||
import {fetchResultTest, selectedTest, selectResult} from "../../../redux/quizSlice";
|
||||
import {apiRequest} from "../../../api/request";
|
||||
import React, { useEffect, useState } from "react";
|
||||
import { useDispatch, useSelector } from "react-redux";
|
||||
|
||||
import {
|
||||
fetchResultTest,
|
||||
selectedTest,
|
||||
selectResult,
|
||||
} from "../../../redux/quizSlice";
|
||||
import { apiRequest } from "../../../api/request";
|
||||
|
||||
export const Results = () => {
|
||||
const result = useSelector(selectResult);
|
||||
const test = useSelector(selectedTest);
|
||||
const [maxScore, setMaxScore] = useState('');
|
||||
const [maxScore, setMaxScore] = useState("");
|
||||
const dispatch = useDispatch();
|
||||
|
||||
useEffect(() => {
|
||||
dispatch(fetchResultTest(test.uuid));
|
||||
apiRequest(`/user-questionnaire/get-points-number?user_questionnaire_uuid=${test.uuid}`)
|
||||
.then((res) => setMaxScore(res.sum_point));
|
||||
|
||||
apiRequest(
|
||||
`/user-questionnaire/get-points-number?user_questionnaire_uuid=${test.uuid}`
|
||||
).then((res) => setMaxScore(res.sum_point));
|
||||
}, [apiRequest, dispatch, test]);
|
||||
|
||||
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>
|
||||
<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>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
@ -1,20 +1,29 @@
|
||||
import React from 'react'
|
||||
import iconSpecialization from "../../../images/icon-specialization.png"
|
||||
import { Link } from 'react-router-dom'
|
||||
import React from "react";
|
||||
|
||||
export const SelectedCategory = ({setSelectedCategory}) => {
|
||||
import iconSpecialization from "../../../assets/images/partnerProfile/personalBackEnd.svg";
|
||||
|
||||
export const SelectedCategory = ({ setSelectedCategory }) => {
|
||||
return (
|
||||
<div className='selected-category'>
|
||||
<div className="selected-category__container">
|
||||
<div className="selected-category__title">Ваша выбранная <br /> категория</div>
|
||||
<div className="selected-category__category">
|
||||
<div className="selected-category__image">
|
||||
<img src={iconSpecialization} alt="" />
|
||||
</div>
|
||||
<div className="selected-category__title-category">Backend <br /> разработчики</div>
|
||||
</div>
|
||||
<button onClick={()=>setSelectedCategory(true)} className="selected-category__button">Заменить специализацию </button>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
<div className="selected-category">
|
||||
<div className="selected-category__container">
|
||||
<div className="selected-category__title">
|
||||
Ваша выбранная <br /> категория
|
||||
</div>
|
||||
<div className="selected-category__category">
|
||||
<div className="selected-category__image">
|
||||
<img src={iconSpecialization} alt="" />
|
||||
</div>
|
||||
<div className="selected-category__title-category">
|
||||
Backend <br /> разработчики
|
||||
</div>
|
||||
</div>
|
||||
<button
|
||||
onClick={() => setSelectedCategory(true)}
|
||||
className="selected-category__button"
|
||||
>
|
||||
Заменить специализацию{" "}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@ -1,141 +1,153 @@
|
||||
import React, { useEffect, useState } from 'react'
|
||||
import { useNavigate } from "react-router-dom"
|
||||
import { useSelector, useDispatch } from 'react-redux'
|
||||
import questionIcon from "../../../images/question.png"
|
||||
import { Progressbar } from './ProgressbarQuiz'
|
||||
import { GetOptionTask } from './GetOptionTask'
|
||||
import {
|
||||
fetchUserAnswersMany, fetchUserAnswerOne, fetchGetAnswers, answersSelector, selectedTest, questionsSelector, setAnswers, setCompleteTest
|
||||
} from './../../../redux/quizSlice'
|
||||
import React, { useEffect, useState } from "react";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
import { useSelector, useDispatch } from "react-redux";
|
||||
|
||||
import './quiz.scss'
|
||||
import { apiRequest } from "../../../api/request";
|
||||
import { HeaderQuiz } from './HeaderQuiz'
|
||||
import { HeaderQuiz } from "./HeaderQuiz";
|
||||
|
||||
import { Progressbar } from "./ProgressbarQuiz";
|
||||
import { GetOptionTask } from "./GetOptionTask";
|
||||
import {
|
||||
fetchUserAnswersMany,
|
||||
fetchUserAnswerOne,
|
||||
fetchGetAnswers,
|
||||
answersSelector,
|
||||
selectedTest,
|
||||
questionsSelector,
|
||||
setAnswers,
|
||||
setCompleteTest,
|
||||
} from "./../../../redux/quizSlice";
|
||||
|
||||
import questionIcon from "../../../assets/images/question.png";
|
||||
|
||||
import "./quiz.scss";
|
||||
|
||||
export const TaskQuiz = () => {
|
||||
|
||||
const navigate = useNavigate();
|
||||
const dispatch = useDispatch();
|
||||
|
||||
const answers = useSelector(answersSelector);
|
||||
const questions = useSelector(questionsSelector);
|
||||
|
||||
|
||||
const dataTest = useSelector(selectedTest);
|
||||
const [index, setIndex] = useState(0);
|
||||
const [checkedValues, setCheckedValues] = useState([]);
|
||||
//const [stripValue, setStripValue] = useState(0);
|
||||
const [inputValue, setInputValue] = useState('');
|
||||
const [inputValue, setInputValue] = useState("");
|
||||
|
||||
|
||||
|
||||
const id = localStorage.getItem('id');
|
||||
const id = localStorage.getItem("id");
|
||||
|
||||
useEffect(() => {
|
||||
// fetch('https://itguild.info/api/user-questionnaire/questionnaires-list?user_id=110').then(response => response.json())
|
||||
// .then(json => console.log(json))
|
||||
apiRequest(`/question/get-questions?uuid=${dataTest.uuid}`)
|
||||
.then((response) => {
|
||||
console.log(response)
|
||||
dispatch(fetchGetAnswers(response[0].id));
|
||||
setStripValue((+index + 1) * 100 / response.length)
|
||||
})
|
||||
apiRequest(`/question/get-questions?uuid=${dataTest.uuid}`).then(
|
||||
(response) => {
|
||||
console.log(response);
|
||||
dispatch(fetchGetAnswers(response[0].id));
|
||||
setStripValue(((+index + 1) * 100) / response.length);
|
||||
}
|
||||
);
|
||||
}, [dispatch]);
|
||||
|
||||
const nextQuestion = async (e) => {
|
||||
e.preventDefault();
|
||||
//Проверка на валидацию ответов
|
||||
if (!(checkedValues.length || inputValue)) {
|
||||
alert("Вы не ответили на вопрос")
|
||||
return
|
||||
alert("Вы не ответили на вопрос");
|
||||
return;
|
||||
}
|
||||
|
||||
//отправка ответов на сервер
|
||||
if (questions[index].question_type_id != 3) {
|
||||
//dispatch(fetchUserAnswerOne(checkedValues));
|
||||
} else {
|
||||
console.log(checkedValues);
|
||||
console.log(checkedValues);
|
||||
// dispatch(fetchUserAnswersMany(checkedValues));
|
||||
}
|
||||
|
||||
//Проверка на окончание теста
|
||||
if (!(index < questions.length - 1)) {
|
||||
dispatch(setCompleteTest())
|
||||
return
|
||||
dispatch(setCompleteTest());
|
||||
return;
|
||||
}
|
||||
|
||||
dispatch(fetchGetAnswers(questions[index + 1].id));
|
||||
setIndex(prev => prev + 1);
|
||||
setIndex((prev) => prev + 1);
|
||||
setCheckedValues([]);
|
||||
setInputValue('')
|
||||
setInputValue("");
|
||||
};
|
||||
|
||||
|
||||
const handleChange = (e) => {
|
||||
const checked = e.target.checked;
|
||||
|
||||
if (questions[index].question_type_id != 3) {
|
||||
setCheckedValues([{
|
||||
user_id: id,
|
||||
user_questionnaire_uuid: dataTest.uuid,
|
||||
question_id: questions[index].id,
|
||||
response_body: e.target.value
|
||||
}])
|
||||
return
|
||||
setCheckedValues([
|
||||
{
|
||||
user_id: id,
|
||||
user_questionnaire_uuid: dataTest.uuid,
|
||||
question_id: questions[index].id,
|
||||
response_body: e.target.value,
|
||||
},
|
||||
]);
|
||||
return;
|
||||
}
|
||||
|
||||
checked ? setCheckedValues(prev => [...prev, {
|
||||
user_id: id,
|
||||
user_questionnaire_uuid: dataTest.uuid,
|
||||
question_id: questions[index].id,
|
||||
response_body: e.target.value
|
||||
}]) :
|
||||
setCheckedValues(prev => [...prev.filter(item => item.response_body !== e.target.value)]);
|
||||
checked
|
||||
? setCheckedValues((prev) => [
|
||||
...prev,
|
||||
{
|
||||
user_id: id,
|
||||
user_questionnaire_uuid: dataTest.uuid,
|
||||
question_id: questions[index].id,
|
||||
response_body: e.target.value,
|
||||
},
|
||||
])
|
||||
: setCheckedValues((prev) => [
|
||||
...prev.filter((item) => item.response_body !== e.target.value),
|
||||
]);
|
||||
};
|
||||
|
||||
|
||||
console.log('render task');
|
||||
|
||||
console.log("render task");
|
||||
|
||||
return (
|
||||
<div className="task">
|
||||
{
|
||||
<div className="task__container">
|
||||
<div className='task__header'>
|
||||
<div className="task__header">
|
||||
<img src={questionIcon} alt="" />
|
||||
<h3 className="task__title quiz-title_h3">{questions[index].question_body}</h3>
|
||||
<h3 className="task__title quiz-title_h3">
|
||||
{questions[index].question_body}
|
||||
</h3>
|
||||
</div>
|
||||
|
||||
<div className="task__body">
|
||||
<form className='task__form form-task' onSubmit={nextQuestion}>
|
||||
{
|
||||
|
||||
answers.map((answer) => (
|
||||
<GetOptionTask
|
||||
key={answer.id}
|
||||
type={questions[index].question_type_id}
|
||||
handleChange={handleChange}
|
||||
answer={answer}
|
||||
/>
|
||||
))
|
||||
}
|
||||
<form className="task__form form-task" onSubmit={nextQuestion}>
|
||||
{answers.map((answer) => (
|
||||
<GetOptionTask
|
||||
key={answer.id}
|
||||
type={questions[index].question_type_id}
|
||||
handleChange={handleChange}
|
||||
answer={answer}
|
||||
/>
|
||||
))}
|
||||
<div className="form-task__buttons">
|
||||
{/* {
|
||||
index != 0 && <button type='submit' className='form-task__btn quiz-btn quiz-btn_back'
|
||||
onClick={prevQuestion}>Назад</button>
|
||||
} */}
|
||||
{
|
||||
index != questions.length && <button onClick={nextQuestion}
|
||||
className='form-task__btn quiz-btn'>Далее</button>
|
||||
}
|
||||
{index != questions.length && (
|
||||
<button
|
||||
onClick={nextQuestion}
|
||||
className="form-task__btn quiz-btn"
|
||||
>
|
||||
Далее
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
}
|
||||
</div>
|
||||
|
||||
)
|
||||
);
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user