frontPanel/src/pages/ResultPage/ResultSettings.tsx

117 lines
3.6 KiB
TypeScript
Raw Normal View History

import IconPlus from "@icons/IconPlus";
2023-11-20 17:22:13 +00:00
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";
2023-11-20 17:22:13 +00:00
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, useState } from "react";
import { WhenCard } from "./cards/WhenCard";
import { ResultCard } from "./cards/ResultCard";
import { EmailSettingsCard } from "./cards/EmailSettingsCard";
import { useCurrentQuiz } from "@root/quizes/hooks"
import { useQuestionsStore } from "@root/questions/store";
import { QuizQuestionResult } from "@model/questionTypes/result";
export const ResultSettings = () => {
const quiz = useCurrentQuiz()
const results = useQuestionsStore().questions.filter(q => q.type === "result")
console.log("опросник ", quiz)
const [quizExpand, setQuizExpand] = useState(true)
const [resultContract, setResultContract] = useState(true)
const [readyLeave, setReadyLeave] = useState(true)
const setAlertLeave = () => {
if (readyLeave) setReadyLeave(false)
console.log(readyLeave)
}
2023-04-15 09:10:59 +00:00
useEffect(() => {
return () =>{
console.log(readyLeave)
if (!readyLeave) alert("Пожалуйста, проверьте, что вы заполнили все результаты")
}
}, [readyLeave])
2023-04-15 09:10:59 +00:00
return (
2023-10-16 14:23:44 +00:00
<Box sx={{ maxWidth: "796px" }}>
<Box sx={{
display: "flex",
alignItems: "center",
margin: "60px 0 40px 0",
}}>
<Typography variant="h5">
2023-04-15 09:10:59 +00:00
Настройки результатов
</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)}
2023-04-15 09:10:59 +00:00
>
Свернуть
</Button>
</Box>
<WhenCard quizExpand={quizExpand} />
{quiz.config.resultInfo.when === "email" && <EmailSettingsCard quizExpand={quizExpand} />}
2023-10-16 14:23:44 +00:00
<Box
sx={{ display: "flex", alignItems: "center", mb: "15px", mt: "15px" }}
>
2023-04-15 09:10:59 +00:00
<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)}
2023-04-15 09:10:59 +00:00
>
Развернуть все
</Button>
</Box>
{
results.map((resultQuestion) => <ResultCard resultContract={resultContract} resultData={resultQuestion} key={resultQuestion.id} setAlertLeave={setAlertLeave} />)
}
<Modal
open={false}
// onClose={handleClose}
aria-labelledby="modal-modal-title"
aria-describedby="modal-modal-description"
>
<></>
</Modal>
2023-04-15 09:10:59 +00:00
</Box>
);
2023-04-23 08:39:34 +00:00
};