feat: QuizQuestionText onlyNumbers field

This commit is contained in:
IlyaDoronin 2023-10-30 13:46:55 +03:00
parent 66e45f340c
commit 9dfa464afd
3 changed files with 51 additions and 9 deletions

@ -12,5 +12,6 @@ export const QUIZ_QUESTION_TEXT: Omit<QuizQuestionText, "id"> = {
innerName: "", innerName: "",
required: false, required: false,
answerType: "single", answerType: "single",
onlyNumbers: false,
}, },
}; };

@ -16,10 +16,11 @@ export interface QuizQuestionText extends QuizQuestionBase {
required: boolean; required: boolean;
/** Чекбокс "Автозаполнение адреса" */ /** Чекбокс "Автозаполнение адреса" */
autofill: boolean; autofill: boolean;
answerType: "single" | "multi" | "number"; answerType: "single" | "multi";
hint: QuestionHint; hint: QuestionHint;
rule: QuestionBranchingRule; rule: QuestionBranchingRule;
back: string; back: string;
originalBack: string; originalBack: string;
onlyNumbers: boolean;
}; };
} }

@ -28,16 +28,17 @@ type SettingTextFieldProps = {
type Answer = { type Answer = {
name: string; name: string;
value: "single" | "multi" | "number"; value: "single" | "multi";
}; };
const ANSWER_TYPES: Answer[] = [ const ANSWER_TYPES: Answer[] = [
{ name: "Однострочное", value: "single" }, { name: "Однострочное", value: "single" },
{ name: "Многострочное", value: "multi" }, { name: "Многострочное", value: "multi" },
{ name: "Только числа", value: "number" },
]; ];
export default function SettingTextField({ totalIndex }: SettingTextFieldProps) { export default function SettingTextField({
totalIndex,
}: SettingTextFieldProps) {
const { listQuestions } = questionStore(); const { listQuestions } = questionStore();
const quizId = Number(useParams().quizId); const quizId = Number(useParams().quizId);
const theme = useTheme(); const theme = useTheme();
@ -68,12 +69,24 @@ export default function SettingTextField({ totalIndex }: SettingTextFieldProps)
pl: "20px", pl: "20px",
}} }}
> >
<Typography sx={{ fontWeight: "500", fontSize: "18px", color: " #4D4D4D", marginBottom: "14px" }}> <Typography
sx={{
fontWeight: "500",
fontSize: "18px",
color: " #4D4D4D",
marginBottom: "14px",
}}
>
Настройки ответов Настройки ответов
</Typography> </Typography>
<FormControl> <FormControl>
<RadioGroup <RadioGroup
sx={{ display: "flex", flexDirection: "column", gap: "14px", width: "100%" }} sx={{
display: "flex",
flexDirection: "column",
gap: "14px",
width: "100%",
}}
aria-labelledby="demo-controlled-radio-buttons-group" aria-labelledby="demo-controlled-radio-buttons-group"
name="controlled-radio-buttons-group" name="controlled-radio-buttons-group"
value={ANSWER_TYPES.findIndex( value={ANSWER_TYPES.findIndex(
@ -97,12 +110,29 @@ export default function SettingTextField({ totalIndex }: SettingTextFieldProps)
"& .MuiRadio-root": { padding: "8px 9px" }, "& .MuiRadio-root": { padding: "8px 9px" },
}} }}
value={index} value={index}
control={<Radio icon={<CheckIcon />} checkedIcon={<CheckedIcon />} />} control={
<Radio icon={<CheckIcon />} checkedIcon={<CheckedIcon />} />
}
label={name} label={name}
/> />
))} ))}
</RadioGroup> </RadioGroup>
</FormControl> </FormControl>
<CustomCheckbox
sx={{
display: isMobile ? "flex" : "block",
mr: isMobile ? "0px" : "16px",
marginTop: "15px",
alignItems: isMobile ? "flex-end" : "center",
}}
label={"Только числа"}
checked={question.content.onlyNumbers}
handleChange={({ target }) => {
updateQuestionsList<QuizQuestionText>(quizId, totalIndex, {
content: { ...question.content, onlyNumbers: target.checked },
});
}}
/>
</Box> </Box>
<Box <Box
sx={{ sx={{
@ -115,7 +145,14 @@ export default function SettingTextField({ totalIndex }: SettingTextFieldProps)
gap: "14px", gap: "14px",
}} }}
> >
<Typography sx={{ height: isMobile ? "18px" : "auto", fontWeight: "500", fontSize: "18px", color: " #4D4D4D" }}> <Typography
sx={{
height: isMobile ? "18px" : "auto",
fontWeight: "500",
fontSize: "18px",
color: " #4D4D4D",
}}
>
Настройки вопросов Настройки вопросов
</Typography> </Typography>
<CustomCheckbox <CustomCheckbox
@ -172,7 +209,10 @@ export default function SettingTextField({ totalIndex }: SettingTextFieldProps)
}); });
}} }}
/> />
<Tooltip title="Будет отображаться как заголовок вопроса в приходящих заявках." placement="top"> <Tooltip
title="Будет отображаться как заголовок вопроса в приходящих заявках."
placement="top"
>
<Box> <Box>
<InfoIcon /> <InfoIcon />
</Box> </Box>