results page

.gitignore

@@ -399,6 +399,7 @@ FodyWeavers.xsd
 
 # JetBrains Rider
 *.sln.iml
+backend/.idea/
 backend/.idea/workspace.xml
 backend/.venv/Lib
 backend/.venv/Lib/site-packages/asgiref/__init__.py

frontend/mmpi-test/src/pages/Results.jsx

@@ -1,20 +1,64 @@
 import React from 'react';
-import { useLocation } from 'react-router-dom';
-
-const Results = () => {
-  const location = useLocation();
-  const { answers } = location.state || {}; // Получаем данные из состояния
+import '../styles/results.css';
+import CheckIcon from '../img/check-icon.png';
+import ClinicalScalesImage from '../img/clinical-scales.png';
+import EvaluativeScalesImage from '../img/evaluative-scales.png';
 
+const Result = () => {
   return (
-    <div className="results-container">
-      <h2>Ваши результаты:</h2>
-      <ul>
-        {answers && answers.map((answer, index) => (
-          <li key={index}>Вопрос {index + 1}: {answer}</li>
-        ))}
-      </ul>
+    <div className="result-container">
+      <div className="result-header">
+        <img src={CheckIcon} alt="Успех" className="result-check-icon" />
+        <h1 className="result-title">Поздравляем с успешным<br />прохождением тестирования!</h1>
+      </div>
+
+      <div className="result-buttons">
+        <div className="button-with-note">
+          <button className="result-btn save-button">Сохранить результат</button>
+          <p className="result-note">Результат сохранится в формате PDF на ваше устройство</p>
+        </div>
+        <div className="button-with-note">
+          <button className="result-btn send-button">Отправить результат</button>
+          <p className="result-note">Результат будет отправлен на электронную почту</p>
+        </div>
+      </div>
+      <h3 className="result-subtitle">Ниже вы можете увидеть график с результатами</h3>
+      <div className="placeholder">[ГРАФИК]</div>
+      <div className="placeholder">[ТАБЛИЦА]</div>
+
+      <p className="result-description">
+        Перед вами результаты по 10 основным шкалам. Красным отмечены шкалы, которые выходят за пределы коридора нормы (норма от 30T - до 70T).<br /><br />
+        В узком коридоре нормы — в пределах 46 — 55 Т — колебания профиля трудно интерпретируемые, так как они не выявляют достаточно выраженных индивидуально-личностных свойств и характерны для полностью сбалансированной личности.<br /><br />
+        В широком коридоре нормы (от 30 до 70 Т) в профиле нормы каждой тенденции противопоставлена противоположная по направленности «антитенденция», а чувства и поведение подчинены контролю сознания (или эмоции настолько умеренны, что минимальный контроль над ними оказывается вполне достаточным).<br /><br />
+        Повышения, колеблющиеся в пределах 56 — 66 Т, выявляют те ведущие тенденции, которые определяют характерологические особенности индивида.<br /><br />
+        Более высокие показатели разных базисных шкал (67-75 Т) выделяют те акцентуированные (сильно выраженные) черты, которые временами затрудняют социально-психологическую адаптацию человека.<br /><br />
+        Показатели выше 75 Т свидетельствуют о нарушенной адаптации и об отклонении состояния индивида от нормального. Это могут быть психопатические черты характера, состояние стресса, вызванное экстремальной ситуацией, невротические расстройства и, наконец, психопатология, о наличии которой может судить только патопсихолог или психиатр по совокупности данных психодиагностического, экспериментально-психологического и клинического исследования.
+      </p>
+
+      <h3 className="result-subtitle">Ниже вы можете ознакомиться с описанием основных шкал</h3>
+
+      <h4 className="scale-section-title">Клинические шкалы и их значения</h4>
+      <img src={ClinicalScalesImage} alt="Клинические шкалы" className="result-scale-image" />
+
+      <h4 className="scale-section-title">Оценочные шкалы и их значения</h4>
+      <img src={EvaluativeScalesImage} alt="Оценочные шкалы" className="result-scale-image" />
+
+      <p className="result-formula">
+        Баллы рассчитывались по следующей формуле:<br />
+        <strong>T = 50 + 10 × (X - M) / σ</strong>, где:<br />
+        X — "сырой" балл испытуемого по шкале<br />
+        M — среднее значение по нормативной выборке<br />
+        σ — стандартное отклонение по нормативной выборке<br /><br />
+        Пример:<br />
+        Допустим, по шкале 2 испытуемый набрал 25 сырых баллов. Подставляя в формулу, получаем:<br />
+        <strong>T = 50 + 10 × (25 - 18.9) / 5 = 62.2</strong> — данный результат соответствует норме.
+      </p>
+
+      <p className="result-footer">
+        Результаты тестирования могут показать наличие проблем, но должны интерпретироваться исключительно специалистом.
+      </p>
     </div>
   );
 };
 
-export default Results;
+export default Result;

frontend/mmpi-test/src/pages/Test.jsx

@@ -91,7 +91,6 @@ const Test = () => {
         throw new Error(`Ошибка ответа: ${response.status}`);
       }
 
-      const data = await response.json();
       console.log(`[INFO] Ответ на вопрос ${questionNumber} успешно отправлен`);
 
       const newAnswers = [...answers, answer];
@@ -108,7 +107,7 @@ const Test = () => {
     } catch (error) {
       console.error('[ERROR] Не удалось отправить ответ:', error);
     } finally {
-      setTimeout(() => setButtonsDisabled(false), 300);
+      setTimeout(() => setButtonsDisabled(false), 100);
     }
   };
 

