diff --git a/package.json b/package.json index 3a9de541..1e59ab71 100755 --- a/package.json +++ b/package.json @@ -7,7 +7,6 @@ "@emotion/react": "^11.10.5", "@emotion/styled": "^11.10.5", "@frontend/kitui": "^1.0.63", - "@frontend/squzanswerer": "^1.0.0", "@mui/icons-material": "^5.10.14", "@mui/material": "^5.10.14", "@mui/x-date-pickers": "^6.16.1", diff --git a/src/App.tsx b/src/App.tsx index 5dea049d..5b2695e0 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -236,7 +236,7 @@ export default function App() { } /> } /> - } /> + {/* } /> */} } /> } /> }> diff --git a/src/pages/Questions/ButtonsOptions/ButtonsOptions.tsx b/src/pages/Questions/ButtonsOptions/ButtonsOptions.tsx new file mode 100644 index 00000000..88501fdc --- /dev/null +++ b/src/pages/Questions/ButtonsOptions/ButtonsOptions.tsx @@ -0,0 +1,273 @@ +import { DoubleArrowRight } from "@icons/questionsPage/DoubleArrowRight"; +import { DoubleTick } from "@icons/questionsPage/DoubleTick"; +import { VectorQuestions } from "@icons/questionsPage/VectorQuestions"; +import { DeleteIcon } from "@icons/questionsPage/deleteIcon"; +import type { SxProps } from "@mui/material"; +import { + Box, + Button, + IconButton, + Modal, + Tooltip, + Typography, + useMediaQuery, + useTheme, +} from "@mui/material"; +import { + copyQuestion, + deleteQuestion, + deleteQuestionWithTimeout, + clearRuleForAll, + updateQuestion, + getQuestionByContentId, +} from "@root/questions/actions"; +import { updateDesireToOpenABranchingModal } from "@root/uiTools/actions"; +import MiniButtonSetting from "@ui_kit/MiniButtonSetting"; +import { CopyIcon } from "../../assets/icons/questionsPage/CopyIcon"; +import Branching from "../../assets/icons/questionsPage/branching"; +import Clue from "../../assets/icons/questionsPage/clue"; +import { HideIcon } from "../../assets/icons/questionsPage/hideIcon"; +import SettingIcon from "../../assets/icons/questionsPage/settingIcon"; +import type { AnyTypedQuizQuestion } from "../../model/questionTypes/shared"; +import { useCurrentQuiz } from "@root/quizes/hooks"; +import { enqueueSnackbar } from "notistack"; +import { useQuestionsStore } from "@root/questions/store"; +import { updateOpenedModalSettingsId } from "@root/uiTools/actions"; +import { updateRootContentId } from "@root/quizes/actions"; +import { useUiTools } from "@root/uiTools/store"; +import { useState } from "react"; +import { updateSomeWorkBackend } from "@root/uiTools/actions"; +import { DeleteFunction } from "@utils/deleteFunc"; + +interface Props { + switchState: string; + SSHC: (data: string) => void; + question: AnyTypedQuizQuestion; + sx?: SxProps; + openBranchingPage: boolean; + setOpenBranchingPage: (a: boolean) => void; +} + +export default function ButtonsOptions({ + SSHC, + switchState, + question, + openBranchingPage, + setOpenBranchingPage, +}: Props) { + const theme = useTheme(); + const isMobile = useMediaQuery(theme.breakpoints.down(790)); + const isWrappMiniButtonSetting = useMediaQuery(theme.breakpoints.down(920)); + const quiz = useCurrentQuiz(); + const { questions } = useQuestionsStore.getState(); + const [openDelete, setOpenDelete] = useState(false); + + const openedModal = () => { + setOpenBranchingPage(true); + updateDesireToOpenABranchingModal(question.content.id); + }; + + const buttonSetting: { + icon: JSX.Element; + title: string; + value: string; + myFunc?: any; + }[] = [ + { + icon: ( + + ), + title: "Настройки", + value: "setting", + }, + { + icon: ( + + ), + title: "Ветвление", + value: "branching", + myFunc: (question) => { + setOpenBranchingPage(true); + updateDesireToOpenABranchingModal(question.content.id); + }, + }, + ]; + + return ( + + + {buttonSetting.map(({ icon, title, value, myFunc }) => ( + + {value === "branching" ? ( + question.type === "page" || + question.type === "text" || + question.type === "date" || + question.type === "number" ? ( + <> + ) : ( + { + openedModal(); + }} + sx={{ + display: quiz.config.type === "form" ? "none" : "flex", + backgroundColor: + switchState === value + ? theme.palette.brightPurple.main + : "transparent", + color: + switchState === value + ? "#ffffff" + : theme.palette.grey3.main, + minWidth: isWrappMiniButtonSetting ? "30px" : "64px", + height: "30px", + "&:hover": { + color: theme.palette.grey3.main, + "& path": { stroke: theme.palette.grey3.main }, + }, + }} + > + {icon} + {isWrappMiniButtonSetting ? null : title} + + ) + ) : ( + <> + { + SSHC(value); + myFunc(); + }} + sx={{ + backgroundColor: + switchState === value + ? theme.palette.brightPurple.main + : "transparent", + color: + switchState === value + ? "#ffffff" + : theme.palette.grey3.main, + minWidth: isWrappMiniButtonSetting ? "30px" : "64px", + height: "30px", + "&:hover": { + color: theme.palette.grey3.main, + "& path": { stroke: theme.palette.grey3.main }, + }, + }} + > + {icon} + {isWrappMiniButtonSetting ? null : title} + + + )} + + ))} + + + copyQuestion(question.id, question.quizId)} + > + + + {(quiz?.config.type !== "form" || question.id !== questions[0].id) && ( + { + if (question.type === null) { + deleteQuestion(question.id); + } + if (question.content.rule.parentId.length !== 0) { + setOpenDelete(true); + } else { + deleteQuestionWithTimeout(question.id, () => + DeleteFunction(questions, question, quiz), + ); + } + }} + data-cy="delete-question" + > + + + )} + setOpenDelete(false)}> + + + Вы удаляете вопрос, участвующий в ветвлении. Все его потомки + потеряют данные ветвления. Вы уверены, что хотите удалить вопрос? + + + + + + + + + + ); +} diff --git a/src/pages/Questions/ButtonsOptions/switchOptionsAndPict.tsx b/src/pages/Questions/ButtonsOptions/switchOptionsAndPict.tsx new file mode 100644 index 00000000..30b53b8a --- /dev/null +++ b/src/pages/Questions/ButtonsOptions/switchOptionsAndPict.tsx @@ -0,0 +1,25 @@ +import { QuizQuestionVarImg } from "@model/questionTypes/varimg"; +import UploadImage from "../UploadImage"; +import HelpQuestions from "../helpQuestions"; +import SettingOptionsAndPict from "./SettingOptionsAndPict"; + +interface Props { + switchState: string; + question: QuizQuestionVarImg; +} + +export default function SwitchOptionsAndPict({ + switchState = "setting", + question, +}: Props) { + switch (switchState) { + case "setting": + return ; + case "help": + return ; + case "image": + return ; + default: + return <>; + } +} diff --git a/src/pages/Questions/ButtonsOptionsAndPict.tsx b/src/pages/Questions/ButtonsOptionsAndPict.tsx index c93c0b0d..1a5be8cf 100644 --- a/src/pages/Questions/ButtonsOptionsAndPict.tsx +++ b/src/pages/Questions/ButtonsOptionsAndPict.tsx @@ -205,43 +205,46 @@ export default function ButtonsOptionsAndPict({ } > */} - setButtonHover("branching")} - onMouseLeave={() => setButtonHover("")} - onClick={() => { - setOpenBranchingPage(true); - updateDesireToOpenABranchingModal(question.content.id); - }} - sx={{ - display: quiz.config.type === "form" ? "none" : "flex", - height: "30px", - maxWidth: "103px", - minWidth: isIconMobile ? "30px" : "64px", - backgroundColor: - switchState === "branching" - ? theme.palette.brightPurple.main - : "transparent", - color: - switchState === "branching" - ? "#ffffff" - : theme.palette.grey3.main, - "&:hover": { + {question.type !== "text" + && + setButtonHover("branching")} + onMouseLeave={() => setButtonHover("")} + onClick={() => { + setOpenBranchingPage(true); + updateDesireToOpenABranchingModal(question.content.id); + }} + sx={{ + display: quiz.config.type === "form" ? "none" : "flex", + height: "30px", + maxWidth: "103px", + minWidth: isIconMobile ? "30px" : "64px", + backgroundColor: + switchState === "branching" + ? theme.palette.brightPurple.main + : "transparent", color: - switchState === "branching" ? theme.palette.grey3.main : null, - }, - }} - > - - {isIconMobile ? null : "Ветвление"} - + : theme.palette.grey3.main, + "&:hover": { + color: + switchState === "branching" ? theme.palette.grey3.main : null, + }, + }} + > + + {isIconMobile ? null : "Ветвление"} + + } {/* */} setButtonHover("image")} diff --git a/src/pages/Questions/Emoji/Emoji.tsx b/src/pages/Questions/Emoji/Emoji.tsx index c30ebcc8..f16d2272 100644 --- a/src/pages/Questions/Emoji/Emoji.tsx +++ b/src/pages/Questions/Emoji/Emoji.tsx @@ -51,7 +51,7 @@ export default function Emoji({ ( - <> + <>Оооооо, тестовая публикация получа {!isTablet && ( { updateQuestion(question.id, (question) => { if (question.type !== "varimg") return; @@ -100,7 +101,7 @@ export default function SettingOptionsAndPict({ }} maxLength={60} placeholder={"Пример текста"} - text={question.content.replText} + value={question.content.replText} onChange={({ target }) => setReplText(target.value)} /> @@ -182,7 +183,7 @@ export default function SettingOptionsAndPict({ setReplText(target.value)} /> diff --git a/src/pages/Questions/OwnTextField/OwnTextField.tsx b/src/pages/Questions/OwnTextField/OwnTextField.tsx index 4be6ad4a..a70cab56 100644 --- a/src/pages/Questions/OwnTextField/OwnTextField.tsx +++ b/src/pages/Questions/OwnTextField/OwnTextField.tsx @@ -14,6 +14,7 @@ import type { QuizQuestionText } from "../../../model/questionTypes/text"; import ButtonsOptions from "../ButtonsOptions"; import SwitchTextField from "./switchTextField"; import TooltipClickInfo from "@ui_kit/Toolbars/TooltipClickInfo"; +import ButtonsOptionsAndPict from "../ButtonsOptionsAndPict"; interface Props { question: QuizQuestionText; @@ -100,7 +101,7 @@ export default function OwnTextField({ )} - ; + case "image": + return ; case "help": return ; default: diff --git a/src/pages/ViewPublicationPage.tsx b/src/pages/ViewPublicationPage.tsx index 6480cdb6..037a2366 100644 --- a/src/pages/ViewPublicationPage.tsx +++ b/src/pages/ViewPublicationPage.tsx @@ -1,4 +1,4 @@ -import { QuizView } from "@frontend/squzanswerer"; +// import { QuizView } from "@frontend/squzanswerer"; import { Box } from "@mui/material"; import { useParams } from "react-router-dom"; diff --git a/src/pages/auth/Signup.tsx b/src/pages/auth/Signup.tsx index 5c86a2d4..67999b12 100644 --- a/src/pages/auth/Signup.tsx +++ b/src/pages/auth/Signup.tsx @@ -39,7 +39,7 @@ const validationSchema = object({ password: string() .min(8, "Минимум 8 символов") .matches( - /^[.,:;\-_+!&()<>\[\]{}№`@"~*|#$%^=?\d\w]+$/, + /^[.,:;\-_+!&()<>\[\]{}№`@"'~*|#$₽%^=?\d\w]+$/, "Некорректные символы", ) .required("Поле обязательно"),