убран код ИИ, вывод информации на страницу отдельного курса

src/AppRoutes.tsx

@@ -16,7 +16,7 @@ import { getRouteHome } from "./shared/consts/router";
 import { getRouteForgotPassword } from "./shared/consts/router";
 import { getRouteCourses } from "./shared/consts/router";
 import { getRouteCourseExercises } from "./shared/consts/router";
-import { getRouteExercise } from "./shared/consts/router";
+// import { getRouteExercise } from "./shared/consts/router";
 import { getRouteSettings } from "./shared/consts/router";
 import { getRouteCourseComplete } from "./shared/consts/router";
 
@@ -31,8 +31,14 @@ const AppRoutes = () => (
     <Route path={getRouteHome()} component={Home} />
     <Route path={getRouteForgotPassword()} component={ForgotPasword} />
     <Route path={getRouteCourses()} component={Courses} />
+
+    {/* <Route path="pacient/:id" component={CourseExercises} /> */}
+
     <Route path={getRouteCourseExercises(':id')} component={CourseExercises} />
-    <Route path={getRouteExercise(':id')} component={Exercise} />
+
+    <Route path="/pacient/:courseId/:exerciseId" component={Exercise} /> 
+    {/* <Route path={getRouteExercise(courseId, exerciseId)} component={Exercise} /> */}
+
     <Route path={getRouteSettings()} component={Settings} />
     <Route path={getRouteCourseComplete()} component={CourseComplete} />
   </Switch>

src/pages/CourseExercises.tsx

@@ -1,221 +1,93 @@
 "use client"
 
-import { useState } from "react"
+import { useState, useEffect } from "react"
-import { useHistory } from "react-router-dom"
+import { useParams } from "react-router-dom"
 
 import HeaderNav from "../components/HeaderNav"
 import BottomNavigation from "../components/BottomNavigation"
-import video from "../assets/img/video.mov"
+
 
 import { connect } from '../confconnect';
-import { getRouteExercise } from "../shared/consts/router"
+
 
 export const CourseExercises = () => {
-  const history = useHistory()
+
-  // const { id } = useParams<{ id: string }>();
+  const { id } = useParams<{ id: string }>();
-  const [currentSlide, setCurrentSlide] = useState(0)
+
+
+  // const id = useParams();
+
+const [pacientData, setPacientData] = useState(null);
+  const token = localStorage.getItem('authToken');
+
+  useEffect(() => {
+    console.log(token)
+    if (!token) {
+     console.log('Токен не найден');
+      return;
+    }
 
 
 
-const course = {
+    connect.get(`/pacient/${id}`, {
-  id: 2,
+      
-  description: 'Очень сильно',
+      headers: {
-  name: 'Качаем ноги',
+        Authorization: `Bearer ${token}`,
-  exercises: [
+      },
-    {
+      
-      id: 1,
+    })
-      name: "Подъемы ног лежа",
+    .then(response => {
-      duration: "15 мин",
+      console.log('Response status:', response.status);
-      sets: 3,
+      console.log('Данные:', response.data);
-      reps: 12,
+      setPacientData(response.data);
-      image: "/placeholder.svg?height=200&width=300",
+
-      difficulty: "Легкий",
+
-      description: "Укрепление мышц бедра и улучшение подвижности коленного сустава",
+    })
-      calories: 45,
+    .catch(error => {
-    },
+      if (error.response) {
-    {
+        console.error('Ошибка ответа сервера:', error.response.status, error.response.data);
-      id: 2,
+       
-      name: "Приседания у стены",
+      } else if (error.request) {
-      duration: "10 мин",
+        console.error('Нет ответа от сервера:', error.request);
-      sets: 2,
+       
-      reps: 15,
+      } else {
-      image: "/placeholder.svg?height=200&width=300",
+        console.error('Ошибка при настройке запроса:', error.message);
-      difficulty: "Средний",
+     
-      description: "Безопасные приседания для восстановления силы ног",
+      }
-      calories: 60,
+    });
-    },
+  }, [token]);
-    {
+
-      id: 3,
-      name: "Растяжка квадрицепса",
-      duration: "8 мин",
-      sets: 1,
-      reps: 30,
-      image: "/placeholder.svg?height=200&width=300",
-      difficulty: "Легкий",
-      description: "Улучшение гибкости и снятие напряжения",
-      calories: 25,
-    },
-    {
-      id: 4,
-      name: "Укрепление икр",
-      duration: "12 мин",
-      sets: 3,
-      reps: 20,
-      image: "/placeholder.svg?height=200&width=300",
-      difficulty: "Средний",
-      description: "Развитие силы и выносливости икроножных мышц",
-      calories: 40,
-    },
-  ]}
 
-  // Функции для переключения на следующее/предыдущее упражнение
-  const nextExercise = () => {
-    setCurrentSlide((prev) => (prev + 1) % course.exercises.length)
-  }
 
-  const prevExercise = () => {
-    setCurrentSlide((prev) => (prev - 1 + course.exercises.length) % course.exercises.length)
-  }
-  const currentExercise = course.exercises[currentSlide]
 
-  // const getDifficultyColor = (difficulty: string) => {
-  //   switch (difficulty) {
-  //     case "Легкий":
-  //       return "bg-gradient-to-r from-emerald-400 to-green-500"
-  //     case "Средний":
-  //       return "bg-gradient-to-r from-amber-400 to-orange-500"
-  //     case "Сложный":
-  //       return "bg-gradient-to-r from-red-400 to-pink-500"
-  //     default:
-  //       return "bg-gradient-to-r from-gray-400 to-gray-500"
-  //   }
-  // }
 
   return (
 
 
 
 
-    <div className="bg-gray-50 w-full h-full overflow-auto">
+    <div className="my-36 min-h-screen max-w-4xl mx-auto">
-      <div className="my-36 min-h-screen max-w-4xl mx-auto">
-      <HeaderNav item={course.name} text={course.description} />
      
+      <HeaderNav item={'Test'} text={'test_test'} />
 
+      <div className="mb-20">
+        <div
         
-      {/* Exercise Slider */}
+        className="bg-green-800 p-4 hover:scale-105 transition duration-300 text-white">Перейти на упражнение</div>
-      <div className="px-4 sm:px-6 mt-34 mb-10 ">
+        <h1>выводим текст</h1>
-        <div className="glass-morphism rounded-3xl border border-white/50 shadow-2xl overflow-hidden backdrop-blur-2xl relative">
+         {/* Выводим данные пациента */}
-          {/* Exercise Image */}
+      {pacientData ? (
-          <div className="relative">
+        <pre>{JSON.stringify(pacientData, null, 2)}</pre>
-              <video
+      ) : (
-                src={video}
+        <p>Нет данных</p>
-                className="w-full h-120 object-cover"
+      )}
-                autoPlay
-                loop
-                muted
-                playsInline
-              />
-            <div className="absolute inset-0 bg-gradient-to-t from-black/20 via-transparent to-black/10"></div>
-
-            {/* Difficulty Badge */}
-            <div className="absolute top-4 right-4">
-              {/* <div
-                className={`px-4 py-2 rounded-full text-xs font-bold text-white shadow-lg backdrop-blur-sm ${getDifficultyColor(currentExercise.difficulty)}`}
-              >
-                {currentExercise.difficulty}
-              </div> */}
-            </div>
-
-            {/* Navigation arrows */}
-
-              <button
-                onClick={prevExercise}
-                className="z-50 absolute left-4 top-1/2 transform -translate-y-1/2 w-12 h-12 bg-black/20 backdrop-blur-xl rounded-full flex items-center justify-center text-white hover:bg-black/30 transition-all duration-300 shadow-lg border border-white/20"
-              >
-                <svg className="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                  <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M15 19l-7-7 7-7" />
-                </svg>
-              </button>
-              <button
-                onClick={nextExercise}
-                className="z-50 absolute right-4 top-1/2 transform -translate-y-1/2 w-12 h-12 bg-black/20 backdrop-blur-xl rounded-full flex items-center justify-center text-white hover:bg-black/30 transition-all duration-300 shadow-lg border border-white/20"
-              >
-                <svg className="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                  <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 5l7 7-7 7" />
-                </svg>
-              </button>
-
-
-           
-          </div>
-
-          {/* Exercise Info */}
-          <div className="p-6">
-            <h3 className="text-xl font-semibold text-gray-600 mb-3">{currentExercise.name}</h3>
-
-
-
-<button
-  onClick={() => history.push(getRouteExercise(currentExercise.id))}
-  className="w-full bg-gradient-to-r bg-orange-400 text-white font-semibold py-4 px-6 rounded-2xl hover:shadow-2xl transition-all duration-300 transform hover:scale-105 shadow-lg backdrop-blur-sm"
->
-              Начать упражнение
-            </button>
-          </div>
-        </div>
-
-        {/* Slide indicators */}
-        <div className="flex justify-center mt-6 space-x-2">
-          {course.exercises.map((_, index) => (
-            <button
-              key={index}
-              onClick={() => setCurrentSlide(index)}
-              className={`h-4 rounded-full transition-all duration-300 ${index === currentSlide
-                  ? "bg-gradient-to-r from-[#2BACBE] to-cyan-600 w-8 shadow-lg"
-                  : "bg-gray-300 w-4 hover:bg-gray-400"
-                }`}
-            />
-          ))}
-        </div>
       </div>
 
-      {/* Exercise List */}
-      <div className="px-4 sm:px-6 mb-50">
-        <h2 className="text-xl sm:text-2xl font-semibold text-gray-800 mb-6">Все упражнения курса</h2>
-        <div className="space-y-4">
-          {course.exercises.map((exercise, index) => (
-            <div
-              key={exercise.id}
-              onClick={() => history.push(getRouteExercise(currentExercise.id))}
-              className={`glass-morphism rounded-2xl p-4 sm:p-6 border border-white/50 shadow-lg cursor-pointer transition-all duration-300 hover:shadow-2xl transform hover:scale-[1.02] backdrop-blur-xl ${index === currentSlide ? "ring-2 ring-[#2BACBE] bg-cyan-50/20" : ""
-                }`}
-            >
-              <div className="flex items-center space-x-4">
-                <div className="relative">
-                  <div className="w-14 h-14 sm:w-16 sm:h-16 border-2 border-cyan-500 rounded-2xl flex items-center justify-center text-cyan-500 font-semibold text-lg sm:text-xl shadow-xl">
-                    {index + 1}
-                  </div>
    
-                </div>
-                <div className="flex-1 min-w-0">
-                  <h3 className="font-semibold text-gray-800 text-lg sm:text-xl truncate">{exercise.name}</h3>
-                  <p className="text-gray-600 text-sm mb-2 line-clamp-2">{exercise.description}</p>
-
-                </div>
-                <div className="text-[#2BACBE] transform transition-transform duration-300 hover:translate-x-1">
-                  <svg className="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                    <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 5l7 7-7 7" />
-                  </svg>
-                </div>
-              </div>
-            </div>
-          ))}
-        </div>
-      </div>
 
       <BottomNavigation />
       </div>
-    </div>
+   
   )
 }
 

src/shared/consts/router.ts

@@ -4,8 +4,13 @@ export const getRouteHome = () => `/home`;
 export const getRouteForgotPassword = () => `/forgot-password`;
 
 export const getRouteCourses = () => `/courses`;
-export const getRouteCourseExercises = (id: number | string) => `/course/${id}/exercises`;
+
-export const getRouteExercise = (id: number | string) => `/exercise/${id}`;
+
+
+export const getRouteCourseExercises = (id: number | string) => `/pacient/${id}`;
+
+
+export const getRouteExercise = (courseId: number | string, execiseId: number | string) => `/pacient/${courseId}/${execiseId}`;
 
 export const getRouteSettings = () => `/settings`;
 export const getRouteCourseComplete = () => `/course-complete`;