diff --git a/src/pages/Questions/BranchingModal/Settings.tsx b/src/pages/Questions/BranchingModal/Settings.tsx index 1b81ae77..034581d0 100644 --- a/src/pages/Questions/BranchingModal/Settings.tsx +++ b/src/pages/Questions/BranchingModal/Settings.tsx @@ -1,4 +1,4 @@ -import { Box, MenuItem, FormControl, Checkbox, FormControlLabel, Radio, RadioGroup, Typography, useTheme, Select, Chip, IconButton, TextField } from "@mui/material" +import { Box, MenuItem, FormControl, Checkbox, FormControlLabel, Radio, RadioGroup, Typography, useTheme, Select, useMediaQuery, IconButton, TextField } from "@mui/material" import RadioCheck from "@ui_kit/RadioCheck" import RadioIcon from "@ui_kit/RadioIcon" import { QuizQuestionBase } from "model/questionTypes/shared" @@ -8,7 +8,10 @@ import { useQuestionsStore } from "@root/questions/store"; import { updateQuestion, getQuestionById } from "@root/questions/actions"; import { AnyQuizQuestion } from "../../../model/questionTypes/shared" import { SelectChangeEvent } from '@mui/material/Select'; - +import CalendarIcon from "@icons/CalendarIcon"; +import { DatePicker } from "@mui/x-date-pickers"; +import * as dayjs from 'dayjs' +import { TimePicker } from '@mui/x-date-pickers/TimePicker'; import InfoIcon from "@icons/Info"; import { DeleteIcon } from "@icons/questionsPage/deleteIcon"; @@ -20,7 +23,7 @@ interface Props { parentQuestion: AnyQuizQuestion; targetQuestion: AnyQuizQuestion; ruleIndex: number; - setParentQuestion: (q:AnyQuizQuestion) => void; + setParentQuestion: (q: AnyQuizQuestion) => void; } @@ -45,11 +48,10 @@ export const TypeSwitch = ({ parentQuestion, targetQuestion, ruleIndex, setParen ) break; - case "date": - // return - return <> + case "date": + return - break; + break; case "number": return @@ -57,7 +59,6 @@ export const TypeSwitch = ({ parentQuestion, targetQuestion, ruleIndex, setParen break; case "page": - case "date": return break; @@ -209,8 +210,257 @@ const SelectorType = ({ parentQuestion, targetQuestion, ruleIndex, setParentQues ) } const DateInputsType = ({ parentQuestion, targetQuestion, ruleIndex, setParentQuestion }: Props) => { + const theme = useTheme(); + const upLg = useMediaQuery(theme.breakpoints.up("md")); - return <> + const time = dayjs(new Date) + + const [firstDate, setFirstDate] = useState(time) + const [secondDate, setSecondDate] = useState(time) + const [firstTime, setFirstTime] = useState(time) + const [secondTime, setSecondTime] = useState(time) + + useEffect(() => { + let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion)) + + newParentQuestion.content.rule.main[ruleIndex].rules[0].answers[0] = time + if (newParentQuestion.content.dateRange) parentQuestion.content.rule.main[ruleIndex].rules[0].answers[1] = time + + setParentQuestion(newParentQuestion) + + }, [firstDate, secondDate, firstTime, secondTime]) + + // {/* //dateRange выбор диапазона дат */} + // {/* time выбор времени */} + return + + + Новое условие + + { + let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion)) + newParentQuestion.content.rule.main.splice(ruleIndex, 1) + setParentQuestion(newParentQuestion) + }} + > + + + + + + + Дан ответ + + + (Укажите один или несколько вариантов) + + + + + + { + parentQuestion.content.dateRange && + + (Начало периода) + + } + console.log(e)} + slots={{ + openPickerIcon: () => , + }} + slotProps={{ + openPickerButton: { + sx: { + p: 0, + }, + "data-cy": "open-datepicker", + }, + }} + sx={{ + p: "10px", + "& .MuiInputBase-root": { + minWidth: "325px", + backgroundColor: "#F2F3F7", + borderRadius: "10px", + pr: "31px", + "& input": { + py: "11px", + pl: upLg ? "20px" : "13px", + lineHeight: "19px", + }, + "& fieldset": { + borderColor: "#9A9AAF", + }, + }, + }} + /> + {parentQuestion.content.time && + + } + + + {parentQuestion.content.dateRange && + + { + parentQuestion.content.dateRange && + + (Конец периода) + + } + { }} + slots={{ + openPickerIcon: () => , + }} + slotProps={{ + openPickerButton: { + sx: { + p: 0, + }, + "data-cy": "open-datepicker", + }, + }} + sx={{ + p: "10px", + "& .MuiInputBase-root": { + minWidth: "325px", + backgroundColor: "#F2F3F7", + borderRadius: "10px", + pr: "31px", + "& input": { + py: "11px", + pl: upLg ? "20px" : "13px", + lineHeight: "19px", + }, + "& fieldset": { + borderColor: "#9A9AAF", + }, + }, + }} + /> + {parentQuestion.content.time && + + } + + } + + {/* ) => { + + let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion)) + newParentQuestion.content.rule.main[ruleIndex].rules[0].answers[0] = Number((event.target as HTMLInputElement).value.replace(/[^0-9,\s]/g, "")) + if (newParentQuestion.content.rule.main[ruleIndex].rules[0].answers[1] === undefined) newParentQuestion.content.rule.main[ruleIndex].rules[0].answers[1] = 0 + setParentQuestion(newParentQuestion) + + }} + /> + {parentQuestion.content.chooseRange && + ) => { + + let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion)) + newParentQuestion.content.rule.main[ruleIndex].rules[0].answers[1] = Number((event.target as HTMLInputElement).value.replace(/[^0-9,\s]/g, "")) + if (newParentQuestion.content.rule.main[ruleIndex].rules[0].answers[0] === undefined) newParentQuestion.content.rule.main[ruleIndex].rules[0].answers[0] = 0 + setParentQuestion(newParentQuestion) + + }} + /> + + } */} + + + + + } const NumberInputsType = ({ parentQuestion, targetQuestion, ruleIndex, setParentQuestion }: Props) => { const theme = useTheme(); @@ -281,24 +531,24 @@ const NumberInputsType = ({ parentQuestion, targetQuestion, ruleIndex, setParent }} /> - {parentQuestion.content.chooseRange && - ) => { + value={parentQuestion.content.rule.main[ruleIndex].rules[0].answers[1]} + onChange={(event: React.FormEvent) => { - let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion)) - newParentQuestion.content.rule.main[ruleIndex].rules[0].answers[1] = Number((event.target as HTMLInputElement).value.replace(/[^0-9,\s]/g, "")) - if (newParentQuestion.content.rule.main[ruleIndex].rules[0].answers[0] === undefined) newParentQuestion.content.rule.main[ruleIndex].rules[0].answers[0] = 0 - setParentQuestion(newParentQuestion) + let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion)) + newParentQuestion.content.rule.main[ruleIndex].rules[0].answers[1] = Number((event.target as HTMLInputElement).value.replace(/[^0-9,\s]/g, "")) + if (newParentQuestion.content.rule.main[ruleIndex].rules[0].answers[0] === undefined) newParentQuestion.content.rule.main[ruleIndex].rules[0].answers[0] = 0 + setParentQuestion(newParentQuestion) - }} - /> + }} + /> } @@ -522,24 +772,4 @@ const RatingInputsType = ({ parentQuestion, targetQuestion, ruleIndex, setParent ) -} - -// { -// content: { -// rule: { -// main: [ -// { -// next: "id of next question", // 2 string -// or: true // 3 boolean -// rules: [ -// { -// question: "question id", string -// answers: [] // ответы на вопросы. для вариантов выбора - конкретные айдишники, для полей ввода текста - текст по полному совпадению, для ввода файла ии ещё какой подобной дичи - просто факт того что файл ввели, т.е. boolean -// } -// ] -// } -// ], -// default: ID string -// } -// } -// } +} \ No newline at end of file diff --git a/src/pages/Questions/BranchingPanel/index.tsx b/src/pages/Questions/BranchingPanel/index.tsx index 30f2f962..e01047ad 100644 --- a/src/pages/Questions/BranchingPanel/index.tsx +++ b/src/pages/Questions/BranchingPanel/index.tsx @@ -24,7 +24,7 @@ export const BranchingPanel = () => { { - setTimeout(() => updateOpenBranchingPanel(!value), 10) + updateOpenBranchingPanel(!value) console.log(openBranchingPanel) }} sx={{ diff --git a/src/pages/Questions/ButtonsOptions.tsx b/src/pages/Questions/ButtonsOptions.tsx index 9ba808eb..72e266e7 100644 --- a/src/pages/Questions/ButtonsOptions.tsx +++ b/src/pages/Questions/ButtonsOptions.tsx @@ -48,6 +48,7 @@ const {openBranchingPanel} = useQuestionsStore.getState() }; const handleClickBranching = (_, value) => { + console.log(value) const parentId = question.content.rule.parentId if (parentId.length === 0 ){ return enqueueSnackbar("Вопрос не учавствует в ветвлении") @@ -56,7 +57,7 @@ const {openBranchingPanel} = useQuestionsStore.getState() return enqueueSnackbar("У корня нет условий ветвления") } if (parentId.length !== 0) { - setTimeout(() => updateOpenBranchingPanel(!value), 10) + updateOpenBranchingPanel(!value) openedModal() } diff --git a/src/pages/Questions/ButtonsOptionsAndPict.tsx b/src/pages/Questions/ButtonsOptionsAndPict.tsx index 8300b737..5ade8e55 100644 --- a/src/pages/Questions/ButtonsOptionsAndPict.tsx +++ b/src/pages/Questions/ButtonsOptionsAndPict.tsx @@ -56,6 +56,7 @@ export default function ButtonsOptionsAndPict({ }, [question]); const handleClickBranching = (_, value) => { + const parentId = question.content.rule.parentId if (parentId.length === 0 ) { return enqueueSnackbar("Вопрос не учавствует в ветвлении") @@ -64,7 +65,7 @@ export default function ButtonsOptionsAndPict({ return enqueueSnackbar("У корня нет условий ветвления") } if (parentId.length !== 0) { - setTimeout(() => updateOpenBranchingPanel(!value), 10) + updateOpenBranchingPanel(!value) updateOpenedModalSettingsId(question.id) } diff --git a/src/stores/questions/actions.ts b/src/stores/questions/actions.ts index 630682a0..22bb6c19 100644 --- a/src/stores/questions/actions.ts +++ b/src/stores/questions/actions.ts @@ -262,9 +262,11 @@ export const changeQuestionType = ( ) => { updateQuestion(questionId, question => { const oldId = question.content.id + const oldMain = question.content.rule.main question.type = type; question.content = defaultQuestionByType[type].content; question.content.id = oldId + question.content.rule.main = oldMain }); }; @@ -355,7 +357,9 @@ export const copyQuestion = async (questionId: string, quizId: number) => reques const copiedQuestion = structuredClone(question); copiedQuestion.backendId = newQuestionId; - copiedQuestion.id = nanoid(); + copiedQuestion.id = frontId + copiedQuestion.content.id = frontId + copiedQuestion.content.rule = { main: [], parentId: "", default: "" } setProducedState(state => { state.questions.push(copiedQuestion);