request to change the survey

SurveyFrontend/src/components/SurveyPage/SurveyPage.module.css

@@ -1,3 +1,10 @@
 .survey_page{
     width: 85%;
+}
+
+.error{
+    color: #C0231F;
+    text-align: center;
+    margin: 10px 0;
+    font-size: 18px;
 }

SurveyFrontend/src/components/SurveyPage/SurveyPage.tsx

@@ -1,16 +1,22 @@
 import SurveyInfo from "../SurveyInfo/SurveyInfo.tsx";
 import QuestionsList, {Question} from "../QuestionsList/QuestionsList.tsx";
 import {useEffect, useState} from "react";
-import {getSurveyById, ISurvey} from "../../api/SurveyApi.ts";
+import {getSurveyById, ISurvey, updateSurvey} from "../../api/SurveyApi.ts";
 import {useParams} from "react-router-dom";
 import {getListQuestions} from "../../api/QuestionApi.ts";
 import styles from "./SurveyPage.module.css";
+import SaveButton from "../SaveButton/SaveButton.tsx";
 
 export const SurveyPage: React.FC = () => {
     const [survey, setSurvey] = useState<ISurvey | null>(null);
     const [questions, setQuestions] = useState<Question[]>([]);
     const [loading, setLoading] = useState(true);
-    const { surveyId } = useParams<{ surveyId: string }>(); // Изменили параметр на surveyId
+    const [error, setError] = useState<string | null>(null);
+    const { surveyId } = useParams<{ surveyId: string }>();
+
+    const [description, setDescription] = useState('');
+    const [title, setTitle] = useState('');
+
 
     useEffect(() => {
         if (!surveyId) {
@@ -30,6 +36,9 @@ export const SurveyPage: React.FC = () => {
                 const surveyData = await getSurveyById(id);
                 setSurvey(surveyData);
 
+                setTitle(surveyData.title);
+                setDescription(surveyData.description);
+
                 const questionsData = await getListQuestions(id);
                 const formattedQuestions = questionsData.map(q => ({
                     id: q.id,
@@ -39,6 +48,7 @@ export const SurveyPage: React.FC = () => {
                 setQuestions(formattedQuestions);
             } catch (error) {
                 console.error('Ошибка:', error);
+                setError('Не удалось загрузить опрос')
             } finally {
                 setLoading(false);
             }
@@ -50,19 +60,40 @@ export const SurveyPage: React.FC = () => {
     if (loading) return <div>Загрузка...</div>;
     if (!survey) return <div>Опрос не найден</div>;
 
+    const handleSave = async() => {
+        if (!surveyId || !survey) return;
+
+        try{
+            setError(null);
+            const id = parseInt(surveyId);
+            const surveyUpdated =  await updateSurvey(id, {
+                title: title,
+                description: description,
+            })
+            setSurvey(surveyUpdated);
+        }
+        catch(error){
+            console.error('Ошибка при сохранении опроса:', error);
+            setError('Не удалось сохранить изменения');
+            throw error;
+        }
+    }
+
     return (
         <div className={styles.survey_page}>
             <SurveyInfo
-                titleSurvey={survey.title}
+                titleSurvey={title}
-                descriptionSurvey={survey.description}
+                descriptionSurvey={description}
-                setDescriptionSurvey={() => {}}
+                setDescriptionSurvey={setDescription}
-                setTitleSurvey={() => {}}
+                setTitleSurvey={setTitle}
             />
             <QuestionsList
                 questions={questions}
                 setQuestions={setQuestions}
                 surveyId={survey.id}
             />
+            {error && <div className={styles.error}>{error}</div>}
+            <SaveButton onClick={handleSave}/>
         </div>
     );
 };