SQuiz/frontPanel
2
0
Fork 0
Code Issues 10 Pull Requests Actions Packages Projects Releases Wiki Activity

fix form quiz question components

Browse Source
This commit is contained in:
nflnkr 2023-11-29 18:33:54 +03:00
parent 02d2b2a325
commit 960ee026bd
3 changed files with 16 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/pages/Questions/Form/FormDraggableList/QuestionPageCard.tsx
View File

@ -12,7 +12,7 @@ import Page from "@icons/questionsPage/page";
import RatingIcon from "@icons/questionsPage/rating"; import RatingIcon from "@icons/questionsPage/rating";
import Slider from "@icons/questionsPage/slider"; import Slider from "@icons/questionsPage/slider";
import { Box, InputAdornment, Paper } from "@mui/material"; import { Box, InputAdornment, Paper } from "@mui/material";
import { updateQuestion } from "@root/questions/actions"; import { updateQuestion, updateUntypedQuestion } from "@root/questions/actions";
import CustomTextField from "@ui_kit/CustomTextField"; import CustomTextField from "@ui_kit/CustomTextField";
import { useRef, useState } from "react"; import { useRef, useState } from "react";
import type { DraggableProvidedDragHandleProps } from "react-beautiful-dnd"; import type { DraggableProvidedDragHandleProps } from "react-beautiful-dnd";
@ -39,7 +39,9 @@ export default function QuestionsPageCard({
const anchorRef = useRef(null); const anchorRef = useRef(null);
const setTitle = useDebouncedCallback((title) => { const setTitle = useDebouncedCallback((title) => {
updateQuestion(question.id, question => { const updateQuestionFn = question.type === null ? updateUntypedQuestion : updateQuestion;
updateQuestionFn(question.id, question => {
question.title = title; question.title = title;
}); });
}, 200); }, 200);
@ -106,7 +108,7 @@ export default function QuestionsPageCard({
}} }}
/> />
{question.type === null ? ( {question.type === null ? (
null // <FormTypeQuestions question={question} /> // TODO <FormTypeQuestions question={question} />
) : ( ) : (
<SwitchQuestionsPage question={question} /> <SwitchQuestionsPage question={question} />
)} )}

3
src/pages/Questions/Form/FormQuestionsPage.tsx
View File

@ -1,5 +1,5 @@
import { Box, Button, Typography, useTheme } from "@mui/material"; import { Box, Button, Typography, useTheme } from "@mui/material";
import { incrementCurrentStep } from "@root/quizes/actions"; import { decrementCurrentStep, incrementCurrentStep } from "@root/quizes/actions";
import QuizPreview from "@ui_kit/QuizPreview/QuizPreview"; import QuizPreview from "@ui_kit/QuizPreview/QuizPreview";
import { createPortal } from "react-dom"; import { createPortal } from "react-dom";
import AddAnswer from "../../../assets/icons/questionsPage/addAnswer"; import AddAnswer from "../../../assets/icons/questionsPage/addAnswer";
@ -89,6 +89,7 @@ export default function FormQuestionsPage() {
<Button <Button
variant="outlined" variant="outlined"
sx={{ padding: "10px 20px", borderRadius: "8px", height: "44px" }} sx={{ padding: "10px 20px", borderRadius: "8px", height: "44px" }}
onClick={decrementCurrentStep}
> >
<ArrowLeft /> <ArrowLeft />
</Button> </Button>

31
src/pages/Questions/Form/FormTypeQuestions.tsx
View File

@ -1,23 +1,20 @@
import { useState } from "react";
import { Box } from "@mui/material"; import { Box } from "@mui/material";
import QuestionsMiniButton from "@ui_kit/QuestionsMiniButton"; import QuestionsMiniButton from "@ui_kit/QuestionsMiniButton";
import ButtonsOptions from "../ButtonsOptions";
import SwitchAnswerOptions from "../answerOptions/switchAnswerOptions";
import { BUTTON_TYPE_QUESTIONS } from "../TypeQuestions"; import { BUTTON_TYPE_QUESTIONS } from "../TypeQuestions";
import Answer from "../../../assets/icons/questionsPage/answer"; import Answer from "../../../assets/icons/questionsPage/answer";
import Input from "../../../assets/icons/questionsPage/input";
import DropDown from "../../../assets/icons/questionsPage/drop_down";
import Date from "../../../assets/icons/questionsPage/date"; import Date from "../../../assets/icons/questionsPage/date";
import Slider from "../../../assets/icons/questionsPage/slider";
import Download from "../../../assets/icons/questionsPage/download"; import Download from "../../../assets/icons/questionsPage/download";
import DropDown from "../../../assets/icons/questionsPage/drop_down";
import Input from "../../../assets/icons/questionsPage/input";
import Slider from "../../../assets/icons/questionsPage/slider";
import type {
AnyTypedQuizQuestion,
} from "../../../model/questionTypes/shared";
import { QuestionType } from "@model/question/question"; import { QuestionType } from "@model/question/question";
import { updateQuestion } from "@root/questions/actions"; import { createTypedQuestion } from "@root/questions/actions";
import type {
UntypedQuizQuestion
} from "../../../model/questionTypes/shared";
type ButtonTypeQuestion = { type ButtonTypeQuestion = {
@ -60,11 +57,10 @@ const BUTTON_TYPE_SHORT_QUESTIONS: ButtonTypeQuestion[] = [
]; ];
interface Props { interface Props {
question: AnyTypedQuizQuestion; question: UntypedQuizQuestion;
} }
export default function FormTypeQuestions({ question }: Props) { export default function FormTypeQuestions({ question }: Props) {
const [switchState, setSwitchState] = useState("");
return ( return (
<Box> <Box>
@ -83,22 +79,13 @@ export default function FormTypeQuestions({ question }: Props) {
<QuestionsMiniButton <QuestionsMiniButton
key={title} key={title}
onClick={() => { onClick={() => {
updateQuestion(question.id, question => { createTypedQuestion(question.id, questionType);
question.type = questionType;
})
}} }}
icon={icon} icon={icon}
text={title} text={title}
/> />
))} ))}
</Box> </Box>
<ButtonsOptions
switchState={switchState}
SSHC={setSwitchState}
question={question}
/>
{/* TODO конфликт типов */}
{/* <SwitchAnswerOptions switchState={switchState} question={question} /> */}
</Box> </Box>
); );
} }