diff --git a/src/pages/DesignPage/DesignFilling.tsx b/src/pages/DesignPage/DesignFilling.tsx
index 9c4e702c..df0c1173 100644
--- a/src/pages/DesignPage/DesignFilling.tsx
+++ b/src/pages/DesignPage/DesignFilling.tsx
@@ -105,12 +105,12 @@ export const DesignFilling = ({
@@ -118,63 +118,79 @@ export const DesignFilling = ({
-
-
- updateQuiz(quiz?.id, (quiz) => {
- quiz.config.design = false;
- quiz.config.theme = name;
- })
- }
- />
-
- updateQuiz(quiz?.id, (quiz) => {
- quiz.config.design = false;
- quiz.config.theme = name;
- })
- }
- />
-
-
-
-
-
-
- updateQuiz(quiz?.id, (quiz) => {
- quiz.config.design = true;
- quiz.config.theme = name;
- })
- }
- />
-
- updateQuiz(quiz?.id, (quiz) => {
- quiz.config.design = true;
- quiz.config.theme = name;
- })
- }
- />
+
+
+
+ updateQuiz(quiz?.id, (quiz) => {
+ quiz.config.design = false;
+ quiz.config.theme = name;
+ })
+ }
+ />
+
+ updateQuiz(quiz?.id, (quiz) => {
+ quiz.config.design = false;
+ quiz.config.theme = name;
+ })
+ }
+ />
+
+
+
+
+
+
+ updateQuiz(quiz?.id, (quiz) => {
+ quiz.config.design = true;
+ quiz.config.theme = name;
+ })
+ }
+ />
+
+ updateQuiz(quiz?.id, (quiz) => {
+ quiz.config.design = true;
+ quiz.config.theme = name;
+ })
+ }
+ />
+
diff --git a/src/pages/DesignPage/DesignPage.tsx b/src/pages/DesignPage/DesignPage.tsx
index 23aaa5ea..f73e20dc 100644
--- a/src/pages/DesignPage/DesignPage.tsx
+++ b/src/pages/DesignPage/DesignPage.tsx
@@ -3,10 +3,8 @@ import { Box, useMediaQuery, useTheme, Skeleton } from "@mui/material";
import { setQuizes, setCurrentStep } from "@root/quizes/actions";
import { useCurrentQuiz } from "@root/quizes/hooks";
import { useQuizStore } from "@root/quizes/store";
-import Sidebar from "@ui_kit/Sidebar/Sidebar";
import { useEffect, useState } from "react";
import { useNavigate } from "react-router-dom";
-import { SidebarMobile } from "../../ui_kit/Sidebar/SidebarMobile";
import { cleanQuestions, setQuestions } from "@root/questions/actions";
import {
updateModalInfoWhyCantCreate,
@@ -17,7 +15,6 @@ import { questionApi } from "@api/question";
import { useUiTools } from "@root/uiTools/store";
import { ConfirmLeaveModal } from "../startPage/ConfirmLeaveModal";
-import { Header } from "@ui_kit/Header/Header";
import { DesignFilling } from "./DesignFilling";
import { createPortal } from "react-dom";
import QuizPreview from "@ui_kit/QuizPreview/QuizPreview";
diff --git a/src/pages/InstallQuiz/InstallQuiz.tsx b/src/pages/InstallQuiz/InstallQuiz.tsx
index b4ba07dd..d63f3257 100644
--- a/src/pages/InstallQuiz/InstallQuiz.tsx
+++ b/src/pages/InstallQuiz/InstallQuiz.tsx
@@ -1,22 +1,23 @@
import React, { useState } from "react";
import {
- Box,
- Button,
- ButtonBase,
- FormControl,
- IconButton,
- InputAdornment,
- Link,
- MenuItem,
- Modal,
- OutlinedInput,
- Paper,
- Select,
- SelectChangeEvent,
- TextField,
- Typography,
- Tooltip,
- useTheme, useMediaQuery,
+ Box,
+ Button,
+ ButtonBase,
+ FormControl,
+ IconButton,
+ InputAdornment,
+ Link,
+ MenuItem,
+ Modal,
+ OutlinedInput,
+ Paper,
+ Select,
+ SelectChangeEvent,
+ TextField,
+ Typography,
+ Tooltip,
+ useTheme,
+ useMediaQuery,
} from "@mui/material";
import LinkIcon from "../../assets/icons/LinkIcon";
import InfoIcon from "../../assets/icons/InfoIcon";
@@ -41,7 +42,11 @@ import InBodyInstall from "./InBodyInstall";
import AutoOpenInstall from "./AutoOpenInstall";
import VidjetInstall from "./VidjetInstall";
import InstallQzCode from "./InstallQzCode";
-import {decrementCurrentStep, incrementCurrentStep, updateQuiz} from "@root/quizes/actions";
+import {
+ decrementCurrentStep,
+ incrementCurrentStep,
+ updateQuiz,
+} from "@root/quizes/actions";
import { useCurrentQuiz } from "@root/quizes/hooks";
import { useDomainDefine } from "@utils/hooks/useDomainDefine";
import NumberTwo from "@icons/NumberTwo";
@@ -56,7 +61,6 @@ export default function InstallQuiz() {
setDisplay(event.target.value);
};
-
const [openVk, setOpenVk] = React.useState(false);
const [stepState, setStepState] = React.useState("step1");
const handleOpenVk = () => setOpenVk(true);
@@ -70,6 +74,7 @@ export default function InstallQuiz() {
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down(600));
+ const isSmallMonitor = useMediaQuery(theme.breakpoints.down(1065));
const CopyLink = () => {
let one = document.getElementById("inputLinkone").value;
let text = document.getElementById("inputLink").value;
@@ -101,16 +106,22 @@ export default function InstallQuiz() {
"0px 100px 309px rgba(210, 208, 225, 0.24), 0px 41.7776px 129.093px rgba(210, 208, 225, 0.172525), 0px 22.3363px 69.0192px rgba(210, 208, 225, 0.143066), 0px 12.5216px 38.6916px rgba(210, 208, 225, 0.12), 0px 6.6501px 20.5488px rgba(210, 208, 225, 0.0969343), 0px 2.76726px 8.55082px rgba(210, 208, 225, 0.0674749)",
}}
>
-
-
-
- Ссылка на quiz
+
+
+
+ Ссылка на quiz
-
{/*
-
+
- Установка квизов на сайте
+ Установка quiz на сайте
{
@@ -382,9 +400,9 @@ export default function InstallQuiz() {
gap: "20px",
}}
>
- 1. Код вставки опросника
+ 1. Код вставки quiz
- Установите код в то место, где должен быть опросник
+ Установите код в то место, где должен быть quiz
);
diff --git a/src/pages/Questions/DraggableList/index.tsx b/src/pages/Questions/DraggableList/index.tsx
index d43a1db9..6d596b12 100644
--- a/src/pages/Questions/DraggableList/index.tsx
+++ b/src/pages/Questions/DraggableList/index.tsx
@@ -1,18 +1,24 @@
+import { useEffect } from "react";
import { Box } from "@mui/material";
import { reorderQuestions } from "@root/questions/actions";
import type { DropResult } from "react-beautiful-dnd";
import { DragDropContext, Droppable } from "react-beautiful-dnd";
import DraggableListItem from "./DraggableListItem";
import { useQuestions } from "@root/questions/hooks";
+import { createUntypedQuestion } from "@root/questions/actions";
+import { useCurrentQuiz } from "@root/quizes/hooks";
+
interface Props {
openBranchingPage: boolean;
setOpenBranchingPage: (a: boolean) => void;
}
+
export const DraggableList = ({
openBranchingPage,
setOpenBranchingPage,
}: Props) => {
- const { questions } = useQuestions();
+ const quiz = useCurrentQuiz();
+ const { isLoading, questions } = useQuestions();
const filteredQuestions = questions.filter(
(question) => question.type !== "result",
);
@@ -20,6 +26,12 @@ export const DraggableList = ({
if (destination) reorderQuestions(source.index, destination.index);
};
+ useEffect(() => {
+ if (!isLoading && quiz && !filteredQuestions.length) {
+ createUntypedQuestion(Number(quiz.id));
+ }
+ }, [quiz, filteredQuestions]);
+
return (
diff --git a/src/pages/Questions/QuestionsPage.tsx b/src/pages/Questions/QuestionsPage.tsx
index 0341dfaf..e9798472 100755
--- a/src/pages/Questions/QuestionsPage.tsx
+++ b/src/pages/Questions/QuestionsPage.tsx
@@ -84,13 +84,8 @@ export default function QuestionsPage({
>
{!openBranchingPage && (
{
- createUntypedQuestion(quiz.backendId);
- }}
- sx={{
- position: "fixed",
- bottom: "103px",
- }}
+ onClick={() => createUntypedQuestion(quiz.backendId)}
+ sx={{ position: "fixed", bottom: "103px" }}
data-cy="create-question"
>
diff --git a/src/pages/QuizAnswersPage/CardAnswer.tsx b/src/pages/QuizAnswersPage/CardAnswer.tsx
index 918e852f..5aa0e3dc 100644
--- a/src/pages/QuizAnswersPage/CardAnswer.tsx
+++ b/src/pages/QuizAnswersPage/CardAnswer.tsx
@@ -63,10 +63,37 @@ export const CardAnswer = ({
const { editQuizId } = useQuizStore();
const { questions } = useQuestionsStore();
+ const openResults = async () => {
+ setIsOpen(!isOpen);
+ if (!isOpen) {
+ try {
+ let resAnswer = await resultApi.getAnswerList(Number(idResult));
+
+ let resAnswerOnly = resAnswer.filter((res) => res.Result !== true);
+ let resQuiz = resAnswer.filter((res) => res.Result === true);
+ setResultQuiz(resQuiz);
+ setResultsAnswer(resAnswerOnly);
+ let idResults = resQuiz[0].question_id;
+ let questionsResult = questions.filter(
+ (q) => q.backendId === idResults,
+ );
+ setQuestionsResultState(questionsResult);
+ console.log("тут хранятся ответы", resAnswerOnly);
+ } catch (nativeError) {
+ const error = nativeError as AxiosError;
+
+ if (error.response?.statusText === "Payment Required") {
+ openPrePaymentModal();
+ }
+ }
+ }
+ };
+
return (
{
obsolescenceResult(idResult, editQuizId);
+ openResults();
}}
sx={{
borderRadius: "12px",
@@ -129,39 +156,7 @@ export const CardAnswer = ({
>
{idResult}
- {
- setIsOpen(!isOpen);
- if (!isOpen) {
- try {
- let resAnswer = await resultApi.getAnswerList(
- Number(idResult),
- );
-
- let resAnswerOnly = resAnswer.filter(
- (res) => res.Result !== true,
- );
- let resQuiz = resAnswer.filter(
- (res) => res.Result === true,
- );
- setResultQuiz(resQuiz);
- setResultsAnswer(resAnswerOnly);
- let idResults = resQuiz[0].question_id;
- let questionsResult = questions.filter(
- (q) => q.backendId === idResults,
- );
- setQuestionsResultState(questionsResult);
- console.log("тут хранятся ответы", resAnswerOnly);
- } catch (nativeError) {
- const error = nativeError as AxiosError;
-
- if (error.response?.statusText === "Payment Required") {
- openPrePaymentModal();
- }
- }
- }
- }}
- >
+
{
return (
-
+
{
fontSize: "36px",
fontWeight: "500",
mb: "50px",
- mt: "60px",
+
lineHeight: "normal",
+ wordBreak: "break-word",
}}
>
{quiz.name}
diff --git a/src/pages/Tariffs/Tariffs.tsx b/src/pages/Tariffs/Tariffs.tsx
index f218daaf..99a6db40 100644
--- a/src/pages/Tariffs/Tariffs.tsx
+++ b/src/pages/Tariffs/Tariffs.tsx
@@ -31,6 +31,7 @@ import { currencyFormatter } from "./tariffsUtils/currencyFormatter";
import type { Tariff } from "@frontend/kitui";
import { Tabs } from "./Tabs";
import { cleanAuthTicketData } from "@root/ticket";
+import { useDomainDefine } from "@utils/hooks/useDomainDefine";
const StepperText: Record = {
count: "Тарифы на объём",
@@ -41,6 +42,7 @@ function TariffPage() {
const theme = useTheme();
const token = useToken();
const isTablet = useMediaQuery(theme.breakpoints.down(1000));
+ const isMobile = useMediaQuery(theme.breakpoints.down(600));
const userId = useUserStore((state) => state.userId);
const location = useLocation();
const navigate = useNavigate();
@@ -52,6 +54,7 @@ function TariffPage() {
const [openModal, setOpenModal] = useState({});
const [cash, setCash] = useState("0");
const [selectedItem, setSelectedItem] = useState<"count" | "day">("count");
+ const { isTestServer } = useDomainDefine();
const getTariffsList = async (): Promise => {
const tariffsList: Tariff[] = [];
@@ -132,11 +135,9 @@ function TariffPage() {
// history.pushState({}, null, "https://hub.pena.digital/wallet?action=squizpay");
var link = document.createElement("a");
- link.href =
- "https://hub.pena.digital" +
- `/quizpayment?action=squizpay&dif=${
- (price - Number(user.wallet.cash)) * 100
- }&data=${token}&userid=${userId}
+ link.href = `https://${isTestServer ? "s" : ""}hub.pena.digital/quizpayment?action=squizpay&dif=${
+ (price - Number(user.wallet.cash)) * 100
+ }&data=${token}&userid=${userId}
`;
document.body.appendChild(link);
link.click();
@@ -175,7 +176,7 @@ function TariffPage() {
display: "flex",
height: "80px",
alignItems: "center",
- gap: isTablet ? "20px" : "60px",
+ gap: isMobile ? "7px" : isTablet ? "20px" : "60px",
flexDirection: "row",
justifyContent: "space-between",
bgcolor: "white",
@@ -189,7 +190,7 @@ function TariffPage() {
-
+ console.log(cash)}>
Мой баланс
-
+ 9 ? "13px" : "16px") : "16px"}
+ >
{cash}
diff --git a/src/pages/Tariffs/tariffsUtils/TariffCard.tsx b/src/pages/Tariffs/tariffsUtils/TariffCard.tsx
index d00be039..205e7a23 100644
--- a/src/pages/Tariffs/tariffsUtils/TariffCard.tsx
+++ b/src/pages/Tariffs/tariffsUtils/TariffCard.tsx
@@ -6,6 +6,8 @@ import {
Theme,
Button,
Badge,
+ useTheme,
+ useMediaQuery,
} from "@mui/material";
import { MouseEventHandler, ReactNode } from "react";
@@ -33,7 +35,8 @@ export default function TariffCard({
discount,
}: Props) {
text = Array.isArray(text) ? text : [text];
-
+ const theme = useTheme();
+ const isMobile = useMediaQuery(theme.breakpoints.down(600));
return (
{price}
diff --git a/src/pages/main.tsx b/src/pages/main.tsx
index d5bcf8d8..17f97894 100755
--- a/src/pages/main.tsx
+++ b/src/pages/main.tsx
@@ -95,6 +95,7 @@ export default function Main({ sidebar, header, footer, Page }: Props) {
const [widthMain, setWidthMain] = useState(null);
const [heightSidebar, setHeightSidebar] = useState(null);
+ const [scrollDown, setScrollDown] = useState(null);
const mainBlock = useRef(0);
const heightHeader = heightSidebar + 51 + 36;
const observer = useRef(
@@ -111,7 +112,7 @@ export default function Main({ sidebar, header, footer, Page }: Props) {
if (!quizConfig) return <>>;
return (
<>
-
+
) : (
@@ -137,9 +139,10 @@ export default function Main({ sidebar, header, footer, Page }: Props) {
sx={{
width: "100%",
height: isMobile
- ? mobileSidebar
- ? `calc(100vh - ${heightHeader}px)`
- : "calc(100vh - 51px)"
+ ? // ? mobileSidebar
+ // ? `calc(100vh - ${heightHeader}px)`
+ // "calc(100vh - 51px)"
+ "100vh"
: "calc(100vh - 80px)",
display: "flex",
flexDirection: "column",
@@ -162,6 +165,8 @@ export default function Main({ sidebar, header, footer, Page }: Props) {
widthMain={widthMain}
mobileSidebar={mobileSidebar}
heightSidebar={heightSidebar}
+ scrollDown={scrollDown}
+ setScrollDown={setScrollDown}
/>
@@ -182,6 +187,8 @@ export default function Main({ sidebar, header, footer, Page }: Props) {
background: "#FFF",
borderTop: "#f2f3f7 2px solid",
zIndex: 1,
+ position: isMobile ? "fixed" : undefined,
+ bottom: isMobile ? 0 : undefined,
}}
>
{isConditionMet &&
diff --git a/src/pages/startPage/EditPage.tsx b/src/pages/startPage/EditPage.tsx
index 83dd3801..a2fc261a 100755
--- a/src/pages/startPage/EditPage.tsx
+++ b/src/pages/startPage/EditPage.tsx
@@ -17,7 +17,7 @@ import { useQuizStore } from "@root/quizes/store";
import Sidebar from "@ui_kit/Sidebar/Sidebar";
import Stepper from "@ui_kit/Stepper";
import SwitchStepPages from "@ui_kit/switchStepPages";
-import { useEffect, useState } from "react";
+import { useEffect, useRef, useState } from "react";
import { Link, useNavigate } from "react-router-dom";
import { useDebouncedCallback } from "use-debounce";
import { SidebarMobile } from "../../ui_kit/Sidebar/SidebarMobile";
@@ -48,6 +48,8 @@ interface Props {
widthMain: number;
mobileSidebar: boolean;
heightSidebar: number;
+ scrollDown: boolean;
+ setScrollDown: (a: boolean) => void;
}
export default function EditPage({
openBranchingPage,
@@ -55,6 +57,8 @@ export default function EditPage({
widthMain,
mobileSidebar,
heightSidebar,
+ scrollDown,
+ setScrollDown,
}: Props) {
const quiz = useCurrentQuiz();
const { editQuizId } = useQuizStore();
@@ -67,8 +71,9 @@ export default function EditPage({
const isMobile = useMediaQuery(theme.breakpoints.down(650));
const quizConfig = quiz?.config;
// const [openBranchingPage, setOpenBranchingPage] = useState(false);
+ const mainBlock = useRef(0);
- const heightBar = heightSidebar + 51 + 88 + 23;
+ const heightBar = heightSidebar + 51 + 88;
useEffect(() => {
if (editQuizId === null) navigate("/list");
}, [navigate, editQuizId]);
@@ -108,6 +113,17 @@ export default function EditPage({
setCurrentStep(nextStep);
};
+ let lastScroll = mainBlock.current.scrollTop;
+ const onScroll = (e) => {
+ if ((mainBlock.current.scrollTop > lastScroll && !scrollDown) || null) {
+ setScrollDown(true);
+ }
+ if (mainBlock.current.scrollTop < lastScroll && scrollDown) {
+ setScrollDown(false);
+ }
+ lastScroll = mainBlock.current.scrollTop;
+ };
+
if (!quizConfig) return <>>;
const isConditionMet =
@@ -129,19 +145,25 @@ export default function EditPage({
}}
>
{/* Выбор текущей страницы редактирования чего-либо - находится здесь */}
@@ -162,7 +184,6 @@ export default function EditPage({
-
,
+ ref: Ref,
) {
return ;
});
@@ -59,7 +60,9 @@ export default function FloatingSupportChat({
modalWarningType,
setModalWarningType,
}: Props) {
+ const [monitorType, setMonitorType] = useState<"desktop" | "mobile" | "">("");
const theme = useTheme();
+ const isMobile = useMediaQuery(theme.breakpoints.down(800));
const location = useLocation();
const locationChat = location.pathname;
const user = useUserStore((state) => state.user?._id);
@@ -68,9 +71,24 @@ export default function FloatingSupportChat({
(state) => state[user ? "authData" : "unauthData"],
);
- const isMobile = useMediaQuery(theme.breakpoints.down(800));
+ useEffect(() => {
+ const onResize = () => {
+ if (document.fullscreenElement) {
+ setMonitorType(isMobile ? "mobile" : "desktop");
+
+ return;
+ }
+
+ setMonitorType("");
+ };
+
+ window.addEventListener("resize", onResize);
+
+ return () => {
+ window.removeEventListener("resize", onResize);
+ };
+ }, [isMobile]);
- console.log(messages);
return (
)}
{!disableCollapse && (
@@ -145,7 +145,7 @@ export default function Sidebar({ changePage, disableCollapse }: SidebarProps) {
color: theme.palette.grey2.main,
}}
>
- Настройки quiz
+ {`Настройки ${quiz.config.type}`}
)}
diff --git a/src/ui_kit/Sidebar/SidebarMobile.tsx b/src/ui_kit/Sidebar/SidebarMobile.tsx
index f121a9f1..22a07d1a 100644
--- a/src/ui_kit/Sidebar/SidebarMobile.tsx
+++ b/src/ui_kit/Sidebar/SidebarMobile.tsx
@@ -48,12 +48,14 @@ interface Iprops {
open: boolean;
changePage: (step: number) => void;
setHeightSitebar: any;
+ scrollDown: boolean;
}
export const SidebarMobile: FC = ({
open,
changePage,
setHeightSitebar,
+ scrollDown,
}) => {
const theme = useTheme();
const isWrappSidebar = useMediaQuery(theme.breakpoints.down(400));
@@ -118,7 +120,9 @@ export const SidebarMobile: FC = ({
= ({
borderBottomLeftRadius: "8px",
borderBottomRightRadius: "8px",
transitionDuration: "200ms",
+ position: "fixed",
+ top: "51px",
+ zIndex: theme.zIndex.drawer + 1,
+ transition: "transform 0.3s",
+ transform: scrollDown ? "translateY(-200px)" : undefined,
}}
>
@@ -139,7 +148,7 @@ export const SidebarMobile: FC = ({
sx={{
ml: "15px",
display: "flex",
- alignItems: "end",
+ alignItems: "center",
width: "100%",
justifyContent: "space-between",
}}
@@ -165,7 +174,7 @@ export const SidebarMobile: FC = ({
id="project-name"
placeholder="Название проекта"
sx={{
- width: "270px",
+ width: "85%",
"& .MuiInputBase-root": {
height: "34px",
borderRadius: "8px",
@@ -193,7 +202,7 @@ export const SidebarMobile: FC = ({
)}
- setInputOpen(true)}>
+ setInputOpen(true)} sx={{ mt: "10px" }}>
(null);
+ const [isTestServer, setIsTestServer] = useState(false);
useEffect(() => {
const host = window.location.hostname;