убрала удвоение шапки и сайдбара+нижнее меню(готово)

This commit is contained in:
Tamara 2024-01-04 03:12:12 +03:00
parent f1abade62b
commit 7c396f1f50
5 changed files with 51 additions and 194 deletions

@ -101,13 +101,6 @@ export function useUserAccountFetcher({
dayjs.locale("ru");
const routeslink = [
{
path: "/list",
page: <MyQuizzesFull />,
header: false,
sidebar: false,
footer: false,
},
{
path: "/tariffs",
page: <Tariffs />,
@ -122,13 +115,6 @@ const routeslink = [
sidebar: true,
footer: true,
},
{
path: "/view",
page: <ViewPage />,
header: false,
sidebar: false,
footer: false,
},
{
path: "/design",
page: <DesignPage />,
@ -211,13 +197,20 @@ export default function App() {
<Navigate to="/" replace state={{ redirectTo: "/restore" }} />
}
/>
<Route path="/list" element={<MyQuizzesFull />} />
<Route path={"/view"} element={<ViewPage />} />
<Route element={<PrivateRoute />}>
{routeslink.map((e, i) => (
<Route
key={i}
path={e.path}
element={
<Main page={e.page} header={e.header} sidebar={e.sidebar} />
<Main
page={e.page}
header={e.header}
sidebar={e.sidebar}
footer={e.footer}
/>
}
/>
))}

@ -25,19 +25,6 @@ import QuizPreview from "@ui_kit/QuizPreview/QuizPreview";
export const DesignPage = () => {
const quiz = useCurrentQuiz();
const { editQuizId } = useQuizStore();
useEffect(() => {
const getData = async () => {
const quizes = await quizApi.getList();
setQuizes(quizes);
if (editQuizId) {
const questions = await questionApi.getList({ quiz_id: editQuizId });
setQuestions(questions);
}
};
getData();
}, []);
const { showConfirmLeaveModal } = useUiTools();
const theme = useTheme();
const navigate = useNavigate();

@ -15,6 +15,7 @@ import { useNavigate } from "react-router-dom";
import { resetEditConfig } from "@root/quizes/actions";
import FirstQuiz from "./FirstQuiz";
import QuizCard from "./QuizCard";
import HeaderFull from "@ui_kit/Header/HeaderFull";
interface Props {
outerContainerSx?: SxProps<Theme>;
@ -32,6 +33,7 @@ export default function MyQuizzesFull({
return (
<>
<HeaderFull />
{quizes.length === 0 ? (
<FirstQuiz />
) : (

@ -3,10 +3,10 @@ import Sidebar from "@ui_kit/Sidebar";
import Box from "@mui/material/Box";
import { useTheme, useMediaQuery } from "@mui/material";
import HeaderFull from "@ui_kit/Header/HeaderFull";
import { useState } from "react";
import { useEffect, useState } from "react";
import { SidebarMobile } from "./startPage/Sidebar/SidebarMobile";
import { setShowConfirmLeaveModal } from "@root/uiTools/actions";
import { setCurrentStep } from "@root/quizes/actions";
import { setCurrentStep, setQuizes } from "@root/quizes/actions";
import { useQuizStore } from "@root/quizes/store";
import { SmallSwitchQuestionListGraph } from "@ui_kit/Toolbars/SmallSwitchQuestionListGraph";
import { PanelSwitchQuestionListGraph } from "@ui_kit/Toolbars/PanelSwitchQuestionListGraph";
@ -17,6 +17,9 @@ import { LinkSimple } from "@icons/LinkSimple";
import { useCurrentQuiz } from "@root/quizes/hooks";
import { deleteTimeoutedQuestions } from "@utils/deleteTimeoutedQuestions";
import { useQuestionsStore } from "@root/questions/store";
import { quizApi } from "@api/quiz";
import { questionApi } from "@api/question";
import { createResult, setQuestions } from "@root/questions/actions";
interface Props {
sidebar: boolean;
@ -30,7 +33,34 @@ export default function Main({ sidebar, header, footer, page }: Props) {
const quiz = useCurrentQuiz();
const quizConfig = quiz?.config;
const { questions } = useQuestionsStore();
const { editQuizId } = useQuizStore();
const currentStep = useQuizStore((state) => state.currentStep);
useEffect(() => {
const getData = async () => {
const quizes = await quizApi.getList();
setQuizes(quizes);
if (editQuizId) {
const questions = await questionApi.getList({ quiz_id: editQuizId });
setQuestions(questions);
//Всегда должен существовать хоть 1 резулт - "line"
if (
!questions?.find(
(q) =>
(q.type === "result" && q.content.includes(':"line"')) ||
q.content.includes(":'line'"),
)
) {
createResult(quiz?.backendId, "line");
console.log("Я не нашёл линейный резулт и собираюсь создать новый");
}
}
};
getData();
}, []);
const isMobile = useMediaQuery(theme.breakpoints.down(600));
const isMobileSm = useMediaQuery(theme.breakpoints.down(370));
const isBranchingLogic = useMediaQuery(theme.breakpoints.down(1100));
@ -45,6 +75,9 @@ export default function Main({ sidebar, header, footer, page }: Props) {
}
setOpenBranchingPage((old) => !old);
};
if (!quizConfig) return <></>;
const isConditionMet =
[1].includes(currentStep) && quizConfig.type !== "form";
@ -58,9 +91,10 @@ export default function Main({ sidebar, header, footer, page }: Props) {
setCurrentStep(index);
};
return (
<>
{header ? <Header setMobileSidebar={setMobileSidebar} /> : <HeaderFull />}
<Header setMobileSidebar={setMobileSidebar} />
<Box
sx={{
display: "flex",
@ -82,7 +116,8 @@ export default function Main({ sidebar, header, footer, page }: Props) {
sx={{
width: "100%",
height: "calc(100vh - 80px)",
padding: isMobile ? "15px" : "25px",
overflow: "hidden",
// padding: isMobile ? "15px" : "25px",
}}
>
<Box
@ -97,7 +132,8 @@ export default function Main({ sidebar, header, footer, page }: Props) {
>
{page}
</Box>
{footer ? (
{footer && (
<Box
sx={{
width: "100%",
@ -194,8 +230,6 @@ export default function Main({ sidebar, header, footer, page }: Props) {
</Box>
)}
</Box>
) : (
<></>
)}
</Box>
</Box>

@ -41,65 +41,22 @@ import { AnyTypedQuizQuestion } from "@model/questionTypes/shared";
import { ModalInfoWhyCantCreate } from "./ModalInfoWhyCantCreate";
import { ConfirmLeaveModal } from "./ConfirmLeaveModal";
import { checkQuestionHint } from "@utils/checkQuestionHint";
import { deleteTimeoutedQuestions } from "@utils/deleteTimeoutedQuestions";
import { toggleQuizPreview } from "@root/quizPreview";
import { LinkSimple } from "@icons/LinkSimple";
import { SmallSwitchQuestionListGraph } from "@ui_kit/Toolbars/SmallSwitchQuestionListGraph";
import { PanelSwitchQuestionListGraph } from "@ui_kit/Toolbars/PanelSwitchQuestionListGraph";
import { ButtonTestPublication } from "@ui_kit/Toolbars/ButtonTestPublication";
import { ButtonRecallQuiz } from "@ui_kit/Toolbars/ButtonRecallQuiz";
export default function EditPage() {
const quiz = useCurrentQuiz();
const { editQuizId } = useQuizStore();
const { questions } = useQuestionsStore();
console.log(questions);
useEffect(() => {
const getData = async () => {
const quizes = await quizApi.getList();
setQuizes(quizes);
if (editQuizId) {
const questions = await questionApi.getList({ quiz_id: editQuizId });
setQuestions(questions);
//Всегда должен существовать хоть 1 резулт - "line"
if (
!questions?.find(
(q) =>
(q.type === "result" && q.content.includes(':"line"')) ||
q.content.includes(":'line'"),
)
) {
createResult(quiz?.backendId, "line");
console.log("Я не нашёл линейный резулт и собираюсь создать новый");
}
}
};
getData();
}, []);
const { whyCantCreatePublic, showConfirmLeaveModal } = useUiTools();
const theme = useTheme();
const navigate = useNavigate();
const currentStep = useQuizStore((state) => state.currentStep);
const isBranchingLogic = useMediaQuery(theme.breakpoints.down(1100));
const isMobile = useMediaQuery(theme.breakpoints.down(660));
const isLinkButton = useMediaQuery(theme.breakpoints.down(708));
const isMobileSm = useMediaQuery(theme.breakpoints.down(370));
const [mobileSidebar, setMobileSidebar] = useState<boolean>(false);
const [nextStep, setNextStep] = useState<number>(0);
const quizConfig = quiz?.config;
const [openBranchingPage, setOpenBranchingPage] = useState<boolean>(false);
const openBranchingPageHC = () => {
if (!openBranchingPage) {
deleteTimeoutedQuestions(questions, quiz);
}
setOpenBranchingPage((old) => !old);
};
useEffect(() => {
if (editQuizId === null) navigate("/list");
}, [navigate, editQuizId]);
@ -144,33 +101,14 @@ export default function EditPage() {
const isConditionMet =
[1].includes(currentStep) && quizConfig.type !== "form";
const changePage = (index: number) => {
if (currentStep === 2) {
setNextStep(index);
setShowConfirmLeaveModal(true);
return;
}
setCurrentStep(index);
};
return (
<>
{/*<Header setMobileSidebar={setMobileSidebar} />*/}
<Box
sx={{
display: isMobile ? "block" : "flex",
position: "relative",
}}
>
{/*{isMobile ? (*/}
{/* <SidebarMobile open={mobileSidebar} changePage={changePage} />*/}
{/*) : (*/}
{/* <Sidebar changePage={changePage} />*/}
{/*)}*/}
<Box
sx={{
background: theme.palette.background.default,
@ -207,103 +145,6 @@ export default function EditPage() {
</>
)}
</Box>
{/*<Box*/}
{/* sx={{*/}
{/* width: "100%",*/}
{/* padding: isMobile ? "20px 16px" : "20px 20px",*/}
{/* display: "flex",*/}
{/* justifyContent: isMobile*/}
{/* ? isMobileSm*/}
{/* ? "center"*/}
{/* : "flex-end"*/}
{/* : "flex-start",*/}
{/* flexDirection: isMobile ? "row-reverse" : "-moz-initial",*/}
{/* alignItems: "center",*/}
{/* gap: "15px",*/}
{/* background: "#FFF",*/}
{/* borderTop: "#f2f3f7 2px solid",*/}
{/* }}*/}
{/*>*/}
{/* {isConditionMet &&*/}
{/* (isBranchingLogic ? (*/}
{/* <SmallSwitchQuestionListGraph*/}
{/* openBranchingPage={openBranchingPage}*/}
{/* setOpenBranchingPage={openBranchingPageHC}*/}
{/* />*/}
{/* ) : (*/}
{/* <PanelSwitchQuestionListGraph*/}
{/* openBranchingPage={openBranchingPage}*/}
{/* setOpenBranchingPage={openBranchingPageHC}*/}
{/* hideText*/}
{/* />*/}
{/* ))}*/}
{/* /!* Кнопка тестового просмотра *!/*/}
{/* <ButtonTestPublication />*/}
{/* /!* Кнопка отозвать *!/*/}
{/* <ButtonRecallQuiz />*/}
{/* /!* Ссылка *!/*/}
{/* {quiz?.status === "start" &&*/}
{/* (!isLinkButton ? (*/}
{/* <Box*/}
{/* component={Link}*/}
{/* sx={{*/}
{/* whiteSpace: "nowrap",*/}
{/* textOverflow: "ellipsis",*/}
{/* overflow: "hidden",*/}
{/* display: isMobile ? "none" : "block",*/}
{/* color: "#7E2AEA",*/}
{/* fontSize: "14px",*/}
{/* }}*/}
{/* target="_blank"*/}
{/* to={"https://hbpn.link/" + quiz.qid}*/}
{/* >*/}
{/* https://hbpn.link/{quiz.qid}*/}
{/* </Box>*/}
{/* ) : (*/}
{/* <Box*/}
{/* component={Link}*/}
{/* sx={{*/}
{/* cursor: "pointer",*/}
{/* minWidth: "34px",*/}
{/* height: "34px",*/}
{/* color: "#7E2AEA",*/}
{/* fontSize: "14px",*/}
{/* display: isMobile ? "none" : "flex",*/}
{/* justifyContent: "center",*/}
{/* alignItems: "Center",*/}
{/* background: "#EEE4FC",*/}
{/* borderRadius: "8px",*/}
{/* }}*/}
{/* target="_blank"*/}
{/* to={"https://hbpn.link/" + quiz.qid}*/}
{/* >*/}
{/* <LinkSimple />*/}
{/* </Box>*/}
{/* ))}*/}
{/* /!* Маленькая кнопка ссылки *!/*/}
{/* {isMobile && quiz?.status === "start" && (*/}
{/* <Box*/}
{/* component={Link}*/}
{/* sx={{*/}
{/* cursor: "pointer",*/}
{/* width: "34px",*/}
{/* height: "34px",*/}
{/* color: "#7E2AEA",*/}
{/* fontSize: "14px",*/}
{/* display: "flex",*/}
{/* justifyContent: "center",*/}
{/* alignItems: "Center",*/}
{/* background: "#EEE4FC",*/}
{/* borderRadius: "8px",*/}
{/* }}*/}
{/* target="_blank"*/}
{/* to={"https://hbpn.link/" + quiz.qid}*/}
{/* >*/}
{/* <LinkSimple />*/}
{/* </Box>*/}
{/* )}*/}
{/*</Box>*/}
</Box>
</Box>