diff --git a/src/pages/Questions/answerOptions/AnswerOptions.tsx b/src/pages/Questions/answerOptions/AnswerOptions.tsx index a8dd2c10..a80bc3e7 100755 --- a/src/pages/Questions/answerOptions/AnswerOptions.tsx +++ b/src/pages/Questions/answerOptions/AnswerOptions.tsx @@ -5,20 +5,20 @@ import SwitchAnswerOptions from "./switchAnswerOptions"; import ButtonsOptionsAndPict from "../ButtonsOptionsAndPict"; import QuestionsPageCard from "../QuestionPageCard"; import { useParams } from "react-router-dom"; -import { questionStore, updateQuestionsList } from "@root/questions"; +import { Variants, questionStore, updateQuestionsList } from "@root/questions"; import PointsIcon from "@icons/questionsPage/PointsIcon"; import DeleteIcon from "@icons/questionsPage/deleteIcon"; import MessageIcon from "@icons/messagIcon"; import Popover from "@mui/material/Popover"; import TextareaAutosize from "@mui/base/TextareaAutosize"; +// Импортируем интерфейс Varian + interface Props { totalIndex: number; } export default function AnswerOptions({ totalIndex }: Props) { - const params = Number(useParams().quizId); - const { listQuestions } = questionStore(); const Answer = listQuestions[totalIndex].content.variants; console.log(Answer); @@ -27,22 +27,21 @@ export default function AnswerOptions({ totalIndex }: Props) { const SSHC = (data: string) => { setSwitchState(data); }; - // const [openBranch, setOpenBranch] = useState(false); - // const handleOpenBranch = () => setOpenBranch(true); - // const handleCloseBranch = () => setOpenBranch(false); - const [anchorEl, setAnchorEl] = React.useState(null); + const [isOpen, setIsOpen] = React.useState(false); + const [anchorEl, setAnchorEl] = React.useState(null); // Объявление состояния для anchorEl const handleClick = (event: React.MouseEvent) => { setAnchorEl(event.currentTarget); + setIsOpen(true); }; const handleClose = () => { - setAnchorEl(null); + setIsOpen(false); }; - const open = Boolean(anchorEl); - const id = open ? "simple-popover" : undefined; + const id = "my-popover-id"; + return ( <> @@ -60,14 +59,14 @@ export default function AnswerOptions({ totalIndex }: Props) { ) : ( - {Answer.map((answer: string, index: number) => ( - + {Answer.map((variant: Variants, index: number) => ( + { - const answerNew = Answer; + const answerNew = Answer.slice(); // Create a shallow copy of the array answerNew[index].answer = e.target.value; let clonContent = listQuestions[totalIndex].content; clonContent.variants = answerNew; @@ -86,7 +85,7 @@ export default function AnswerOptions({ totalIndex }: Props) { { - const answerNew = Answer; + const answerNew = Answer.slice(); // Create a shallow copy of the array answerNew[index].hints = e.target.value; let clonContent = listQuestions[totalIndex].content; clonContent.variants = answerNew; @@ -109,7 +108,7 @@ export default function AnswerOptions({ totalIndex }: Props) { { - const answerNew = Answer; + const answerNew = Answer.slice(); // Create a shallow copy of the array answerNew.splice(index, 1); let clonContent = listQuestions[totalIndex].content; clonContent.variants = answerNew; @@ -147,8 +146,12 @@ export default function AnswerOptions({ totalIndex }: Props) { variant="body2" sx={{ color: theme.palette.brightPurple.main }} onClick={() => { - const answerNew = Answer; - answerNew.push({ answer: "" }); + const answerNew = Answer.slice(); // Create a shallow copy of the array + answerNew.push({ + answer: "", + answerLong: "", + hints: "", + }); let clonContent = listQuestions[totalIndex].content; clonContent.variants = answerNew; updateQuestionsList(totalIndex, { content: clonContent }); diff --git a/src/stores/questions.ts b/src/stores/questions.ts index 37ef272f..0279da87 100644 --- a/src/stores/questions.ts +++ b/src/stores/questions.ts @@ -1,7 +1,7 @@ import { create } from "zustand"; import { persist } from "zustand/middleware"; -type Variants = { +export type Variants = { answer: string; answerLong: string; hints: string;