fixed getting data for completing a survey

This commit is contained in:
Tatiana Nikolaeva 2025-06-02 16:00:19 +05:00
parent 88dcb63232
commit 2ec9354fc1
13 changed files with 128 additions and 55 deletions

View file

@ -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}