From 4d25b72a17c963445ec7f23c3ace4adf7487250d Mon Sep 17 00:00:00 2001 From: Nastya Date: Thu, 14 Dec 2023 02:34:34 +0300 Subject: [PATCH] =?UTF-8?q?=D0=BF=D0=BE=D0=BB=D1=83=D1=87=D0=B5=D0=BD?= =?UTF-8?q?=D0=B8=D0=B5=20=D1=81=D0=BF=D0=B8=D1=81=D0=BA=D0=B0=20=D0=B2?= =?UTF-8?q?=D0=BE=D0=BF=D1=80=D0=BE=D1=81=D0=BE=D0=B2=20=D0=BD=D0=B0=20?= =?UTF-8?q?=D1=81=D1=82=D1=80=D0=B0=D0=BD=D0=B8=D1=86=D0=B5=20=D1=80=D0=B5?= =?UTF-8?q?=D0=B4=D0=B0=D0=BA=D1=82=D0=B8=D1=80=D0=BE=D0=B2=D0=B0=D0=BD?= =?UTF-8?q?=D0=B8=D0=B5.=20=D0=BA=D0=BE=D0=BC=D0=BF=D0=BE=D0=BD=D0=B5?= =?UTF-8?q?=D0=BD=D1=82=20=D0=BF=D0=BB=D1=8E=D1=81=D0=B0=20=D0=B4=D0=B5?= =?UTF-8?q?=D1=80=D0=B5=D0=B2=D0=B0=20=D0=BE=D1=87=D0=B8=D1=89=D0=B0=D0=B5?= =?UTF-8?q?=D1=82=20=D0=B2=D0=BE=D0=BF=D1=80=D0=BE=D1=81=D1=8B=20=D0=B8=20?= =?UTF-8?q?=D1=80=D1=83=D1=82=20=D0=BA=D0=B2=D0=B8=D0=B7=D0=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Questions/BranchingMap/CsComponent.tsx | 6 ++- .../Questions/BranchingMap/FirstNodeField.tsx | 15 ++++++-- .../Form/FormDraggableList/index.tsx | 2 - src/pages/startPage/EditPage.tsx | 37 ++++++++++++++++--- src/stores/questions/actions.ts | 1 + src/stores/quizes/actions.ts | 1 + 6 files changed, 49 insertions(+), 13 deletions(-) diff --git a/src/pages/Questions/BranchingMap/CsComponent.tsx b/src/pages/Questions/BranchingMap/CsComponent.tsx index 2dd51e94..7c45e0d5 100644 --- a/src/pages/Questions/BranchingMap/CsComponent.tsx +++ b/src/pages/Questions/BranchingMap/CsComponent.tsx @@ -145,8 +145,9 @@ function CsComponent({ }, [desireToOpenABranchingModal]) useLayoutEffect(() => { updateOpenedModalSettingsId() - // updateRootContentId(quiz.id, "") - // clearRuleForAll() + console.log("first render CSComponent") + // updateRootContentId(quiz.id, "") + // clearRuleForAll() }, []) useEffect(() => { if (modalQuestionTargetContentId.length !== 0 && modalQuestionParentContentId.length !== 0) { @@ -224,6 +225,7 @@ function CsComponent({ const removeNode = ({ targetNodeContentId }: { targetNodeContentId: string }) => { + console.log("старт удаление") const deleteNodes = [] as string[] const deleteEdges: any = [] const cy = cyRef?.current diff --git a/src/pages/Questions/BranchingMap/FirstNodeField.tsx b/src/pages/Questions/BranchingMap/FirstNodeField.tsx index 4526510a..4f5bdde0 100644 --- a/src/pages/Questions/BranchingMap/FirstNodeField.tsx +++ b/src/pages/Questions/BranchingMap/FirstNodeField.tsx @@ -1,6 +1,6 @@ import { Box } from "@mui/material" -import { useEffect, useRef, useState } from "react"; -import { deleteQuestion, updateDragQuestionContentId, updateQuestion } from "@root/questions/actions" +import { useEffect, useRef, useLayoutEffect } from "react"; +import { deleteQuestion, clearRuleForAll, updateQuestion, updateOpenedModalSettingsId } from "@root/questions/actions" import { updateRootContentId } from "@root/quizes/actions" import { useCurrentQuiz } from "@root/quizes/hooks" import { useQuestionsStore } from "@root/questions/store" @@ -11,8 +11,17 @@ interface Props { modalQuestionTargetContentId: string; } export const FirstNodeField = ({ setOpenedModalQuestions, modalQuestionTargetContentId }: Props) => { - const quiz = useCurrentQuiz(); + + + useLayoutEffect(() => { + updateOpenedModalSettingsId() + console.log("first render firstComponent") + updateRootContentId(quiz.id, "") + clearRuleForAll() + }, []) + + const { dragQuestionContentId, questions } = useQuestionsStore() const Container = useRef(null); diff --git a/src/pages/Questions/Form/FormDraggableList/index.tsx b/src/pages/Questions/Form/FormDraggableList/index.tsx index c2e27214..477aad09 100644 --- a/src/pages/Questions/Form/FormDraggableList/index.tsx +++ b/src/pages/Questions/Form/FormDraggableList/index.tsx @@ -1,13 +1,11 @@ import { Box } from "@mui/material"; import { reorderQuestions } from "@root/questions/actions"; -import { useQuestions } from "@root/questions/hooks"; import type { DropResult } from "react-beautiful-dnd"; import { DragDropContext, Droppable } from "react-beautiful-dnd"; import FormDraggableListItem from "./FormDraggableListItem"; export const FormDraggableList = () => { - const { questions } = useQuestions(); const onDragEnd = ({ destination, source }: DropResult) => { if (destination) reorderQuestions(source.index, destination.index); diff --git a/src/pages/startPage/EditPage.tsx b/src/pages/startPage/EditPage.tsx index 6927e2cd..2d92e1d8 100755 --- a/src/pages/startPage/EditPage.tsx +++ b/src/pages/startPage/EditPage.tsx @@ -1,5 +1,8 @@ +import { quizApi } from "@api/quiz"; +import { devlog } from "@frontend/kitui"; import BackArrowIcon from "@icons/BackArrowIcon"; import { Burger } from "@icons/Burger"; +import EyeIcon from "@icons/EyeIcon"; import { PenaLogoIcon } from "@icons/PenaLogoIcon"; import { Box, @@ -11,9 +14,7 @@ import { useMediaQuery, useTheme, } from "@mui/material"; -import { cleanQuestions, updateOpenBranchingPanel } from "@root/questions/actions"; -import { useQuestionsStore } from "@root/questions/store"; -import { decrementCurrentStep, resetEditConfig } from "@root/quizes/actions"; +import { decrementCurrentStep, resetEditConfig, setQuizes } from "@root/quizes/actions"; import { useCurrentQuiz } from "@root/quizes/hooks"; import { useQuizStore } from "@root/quizes/store"; import CustomAvatar from "@ui_kit/Header/Avatar"; @@ -22,22 +23,46 @@ import PenaLogo from "@ui_kit/PenaLogo"; import Sidebar from "@ui_kit/Sidebar"; import Stepper from "@ui_kit/Stepper"; import SwitchStepPages from "@ui_kit/switchStepPages"; +import { isAxiosError } from "axios"; +import { enqueueSnackbar } from "notistack"; import { useEffect, useState } from "react"; import { Link, useNavigate } from "react-router-dom"; +import useSWR from "swr"; import { SidebarMobile } from "./Sidebar/SidebarMobile"; +import {cleanQuestions, updateOpenBranchingPanel} from "@root/questions/actions"; +import {BranchingPanel} from "../Questions/BranchingPanel"; +import {setQuestions} from "@root/questions/actions"; +import {useQuestionsStore} from "@root/questions/store"; +import { useQuestions } from "@root/questions/hooks"; +import { questionApi } from "@api/question"; + + export default function EditPage() { - // if (isLoading && !questions) return Загрузка вопросов...; + const quiz = useCurrentQuiz(); + + console.log("get questions") + useSWR(["questions", quiz?.backendId], ([, id]) => questionApi.getList({ quiz_id: id }), { + onSuccess: setQuestions, + onError: error => { + const message = isAxiosError(error) ? (error.response?.data ?? "") : ""; + + devlog("Error getting question list", error); + enqueueSnackbar(`Не удалось получить вопросы. ${message}`); + } + }); + + + + const {openBranchingPanel, questions} = useQuestionsStore.getState() const theme = useTheme(); const navigate = useNavigate(); const editQuizId = useQuizStore(state => state.editQuizId); - const quiz = useCurrentQuiz(); const currentStep = useQuizStore(state => state.currentStep); const isTablet = useMediaQuery(theme.breakpoints.down(1000)); const isMobile = useMediaQuery(theme.breakpoints.down(660)); const [mobileSidebar, setMobileSidebar] = useState(false); - const {openBranchingPanel} = useQuestionsStore.getState() const quizConfig = quiz?.config; useEffect(() => { diff --git a/src/stores/questions/actions.ts b/src/stores/questions/actions.ts index b853445b..76524034 100644 --- a/src/stores/questions/actions.ts +++ b/src/stores/questions/actions.ts @@ -485,6 +485,7 @@ export const updateDragQuestionContentId = (contentId?: string) => { export const clearRuleForAll = () => { const { questions } = useQuestionsStore.getState(); + console.log(questions) questions.forEach(question => { if (question.type !== null && (question.content.rule.main.length > 0 || question.content.rule.default.length > 0 || question.content.rule.parentId.length > 0)) { updateQuestion(question.content.id, question => { diff --git a/src/stores/quizes/actions.ts b/src/stores/quizes/actions.ts index e0367bfd..625fc12d 100644 --- a/src/stores/quizes/actions.ts +++ b/src/stores/quizes/actions.ts @@ -179,6 +179,7 @@ export const deleteQuiz = async (quizId: string) => requestQueue.enqueue(async ( export const updateRootContentId = (quizId: string, id:string) => updateQuiz( quizId, quiz => { + console.log("Я изменение статуса корня проекта дерева, меняю на ", id) quiz.config.haveRoot = id }, );