дублирование и изменение типа вопроса работают корректно

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":
+        case "date":
-             // return <DateInputsType targetQuestion={targetQuestion} parentQuestion={parentQuestion} ruleIndex={ruleIndex} setParentQuestion={setParentQuestion} />
+            return <DateInputsType targetQuestion={targetQuestion} parentQuestion={parentQuestion} ruleIndex={ruleIndex} setParentQuestion={setParentQuestion} />
-             return <></>
 
-             break;
+            break;
 
         case "number":
             return <NumberInputsType targetQuestion={targetQuestion} parentQuestion={parentQuestion} ruleIndex={ruleIndex} setParentQuestion={setParentQuestion} />
@@ -57,7 +59,6 @@ export const TypeSwitch = ({ parentQuestion, targetQuestion, ruleIndex, setParen
             break;
 
         case "page":
-        case "date":
             return <BlockRule text={"У такого родителя может быть только один потомок"} />
             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 <Box
+        sx={{
+            padding: "20px",
+            margin: "20px",
+            borderRadius: "8px",
+            bgcolor: "#F2F3F7",
+            height: "280px",
+            overflow: "auto"
+        }}
+    >
+        <Box
+            sx={{
+                display: "flex",
+                justifyContent: "space-between",
+                alignItems: "center",
+                pb: "5px",
+            }}
+        >
+            <Typography sx={{ color: "#4D4D4D", fontWeight: "500" }}>
+                Новое условие
+            </Typography>
+            <IconButton
+                sx={{ borderRadius: "6px", padding: "2px" }}
+                onClick={() => {
+                    let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion))
+                    newParentQuestion.content.rule.main.splice(ruleIndex, 1)
+                    setParentQuestion(newParentQuestion)
+                }}
+            >
+                <DeleteIcon color={"#4D4D4D"} />
+            </IconButton>
+        </Box>
+
+        <Box
+            sx={{
+                display: "flex",
+                alignItems: "center",
+                pb: "10px",
+            }}
+        >
+            <Typography sx={{ color: "#4D4D4D", fontWeight: "500" }}>
+                Дан ответ
+            </Typography>
+            <Typography sx={{ color: "#7E2AEA", pl: "10px" }}>
+                (Укажите один или несколько вариантов)
+            </Typography>
+        </Box>
+
+
+        <Box
+            sx={{
+                backgroundColor: "#E8EAEE",
+                margin: "10px"
+            }}
+        >
+            {
+                parentQuestion.content.dateRange &&
+                <Typography sx={{ color: "#4D4D4D", p: "10px" }}>
+                    (Начало периода)
+                </Typography>
+            }
+            <DatePicker
+                value={parentQuestion.content.rule.main[ruleIndex].rules[0].answers[0]}
+                onChange={(e) => console.log(e)}
+                slots={{
+                    openPickerIcon: () => <CalendarIcon />,
+                }}
+                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 &&
+                <TimePicker
+                    value={parentQuestion.content.rule.main[ruleIndex].rules[0].answers[0]}
+                    sx={{
+                            p: "10px",
+                        "& .MuiInputBase-root": {
+                            minWidth: "325px",
+                            backgroundColor: "#F2F3F7",
+                            borderRadius: "10px",
+                            pr: "22px",
+                            "& input": {
+                                py: "11px",
+                                pl: upLg ? "20px" : "13px",
+                                lineHeight: "19px",
+                            },
+                            "& fieldset": {
+                                borderColor: "#9A9AAF",
+                            },
+                        },
+                    }}
+                />
+            }
+        </Box>
+
+        {parentQuestion.content.dateRange &&
+            <Box
+                sx={{
+                    backgroundColor: "#E8EAEE",
+                    margin: "10px"
+                }}
+            >
+                 {
+                parentQuestion.content.dateRange &&
+                <Typography sx={{ color: "#4D4D4D", p: "10px" }}>
+                    (Конец периода)
+                </Typography>
+            }
+                <DatePicker
+                    value={parentQuestion.content.rule.main[ruleIndex].rules[0].answers[1]}
+                    onChange={() => { }}
+                    slots={{
+                        openPickerIcon: () => <CalendarIcon />,
+                    }}
+                    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 &&
+                    <TimePicker
+                        value={parentQuestion.content.rule.main[ruleIndex].rules[0].answers[1]}
+                        sx={{
+                                p: "10px",
+                            "& .MuiInputBase-root": {
+                                minWidth: "325px",
+                                backgroundColor: "#F2F3F7",
+                                borderRadius: "10px",
+                                pr: "22px",
+                                "& input": {
+                                    py: "11px",
+                                    pl: upLg ? "20px" : "13px",
+                                    lineHeight: "19px",
+                                },
+                                "& fieldset": {
+                                    borderColor: "#9A9AAF",
+                                },
+                            },
+                        }}
+                    />
+                }
+            </Box>
+        }
+
+        {/* <TextField
+        sx={{
+            marginTop: "20px",
+            width: "100%"
+        }}
+
+        placeholder="от"
+        value={parentQuestion.content.rule.main[ruleIndex].rules[0].answers[0]}
+        onChange={(event: React.FormEvent<HTMLInputElement>) => {
+
+            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 && 
+    <TextField
+    placeholder="до"
+        sx={{
+            marginTop: "20px",
+            width: "100%"
+        }}
+
+        value={parentQuestion.content.rule.main[ruleIndex].rules[0].answers[1]}
+        onChange={(event: React.FormEvent<HTMLInputElement>) => {
+
+            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)
+
+        }}
+    />
+
+    } */}
+
+
+
+
+    </Box >
 }
 const NumberInputsType = ({ parentQuestion, targetQuestion, ruleIndex, setParentQuestion }: Props) => {
     const theme = useTheme();
@@ -281,24 +531,24 @@ const NumberInputsType = ({ parentQuestion, targetQuestion, ruleIndex, setParent
 
                 }}
             />
-            {parentQuestion.content.chooseRange && 
+            {parentQuestion.content.chooseRange &&
-            <TextField
+                <TextField
-            placeholder="до"
+                    placeholder="до"
-                sx={{
+                    sx={{
-                    marginTop: "20px",
+                        marginTop: "20px",
-                    width: "100%"
+                        width: "100%"
-                }}
+                    }}
 
-                value={parentQuestion.content.rule.main[ruleIndex].rules[0].answers[1]}
+                    value={parentQuestion.content.rule.main[ruleIndex].rules[0].answers[1]}
-                onChange={(event: React.FormEvent<HTMLInputElement>) => {
+                    onChange={(event: React.FormEvent<HTMLInputElement>) => {
 
-                    let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion))
+                        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, ""))
+                        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
+                        if (newParentQuestion.content.rule.main[ruleIndex].rules[0].answers[0] === undefined) newParentQuestion.content.rule.main[ruleIndex].rules[0].answers[0] = 0
-                    setParentQuestion(newParentQuestion)
+                        setParentQuestion(newParentQuestion)
 
-                }}
+                    }}
-            />
+                />
 
             }
 
@@ -522,24 +772,4 @@ const RatingInputsType = ({ parentQuestion, targetQuestion, ruleIndex, setParent
 
         </Box >
     )
-}
+}
-
-// {
-//     content: {
-//         rule: {
-//             main: [
-//                 {
-//                     next: "id of next question", // 2 string
-//                     or: true // 3 boolean
-//                 rules: [
-//                         {
-//                             question: "question id", string
-//                 answers: [] // ответы на вопросы. для вариантов выбора - конкретные айдишники, для полей ввода текста - текст по полному совпадению, для ввода файла ии ещё какой подобной дичи - просто факт того что файл ввели, т.е. boolean
-//                         }
-//                     ]
-//                 }
-//             ],
-//             default: ID string
-//         }
-//     }
-// }

src/pages/Questions/BranchingPanel/index.tsx

@@ -24,7 +24,7 @@ export const BranchingPanel = () => {
         <Switch
           value={openBranchingPanel}
           onChange={(_, value) => {
-              setTimeout(() => updateOpenBranchingPanel(!value), 10)
+              updateOpenBranchingPanel(!value)
           console.log(openBranchingPanel)
           }}
           sx={{

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()
         }
 

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)
         }
 

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);