diff --git a/src/pages/CourseExercises.tsx b/src/pages/CourseExercises.tsx index 00cd46f..e02d630 100644 --- a/src/pages/CourseExercises.tsx +++ b/src/pages/CourseExercises.tsx @@ -15,6 +15,7 @@ import type { Course } from "../pages/Courses"; // import { Exercise } from "./Exercise"; export interface CourseExercises { + id: number; id_course: number; id_exercise: number; exercise: Exercise; @@ -37,11 +38,13 @@ export const CourseExercises = () => { const location = useLocation<{ course?: Course }>(); const course = location.state?.course; - + const [course_exercises, setExercises] = useState([]); const [selectedDay, setSelectedDay] = useState(null); + + const token = localStorage.getItem('authToken'); useEffect(() => { @@ -60,13 +63,10 @@ export const CourseExercises = () => { }) .then(response => { - console.log('Response status:', response.status); - console.log('Данные страницы упражнения курса:', response.data); - // setPacientData(response.data); + console.log('Данные упражнения курса:', response.data.course_exercises); + setExercises(response.data.course_exercises); - - }) .catch(error => { if (error.response) { @@ -88,27 +88,6 @@ export const CourseExercises = () => { } }, [course_exercises]); - //Этот код — это React-хук useEffect, который выполняет определённый блок кода при изменении зависимостей. Давайте разберём его подробно: - //Он следит за изменением массива course_exercises. Когда course_exercises обновляется (например, загружается с сервера или изменяется), он проверяет: - - // Есть ли в массиве упражнения (course_exercises.length > 0) - // И выбран ли уже день (selectedDay === null) - // Если оба условия выполняются, то: - - // Устанавливает selectedDay в значение day первого элемента массива course_exercises[0]. - // Почему это нужно? - // Это логика инициализации: - - // Когда данные о упражнениях загружены впервые, и пользователь ещё не выбрал день (selectedDay равен null), - // автоматически выбирается первый день из загруженных упражнений. - // Почему [course_exercises] в конце? - // Это массив зависимостей. Он говорит React: - - // Запускать этот эффект только тогда, когда course_exercises изменится. - - // Без этого эффекта он бы запускался при каждом рендере, что нежелательно. - - const uniqueDays = Array.from(new Set(course_exercises.map(ex => ex.day))).sort((a, b) => a - b); const dayMap: { [key: number]: number } = {}; @@ -125,13 +104,12 @@ export const CourseExercises = () => { ? course_exercises.filter(ex => ex.day === selectedDay) : course_exercises; - +console.log('отфильтрованный список по дням',filteredExercises) return (
- {/* Это выражение использует оператор опциональной цепочки (?.) и оператор нулевого слияния (??). -Если course не null и не undefined, то взять его свойство title, иначе — вернуть undefined*/} +
{/* Заголовок секции */}
@@ -147,10 +125,13 @@ export const CourseExercises = () => {
{days.map((day, index) => ( + +