survey-webapp/SurveyFrontend/src/components/SettingSurvey/SettingSurvey.tsx
Tatiana Nikolaeva 1e60984d64 fix results page
2025-06-10 08:42:07 +05:00

76 lines
No EOL
3.1 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import React, {useRef, useState} from 'react';
import SurveyInfo from "../SurveyInfo/SurveyInfo.tsx";
import styles from "./SettingSurvey.module.css";
import TimeEvent from "../TimeEvent/TimeEvent.tsx";
import {ISurvey} from "../../api/SurveyApi.ts";
import {useLocation, useOutletContext} from "react-router-dom";
import {useSurveyContext} from "../../context/SurveyContext.tsx";
const SettingSurvey: React.FC = () => {
const location = useLocation();
const isSettingCreatePage = location.pathname.includes('/survey/create');
const { survey, setSurvey } = useOutletContext<{
survey: ISurvey;
setSurvey: (survey: ISurvey) => void;
}>();
const { tempSurvey, setTempSurvey } = useSurveyContext();
const [showPopup, setShowPopup] = useState(false);
const buttonRef = useRef<HTMLButtonElement>(null);
const handleCopyLink = () => {
if (!survey?.id) return;
const link = `${window.location.origin}/complete-survey/${survey.id}`;
navigator.clipboard.writeText(link)
.then(() => {
setShowPopup(true);
setTimeout(() => setShowPopup(false), 2000);
})
.catch(error => console.error(`Не удалось скопировать ссылку: ${error}`));
}
return (
<div className={styles.settingSurvey}>
{isSettingCreatePage ? (
<SurveyInfo
titleSurvey={tempSurvey.title}
descriptionSurvey={tempSurvey.description}
setDescriptionSurvey={(value) => setTempSurvey({ ...tempSurvey, description: value })}
setTitleSurvey={(value) => setTempSurvey({ ...tempSurvey, title: value })}
/>
) : (
<SurveyInfo
titleSurvey={survey.title}
descriptionSurvey={survey.description}
setDescriptionSurvey={(value) => setSurvey({ ...survey, description: value })}
setTitleSurvey={(value) => setSurvey({ ...survey, title: value })}
/>
)}
<div className={styles.startEndTime}>
<TimeEvent title='Время начала'/>
<TimeEvent title='Время окончания'/>
</div>
<div className={styles.param}>
<h2>Параметры видимости</h2>
</div>
{!isSettingCreatePage && (
<div className={styles.buttonContainer}>
<button
ref={buttonRef}
onClick={handleCopyLink}
className={styles.copyButton}
>
Копировать ссылку
</button>
{showPopup && (
<div className={styles.popup}>
Ссылка скопирована
</div>
)}
</div>
)}
</div>
)
}
export default SettingSurvey;