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

Added prettier format imports

Browse Source
This commit is contained in:
MaxOvs19
2023-05-31 08:36:15 +03:00
parent fe656c0360
commit fc8fc33733
91 changed files with 1712 additions and 1509 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
src/components/features/Candidate-lk/HeadBottom.js
View File

@ -1,16 +1,16 @@
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>
);
};
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>
);
};

66
src/components/features/quiz/AlertResult.js
View File

@ -1,33 +1,33 @@
import React from "react";
import suucessIcon from "assets/images/quiz/success.png";
export const AlertResult = () => {
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>
);
};
import React from "react";
import suucessIcon from "assets/images/quiz/success.png";
export const AlertResult = () => {
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>
);
};

62
src/components/features/quiz/BlockCompletedTest.js
View File

@ -1,31 +1,31 @@
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>
);
};
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>
);
};

38
src/components/features/quiz/Card-introduction.js
View File

@ -1,19 +1,19 @@
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>
);
};
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>
);
};

78
src/components/features/quiz/CardAviableTest.js
View File

@ -1,39 +1,39 @@
import React from "react";
import { Link } from "react-router-dom";
import StarRating from "@components/StarRating/StarRating";
import rightArrow from "assets/icons/arrows/arrowRight.svg";
export const CardAvailableTest = ({ title, description, path, passedTest }) => {
return (
<div className="card-available-test">
<Link
to={`/${path}`}
className="card-available-test__container"
style={{
opacity: passedTest ? 0.3 : 1,
pointerEvents: passedTest ? "none" : "all",
}}
>
<div className="card-available-test__top-head">
<StarRating />
<h3 className="card-available-test__title">{title}</h3>
</div>
<div className="card-available-test__info">
<p dangerouslySetInnerHTML={{ __html: description }}></p>
<div className="card-available-test__infoLink">
<img src={rightArrow} alt="arrow" />
</div>
</div>
</Link>
{passedTest && (
<div className="card-available-test__finished">
<p>Получить отчет по тестированию</p>
<Link to={"/quiz/report"}>Отчет по тесту</Link>
</div>
)}
</div>
);
};
import React from "react";
import { Link } from "react-router-dom";
import StarRating from "@components/StarRating/StarRating";
import rightArrow from "assets/icons/arrows/arrowRight.svg";
export const CardAvailableTest = ({ title, description, path, passedTest }) => {
return (
<div className="card-available-test">
<Link
to={`/${path}`}
className="card-available-test__container"
style={{
opacity: passedTest ? 0.3 : 1,
pointerEvents: passedTest ? "none" : "all",
}}
>
<div className="card-available-test__top-head">
<StarRating />
<h3 className="card-available-test__title">{title}</h3>
</div>
<div className="card-available-test__info">
<p dangerouslySetInnerHTML={{ __html: description }}></p>
<div className="card-available-test__infoLink">
<img src={rightArrow} alt="arrow" />
</div>
</div>
</Link>
{passedTest && (
<div className="card-available-test__finished">
<p>Получить отчет по тестированию</p>
<Link to={"/quiz/report"}>Отчет по тесту</Link>
</div>
)}
</div>
);
};

5
src/components/features/quiz/HeaderPageTests.js
View File

@ -1,7 +1,8 @@
import { Link } from "react-router-dom";
import { useSelector } from "react-redux";
import { Link } from "react-router-dom";
import { selectUserInfo, selectedTest } from "@redux/quizSlice";
import { selectedTest, selectUserInfo } from "@redux/quizSlice";
import { urlForLocal } from "@utils/helper";
import "./quiz.scss";

4
src/components/features/quiz/HeaderQuiz.js
View File

