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

fix: add new question button

Browse Source
This commit is contained in:
IlyaDoronin 2023-10-17 16:33:29 +03:00
parent 8c125e4d21
commit 1170f19a90
1 changed files with 27 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
src/pages/Questions/QuestionsPage.tsx
View File

@ -1,19 +1,19 @@
import { import {
Box, Box,
Button, Button,
IconButton, IconButton,
Typography, Typography,
useMediaQuery, useMediaQuery,
useTheme, useTheme,
} from "@mui/material"; } from "@mui/material";
import AddPlus from "../../assets/icons/questionsPage/addPlus"; import AddPlus from "../../assets/icons/questionsPage/addPlus";
import ArrowLeft from "../../assets/icons/questionsPage/arrowLeft"; import ArrowLeft from "../../assets/icons/questionsPage/arrowLeft";
import { quizStore } from "@root/quizes"; import { quizStore } from "@root/quizes";
import { useParams } from "react-router-dom"; import { useParams } from "react-router-dom";
import { import {
questionStore, questionStore,
createQuestion, createQuestion,
updateQuestionsList, updateQuestionsList,
} from "@root/questions"; } from "@root/questions";
import { DraggableList } from "./DraggableList"; import { DraggableList } from "./DraggableList";
@ -22,17 +22,17 @@ import QuizPreview from "@ui_kit/QuizPreview/QuizPreview";
import { createPortal } from "react-dom"; import { createPortal } from "react-dom";
export default function QuestionsPage() { export default function QuestionsPage() {
const { listQuizes, updateQuizesList } = quizStore(); const { listQuizes, updateQuizesList } = quizStore();
const quizId = Number(useParams().quizId); const quizId = Number(useParams().quizId);
const { listQuestions } = questionStore(); const { listQuestions } = questionStore();
const handleNext = () => { const handleNext = () => {
updateQuizesList(quizId, { step: listQuizes[quizId].step + 1 }); updateQuizesList(quizId, { step: listQuizes[quizId].step + 1 });
}; };
const handleBack = () => { const handleBack = () => {
let result = listQuizes[quizId].step - 1; let result = listQuizes[quizId].step - 1;
updateQuizesList(quizId, { step: result ? result : 1 }); updateQuizesList(quizId, { step: result ? result : 1 });
}; };
const collapseEverything = () => { const collapseEverything = () => {
listQuestions[quizId].forEach((item, index) => { listQuestions[quizId].forEach((item, index) => {
@ -43,12 +43,11 @@ export default function QuestionsPage() {
}); });
}; };
const theme = useTheme(); const theme = useTheme();
const isTablet = useMediaQuery(theme.breakpoints.up(1000)); const isMobile = useMediaQuery(theme.breakpoints.down(660));
return ( return (
<> <>
{/* <Stepper activeStep={activeStep} desc={"Задайте вопросы"} /> */}
<Box <Box
sx={{ sx={{
maxWidth: "796px", maxWidth: "796px",
@ -85,10 +84,15 @@ export default function QuestionsPage() {
onClick={() => { onClick={() => {
createQuestion(quizId); createQuestion(quizId);
}} }}
sx={{
position: "fixed",
left: isMobile ? "20px" : "250px",
bottom: "20px",
}}
> >
<AddPlus /> <AddPlus />
</IconButton> </IconButton>
<Box sx={{ display: "flex", gap: "8px" }}> <Box sx={{ display: "flex", gap: "8px", marginLeft: "auto" }}>
<Button <Button
variant="outlined" variant="outlined"
sx={{ padding: "10px 20px", borderRadius: "8px", height: "44px" }} sx={{ padding: "10px 20px", borderRadius: "8px", height: "44px" }}