fixed getting data for completing a survey
This commit is contained in:
parent
88dcb63232
commit
2ec9354fc1
13 changed files with 128 additions and 55 deletions
|
|
@ -1,25 +1,85 @@
|
|||
import SurveyInfo from "../SurveyInfo/SurveyInfo.tsx";
|
||||
import QuestionsList, {Question} from "../QuestionsList/QuestionsList.tsx";
|
||||
import {useState} from "react";
|
||||
import {useEffect, useState} from "react";
|
||||
import styles from './CompletingSurvey.module.css'
|
||||
import { useParams} from "react-router-dom";
|
||||
import {getSurveyById, ISurvey} from "../../api/SurveyApi.ts";
|
||||
import {getListQuestions} from "../../api/QuestionApi.ts";
|
||||
import {getAnswerVariants, IAnswerVariant} from "../../api/AnswerVariantsApi.ts";
|
||||
|
||||
export const CompletingSurvey = () => {
|
||||
const [titleSurvey, setTitleSurvey] = useState("Название опроса");
|
||||
const [descriptionSurvey, setDescriptionSurvey] = useState("");
|
||||
const [questions, setQuestions] = useState<Question[]>([
|
||||
{ id: 1, text: 'Вопрос 1', questionType: 'SingleAnswerQuestion', answerVariants: [{ id: 1, text: 'Ответ 1' },
|
||||
{ id: 2, text: 'Ответ 1' }, { id: 3, text: 'Ответ 1' }]},
|
||||
{ id: 2, text: 'Вопрос 2', questionType: 'MultipleAnswerQuestion', answerVariants: [{ id: 1, text: 'Ответ 1' },
|
||||
{ id: 2, text: 'Ответ 1' }, { id: 3, text: 'Ответ 1' }]}
|
||||
]);
|
||||
// const [titleSurvey, setTitleSurvey] = useState("Название опроса");
|
||||
// const [descriptionSurvey, setDescriptionSurvey] = useState("");
|
||||
// const [questions, setQuestions] = useState<Question[]>([
|
||||
// { id: 1, text: 'Вопрос 1', questionType: 'SingleAnswerQuestion', answerVariants: [{ id: 1, text: 'Ответ 1' },
|
||||
// { id: 2, text: 'Ответ 1' }, { id: 3, text: 'Ответ 1' }]},
|
||||
// { id: 2, text: 'Вопрос 2', questionType: 'MultipleAnswerQuestion', answerVariants: [{ id: 1, text: 'Ответ 1' },
|
||||
// { id: 2, text: 'Ответ 1' }, { id: 3, text: 'Ответ 1' }]}
|
||||
// ]);
|
||||
|
||||
// const [questions, setQuestions] = useState<Question[]>([]);
|
||||
// const [loading, setLoading] = useState(true);
|
||||
// const [error, setError] = useState<string | null>(null);
|
||||
//
|
||||
// const [description, setDescription] = useState('');
|
||||
// const [title, setTitle] = useState('');
|
||||
//
|
||||
// const { survey, setSurvey } = useOutletContext<{
|
||||
// survey: ISurvey;
|
||||
// setSurvey: (survey: ISurvey) => void;
|
||||
// }>();
|
||||
|
||||
const {surveyId} = useParams<{surveyId: string}>();
|
||||
const [survey, setSurvey] = useState<ISurvey | null>(null);
|
||||
const [questions, setQuestions] = useState<Question[]>([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [error, setError] = useState<string | null>(null);
|
||||
|
||||
useEffect(() => {
|
||||
const fetchSurveyData = async () => {
|
||||
try {
|
||||
setLoading(true);
|
||||
if (!surveyId) return;
|
||||
|
||||
const surveyData = await getSurveyById(parseInt(surveyId));
|
||||
setSurvey(surveyData);
|
||||
|
||||
const questionsData = await getListQuestions(parseInt(surveyId));
|
||||
const formattedQuestions = await Promise.all(questionsData.map(async q => {
|
||||
const answerVariants = await getAnswerVariants(parseInt(surveyId), q.id);
|
||||
return {
|
||||
id: q.id,
|
||||
text: q.title,
|
||||
questionType: q.questionType as 'SingleAnswerQuestion' | 'MultipleAnswerQuestion',
|
||||
answerVariants: answerVariants.map((a: IAnswerVariant) => ({
|
||||
id: a.id,
|
||||
text: a.text
|
||||
}))
|
||||
};
|
||||
}));
|
||||
setQuestions(formattedQuestions);
|
||||
} catch (error) {
|
||||
console.error('Ошибка загрузки опроса:', error);
|
||||
setError('Не удалось загрузить опрос');
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
fetchSurveyData();
|
||||
}, [surveyId]);
|
||||
|
||||
if (loading) return <div>Загрузка...</div>;
|
||||
if (error) return <div>{error}</div>;
|
||||
if (!survey) return <div>Опрос не найден</div>;
|
||||
|
||||
return (
|
||||
<div className={styles.survey}>
|
||||
<SurveyInfo
|
||||
titleSurvey={titleSurvey}
|
||||
descriptionSurvey={descriptionSurvey}
|
||||
setDescriptionSurvey={setDescriptionSurvey}
|
||||
setTitleSurvey={setTitleSurvey}
|
||||
titleSurvey={survey.title}
|
||||
descriptionSurvey={survey.description}
|
||||
setDescriptionSurvey={(value) => setSurvey({ ...survey, description: value })}
|
||||
setTitleSurvey={(value) => setSurvey({ ...survey, title: value })}
|
||||
/>
|
||||
<QuestionsList
|
||||
questions={questions}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue