From e97d5842ebddd7799a96d0262bea971036aaa92e Mon Sep 17 00:00:00 2001 From: hyeok9912 Date: Sat, 26 Jul 2025 18:11:36 +0900 Subject: [PATCH 1/2] fix:pipeline --- .../components/playlist/CategoryPlaylist.tsx | 2 +- front-end/src/components/playlist/Modal.tsx | 2 +- .../components/playlist/TeacherPlaylist.tsx | 30 +++++++++++++++---- front-end/src/styles/pages/login/login.scss | 9 ++++-- 4 files changed, 32 insertions(+), 11 deletions(-) diff --git a/front-end/src/components/playlist/CategoryPlaylist.tsx b/front-end/src/components/playlist/CategoryPlaylist.tsx index 552e461..3431667 100644 --- a/front-end/src/components/playlist/CategoryPlaylist.tsx +++ b/front-end/src/components/playlist/CategoryPlaylist.tsx @@ -145,4 +145,4 @@ const CategoryPlaylist: React.FC = ({ category: initialCa ); }; -export default CategoryPlaylist; \ No newline at end of file +export default CategoryPlaylist; diff --git a/front-end/src/components/playlist/Modal.tsx b/front-end/src/components/playlist/Modal.tsx index 50b2de7..5496ab5 100644 --- a/front-end/src/components/playlist/Modal.tsx +++ b/front-end/src/components/playlist/Modal.tsx @@ -87,7 +87,7 @@ const Modal: React.FC = ({ } finally { setLoadingPlaylists(false); } - }, [token, setPlaylists, getVideo, detailPlaylist]); + }, [token, setPlaylists]); const handleSaveVideo = async () => { if (!selectVideo) { diff --git a/front-end/src/components/playlist/TeacherPlaylist.tsx b/front-end/src/components/playlist/TeacherPlaylist.tsx index 54b23a3..6e4c173 100644 --- a/front-end/src/components/playlist/TeacherPlaylist.tsx +++ b/front-end/src/components/playlist/TeacherPlaylist.tsx @@ -1,15 +1,12 @@ -+91 --237 -Lines changed: 91 additions & 237 deletions -Original file line number Original file line Diff line number Diff line change -@@ -1,314 +1,168 @@ 'use client'; import React, { useCallback, useEffect, useState } from 'react'; import { useRouter, useSearchParams } from 'next/navigation'; + import { useQuery } from '@tanstack/react-query'; import { getAllVideos, getLatestVideos } from '@/app/api/teacherAPI'; import { Video } from '@/types/video'; + import { deletePlaylist, getVideo, detailPlaylist } from '@/app/api/playlistApi'; import Cookies from 'js-cookie'; import instructorData from '@/data/instructorData'; @@ -19,6 +16,7 @@ import { devConsoleError } from '@/utils/logger'; import TeacherTabs from './TeacherTap'; import TeacherVideoList from './TeacherVideolist'; import Modal from './Modal'; + const TeacherPlaylistPage = () => { const router = useRouter(); const searchParams = useSearchParams(); @@ -30,6 +28,7 @@ const TeacherPlaylistPage = () => { const [showModal, setShowModal] = useState(false); const [selectVideo, setSelectVideo] = useState(null); const [playlists, setPlaylists] = useState(undefined); + const token = Cookies.get('token'); const handleTeacherSelect = (inst: (typeof instructorData)[number]) => { @@ -82,6 +81,7 @@ const TeacherPlaylistPage = () => { const detail = await detailPlaylist(playlist.playlistId, token); return { ...playlist, + videos: detail && detail.videos && Array.isArray(detail.videos) ? detail.videos : [], }; } catch (detailError) { @@ -112,9 +112,11 @@ const TeacherPlaylistPage = () => { } if (!token) return; + try { await deletePlaylist(playlistId, token); alert('재생목록이 삭제되었습니다.'); + setPlaylists((prevPlaylists: PlayLists | undefined) => prevPlaylists ? { @@ -140,6 +142,7 @@ const TeacherPlaylistPage = () => { selected={selected} onSelectTeacher={handleTeacherSelect} /> + { selectedTeacherName={selected.name} token={token} onOpenModal={openModal} - /> \ No newline at end of file + /> + + {showModal && ( + + )} + + ); +}; + +export default TeacherPlaylistPage; diff --git a/front-end/src/styles/pages/login/login.scss b/front-end/src/styles/pages/login/login.scss index fec28bf..9edf34a 100644 --- a/front-end/src/styles/pages/login/login.scss +++ b/front-end/src/styles/pages/login/login.scss @@ -76,7 +76,6 @@ display: flex; justify-content: center; align-items: center; - height: 20vh; width: 100%; button { border-radius: 0.5rem; @@ -104,7 +103,7 @@ .googleLogin { display: flex; width: 18%; - height: 6vh; + height: auto; justify-content: center; align-items: center; margin: 0 auto; @@ -113,6 +112,8 @@ font-size: 1.5rem; font-weight: bold; border-radius: 2rem; + padding-top: 1rem; + padding-bottom: 1rem; .googleIcon { width: 2rem; margin-right: 2rem; @@ -121,7 +122,9 @@ .naverLogin { display: flex; width: 18%; - height: 6vh; + height: auto; + padding-top: 1rem; + padding-bottom: 1rem; justify-content: center; align-items: center; margin: 1rem auto; From ab39984062084976384e7b21095bdeefb5cf0498 Mon Sep 17 00:00:00 2001 From: hyeok9912 Date: Sat, 26 Jul 2025 19:41:58 +0900 Subject: [PATCH 2/2] css: edit modal --- front-end/src/app/categories/[id]/page.tsx | 11 ------ .../authservice/registerservice.tsx | 5 +-- front-end/src/components/playlist/Modal.tsx | 2 +- front-end/src/styles/pages/login/login.scss | 6 ++++ .../src/styles/pages/playlist/playlist.scss | 35 +++++++++++++------ 5 files changed, 32 insertions(+), 27 deletions(-) delete mode 100644 front-end/src/app/categories/[id]/page.tsx diff --git a/front-end/src/app/categories/[id]/page.tsx b/front-end/src/app/categories/[id]/page.tsx deleted file mode 100644 index bf95c7d..0000000 --- a/front-end/src/app/categories/[id]/page.tsx +++ /dev/null @@ -1,11 +0,0 @@ -import React from 'react'; - -const Categories = () => { - return ( -
-

카테고리 페이지

-
- ); -}; - -export default Categories; diff --git a/front-end/src/components/authservice/registerservice.tsx b/front-end/src/components/authservice/registerservice.tsx index 992a714..52c87fc 100644 --- a/front-end/src/components/authservice/registerservice.tsx +++ b/front-end/src/components/authservice/registerservice.tsx @@ -6,8 +6,5 @@ export const registerUser = async (userData: { password: string; confirmPassword: string; }) => { - const response = await fetchRegisterUser(userData); - if (response.status === 200 || response.status === 201) { - alert('회원가입 완료'); - } + await fetchRegisterUser(userData); }; diff --git a/front-end/src/components/playlist/Modal.tsx b/front-end/src/components/playlist/Modal.tsx index 5496ab5..0ece340 100644 --- a/front-end/src/components/playlist/Modal.tsx +++ b/front-end/src/components/playlist/Modal.tsx @@ -211,7 +211,7 @@ const Modal: React.FC = ({ }} className={isVideoInPlaylist ? 'remove-video-button' : 'add-video-button'} > - {isVideoInPlaylist ? 'X' : '+'} + {isVideoInPlaylist ? '-' : '+'}

{playlist.playlistName}

diff --git a/front-end/src/styles/pages/login/login.scss b/front-end/src/styles/pages/login/login.scss index 9edf34a..34c3fad 100644 --- a/front-end/src/styles/pages/login/login.scss +++ b/front-end/src/styles/pages/login/login.scss @@ -134,4 +134,10 @@ font-weight: bold; border-radius: 2rem; } + .error-message { + color: red; + display: flex; + justify-content: center; + margin-bottom: 1rem; + } } diff --git a/front-end/src/styles/pages/playlist/playlist.scss b/front-end/src/styles/pages/playlist/playlist.scss index 412074e..f249b67 100644 --- a/front-end/src/styles/pages/playlist/playlist.scss +++ b/front-end/src/styles/pages/playlist/playlist.scss @@ -58,30 +58,43 @@ margin-bottom: 1rem; justify-content: space-between; .remove-video-button { - color: white; - font-size: 1.2rem; + font-size: 1.5rem; display: flex; align-items: center; margin-left: 0.8rem; + width: 2.2rem; + height: 2.2rem; background-color: red; - width: 1.5rem; justify-content: center; - height: 1.5rem; border-radius: 5px; - padding: 10px; + span { + display: flex; + align-items: center; + justify-content: center; + color: white; + position: relative; + top: -6%; + } } .add-video-button { color: white; + height: 2.2rem; font-size: 1.5rem; display: flex; align-items: center; margin-left: 0.8rem; - width: 1.5rem; + width: 2.2rem; background-color: var(--btn-color); justify-content: center; border-radius: 5px; - height: 1.5rem; - padding: 10px; + span { + display: flex; + align-items: center; + justify-content: center; + color: white; + position: relative; + top: -5%; + } } input { width: 2rem; @@ -221,9 +234,9 @@ } } - .inner { - // padding: 10rem 0; - } + // .inner { + // // padding: 10rem 0; + // } .dev_list_cont { width: 100%; @include pc_1280 {