add result page

This commit is contained in:
MikanD
2025-06-01 00:52:20 +03:00
parent 48ec88df74
commit 4a5b0a9532
8 changed files with 1146 additions and 24 deletions

View File

@@ -132,11 +132,11 @@ function QuestionBlock({
<div className={`question agreement ${answered !== undefined ? "answered" : "unanswered"}`}>
{agreementQuestion.question}
<button
className={answered === 1 ? "selected" : ""}
className={`answer ${answered === 1 ? "selected" : "idle"}`}
disabled={answered===1}
onClick={() => onAnswer(`${question.questionType}_${question.id}`, 1)}>Согласен</button>
<button
className={answered === 0 ? "selected" : ""}
className={`answer ${answered === 0 ? "selected" : "idle"}`}
disabled={answered === 0}
onClick={() => onAnswer(`${question.questionType}_${question.id}`, 0)}>Не согласен</button>
@@ -149,7 +149,7 @@ function QuestionBlock({
<div className={`question pair ${answered !== undefined ? "answered" : "unanswered"}`}>
{pairQuestion.statements.map((statement) => (
<button
className={answered === statement.id ? "selected" : ""}
className={`answer ${answered === statement.id ? "selected" : "idle"}`}
disabled={answered === statement.id}
key={statement.id}
onClick={() => onAnswer(`${question.questionType}_${question.id}`, statement.id)}

View File

@@ -0,0 +1,31 @@
import { useParams } from 'react-router-dom';
import { useData } from '../API/common';
import { ScoreVariable, Survey } from '../types/survey';
import ReactMarkdown from 'react-markdown';
import { LoadingData } from '../components/LoadingData';
export function SurveyResultPage() {
const { scoreVariableId } = useParams<{ scoreVariableId: string }>();
const scoreVariable = useData<ScoreVariable>('surveys', 'score-variables', scoreVariableId || 0);
const survey = useData<Survey>('surveys', 'surveys', scoreVariable?.survey || 0, !!scoreVariable);
return (
<div>
<LoadingData data={survey && scoreVariable?null:scoreVariable}>
<h1>{survey?.title}</h1>
<div className={"result"}>
<h2>Ваш результат</h2>
<p>{scoreVariable?.title}</p>
</div>
<div className={"description"}>
<ReactMarkdown>{scoreVariable?.description}</ReactMarkdown>
</div>
<div>
<h3>Подходящие профессии</h3>
<p>Здесь будет список профессий.</p>
</div>
</LoadingData>
</div>
);
}