From 43f6c4a3f8448adeb24f59367f0e810350ec63b9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EC=A7=80=EC=9C=A4?= <asdfasdf001234@ajou.ac.kr> Date: Sun, 8 Dec 2024 21:45:44 +0900 Subject: [PATCH] =?UTF-8?q?Fix:=20=EB=8D=B0=EC=9D=B4=ED=84=B0=20=EC=97=86?= =?UTF-8?q?=EC=9D=84=20=EC=8B=9C=20=EC=97=90=EB=9F=AC=EC=B2=98=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- front/src/api/routineAPI.js | 16 ++++++++-------- front/src/components/routine/List.jsx | 10 +++++----- front/src/components/workout/VideoDetails.jsx | 16 +++++++++++----- 3 files changed, 24 insertions(+), 18 deletions(-) diff --git a/front/src/api/routineAPI.js b/front/src/api/routineAPI.js index 7f77d75..3aa8894 100644 --- a/front/src/api/routineAPI.js +++ b/front/src/api/routineAPI.js @@ -21,15 +21,15 @@ async function fetchWithOptions(url, options) { } } -// 개별 함수들을 export -export const addExerciseRecord = async (record) => { +// 개별 함수들을 + const addExerciseRecord = async (record) => { return await fetchWithOptions('/api/routine/records', { method: 'POST', body: JSON.stringify(record), }); }; -export const getUserRoutines = async () => { + const getUserRoutines = async () => { try { const response = await fetchWithOptions('/api/routine', { method: 'GET', @@ -49,7 +49,7 @@ export const getUserRoutines = async () => { } }; -export const getRoutineVideos = async (routineName) => { + const getRoutineVideos = async (routineName) => { try { const response = await fetchWithOptions(`/api/routine/videos?routine_name=${encodeURIComponent(routineName)}`, { method: 'GET', @@ -67,21 +67,21 @@ export const getRoutineVideos = async (routineName) => { } }; -export const createRoutine = async (routineName) => { + const createRoutine = async (routineName) => { return await fetchWithOptions('/api/routine', { method: 'POST', body: JSON.stringify({ routine_name: routineName }), }); }; -export const deleteRoutine = async (routineName) => { + const deleteRoutine = async (routineName) => { return await fetchWithOptions('/api/routine', { method: 'DELETE', body: JSON.stringify({ routine_name: routineName }), }); } -async function addRoutineVideo(data){ + async function addRoutineVideo(data){ try{ const uri = `/api/routine/add` const response = await fetch(uri, { @@ -102,4 +102,4 @@ async function addRoutineVideo(data){ } -export { addRoutineVideo, addExerciseRecord, getUserRoutines, getRoutineVideos, deleteRoutine }; +export { addRoutineVideo, addExerciseRecord, getUserRoutines, getRoutineVideos, createRoutine, deleteRoutine }; diff --git a/front/src/components/routine/List.jsx b/front/src/components/routine/List.jsx index 774bf71..f5456e3 100644 --- a/front/src/components/routine/List.jsx +++ b/front/src/components/routine/List.jsx @@ -1,7 +1,7 @@ import React, { useState, useEffect } from "react"; import "./List.css"; import truncateText from './truncateText'; -import routineAPI from '../../api/routineAPI'; +import {getUserRoutines, getRoutineVideos, deleteRoutine, createRoutine} from '../../api/routineAPI'; function List({ onRoutineSelect, isActive }) { const [routines, setRoutines] = useState([]); @@ -43,12 +43,12 @@ function List({ onRoutineSelect, isActive }) { // 루틴 데이터와 비디오 데이터 함께 가져오기 const fetchRoutines = async () => { try { - const routineData = await routineAPI.getUserRoutines(); + const routineData = await getUserRoutines(); if (routineData) { // 각 루틴에 대해 비디오 정보 가져오기 const routinesWithVideos = await Promise.all( routineData.map(async (routine) => { - const videos = await routineAPI.getRoutineVideos(routine.routine_name); + const videos = await getRoutineVideos(routine.routine_name); return { ...routine, exercises: videos.map(video => ({ @@ -88,7 +88,7 @@ function List({ onRoutineSelect, isActive }) { const handledelete = async (name) => { try { - await routineAPI.deleteRoutine(name); + await deleteRoutine(name); setIsModalOpen(false); await fetchRoutines(); // 삭제 후 목록 새로고침 } catch (err) { @@ -101,7 +101,7 @@ function List({ onRoutineSelect, isActive }) { const routineName = prompt("새로운 루틴의 이름을 입력하세요:"); if (!routineName) return; - await routineAPI.createRoutine(routineName); + await createRoutine(routineName); await fetchRoutines(); } catch (err) { console.error("루틴 추가 실패:", err); diff --git a/front/src/components/workout/VideoDetails.jsx b/front/src/components/workout/VideoDetails.jsx index 367789d..c3e0bff 100644 --- a/front/src/components/workout/VideoDetails.jsx +++ b/front/src/components/workout/VideoDetails.jsx @@ -30,14 +30,20 @@ function VideoDetails({video, routines}) { <span>{secToTime(video.video_length)}</span> <span><FontAwesomeIcon icon={faHeart} /> {video.video_likes}<br/></span> </span> - <select name="routines" id="routines"> - {routines.map((item) => ( + {routines ? ( <> - <option value={item}>{item}</option> - </> - ))} + <select> + {routines.map((item, index) => ( + <option key={index} value={item}> + {item} + </option> + ))} </select> <button className="addbutton" onClick={addRoutine}>추가</button> + </> + ) : ( + <label>추가할 루틴이 없습니다.</label> + )} </div> </div> ); -- GitLab