123 lines
3.9 KiB
TypeScript
123 lines
3.9 KiB
TypeScript
import IconPlus from "@icons/IconPlus";
|
||
import Info from "@icons/Info";
|
||
import Plus from "@icons/Plus";
|
||
import ArrowLeft from "@icons/questionsPage/arrowLeft";
|
||
import { Box, Button, Typography, Paper, Modal, TextField } from "@mui/material";
|
||
import { incrementCurrentStep } from "@root/quizes/actions";
|
||
import CustomWrapper from "@ui_kit/CustomWrapper";
|
||
import { DescriptionForm } from "./DescriptionForm/DescriptionForm";
|
||
import { ResultListForm } from "./ResultListForm";
|
||
import { SettingForm } from "./SettingForm";
|
||
import { useEffect, useRef, useState } from "react";
|
||
import { WhenCard } from "./cards/WhenCard";
|
||
import { ResultCard, checkEmptyData } from "./cards/ResultCard";
|
||
import { EmailSettingsCard } from "./cards/EmailSettingsCard";
|
||
import { useCurrentQuiz } from "@root/quizes/hooks"
|
||
import { useQuestionsStore } from "@root/questions/store";
|
||
import { createFrontResult, deleteQuestion } from "@root/questions/actions";
|
||
import { QuizQuestionResult } from "@model/questionTypes/result";
|
||
|
||
export const ResultSettings = () => {
|
||
const { questions } = useQuestionsStore()
|
||
const quiz = useCurrentQuiz()
|
||
const results = useQuestionsStore().questions.filter((q): q is QuizQuestionResult => q.type === "result")
|
||
console.log("опросник ", quiz)
|
||
const [quizExpand, setQuizExpand] = useState(true)
|
||
const [resultContract, setResultContract] = useState(true)
|
||
const isReadyToLeaveRef = useRef(true);
|
||
|
||
useEffect(function calcIsReadyToLeave(){
|
||
let isReadyToLeave = true;
|
||
results.forEach((result) => {
|
||
if (checkEmptyData({ resultData: result })) {
|
||
isReadyToLeave = false;
|
||
}
|
||
});
|
||
isReadyToLeaveRef.current = isReadyToLeave;
|
||
}, [results])
|
||
|
||
useEffect(() => {
|
||
return () => {
|
||
if (isReadyToLeaveRef.current === false) alert("Пожалуйста, проверьте, что вы заполнили все результаты");
|
||
};
|
||
}, []);
|
||
|
||
return (
|
||
<Box sx={{ maxWidth: "796px" }}>
|
||
<Box sx={{
|
||
display: "flex",
|
||
alignItems: "center",
|
||
margin: "60px 0 40px 0",
|
||
}}>
|
||
<Typography variant="h5">
|
||
Настройки результатов
|
||
</Typography>
|
||
<Info />
|
||
<Button
|
||
disableRipple
|
||
sx={{
|
||
ml: "auto",
|
||
width: "73px",
|
||
height: "19px",
|
||
color: "#7E2AEA",
|
||
textDecoration: "underline",
|
||
fontSize: "16px",
|
||
"&:hover": {
|
||
background: "none",
|
||
textDecoration: "underline",
|
||
},
|
||
}}
|
||
variant="text"
|
||
onClick={() => setQuizExpand(!quizExpand)}
|
||
>
|
||
Свернуть
|
||
</Button>
|
||
</Box>
|
||
|
||
|
||
<WhenCard quizExpand={quizExpand} />
|
||
{quiz.config.resultInfo.when === "email" && <EmailSettingsCard quizExpand={quizExpand} />}
|
||
|
||
|
||
<Box
|
||
sx={{ display: "flex", alignItems: "center", mb: "15px", mt: "15px" }}
|
||
>
|
||
<Typography variant="p1" sx={{ color: "#4D4D4D", fontSize: "14px" }}>
|
||
Создайте результат
|
||
</Typography>
|
||
<Button
|
||
disableRipple
|
||
sx={{
|
||
ml: "auto",
|
||
height: "19px",
|
||
color: "#7E2AEA",
|
||
textDecoration: "underline",
|
||
fontSize: "16px",
|
||
|
||
"&:hover": {
|
||
background: "none",
|
||
textDecoration: "underline",
|
||
},
|
||
}}
|
||
variant="text"
|
||
onClick={() => setResultContract(!resultContract)}
|
||
>
|
||
Развернуть все
|
||
</Button>
|
||
</Box>
|
||
|
||
{
|
||
results.map((resultQuestion) => <ResultCard resultContract={resultContract} resultData={resultQuestion} key={resultQuestion.id} />)
|
||
}
|
||
<Modal
|
||
open={false}
|
||
// onClose={handleClose}
|
||
aria-labelledby="modal-modal-title"
|
||
aria-describedby="modal-modal-description"
|
||
>
|
||
<></>
|
||
</Modal>
|
||
</Box>
|
||
);
|
||
};
|