This commit is contained in:
2023-11-21 17:46:57 +03:00
parent ec7d0716b3
commit b0c9884fe4
9 changed files with 217 additions and 195 deletions

View File

@ -1,7 +1,11 @@
import moment from "moment";
import React, { useEffect, useState } from "react";
import { useSelector } from "react-redux";
import { Link, useNavigate, useParams } from "react-router-dom";
import { useTimer } from "react-timer-hook";
import { completedTestSelector } from "@redux/quizSlice";
import { Footer } from "@components/Common/Footer/Footer";
import { ProfileBreadcrumbs } from "@components/ProfileBreadcrumbs/ProfileBreadcrumbs";
import { ProfileHeader } from "@components/ProfileHeader/ProfileHeader";
@ -10,32 +14,29 @@ import { BlockCompletedTest } from "@components/features/quiz/BlockCompletedTest
import { CardIntroduction } from "@components/features/quiz/Card-introduction";
import { QuizPassingInformation } from "@components/features/quiz/Quiz-passing-information";
import { TaskQuiz } from "@components/features/quiz/Task";
import { useTimer } from "react-timer-hook";
import moment from "moment";
export const PassingTests = () => {
const [startTest, setStartTest] = useState(false);
const navigate = useNavigate()
const navigate = useNavigate();
const completedTest = useSelector(completedTestSelector);
const { uuid } = useParams()
const { uuid } = useParams();
const timer = useTimer({
expiryTimestamp: moment(),
autoStart: false,
onExpire: () => {
navigate("/quiz")
}
navigate("/quiz");
},
});
const onCloseWindow = (e) => {
e.preventDefault();
if(startTest){
let confirmationMessage = "\o/";
if (startTest) {
let confirmationMessage = "o/";
(e || window.e).returnValue = confirmationMessage;
return confirmationMessage;
}
}
};
const introduction = [
{
@ -56,21 +57,23 @@ export const PassingTests = () => {
];
function onSwitchTab(e) {
console.log(e,document.visibilityState);
console.log(e, document.visibilityState);
if (document.visibilityState === "hidden" && startTest) {
alert("Убедительная просьба не покидать страницу и не переключаться. Рассчитывайте только на свои знания и умения!!!")
alert(
"Убедительная просьба не покидать страницу и не переключаться. Рассчитывайте только на свои знания и умения!!!"
);
}
}
useEffect(()=>{
useEffect(() => {
window.addEventListener("beforeunload", onCloseWindow);
window.addEventListener("visibilitychange", onSwitchTab);
window.onblur = onSwitchTab
window.onblur = onSwitchTab;
return () => {
window.removeEventListener("beforeunload", onCloseWindow);
window.removeEventListener("visibilitychange", onSwitchTab);
}
}, [startTest])
};
}, [startTest]);
return (
<div className="passing-tests-page">
@ -103,7 +106,7 @@ export const PassingTests = () => {
</div>
)}
{startTest ? (
<TaskQuiz timer={timer}/>
<TaskQuiz timer={timer} />
) : (
<div className="passing-tests-page__introduction">
{introduction.map((item, i) => (
@ -141,5 +144,3 @@ export const PassingTests = () => {
</div>
);
};

View File

@ -27,7 +27,7 @@ import BackEndImg from "assets/images/partnerProfile/personalBackEnd.svg";
import "./quiz-page.scss";
export const QuizPage = () => {
const [questionnaires,setQuestionnaires] = useState([]);
const [questionnaires, setQuestionnaires] = useState([]);
const dispatch = useDispatch();
const [personalInfoItems] = useState([
{
@ -36,7 +36,7 @@ export const QuizPage = () => {
description:
"Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript",
available: true,
img: BackEndImg
img: BackEndImg,
},
{
title: "Frontend разработчики",
@ -44,14 +44,14 @@ export const QuizPage = () => {
description:
"Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript",
available: true,
img: FrontendImg
img: FrontendImg,
},
{
title: "Архитектура проектов",
link: "/registration-candidate",
description: "Потоки данных ER ERP CRM CQRS UML BPMN",
available: true,
img: ArchitectureImg
img: ArchitectureImg,
},
{
title: "Дизайн проектов",
@ -59,35 +59,35 @@ export const QuizPage = () => {
description:
"Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript",
available: true,
img: DesignImg
img: DesignImg,
},
{
title: "Тестирование проектов",
link: "/registration-candidate",
description: "SQL Postman TestRail Kibana Ручное тестирование",
available: false,
img: TestImg
img: TestImg,
},
{
title: "Администрирование проектов",
link: "/registration-candidate",
description: "DevOps ELK Kubernetes Docker Bash Apache Oracle Git",
available: false,
img: AdminImg
img: AdminImg,
},
{
title: "Управление проектом",
link: "/registration-candidate",
description: "Scrum Kanban Agile Miro CustDev",
available: false,
img: ManageImg
img: ManageImg,
},
{
title: "Копирайтинг проектов",
link: "/registration-candidate",
description: "Теги Заголовок H1 Дескриптор Абзац Сценарий",
available: false,
img: CopyImg
img: CopyImg,
},
{
title: "Реклама и SMM",
@ -95,18 +95,16 @@ export const QuizPage = () => {
description:
"Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript",
available: false,
img: SmmImg
}
img: SmmImg,
},
]);
const userId = localStorage.getItem("id");
const [selectedCategory, setSetSelectedCategory] = useState(false);
useEffect(() => {
apiRequest(
`/user-questionnaire/questionnaires-list?user_id=${userId}`
)
.then(res => setQuestionnaires(res))
.catch(e => console.log(e));
apiRequest(`/user-questionnaire/questionnaires-list?user_id=${userId}`)
.then((res) => setQuestionnaires(res))
.catch((e) => console.log(e));
}, []);
return (
@ -117,7 +115,7 @@ export const QuizPage = () => {
<ProfileBreadcrumbs
links={[
{ name: "Главная", link: "/profile-candidate" },
{ name: "Тестирование", link: "/quiz" }
{ name: "Тестирование", link: "/quiz" },
]}
/>
<div className="quiz-page__title main-title">