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: "",
required: false,
answerType: "single",
onlyNumbers: false,
},
};

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

@ -28,16 +28,17 @@ type SettingTextFieldProps = {
type Answer = {
name: string;
value: "single" | "multi" | "number";
value: "single" | "multi";
};
const ANSWER_TYPES: Answer[] = [
{ name: "Однострочное", value: "single" },
{ name: "Многострочное", value: "multi" },
{ name: "Только числа", value: "number" },
];
export default function SettingTextField({ totalIndex }: SettingTextFieldProps) {
export default function SettingTextField({
totalIndex,
}: SettingTextFieldProps) {
const { listQuestions } = questionStore();
const quizId = Number(useParams().quizId);
const theme = useTheme();
@ -68,12 +69,24 @@ export default function SettingTextField({ totalIndex }: SettingTextFieldProps)
pl: "20px",
}}
>
<Typography sx={{ fontWeight: "500", fontSize: "18px", color: " #4D4D4D", marginBottom: "14px" }}>
<Typography
sx={{
fontWeight: "500",
fontSize: "18px",
color: " #4D4D4D",
marginBottom: "14px",
}}
>
Настройки ответов
</Typography>
<FormControl>
<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"
name="controlled-radio-buttons-group"
value={ANSWER_TYPES.findIndex(
@ -97,12 +110,29 @@ export default function SettingTextField({ totalIndex }: SettingTextFieldProps)
"& .MuiRadio-root": { padding: "8px 9px" },
}}
value={index}
control={<Radio icon={<CheckIcon />} checkedIcon={<CheckedIcon />} />}
control={
<Radio icon={<CheckIcon />} checkedIcon={<CheckedIcon />} />
}
label={name}
/>
))}
</RadioGroup>
</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
sx={{
@ -115,7 +145,14 @@ export default function SettingTextField({ totalIndex }: SettingTextFieldProps)
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>
<CustomCheckbox
@ -172,7 +209,10 @@ export default function SettingTextField({ totalIndex }: SettingTextFieldProps)
});
}}
/>
<Tooltip title="Будет отображаться как заголовок вопроса в приходящих заявках." placement="top">
<Tooltip
title="Будет отображаться как заголовок вопроса в приходящих заявках."
placement="top"
>
<Box>
<InfoIcon />
</Box>