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"
import { useState, useRef, useEffect } from "react";
import { useParams } from "react-router-dom";
import { useQuestionsStore } from "@root/questions/store";
import { updateQuestion, getQuestionById } from "@root/questions/actions";
import { SelectChangeEvent } from '@mui/material/Select';
import CalendarIcon from "@icons/CalendarIcon";
import { DatePicker } from "@mui/x-date-pickers";
import dayjs from 'dayjs'
import { TimePicker } from '@mui/x-date-pickers/TimePicker';
import InfoIcon from "@icons/Info";
import { DeleteIcon } from "@icons/questionsPage/deleteIcon";
import type { AnyTypedQuizQuestion } from "../../../model/questionTypes/shared"
import type { QuizQuestionNumber } from "../../../model/questionTypes/number"
const CONDITIONS = [
"Все условия обязательны",
"Обязательно хотя бы одно условие",
];
interface Props {
parentQuestion: AnyTypedQuizQuestion;
targetQuestion: AnyTypedQuizQuestion;
ruleIndex: number;
setParentQuestion: (q:AnyTypedQuizQuestion) => void;
}
//Этот компонент вызывается 1 раз на каждое условие родителя для перехода к этому вопросу. Поэтому для изменения стора мы знаем индекс
export const TypeSwitch = ({ parentQuestion, targetQuestion, ruleIndex, setParentQuestion }: Props) => {
switch (parentQuestion.type) {
// case 'nonselected':
// return
// break;
case "variant":
case "images":
case "varimg":
case "emoji":
case "select":
return (parentQuestion.content.variants === undefined ? :
//Реализован
)
break;
case "date":
return
break;
case "number":
return
//Реализован
break;
case "page":
return
break;
case "text":
return
//Реализован
break;
case "file":
return
//Реализован
break;
case "rating":
return
//Реализован
break;
default:
return
break;
}
}
export const BlockRule = ({ text }: { text: string }) => {
return (
{text}
)
}
const SelectorType = ({ parentQuestion, targetQuestion, ruleIndex, setParentQuestion }: Props) => {
const theme = useTheme();
const quizId = Number(useParams().quizId);
return (
Новое условие
{
let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion))
newParentQuestion.content.rule.main.splice(ruleIndex, 1)
setParentQuestion(newParentQuestion)
}}
>
Дан ответ
(Укажите один или несколько вариантов)
{
let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion))
newParentQuestion.content.rule.main[ruleIndex].or = value
setParentQuestion(newParentQuestion)
}}
>
{CONDITIONS.map((condition, totalIndex) => (
}
icon={}
/>
}
label={condition}
/>
))}
)
}
const DateInputsType = ({ parentQuestion, targetQuestion, ruleIndex, setParentQuestion }: Props) => {
const theme = useTheme();
const upLg = useMediaQuery(theme.breakpoints.up("md"));
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 &&
(Начало периода)
}
{
const date = dateString?.toDate().toLocaleDateString("ru-RU", { year: "numeric", month: "2-digit", day: "2-digit" });
let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion))
newParentQuestion.content.rule.main[ruleIndex].rules[0].answers = [date]
setParentQuestion(newParentQuestion)
}}
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();
const quizId = Number(useParams().quizId);
return (
Новое условие
{
let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion))
newParentQuestion.content.rule.main.splice(ruleIndex, 1)
setParentQuestion(newParentQuestion)
}}
>
Дан ответ
(Укажите один или несколько вариантов)
) => {
const newParentQuestion = JSON.parse(JSON.stringify(parentQuestion))
const previousValue = newParentQuestion.content.rule.main[ruleIndex].rules[0].answers[0];
newParentQuestion.content.rule.main[ruleIndex].rules[0].answers[0] =(parentQuestion as QuizQuestionNumber).content.chooseRange ? previousValue ? `${target.value}—${previousValue.split("—")[1] || 0}` : `${target.value}—0` : target.value;
setParentQuestion(newParentQuestion)
}}
/>
{(parentQuestion as QuizQuestionNumber).content.chooseRange &&
) => {
const newParentQuestion = JSON.parse(JSON.stringify(parentQuestion))
const previousValue = newParentQuestion.content.rule.main[ruleIndex].rules[0].answers[0];
newParentQuestion.content.rule.main[ruleIndex].rules[0].answers[0] = previousValue ? `${previousValue.split("—")[0] || 0}—${target.value}` : `0—${target.value}`
setParentQuestion(newParentQuestion)
}}
/>
}
)
}
const TextInputsType = ({ parentQuestion, targetQuestion, ruleIndex, setParentQuestion }: Props) => {
const theme = useTheme();
const quizId = Number(useParams().quizId);
return (
Новое условие
{
let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion))
newParentQuestion.content.rule.main.splice(ruleIndex, 1)
setParentQuestion(newParentQuestion)
}}
>
Дан ответ
(Укажите текст, при совпадении с которым пользователь попадёт на этот вопрос)
) => {
let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion))
newParentQuestion.content.rule.main[ruleIndex].rules[0].answers = [(event.target as HTMLInputElement).value]
setParentQuestion(newParentQuestion)
}}
/>
)
}
const FileInputsType = ({ parentQuestion, targetQuestion, ruleIndex, setParentQuestion }: Props) => {
const theme = useTheme();
const quizId = Number(useParams().quizId);
return (
Новое условие
{
let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion))
newParentQuestion.content.rule.main.splice(ruleIndex, 1)
setParentQuestion(newParentQuestion)
}}
>
Перевести на этот вопрос если пользователь загрузил файл
) => {
let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion))
newParentQuestion.content.rule.main[ruleIndex].rules[0].answers = [(event.target as HTMLInputElement).checked]
setParentQuestion(newParentQuestion)
}}
/>} label="да" />
)
}
const RatingInputsType = ({ parentQuestion, targetQuestion, ruleIndex, setParentQuestion }: Props) => {
const theme = useTheme();
const quizId = Number(useParams().quizId);
return (
Новое условие
{
let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion))
newParentQuestion.content.rule.main.splice(ruleIndex, 1)
setParentQuestion(newParentQuestion)
}}
>
Ожидаемое количество ячеек(не более доступного количества)
) => {
let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion))
let valueNumber = Number((event.target as HTMLInputElement).value.replace(/[^0-9,\s]/g, ""))
valueNumber = valueNumber > parentQuestion.content.steps ? parentQuestion.content.steps : valueNumber
newParentQuestion.content.rule.main[ruleIndex].rules[0].answers = [valueNumber]
setParentQuestion(newParentQuestion)
}}
/>
)
}