frontend/mmpi-test/src/styles/results.css

@@ -0,0 +1,144 @@
+*{
+  margin: 0;
+  padding: 0;
+  font-family: Montserrat;
+}
+@font-face{
+  font-family: Montserrat;
+  src: url(../fonts/Montserrat/Montserrat-VariableFont_wght.ttf);
+}
+
+.result-container {
+  max-width: 900px;
+  margin: 0 auto;
+  padding: 40px 20px;
+  text-align: center;
+  font-family: Arial, sans-serif;
+  color: #333;
+}
+
+.result-header {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 20px;
+  margin-bottom: 30px;
+}
+
+.result-check-icon {
+  width: 140px;
+  height: 140px;
+}
+
+.result-title {
+  font-size: 32px;
+  font-weight: 600;
+  line-height: 1.4;
+}
+
+.result-buttons {
+  display: flex;
+  justify-content: center;
+  gap: 10px;
+  margin-bottom: 30px;
+  flex-wrap: wrap;
+}
+
+.button-with-note {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  max-width: 260px;
+  padding:20px 20px;
+  border: none;
+  border-radius: 15px;
+}
+
+.result-btn {
+  padding: 20px 25px;
+  font-size: 18px;
+  font-weight: 500;
+  border-radius: 30px;
+  border: none;
+  background-color: #3b82f6;
+  color: rgb(0, 0, 0);
+  cursor: pointer;
+  transition: background-color 0.3s;
+}
+
+
+.save-button{
+  background-color: #f3e2d3;
+  border:1px solid #000000 ;
+}
+
+.send-button{
+  background-color: #cedbea;
+  border:1px solid #000000 ;
+}
+
+.save-button:hover {
+  background-color: #eed5c0;
+}
+
+.send-button:hover {
+  background-color: #bad0e9;
+}
+
+.result-note {
+  font-size: 12px;
+  margin-top: 6px;
+  color: #474747;
+  text-align: center;
+}
+
+.placeholder {
+  margin: 30px auto;
+  width: 100%;
+  height: 250px;
+  border: 2px dashed #aaa;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  color: #666;
+  font-size: 20px;
+}
+
+.result-description,
+.result-formula {
+  text-align: justify;
+  margin-top: 30px;
+  line-height: 1.6;
+  font-weight: 500;
+}
+
+.result-formula {
+  text-align: justify;
+  margin-top: 40px;
+}
+
+.result-subtitle {
+  margin-top: 40px;
+  font-size: 20px;
+  font-weight: 600;
+}
+
+.scale-section-title{
+  font-weight: 500;
+  margin-top: 25px;
+  margin-bottom: 10px;
+}
+
+.result-scale-image {
+  width: 100%;
+  max-width: 600px;
+  margin: 10px auto;
+  display: block;
+}
+
+.result-footer {
+  margin-top: 40px;
+  font-weight: bold;
+  text-align: center;
+}
+