diff --git a/src/constants/base.ts b/src/constants/base.ts index 09602098..b403e747 100644 --- a/src/constants/base.ts +++ b/src/constants/base.ts @@ -10,6 +10,16 @@ export const QUIZ_QUESTION_BASE: Omit = { text: "", video: "", }, + rule: { + or: true, + show: true, + reqs: [ + { + id: "", + vars: [], + }, + ], + }, back: "", autofill: false, }, diff --git a/src/constants/date.ts b/src/constants/date.ts index 8b217313..648c9d78 100644 --- a/src/constants/date.ts +++ b/src/constants/date.ts @@ -13,19 +13,5 @@ export const QUIZ_QUESTION_DATE: Omit = { type: "calendar", dateRange: false, time: false, - hint: { - text: "", - video: "", - }, - rule: { - or: true, - show: true, - reqs: [ - { - id: "", - vars: [], - }, - ], - }, }, }; diff --git a/src/constants/emoji.ts b/src/constants/emoji.ts index 4751a692..48811534 100644 --- a/src/constants/emoji.ts +++ b/src/constants/emoji.ts @@ -19,19 +19,5 @@ export const QUIZ_QUESTION_EMOJI: Omit = { extendedText: "", }, ], - hint: { - text: "", - video: "", - }, - rule: { - or: true, - show: true, - reqs: [ - { - id: "", - vars: [], - }, - ], - }, }, }; diff --git a/src/constants/file.ts b/src/constants/file.ts index 922d6d18..425b28e7 100644 --- a/src/constants/file.ts +++ b/src/constants/file.ts @@ -11,19 +11,5 @@ export const QUIZ_QUESTION_FILE: Omit = { innerNameCheck: false, innerName: "", type: "all", - hint: { - text: "", - video: "", - }, - rule: { - or: true, - show: true, - reqs: [ - { - id: "", - vars: [], - }, - ], - }, }, }; diff --git a/src/constants/images.ts b/src/constants/images.ts index 7cb27e0f..ed338d07 100644 --- a/src/constants/images.ts +++ b/src/constants/images.ts @@ -22,20 +22,6 @@ export const QUIZ_QUESTION_IMAGES: Omit = { extendedText: "", }, ], - hint: { - text: "", - video: "", - }, - rule: { - or: true, - show: true, - reqs: [ - { - id: "", - vars: [], - }, - ], - }, largeCheck: false, }, }; diff --git a/src/constants/number.ts b/src/constants/number.ts index 10af288e..314dad16 100644 --- a/src/constants/number.ts +++ b/src/constants/number.ts @@ -16,20 +16,6 @@ export const QUIZ_QUESTION_NUMBER: Omit = { steps: 5, start: 50, chooseRange: false, - hint: { - text: "", - video: "", - }, - rule: { - or: true, - show: true, - reqs: [ - { - id: "", - vars: [], - }, - ], - }, form: "star", }, }; diff --git a/src/constants/page.ts b/src/constants/page.ts index c4faa34d..ce92a8b1 100644 --- a/src/constants/page.ts +++ b/src/constants/page.ts @@ -11,19 +11,5 @@ export const QUIZ_QUESTION_PAGE: Omit = { innerName: "", text: "", video: "", - hint: { - text: "", - video: "", - }, - rule: { - or: true, - show: true, - reqs: [ - { - id: "", - vars: [], - }, - ], - }, }, }; diff --git a/src/constants/rating.ts b/src/constants/rating.ts index 27ec6cc6..ea604214 100644 --- a/src/constants/rating.ts +++ b/src/constants/rating.ts @@ -14,19 +14,5 @@ export const QUIZ_QUESTION_RATING: Omit = { ratingExpanded: false, ratingDescription: "", form: "", - hint: { - text: "", - video: "", - }, - rule: { - or: true, - show: true, - reqs: [ - { - id: "", - vars: [], - }, - ], - }, }, }; diff --git a/src/constants/select.ts b/src/constants/select.ts index d67b7ca2..cf1873bb 100644 --- a/src/constants/select.ts +++ b/src/constants/select.ts @@ -12,19 +12,6 @@ export const QUIZ_QUESTION_SELECT: Omit = { innerNameCheck: false, innerName: "", default: "", - hint: { - text: "", - video: "", - }, - rule: { - or: true, - show: true, - reqs: [ - { - id: "", - vars: [], - }, - ], - }, + variants: [{ answer: "", hints: "", extendedText: "" }], }, }; diff --git a/src/constants/text.ts b/src/constants/text.ts index 5d32ff4f..d589fe98 100644 --- a/src/constants/text.ts +++ b/src/constants/text.ts @@ -12,19 +12,5 @@ export const QUIZ_QUESTION_TEXT: Omit = { innerName: "", required: false, answerType: "single", - hint: { - text: "", - video: "", - }, - rule: { - or: true, - show: true, - reqs: [ - { - id: "", - vars: [], - }, - ], - }, }, }; diff --git a/src/constants/variant.ts b/src/constants/variant.ts index b49963c5..b16a2a7a 100644 --- a/src/constants/variant.ts +++ b/src/constants/variant.ts @@ -14,19 +14,5 @@ export const QUIZ_QUESTION_VARIANT: Omit = { required: false, innerName: "", variants: [{ answer: "", hints: "", extendedText: "" }], - hint: { - text: "", - video: "", - }, - rule: { - or: true, - show: true, - reqs: [ - { - id: "", - vars: [], - }, - ], - }, }, }; diff --git a/src/constants/varimg.ts b/src/constants/varimg.ts index 027af803..6f98bdae 100644 --- a/src/constants/varimg.ts +++ b/src/constants/varimg.ts @@ -12,20 +12,6 @@ export const QUIZ_QUESTION_VARIMG: Omit = { innerName: "", required: false, variants: [{ answer: "", hints: "", extendedText: "" }], - hint: { - text: "", - video: "", - }, - rule: { - or: true, - show: true, - reqs: [ - { - id: "", - vars: [], - }, - ], - }, largeCheck: false, replText: "", }, diff --git a/src/model/questionTypes/date.ts b/src/model/questionTypes/date.ts index 3d3cd287..18a7df45 100644 --- a/src/model/questionTypes/date.ts +++ b/src/model/questionTypes/date.ts @@ -1,7 +1,7 @@ import type { QuizQuestionBase, - QuizQuestionBranchingRules, - QuizQuestionHint, + QuestionHint, + QuestionBranchingRule, } from "./shared"; export interface QuizQuestionDate extends QuizQuestionBase { @@ -16,8 +16,8 @@ export interface QuizQuestionDate extends QuizQuestionBase { type: "calendar" | "mask"; dateRange: boolean; time: boolean; - hint: QuizQuestionHint; - rule: QuizQuestionBranchingRules; + hint: QuestionHint; + rule: QuestionBranchingRule; back: string; autofill: boolean; }; diff --git a/src/model/questionTypes/emoji.ts b/src/model/questionTypes/emoji.ts index 0f3f5272..84193a43 100644 --- a/src/model/questionTypes/emoji.ts +++ b/src/model/questionTypes/emoji.ts @@ -1,8 +1,8 @@ import type { QuizQuestionBase, - QuizQuestionBranchingRules, - QuizQuestionHint, - Variant, + QuestionVariant, + QuestionHint, + QuestionBranchingRule, } from "./shared"; export interface QuizQuestionEmoji extends QuizQuestionBase { @@ -18,9 +18,9 @@ export interface QuizQuestionEmoji extends QuizQuestionBase { innerName: string; /** Чекбокс "Необязательный вопрос" */ required: boolean; - variants: Variant[]; - hint: QuizQuestionHint; - rule: QuizQuestionBranchingRules; + variants: QuestionVariant[]; + hint: QuestionHint; + rule: QuestionBranchingRule; back: string; autofill: boolean; }; diff --git a/src/model/questionTypes/file.ts b/src/model/questionTypes/file.ts index 603b7bcb..514424f2 100644 --- a/src/model/questionTypes/file.ts +++ b/src/model/questionTypes/file.ts @@ -1,7 +1,7 @@ import type { QuizQuestionBase, - QuizQuestionBranchingRules, - QuizQuestionHint, + QuestionHint, + QuestionBranchingRule, } from "./shared"; export const uploadFileTypesMap = { @@ -26,8 +26,8 @@ export interface QuizQuestionFile extends QuizQuestionBase { /** Чекбокс "Автозаполнение адреса" */ autofill: boolean; type: UploadFileType; - hint: QuizQuestionHint; - rule: QuizQuestionBranchingRules; + hint: QuestionHint; + rule: QuestionBranchingRule; back: string; }; } diff --git a/src/model/questionTypes/images.ts b/src/model/questionTypes/images.ts index 86cae425..d555b7e7 100644 --- a/src/model/questionTypes/images.ts +++ b/src/model/questionTypes/images.ts @@ -1,8 +1,8 @@ import type { QuizQuestionBase, - QuizQuestionBranchingRules, - QuizQuestionHint, - Variant, + QuestionVariant, + QuestionHint, + QuestionBranchingRule, } from "./shared"; export interface QuizQuestionImages extends QuizQuestionBase { @@ -25,9 +25,9 @@ export interface QuizQuestionImages extends QuizQuestionBase { /** Чекбокс "Необязательный вопрос" */ required: boolean; /** Варианты (картинки) */ - variants: Variant[]; - hint: QuizQuestionHint; - rule: QuizQuestionBranchingRules; + variants: QuestionVariant[]; + hint: QuestionHint; + rule: QuestionBranchingRule; back: string; autofill: boolean; largeCheck: boolean; diff --git a/src/model/questionTypes/number.ts b/src/model/questionTypes/number.ts index 727515ea..2beb1f5c 100644 --- a/src/model/questionTypes/number.ts +++ b/src/model/questionTypes/number.ts @@ -1,7 +1,7 @@ import type { QuizQuestionBase, - QuizQuestionBranchingRules, - QuizQuestionHint, + QuestionHint, + QuestionBranchingRule, } from "./shared"; export interface QuizQuestionNumber extends QuizQuestionBase { @@ -24,8 +24,8 @@ export interface QuizQuestionNumber extends QuizQuestionBase { steps: number; /** Чекбокс "Выбор диапазона (два ползунка)" */ chooseRange: boolean; - hint: QuizQuestionHint; - rule: QuizQuestionBranchingRules; + hint: QuestionHint; + rule: QuestionBranchingRule; back: string; autofill: boolean; form: "star" | "trophie" | "flag" | "heart" | "like" | "bubble" | "hashtag"; diff --git a/src/model/questionTypes/page.ts b/src/model/questionTypes/page.ts index de3b1845..c9c0fc02 100644 --- a/src/model/questionTypes/page.ts +++ b/src/model/questionTypes/page.ts @@ -1,7 +1,7 @@ import type { QuizQuestionBase, - QuizQuestionBranchingRules, - QuizQuestionHint, + QuestionHint, + QuestionBranchingRule, } from "./shared"; export interface QuizQuestionPage extends QuizQuestionBase { @@ -13,8 +13,8 @@ export interface QuizQuestionPage extends QuizQuestionBase { innerName: string; text: string; video: string; - hint: QuizQuestionHint; - rule: QuizQuestionBranchingRules; + hint: QuestionHint; + rule: QuestionBranchingRule; back: string; autofill: boolean; }; diff --git a/src/model/questionTypes/rating.ts b/src/model/questionTypes/rating.ts index bb440881..8fde1115 100644 --- a/src/model/questionTypes/rating.ts +++ b/src/model/questionTypes/rating.ts @@ -1,7 +1,7 @@ import type { QuizQuestionBase, - QuizQuestionBranchingRules, - QuizQuestionHint, + QuestionHint, + QuestionBranchingRule, } from "./shared"; export interface QuizQuestionRating extends QuizQuestionBase { @@ -18,8 +18,8 @@ export interface QuizQuestionRating extends QuizQuestionBase { ratingDescription: string; /** Форма иконки */ form: string; - hint: QuizQuestionHint; - rule: QuizQuestionBranchingRules; + hint: QuestionHint; + rule: QuestionBranchingRule; back: string; autofill: boolean; }; diff --git a/src/model/questionTypes/select.ts b/src/model/questionTypes/select.ts index 5a5e5860..6b734a90 100644 --- a/src/model/questionTypes/select.ts +++ b/src/model/questionTypes/select.ts @@ -1,8 +1,8 @@ import type { QuizQuestionBase, - QuizQuestionBranchingRules, - QuizQuestionHint, - Variant, + QuestionVariant, + QuestionHint, + QuestionBranchingRule, } from "./shared"; export interface QuizQuestionSelect extends QuizQuestionBase { @@ -18,9 +18,9 @@ export interface QuizQuestionSelect extends QuizQuestionBase { innerName: string; /** Поле "Текст в выпадающем списке" */ default: string; - hint: QuizQuestionHint; - rule: QuizQuestionBranchingRules; - variants: Variant[]; + variants: QuestionVariant[]; + rule: QuestionBranchingRule; + hint: QuestionHint; back: string; autofill: boolean; }; diff --git a/src/model/questionTypes/shared.ts b/src/model/questionTypes/shared.ts index 751514fa..ab92bd65 100644 --- a/src/model/questionTypes/shared.ts +++ b/src/model/questionTypes/shared.ts @@ -10,7 +10,7 @@ import type { QuizQuestionText } from "./text"; import type { QuizQuestionVariant } from "./variant"; import type { QuizQuestionVarImg } from "./varimg"; -export interface QuizQuestionBranchingRules { +export interface QuestionBranchingRule { /** Радиокнопка "Все условия обязательны" */ or: boolean; show: boolean; @@ -21,24 +21,22 @@ export interface QuizQuestionBranchingRules { }[]; } -export interface QuizQuestionHint { +export interface QuestionHint { /** Текст подсказки */ text: string; /** URL видео подсказки */ video: string; } -export type Variant = { +export type QuestionVariant = { + /** Текст */ answer: string; + /** Текст подсказки */ hints: string; + /** Дополнительное поле для текста, emoji, ссылки на картинку */ extendedText: string; }; -export type Hint = { - text: string; - video: string; -}; - export interface QuizQuestionBase { id: number; title: string; @@ -46,7 +44,8 @@ export interface QuizQuestionBase { expanded: boolean; required: boolean; content: { - hint: Hint; + hint: QuestionHint; + rule: QuestionBranchingRule; back: string; autofill: boolean; }; diff --git a/src/model/questionTypes/text.ts b/src/model/questionTypes/text.ts index 6c220a95..43f35417 100644 --- a/src/model/questionTypes/text.ts +++ b/src/model/questionTypes/text.ts @@ -1,7 +1,7 @@ import type { QuizQuestionBase, - QuizQuestionBranchingRules, - QuizQuestionHint, + QuestionHint, + QuestionBranchingRule, } from "./shared"; export interface QuizQuestionText extends QuizQuestionBase { @@ -17,8 +17,8 @@ export interface QuizQuestionText extends QuizQuestionBase { /** Чекбокс "Автозаполнение адреса" */ autofill: boolean; answerType: "single" | "multi" | "number"; - hint: QuizQuestionHint; - rule: QuizQuestionBranchingRules; + hint: QuestionHint; + rule: QuestionBranchingRule; back: string; }; } diff --git a/src/model/questionTypes/variant.ts b/src/model/questionTypes/variant.ts index f2fa5f80..9a7f3c9b 100644 --- a/src/model/questionTypes/variant.ts +++ b/src/model/questionTypes/variant.ts @@ -1,8 +1,8 @@ import type { QuizQuestionBase, - QuizQuestionBranchingRules, - QuizQuestionHint, - Variant, + QuestionVariant, + QuestionHint, + QuestionBranchingRule, } from "./shared"; export interface QuizQuestionVariant extends QuizQuestionBase { @@ -21,9 +21,9 @@ export interface QuizQuestionVariant extends QuizQuestionBase { /** Поле "Внутреннее название вопроса" */ innerName: string; /** Варианты ответов */ - variants: Variant[]; - hint: QuizQuestionHint; - rule: QuizQuestionBranchingRules; + variants: QuestionVariant[]; + hint: QuestionHint; + rule: QuestionBranchingRule; back: string; autofill: boolean; }; diff --git a/src/model/questionTypes/varimg.ts b/src/model/questionTypes/varimg.ts index 8bb27f7f..2e5ebd43 100644 --- a/src/model/questionTypes/varimg.ts +++ b/src/model/questionTypes/varimg.ts @@ -1,8 +1,8 @@ import type { QuizQuestionBase, - QuizQuestionBranchingRules, - QuizQuestionHint, - Variant, + QuestionVariant, + QuestionHint, + QuestionBranchingRule, } from "./shared"; export interface QuizQuestionVarImg extends QuizQuestionBase { @@ -16,9 +16,9 @@ export interface QuizQuestionVarImg extends QuizQuestionBase { innerName: string; /** Чекбокс "Необязательный вопрос" */ required: boolean; - variants: Variant[]; - hint: QuizQuestionHint; - rule: QuizQuestionBranchingRules; + variants: QuestionVariant[]; + hint: QuestionHint; + rule: QuestionBranchingRule; back: string; autofill: boolean; largeCheck: boolean; diff --git a/src/pages/Questions/AnswerDraggableList/AnswerItem.tsx b/src/pages/Questions/AnswerDraggableList/AnswerItem.tsx index ca125024..97f17f4a 100644 --- a/src/pages/Questions/AnswerDraggableList/AnswerItem.tsx +++ b/src/pages/Questions/AnswerDraggableList/AnswerItem.tsx @@ -23,13 +23,14 @@ import TextareaAutosize from "@mui/base/TextareaAutosize"; import AddEmoji from "../../../assets/icons/questionsPage/addEmoji"; import type { ChangeEvent, KeyboardEvent } from "react"; -import type { Variants } from "@root/questions"; +import type { QuizQuestionVariant } from "../../../model/questionTypes/variant"; +import type { QuestionVariant } from "../../../model/questionTypes/shared"; type AnswerItemProps = { index: number; totalIndex: number; - variants: Variants[]; - variant: Variants; + variants: QuestionVariant[]; + variant: QuestionVariant; emoji: boolean; }; @@ -46,13 +47,14 @@ export const AnswerItem = ({ const theme = useTheme(); const isMobile = useMediaQuery(theme.breakpoints.down(790)); const anchorElement = useRef(); + const question = listQuestions[quizId][totalIndex] as QuizQuestionVariant; const debounced = useDebouncedCallback((value) => { const answerNew = variants.slice(); answerNew[index].answer = value; updateQuestionsList(quizId, totalIndex, { content: { - ...listQuestions[quizId][totalIndex].content, + ...question.content, variants: answerNew, }, }); @@ -72,13 +74,10 @@ export const AnswerItem = ({ const addNewAnswer = () => { const answerNew = variants.slice(); - answerNew.push({ answer: "", hints: "", emoji: "" }); + answerNew.push({ answer: "", hints: "", extendedText: "" }); updateQuestionsList(quizId, totalIndex, { - content: { - ...listQuestions[quizId][totalIndex].content, - variants: answerNew, - }, + content: { ...question.content, variants: answerNew }, }); }; @@ -87,10 +86,7 @@ export const AnswerItem = ({ answerNew.splice(index, 1); updateQuestionsList(quizId, totalIndex, { - content: { - ...listQuestions[quizId][totalIndex].content, - variants: answerNew, - }, + content: { ...question.content, variants: answerNew }, }); }; @@ -99,10 +95,7 @@ export const AnswerItem = ({ answerNew[index].hints = event.target.value; updateQuestionsList(quizId, totalIndex, { - content: { - ...listQuestions[quizId][totalIndex].content, - variants: answerNew, - }, + content: { ...question.content, variants: answerNew }, }); }; @@ -121,13 +114,10 @@ export const AnswerItem = ({ fullWidth focused={false} placeholder={"Добавьте ответ"} - multiline={listQuestions[quizId][totalIndex].content.largeCheck} + multiline={question.content.largeCheck} onChange={({ target }) => debounced(target.value)} onKeyDown={(event: KeyboardEvent) => { - if ( - event.code === "Enter" && - !listQuestions[quizId][totalIndex].content.largeCheck - ) { + if (event.code === "Enter" && !question.content.largeCheck) { addNewAnswer(); } }} @@ -151,8 +141,10 @@ export const AnswerItem = ({ gap: "5px", }} > - {variant.emoji && ( - {variant.emoji} + {variant.extendedText && ( + + {variant.extendedText} + )} @@ -178,7 +170,7 @@ export const AnswerItem = ({ cloneVariants[index] = { ...cloneVariants[index], - emoji: native, + extendedText: native, }; updateQuestionsList(quizId, totalIndex, { @@ -223,9 +215,15 @@ export const AnswerItem = ({ }} sx={{ "& .MuiInputBase-root": { - padding: emoji ? "5px 13.5px" : "13.5px", + padding: emoji ? "5px 13px" : "13px", borderRadius: "10px", background: "#ffffff", + "& input.MuiInputBase-input": { + height: "22px", + }, + "& textarea.MuiInputBase-input": { + marginTop: "1px", + }, }, }} inputProps={{ diff --git a/src/pages/Questions/AnswerDraggableList/index.tsx b/src/pages/Questions/AnswerDraggableList/index.tsx index 479f1312..37733107 100644 --- a/src/pages/Questions/AnswerDraggableList/index.tsx +++ b/src/pages/Questions/AnswerDraggableList/index.tsx @@ -9,10 +9,10 @@ import { updateVariants } from "@root/questions"; import { reorder } from "./helper"; import type { DropResult } from "react-beautiful-dnd"; -import type { Variants } from "@root/questions"; +import type { QuestionVariant } from "../../../model/questionTypes/shared"; type AnswerDraggableListProps = { - variants: Variants[]; + variants: QuestionVariant[]; totalIndex: number; emoji?: boolean; }; diff --git a/src/pages/Questions/DataOptions/DataOptions.tsx b/src/pages/Questions/DataOptions/DataOptions.tsx index 6999d77d..7f31bcc9 100644 --- a/src/pages/Questions/DataOptions/DataOptions.tsx +++ b/src/pages/Questions/DataOptions/DataOptions.tsx @@ -13,6 +13,8 @@ import InfoIcon from "../../../assets/icons/InfoIcon"; import SelectableButton from "@ui_kit/SelectableButton"; import { questionStore, updateQuestionsList } from "@root/questions"; +import type { QuizQuestionDate } from "../../../model/questionTypes/date"; + interface Props { totalIndex: number; } @@ -23,16 +25,17 @@ export default function DataOptions({ totalIndex }: Props) { const { listQuestions } = questionStore(); const theme = useTheme(); const isMobile = useMediaQuery(theme.breakpoints.down(790)); + const question = listQuestions[quizId][totalIndex] as QuizQuestionDate; const SSHC = (data: string) => { setSwitchState(data); }; useEffect(() => { - if (listQuestions[quizId][totalIndex].content.type !== "mask") { - const clonContent = listQuestions[quizId][totalIndex].content; - clonContent.type = "calendar"; - updateQuestionsList(quizId, totalIndex, { content: clonContent }); + if (question.content.type !== "mask") { + updateQuestionsList(quizId, totalIndex, { + content: { ...question.content, type: "calendar" }, + }); } }, []); @@ -50,26 +53,22 @@ export default function DataOptions({ totalIndex }: Props) { > { - const clonContent = listQuestions[quizId][totalIndex].content; - clonContent.type = "calendar"; - updateQuestionsList(quizId, totalIndex, { content: clonContent }); + updateQuestionsList(quizId, totalIndex, { + content: { ...question.content, type: "calendar" }, + }); }} sx={{ maxWidth: "257px", height: "48px", whiteSpace: "nowrap" }} > Использовать календарь { - const clonContent = listQuestions[quizId][totalIndex].content; - clonContent.type = "mask"; - updateQuestionsList(quizId, totalIndex, { content: clonContent }); + updateQuestionsList(quizId, totalIndex, { + content: { ...question.content, type: "mask" }, + }); }} sx={{ maxWidth: "211px", height: "48px", whiteSpace: "nowrap" }} > diff --git a/src/pages/Questions/QuestionsPage.tsx b/src/pages/Questions/QuestionsPage.tsx index 1ecb607c..e0d5c6b0 100755 --- a/src/pages/Questions/QuestionsPage.tsx +++ b/src/pages/Questions/QuestionsPage.tsx @@ -17,6 +17,8 @@ import { } from "@root/questions"; import { DraggableList } from "./DraggableList"; +import type { AnyQuizQuestion } from "../../model/questionTypes/shared"; + export default function QuestionsPage() { const { listQuizes, updateQuizesList } = quizStore(); const quizId = Number(useParams().quizId); @@ -32,7 +34,10 @@ export default function QuestionsPage() { const collapseEverything = () => { listQuestions[quizId].forEach((item, index) => { - updateQuestionsList(quizId, index, { ...item, expanded: false }); + updateQuestionsList(quizId, index, { + ...item, + expanded: false, + }); }); }; diff --git a/src/pages/Questions/answerOptions/responseSettings.tsx b/src/pages/Questions/answerOptions/responseSettings.tsx index 55dcc0ee..4c613bf6 100644 --- a/src/pages/Questions/answerOptions/responseSettings.tsx +++ b/src/pages/Questions/answerOptions/responseSettings.tsx @@ -12,6 +12,8 @@ import InfoIcon from "../../../assets/icons/InfoIcon"; import CustomTextField from "@ui_kit/CustomTextField"; import { questionStore, updateQuestionsList } from "@root/questions"; +import type { QuizQuestionVariant } from "../../../model/questionTypes/variant"; + interface Props { totalIndex: number; } @@ -22,10 +24,11 @@ export default function ResponseSettings({ totalIndex }: Props) { const theme = useTheme(); const isTablet = useMediaQuery(theme.breakpoints.down(900)); const isMobile = useMediaQuery(theme.breakpoints.down(790)); + const question = listQuestions[quizId][totalIndex] as QuizQuestionVariant; const debounced = useDebouncedCallback((value) => { - let clonContent = listQuestions[quizId][totalIndex].content; - clonContent.innerName = value; - updateQuestionsList(quizId, totalIndex, { content: clonContent }); + updateQuestionsList(quizId, totalIndex, { + content: { ...question.content, innerName: value }, + }); }, 1000); return ( @@ -37,41 +40,47 @@ export default function ResponseSettings({ totalIndex }: Props) { marginRight: isMobile ? "0" : "30px", }} > - + Настройки ответов { - let clonContent = listQuestions[quizId][totalIndex].content; - clonContent.largeCheck = e.target.checked; - - if (!e.target.checked) { - clonContent.large = ""; - } - - updateQuestionsList(quizId, totalIndex, { content: clonContent }); + checked={question.content.largeCheck} + handleChange={({ target }) => { + updateQuestionsList(quizId, totalIndex, { + content: { + ...question.content, + largeCheck: target.checked, + }, + }); }} /> { - let clonContent = listQuestions[quizId][totalIndex].content; - clonContent.multi = e.target.checked; - updateQuestionsList(quizId, totalIndex, { content: clonContent }); + checked={question.content.multi} + handleChange={({ target }) => { + updateQuestionsList(quizId, totalIndex, { + content: { ...question.content, multi: target.checked }, + }); }} /> { - let clonContent = listQuestions[quizId][totalIndex].content; - clonContent.own = e.target.checked; - updateQuestionsList(quizId, totalIndex, { content: clonContent }); + checked={question.content.own} + handleChange={({ target }) => { + updateQuestionsList(quizId, totalIndex, { + content: { ...question.content, own: target.checked }, + }); }} /> @@ -80,28 +89,31 @@ export default function ResponseSettings({ totalIndex }: Props) { { + checked={!question.required} + handleChange={({ target }) => { updateQuestionsList(quizId, totalIndex, { - required: !e.target.checked, + required: !target.checked, }); }} /> - + { - let clonContent = listQuestions[quizId][totalIndex].content; - clonContent.innerNameCheck = e.target.checked; - - if (!e.target.checked) { - clonContent.innerName = ""; - } - + checked={question.content.innerNameCheck} + handleChange={({ target }) => { updateQuestionsList(quizId, totalIndex, { - content: clonContent, + content: { + ...question.content, + innerNameCheck: target.checked, + innerName: target.checked ? question.content.innerName : "", + }, }); }} /> @@ -114,11 +126,11 @@ export default function ResponseSettings({ totalIndex }: Props) { - {listQuestions[quizId][totalIndex].content.innerNameCheck && ( + {question.content.innerNameCheck && ( debounced(target.value)} /> )} diff --git a/src/pages/Questions/branchingQuestions.tsx b/src/pages/Questions/branchingQuestions.tsx index 0e697d85..fa7037ce 100644 --- a/src/pages/Questions/branchingQuestions.tsx +++ b/src/pages/Questions/branchingQuestions.tsx @@ -26,6 +26,8 @@ import RadioCheck from "@ui_kit/RadioCheck"; import RadioIcon from "@ui_kit/RadioIcon"; import InfoIcon from "@icons/Info"; +import type { QuizQuestionBase } from "../../model/questionTypes/shared"; + type BranchingQuestionsProps = { totalIndex: number; }; @@ -47,6 +49,7 @@ export default function BranchingQuestions({ const { openedModalSettings, listQuestions } = questionStore(); const theme = useTheme(); const titleRef = useRef(null); + const question = listQuestions[quizId][totalIndex] as QuizQuestionBase; useEffect(() => { setTitleInputWidth(titleRef.current?.offsetWidth || 0); diff --git a/src/stores/questions.ts b/src/stores/questions.ts index 6775d0e5..a393677d 100644 --- a/src/stores/questions.ts +++ b/src/stores/questions.ts @@ -9,7 +9,7 @@ import { QuizQuestionVarImg } from "../model/questionTypes/varimg"; import type { AnyQuizQuestion, QuizQuestionType, - Variant, + QuestionVariant, } from "../model/questionTypes/shared"; import { QUIZ_QUESTION_BASE } from "../constants/base"; @@ -50,7 +50,7 @@ export interface Question { deleted: true; page: number; content: { - variants: Variant[]; + variants: QuestionVariant[]; hint: Hint; rule: Rule; images: string[]; @@ -203,7 +203,7 @@ export const updateQuestionsListDragAndDrop = ( export const updateVariants = ( quizId: number, index: number, - variants: Variant[] + variants: QuestionVariant[] ) => { const listQuestions = { ...questionStore.getState()["listQuestions"] };