@ -2,9 +2,11 @@ import React, { useEffect } from "react";
import { useDispatch, useSelector } from "react-redux";
import { selectUserInfo, setUserInfo } from "@redux/quizSlice";
import { apiRequest } from "@api/request";
import { urlForLocal } from "@utils/helper";
import { apiRequest } from "@api/request";
import "./quiz.scss";
export const HeaderQuiz = ({ header }) => {

5
src/components/features/quiz/Instructions.js
View File

@ -1,9 +1,10 @@
import { Link } from "react-router-dom";
import { useEffect, useState } from "react";
import { useSelector } from "react-redux";
import { Link } from "react-router-dom";
import { selectedTest } from "@redux/quizSlice";
import { apiRequest } from "@api/request";
import { selectedTest } from "@redux/quizSlice";
import comment from "assets/icons/comment.jpg";

3
src/components/features/quiz/MyTestsQuiz.js
View File

@ -1,7 +1,8 @@
import { Link } from "react-router-dom";
import { useDispatch } from "react-redux";
import { Link } from "react-router-dom";
import { setSelectedTest } from "@redux/quizSlice";
import { urlForLocal } from "@utils/helper";
import calendarImage from "assets/icons/calendar.svg";

183
src/components/features/quiz/Quiz-passing-information.js
View File

@ -1,91 +1,92 @@
import React, { useEffect } from "react";
import { useSelector } from "react-redux";
import { useTimer } from "react-timer-hook";
import StarRating from "@components/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 startTesting = () => {
setStartTest(true);
start();
};
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>
{/* {isRunning && <button className="quiz-passing-information__button quiz-btn" onClick={pause}>Завершить</button>} */}
</div>
</div>
);
};
import React, { useEffect } from "react";
import { useSelector } from "react-redux";
import { useTimer } from "react-timer-hook";
import { completedTestSelector } from "@redux/quizSlice";
import StarRating from "@components/StarRating/StarRating";
import accempt from "assets/images/quiz/accempt.png";
import timer from "assets/images/quiz/timer.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 startTesting = () => {
setStartTest(true);
start();
};
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>
{/* {isRunning && <button className="quiz-passing-information__button quiz-btn" onClick={pause}>Завершить</button>} */}
</div>
</div>
);
};

70
src/components/features/quiz/QuizReport.js
View File

@ -1,35 +1,35 @@
import React from "react";
import StarRating from "@components/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>
);
};
import React from "react";
import StarRating from "@components/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>
);
};

71
src/components/features/quiz/Results.js
View File

@ -1,35 +1,36 @@
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 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, 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>
);
};
import React, { useEffect, useState } from "react";
import { useDispatch, useSelector } from "react-redux";
import { fetchResultTest, selectResult, selectedTest } from "@redux/quizSlice";
import { apiRequest } from "@api/request";
export const Results = () => {
const result = useSelector(selectResult);
const test = useSelector(selectedTest);
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, 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>
);
};

58
src/components/features/quiz/SelectedCategory.js
View File

@ -1,29 +1,29 @@
import React from "react";
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>
);
};
import React from "react";
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>
);
};

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

@ -1,25 +1,25 @@
import React, { useEffect, useState } from "react";
import { useDispatch, useSelector } from "react-redux";
import { useNavigate } from "react-router-dom";
import { useSelector, useDispatch } from "react-redux";
import { apiRequest } from "@api/request";
import { HeaderQuiz } from "./HeaderQuiz";
import { Progressbar } from "./ProgressbarQuiz";
import { GetOptionTask } from "./GetOptionTask";
import {
fetchUserAnswersMany,
fetchUserAnswerOne,
fetchGetAnswers,
answersSelector,
selectedTest,
fetchGetAnswers,
fetchUserAnswerOne,
fetchUserAnswersMany,
questionsSelector,
selectedTest,
setAnswers,
setCompleteTest,
} from "@redux/quizSlice";
import { apiRequest } from "@api/request";
import questionIcon from "assets/images/question.png";
import { GetOptionTask } from "./GetOptionTask";
import { HeaderQuiz } from "./HeaderQuiz";
import { Progressbar } from "./ProgressbarQuiz";
import "./quiz.scss";
export const TaskQuiz = () => {