SQuiz/frontPanel
2
0
Fork 0
Code Issues 10 Pull Requests Actions Packages Projects Releases Wiki Activity

отображение модалки ветвления

Browse Source
This commit is contained in:
Nastya 2023-12-03 05:16:53 +03:00
parent 4623dfd2ee
commit 542159e5b1
6 changed files with 88 additions and 67 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/pages/Questions/BranchingMap/CsComponent.tsx
View File

@ -6,7 +6,7 @@ import { useCurrentQuiz } from "@root/quizes/hooks";
import { updateRootInfo } from "@root/quizes/actions" import { updateRootInfo } from "@root/quizes/actions"
import { AnyQuizQuestion } from "@model/questionTypes/shared" import { AnyQuizQuestion } from "@model/questionTypes/shared"
import { useQuestionsStore } from "@root/questions/store"; import { useQuestionsStore } from "@root/questions/store";
import { cleardragQuestionContentId, getQuestionById, updateQuestion, updateOpenedModalSettingsId, getQuestionByContentId } from "@root/questions/actions"; import { cleardragQuestionContentId, updateQuestion, updateOpenedModalSettingsId, getQuestionByContentId } from "@root/questions/actions";
import { storeToNodes } from "./helper"; import { storeToNodes } from "./helper";
@ -565,10 +565,8 @@ export const CsComponent = ({
gearElement.style.zIndex = "1" gearElement.style.zIndex = "1"
gearsContainer.current?.appendChild(gearElement); gearsContainer.current?.appendChild(gearElement);
gearElement.addEventListener("mouseup", (e) => { gearElement.addEventListener("mouseup", (e) => {
console.log("шестерня") console.log(item.id())
// setOpenedModalSettings( updateOpenedModalSettingsId(item.id())
// findQuestionById(quizId, node.id().split(" ").pop() || "").index
// );
}); });
return gearElement; return gearElement;

45
src/pages/Questions/BranchingModal/BranchingQuestionsModal.tsx
View File

@ -1,4 +1,4 @@
import { useState, useRef, useEffect } from "react"; import { useState, useRef, useEffect, useLayoutEffect } from "react";
import { import {
Box, Box,
Button, Button,
@ -22,7 +22,7 @@ import InfoIcon from "@icons/Info";
import { DeleteIcon } from "@icons/questionsPage/deleteIcon"; import { DeleteIcon } from "@icons/questionsPage/deleteIcon";
import { TypeSwitch, BlockRule } from "./Settings"; import { TypeSwitch, BlockRule } from "./Settings";
import { getQuestionById, updateOpenedModalSettingsId, updateQuestion } from "@root/questions/actions"; import { getQuestionById, getQuestionByContentId, updateOpenedModalSettingsId, updateQuestion } from "@root/questions/actions";
import { useQuestionsStore } from "@root/questions/store"; import { useQuestionsStore } from "@root/questions/store";
import { enqueueSnackbar } from "notistack"; import { enqueueSnackbar } from "notistack";
@ -30,17 +30,38 @@ import { enqueueSnackbar } from "notistack";
export default function BranchingQuestions() { export default function BranchingQuestions() {
const theme = useTheme(); const theme = useTheme();
const { openedModalSettingsId } = useQuestionsStore(); const { openedModalSettingsId } = useQuestionsStore();
const [targetQuestion, setTargetQuestion] = useState<AnyQuizQuestion | null>(getQuestionById(openedModalSettingsId)) const [targetQuestion, setTargetQuestion] = useState<AnyQuizQuestion | null>(getQuestionById(openedModalSettingsId) || getQuestionByContentId(openedModalSettingsId))
const [parentQuestion, setParentQuestion] = useState<AnyQuizQuestion | null>(getQuestionById(openedModalSettingsId)) console.log(targetQuestion)
const [parentQuestion, setParentQuestion] = useState<AnyQuizQuestion | null>(getQuestionByContentId(targetQuestion?.content.rule.parentId))
console.log(parentQuestion)
useLayoutEffect(() => {
if (parentQuestion.content.rule.main.length === 0) updateQuestion(parentQuestion.id, question => question.content.rule.main.push({
next: targetQuestion.content.id,
or: true,
rules: [{
question: parentQuestion.content.id,
answers: []
}]
}))
})
if (targetQuestion === null || parentQuestion === null) { if (targetQuestion === null || parentQuestion === null) {
console.log(openedModalSettingsId)
enqueueSnackbar("Невозможно найти данные ветвления для этого вопроса") enqueueSnackbar("Невозможно найти данные ветвления для этого вопроса")
return <></> return <></>
} }
const saveData = () => { const saveData = () => {
console.log(parentQuestion)
if (parentQuestion !== null) {
updateQuestion(parentQuestion.content.id, question => question.content = parentQuestion.content)
}
handleClose()
} }
@ -100,14 +121,14 @@ export default function BranchingQuestions() {
{ {
parentQuestion.content.rule.main.length ? parentQuestion.content.rule.main.length ?
parentQuestion.content.rule.main.map((e: any, i: number) => { parentQuestion.content.rule.main.map((e: any, i: number) => {
if (e.next === targetQuestion.id) { if (e.next === targetQuestion.content.id) {
return <TypeSwitch key={i} targetQuestion={targetQuestion} parentQuestion={parentQuestion} ruleIndex={i} /> return <TypeSwitch key={i} setParentQuestion={setParentQuestion} targetQuestion={targetQuestion} parentQuestion={parentQuestion} ruleIndex={i} />
} else { } else {
<></> <></>
} }
}) })
: :
<TypeSwitch targetQuestion={targetQuestion} parentQuestion={parentQuestion} ruleIndex={0} /> <TypeSwitch targetQuestion={targetQuestion} setParentQuestion={setParentQuestion} parentQuestion={parentQuestion} ruleIndex={0} />
} }
</Box> </Box>
@ -128,8 +149,8 @@ export default function BranchingQuestions() {
cursor: "pointer" cursor: "pointer"
}} }}
onClick={() => { onClick={() => {
const mutate = parentQuestion const mutate = JSON.parse(JSON.stringify(parentQuestion))
mutate.content.rule.main.push(createBranchingRuleMain(targetQuestion.id, parentQuestion.id)) mutate.content.rule.main.push(createBranchingRuleMain(targetQuestion.content.id, parentQuestion.content.id))
setParentQuestion(mutate) setParentQuestion(mutate)
}} }}
> >
@ -145,7 +166,7 @@ export default function BranchingQuestions() {
checked={parentQuestion.content.rule.default === targetQuestion.id} checked={parentQuestion.content.rule.default === targetQuestion.id}
onClick={() => { onClick={() => {
const mutate = parentQuestion let mutate = JSON.parse(JSON.stringify(parentQuestion))
mutate.content.rule.default = targetQuestion.id mutate.content.rule.default = targetQuestion.id
setParentQuestion(mutate) setParentQuestion(mutate)
}} }}
@ -165,7 +186,7 @@ export default function BranchingQuestions() {
<Button <Button
variant="contained" variant="contained"
sx={{ width: "100%", maxWidth: "130px" }} sx={{ width: "100%", maxWidth: "130px" }}
onClick={handleClose} onClick={saveData}
> >
Готово Готово
</Button> </Button>

89
src/pages/Questions/BranchingModal/Settings.tsx
View File

@ -20,11 +20,13 @@ interface Props {
parentQuestion: AnyQuizQuestion; parentQuestion: AnyQuizQuestion;
targetQuestion: AnyQuizQuestion; targetQuestion: AnyQuizQuestion;
ruleIndex: number; ruleIndex: number;
setParentQuestion: (q:AnyQuizQuestion) => void;
} }
//Этот компонент вызывается 1 раз на каждое условие родителя для перехода к этому вопросу. Поэтому для изменения стора мы знаем индекс //Этот компонент вызывается 1 раз на каждое условие родителя для перехода к этому вопросу. Поэтому для изменения стора мы знаем индекс
export const TypeSwitch = ({ parentQuestion, targetQuestion, ruleIndex }: Props) => { export const TypeSwitch = ({ parentQuestion, targetQuestion, ruleIndex, setParentQuestion }: Props) => {
console.log("index " + ruleIndex)
switch (parentQuestion.type) { switch (parentQuestion.type) {
// case 'nonselected': // case 'nonselected':
@ -38,19 +40,19 @@ export const TypeSwitch = ({ parentQuestion, targetQuestion, ruleIndex }: Props)
case "select": case "select":
return (parentQuestion.content.variants === undefined ? <BlockRule text={"У родителя нет вариантов"} /> : return (parentQuestion.content.variants === undefined ? <BlockRule text={"У родителя нет вариантов"} /> :
<SelectorType targetQuestion={targetQuestion} parentQuestion={parentQuestion} ruleIndex={ruleIndex} /> <SelectorType targetQuestion={targetQuestion} parentQuestion={parentQuestion} ruleIndex={ruleIndex} setParentQuestion={setParentQuestion} />
//Реализован //Реализован
) )
break; break;
case "date": case "date":
// return <DateInputsType targetQuestion={targetQuestion} parentQuestion={parentQuestion} ruleIndex={ruleIndex} /> // return <DateInputsType targetQuestion={targetQuestion} parentQuestion={parentQuestion} ruleIndex={ruleIndex} setParentQuestion={setParentQuestion} />
return <></> return <></>
break; break;
case "number": case "number":
return <NumberInputsType targetQuestion={targetQuestion} parentQuestion={parentQuestion} ruleIndex={ruleIndex} /> return <NumberInputsType targetQuestion={targetQuestion} parentQuestion={parentQuestion} ruleIndex={ruleIndex} setParentQuestion={setParentQuestion} />
//Реализован //Реализован
break; break;
@ -60,17 +62,17 @@ export const TypeSwitch = ({ parentQuestion, targetQuestion, ruleIndex }: Props)
break; break;
case "text": case "text":
return <TextInputsType targetQuestion={targetQuestion} parentQuestion={parentQuestion} ruleIndex={ruleIndex} /> return <TextInputsType targetQuestion={targetQuestion} parentQuestion={parentQuestion} ruleIndex={ruleIndex} setParentQuestion={setParentQuestion} />
//Реализован //Реализован
break; break;
case "file": case "file":
return <FileInputsType targetQuestion={targetQuestion} parentQuestion={parentQuestion} ruleIndex={ruleIndex} /> return <FileInputsType targetQuestion={targetQuestion} parentQuestion={parentQuestion} ruleIndex={ruleIndex} setParentQuestion={setParentQuestion} />
//Реализован //Реализован
break; break;
case "rating": case "rating":
return <RatingInputsType targetQuestion={targetQuestion} parentQuestion={parentQuestion} ruleIndex={ruleIndex} /> return <RatingInputsType targetQuestion={targetQuestion} parentQuestion={parentQuestion} ruleIndex={ruleIndex} setParentQuestion={setParentQuestion} />
//Реализован //Реализован
break; break;
@ -91,9 +93,10 @@ export const BlockRule = ({ text }: { text: string }) => {
>{text}</Typography> >{text}</Typography>
) )
} }
const SelectorType = ({ parentQuestion, targetQuestion, ruleIndex }: { parentQuestion: any, targetQuestion: any, ruleIndex: number }) => { const SelectorType = ({ parentQuestion, targetQuestion, ruleIndex, setParentQuestion }: Props) => {
const theme = useTheme(); const theme = useTheme();
const quizId = Number(useParams().quizId); const quizId = Number(useParams().quizId);
console.log(parentQuestion)
return ( return (
<Box <Box
@ -120,9 +123,9 @@ const SelectorType = ({ parentQuestion, targetQuestion, ruleIndex }: { parentQue
<IconButton <IconButton
sx={{ borderRadius: "6px", padding: "2px" }} sx={{ borderRadius: "6px", padding: "2px" }}
onClick={() => { onClick={() => {
const newParentQuestion = { ...parentQuestion } let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion))
newParentQuestion.content.rule.main.splice(ruleIndex, 1) newParentQuestion.content.rule.main.splice(ruleIndex, 1)
//updateQuestionsList(quizId, parentQuestion.index, parentQuestion); setParentQuestion(newParentQuestion)
}} }}
> >
<DeleteIcon color={"#4D4D4D"} /> <DeleteIcon color={"#4D4D4D"} />
@ -145,13 +148,15 @@ const SelectorType = ({ parentQuestion, targetQuestion, ruleIndex }: { parentQue
</Box> </Box>
<Select <Select
multiple multiple
value={parentQuestion.content.rule.main[ruleIndex].rules[0].answers} value={parentQuestion.content.rule.main[ruleIndex].rules[0].answers || []}
onChange={(event: SelectChangeEvent) => { onChange={(event: SelectChangeEvent) => {
const newParentQuestion = { ...parentQuestion } let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion))
parentQuestion.content.rule.main[ruleIndex].rules[0].answers = (event.target as HTMLSelectElement).value newParentQuestion.content.rule.main[ruleIndex].rules[0].answers = (event.target as HTMLSelectElement).value
//updateQuestionsList(quizId, parentQuestion.index, parentQuestion); setParentQuestion(newParentQuestion)
console.log(parentQuestion.content.rule.main[ruleIndex])
console.log(parentQuestion.content.rule.main[ruleIndex].rules[0])
console.log(parentQuestion.content.rule.main[ruleIndex].rules[0].answers)
}} }}
sx={{ sx={{
width: "100%", width: "100%",
@ -177,9 +182,9 @@ const SelectorType = ({ parentQuestion, targetQuestion, ruleIndex }: { parentQue
aria-labelledby="demo-controlled-radio-buttons-group" aria-labelledby="demo-controlled-radio-buttons-group"
value={parentQuestion.content.rule.main[ruleIndex].or} value={parentQuestion.content.rule.main[ruleIndex].or}
onChange={(_, value) => { onChange={(_, value) => {
const newParentQuestion = { ...parentQuestion } let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion))
parentQuestion.content.rule.main[ruleIndex].or = value newParentQuestion.content.rule.main[ruleIndex].or = value
//updateQuestionsList(quizId, parentQuestion.index, parentQuestion); setParentQuestion(newParentQuestion)
}} }}
> >
{CONDITIONS.map((condition, totalIndex) => ( {CONDITIONS.map((condition, totalIndex) => (
@ -203,11 +208,11 @@ const SelectorType = ({ parentQuestion, targetQuestion, ruleIndex }: { parentQue
</Box > </Box >
) )
} }
const DateInputsType = ({ parentQuestion, targetQuestion, ruleIndex }: { parentQuestion: any, targetQuestion: any, ruleIndex: number }) => { const DateInputsType = ({ parentQuestion, targetQuestion, ruleIndex, setParentQuestion }: Props) => {
return <></> return <></>
} }
const NumberInputsType = ({ parentQuestion, targetQuestion, ruleIndex }: { parentQuestion: any, targetQuestion: any, ruleIndex: number }) => { const NumberInputsType = ({ parentQuestion, targetQuestion, ruleIndex, setParentQuestion }: Props) => {
const theme = useTheme(); const theme = useTheme();
const quizId = Number(useParams().quizId); const quizId = Number(useParams().quizId);
@ -236,9 +241,9 @@ const NumberInputsType = ({ parentQuestion, targetQuestion, ruleIndex }: { paren
<IconButton <IconButton
sx={{ borderRadius: "6px", padding: "2px" }} sx={{ borderRadius: "6px", padding: "2px" }}
onClick={() => { onClick={() => {
const newParentQuestion = { ...parentQuestion } let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion))
newParentQuestion.content.rule.main.splice(ruleIndex, 1) newParentQuestion.content.rule.main.splice(ruleIndex, 1)
//updateQuestionsList(quizId, parentQuestion.index, parentQuestion); setParentQuestion(newParentQuestion)
}} }}
> >
<DeleteIcon color={"#4D4D4D"} /> <DeleteIcon color={"#4D4D4D"} />
@ -268,9 +273,9 @@ const NumberInputsType = ({ parentQuestion, targetQuestion, ruleIndex }: { paren
value={parentQuestion.content.rule.main[ruleIndex].rules[0].answers[0]} value={parentQuestion.content.rule.main[ruleIndex].rules[0].answers[0]}
onChange={(event: React.FormEvent<HTMLInputElement>) => { onChange={(event: React.FormEvent<HTMLInputElement>) => {
const newParentQuestion = { ...parentQuestion } let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion))
parentQuestion.content.rule.main[ruleIndex].rules[0].answers = [(event.target as HTMLInputElement).value.replace(/[^0-9,\s]/g, "")] newParentQuestion.content.rule.main[ruleIndex].rules[0].answers = [(event.target as HTMLInputElement).value.replace(/[^0-9,\s]/g, "")]
//updateQuestionsList(quizId, parentQuestion.index, parentQuestion); setParentQuestion(newParentQuestion)
}} }}
/> */} /> */}
@ -281,7 +286,7 @@ const NumberInputsType = ({ parentQuestion, targetQuestion, ruleIndex }: { paren
</Box > </Box >
) )
} }
const TextInputsType = ({ parentQuestion, targetQuestion, ruleIndex }: { parentQuestion: any, targetQuestion: any, ruleIndex: number }) => { const TextInputsType = ({ parentQuestion, targetQuestion, ruleIndex, setParentQuestion }: Props) => {
const theme = useTheme(); const theme = useTheme();
const quizId = Number(useParams().quizId); const quizId = Number(useParams().quizId);
@ -310,9 +315,9 @@ const TextInputsType = ({ parentQuestion, targetQuestion, ruleIndex }: { parentQ
<IconButton <IconButton
sx={{ borderRadius: "6px", padding: "2px" }} sx={{ borderRadius: "6px", padding: "2px" }}
onClick={() => { onClick={() => {
const newParentQuestion = { ...parentQuestion } let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion))
newParentQuestion.content.rule.main.splice(ruleIndex, 1) newParentQuestion.content.rule.main.splice(ruleIndex, 1)
//updateQuestionsList(quizId, parentQuestion.index, parentQuestion); setParentQuestion(newParentQuestion)
}} }}
> >
<DeleteIcon color={"#4D4D4D"} /> <DeleteIcon color={"#4D4D4D"} />
@ -341,9 +346,9 @@ const TextInputsType = ({ parentQuestion, targetQuestion, ruleIndex }: { parentQ
value={parentQuestion.content.rule.main[ruleIndex].rules[0].answers[0]} value={parentQuestion.content.rule.main[ruleIndex].rules[0].answers[0]}
onChange={(event: React.FormEvent<HTMLInputElement>) => { onChange={(event: React.FormEvent<HTMLInputElement>) => {
const newParentQuestion = { ...parentQuestion } let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion))
newParentQuestion.content.rule.main[ruleIndex].rules[0].answers = [(event.target as HTMLInputElement).value] newParentQuestion.content.rule.main[ruleIndex].rules[0].answers = [(event.target as HTMLInputElement).value]
//updateQuestionsList(quizId, parentQuestion.index, parentQuestion); setParentQuestion(newParentQuestion)
}} }}
/> */} /> */}
@ -354,7 +359,7 @@ const TextInputsType = ({ parentQuestion, targetQuestion, ruleIndex }: { parentQ
</Box > </Box >
) )
} }
const FileInputsType = ({ parentQuestion, targetQuestion, ruleIndex }: { parentQuestion: any, targetQuestion: any, ruleIndex: number }) => { const FileInputsType = ({ parentQuestion, targetQuestion, ruleIndex, setParentQuestion }: Props) => {
const theme = useTheme(); const theme = useTheme();
const quizId = Number(useParams().quizId); const quizId = Number(useParams().quizId);
@ -383,9 +388,9 @@ const FileInputsType = ({ parentQuestion, targetQuestion, ruleIndex }: { parentQ
<IconButton <IconButton
sx={{ borderRadius: "6px", padding: "2px" }} sx={{ borderRadius: "6px", padding: "2px" }}
onClick={() => { onClick={() => {
const newParentQuestion = { ...parentQuestion } let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion))
newParentQuestion.content.rule.main.splice(ruleIndex, 1) newParentQuestion.content.rule.main.splice(ruleIndex, 1)
//updateQuestionsList(quizId, parentQuestion.index, parentQuestion); setParentQuestion(newParentQuestion)
}} }}
> >
<DeleteIcon color={"#4D4D4D"} /> <DeleteIcon color={"#4D4D4D"} />
@ -411,9 +416,9 @@ const FileInputsType = ({ parentQuestion, targetQuestion, ruleIndex }: { parentQ
checked={parentQuestion.content.rule.main[ruleIndex].rules[0].answers[0]} checked={parentQuestion.content.rule.main[ruleIndex].rules[0].answers[0]}
onChange={(event: React.FormEvent<HTMLInputElement>) => { onChange={(event: React.FormEvent<HTMLInputElement>) => {
const newParentQuestion = { ...parentQuestion } let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion))
parentQuestion.content.rule.main[ruleIndex].rules[0].answers = [(event.target as HTMLInputElement).checked] newParentQuestion.content.rule.main[ruleIndex].rules[0].answers = [(event.target as HTMLInputElement).checked]
//updateQuestionsList(quizId, parentQuestion.index, parentQuestion); setParentQuestion(newParentQuestion)
}} }}
/>} label="да" /> />} label="да" />
@ -424,7 +429,7 @@ const FileInputsType = ({ parentQuestion, targetQuestion, ruleIndex }: { parentQ
</Box > </Box >
) )
} }
const RatingInputsType = ({ parentQuestion, targetQuestion, ruleIndex }: { parentQuestion: any, targetQuestion: any, ruleIndex: number }) => { const RatingInputsType = ({ parentQuestion, targetQuestion, ruleIndex, setParentQuestion }: Props) => {
const theme = useTheme(); const theme = useTheme();
const quizId = Number(useParams().quizId); const quizId = Number(useParams().quizId);
@ -453,9 +458,9 @@ const RatingInputsType = ({ parentQuestion, targetQuestion, ruleIndex }: { paren
<IconButton <IconButton
sx={{ borderRadius: "6px", padding: "2px" }} sx={{ borderRadius: "6px", padding: "2px" }}
onClick={() => { onClick={() => {
const newParentQuestion = { ...parentQuestion } let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion))
newParentQuestion.content.rule.main.splice(ruleIndex, 1) newParentQuestion.content.rule.main.splice(ruleIndex, 1)
//updateQuestionsList(quizId, parentQuestion.index, parentQuestion); setParentQuestion(newParentQuestion)
}} }}
> >
<DeleteIcon color={"#4D4D4D"} /> <DeleteIcon color={"#4D4D4D"} />
@ -481,9 +486,9 @@ const RatingInputsType = ({ parentQuestion, targetQuestion, ruleIndex }: { paren
value={parentQuestion.content.rule.main[ruleIndex].rules[0].answers[0]} value={parentQuestion.content.rule.main[ruleIndex].rules[0].answers[0]}
onChange={(event: React.FormEvent<HTMLInputElement>) => { onChange={(event: React.FormEvent<HTMLInputElement>) => {
const newParentQuestion = { ...parentQuestion } let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion))
parentQuestion.content.rule.main[ruleIndex].rules[0].answers = [(event.target as HTMLInputElement).value.replace(/[^0-9,\s]/g, "")] newParentQuestion.content.rule.main[ruleIndex].rules[0].answers = [(event.target as HTMLInputElement).value.replace(/[^0-9,\s]/g, "")]
//updateQuestionsList(quizId, parentQuestion.index, parentQuestion); setParentQuestion(newParentQuestion)
}} }}
/> */} /> */}

5
src/pages/Questions/ButtonsOptions.tsx
View File

@ -19,6 +19,7 @@ import Clue from "../../assets/icons/questionsPage/clue";
import { HideIcon } from "../../assets/icons/questionsPage/hideIcon"; import { HideIcon } from "../../assets/icons/questionsPage/hideIcon";
import SettingIcon from "../../assets/icons/questionsPage/settingIcon"; import SettingIcon from "../../assets/icons/questionsPage/settingIcon";
import type { AnyTypedQuizQuestion } from "../../model/questionTypes/shared"; import type { AnyTypedQuizQuestion } from "../../model/questionTypes/shared";
import { updateOpenedModalSettingsId } from "@root/questions/actions";
interface Props { interface Props {
@ -38,9 +39,7 @@ export default function ButtonsOptions({
const isWrappMiniButtonSetting = useMediaQuery(theme.breakpoints.down(920)); const isWrappMiniButtonSetting = useMediaQuery(theme.breakpoints.down(920));
const openedModal = () => { const openedModal = () => {
updateQuestion(question.id, question => { updateOpenedModalSettingsId(question.id)
question.openedModalSettings = true;
});
}; };
const buttonSetting: { const buttonSetting: {

6
src/pages/Questions/ButtonsOptionsAndPict.tsx
View File

@ -22,6 +22,7 @@ import { HideIcon } from "../../assets/icons/questionsPage/hideIcon";
import ImgIcon from "../../assets/icons/questionsPage/imgIcon"; import ImgIcon from "../../assets/icons/questionsPage/imgIcon";
import SettingIcon from "../../assets/icons/questionsPage/settingIcon"; import SettingIcon from "../../assets/icons/questionsPage/settingIcon";
import { QuizQuestionVariant } from "@model/questionTypes/variant"; import { QuizQuestionVariant } from "@model/questionTypes/variant";
import { updateOpenedModalSettingsId } from "@root/questions/actions";
interface Props { interface Props {
@ -183,10 +184,7 @@ export default function ButtonsOptionsAndPict({
onMouseEnter={() => setButtonHover("branching")} onMouseEnter={() => setButtonHover("branching")}
onMouseLeave={() => setButtonHover("")} onMouseLeave={() => setButtonHover("")}
onClick={() => { onClick={() => {
SSHC("branching"); updateOpenedModalSettingsId(question.id)
updateQuestion(question.id, question => {
question.openedModalSettings = true;
});
}} }}
sx={{ sx={{
height: "30px", height: "30px",

2
src/pages/Questions/QuestionsPage.tsx
View File

@ -101,7 +101,7 @@ export default function QuestionsPage() {
</Box> </Box>
</Box> </Box>
{createPortal(<QuizPreview />, document.body)} {createPortal(<QuizPreview />, document.body)}
{/* {openedModalSettingsId !== null && <BranchingQuestions/>} */} {openedModalSettingsId !== null && <BranchingQuestions/>}
</> </>
); );
} }