diff --git a/src/components/home/InformationContainer.jsx b/src/components/home/InformationContainer.jsx index 2e8a5ea..8e9e04c 100644 --- a/src/components/home/InformationContainer.jsx +++ b/src/components/home/InformationContainer.jsx @@ -1,48 +1,59 @@ +import { ANNOUNCE_URL, SERVICE_CENTER_URL } from "constants/url"; import { useEffect, useState } from "react"; +import { Link } from "react-router-dom"; +import { getAnnounceListAPI } from "services/home/announce"; +import { getQnAListAPI } from "services/home/serviceCenter"; import "styles/components/home/InformationContainer.scss"; +import { formatDate } from "utils/time"; export const InformationContainer = () => { const [data, setData] = useState([]); const [navType, setNavType] = useState("notice"); // 상태로 관리 + + const fetchNotices = async (page = 1, sort = "DATE_DESC", type = "") => { + try { + const res = await getAnnounceListAPI({ + keyword: "", + page: page - 1, // 서버는 0부터 시작 + sort, + type: type, + }); + + if (res?.content && res.content.length > 0) { + setData(res.content.slice(0, 5)); + } else { + setData([]); + } + } catch (err) { + console.error("공지사항 조회 에러"); + } + }; + + const fetchQnAList = async (keyword = "", page = 1, sort = "DATE_DESC") => { + try { + let res; + + res = await getQnAListAPI({ + keyword, + page: page - 1, + sort, + }); + + if (res?.content && res.content.length > 0) { + setData(res.content.slice(0, 5)); + } else { + setData([]); + } + } catch (err) { + console.error("문의목록 조회 에러"); + } + }; + useEffect(() => { if (navType === "notice") { - // 공지사항 더미 데이터 - setData([ - { title: "상대방에게 욕설, 비난이 담긴 채팅 신고", date: "2025.06.21" }, - { title: "2025. 07. 21 업데이트 안내", date: "2025.06.21" }, - { title: "AI 업그레이드 안내", date: "2025.06.21" }, - { title: "2026. 08. 21 점검 안내", date: "2025.06.21" }, - { title: "상대방에게 욕설, 비난이 담긴 채팅 신고", date: "2025.06.21" }, - ]); + fetchNotices(); } else if (navType === "help") { - // 고객센터 더미 데이터 - setData([ - { - title: "게임이 실행되지 않아요0", - date: "2025.06.21", - answered: true, - }, - { - title: "게임이 실행되지 않아요1", - date: "2025.06.21", - answered: false, - }, - { - title: "게임이 실행되지 않아요2", - date: "2025.06.21", - answered: true, - }, - { - title: "게임이 실행되지 않아요3", - date: "2025.06.21", - answered: false, - }, - { - title: "게임이 실행되지 않아요4", - date: "2025.06.21", - answered: true, - }, - ]); + fetchQnAList(); } }, [navType]); return ( @@ -75,12 +86,26 @@ export const InformationContainer = () => { ) : ( 답변대기 ))} - {item.title} - {item.date} + {navType === "help" ? ( + + {item.title} + + ) : ( + + {item.title} + + )} + {formatDate(item.createdAt)} )) ) : ( -

공지사항이 존재하지 않습니다.

+

게시글이 존재하지 않습니다.

)} diff --git a/src/components/home/RankingPreview.jsx b/src/components/home/RankingPreview.jsx index 6be3eb5..af2cf02 100644 --- a/src/components/home/RankingPreview.jsx +++ b/src/components/home/RankingPreview.jsx @@ -1,5 +1,5 @@ import { useEffect, useState } from "react"; -import { getRankingListAPI } from "services/home/ranking"; +import { getMyRankingAPI, getRankingListAPI } from "services/home/ranking"; import "styles/components/home/RankingPreview.scss"; import { getAuthToken } from "utils/token"; export const RankingPreview = () => { @@ -18,8 +18,9 @@ export const RankingPreview = () => { const { accessToken } = getAuthToken(); if (accessToken) { - const myRes = 0; + const myRes = await getMyRankingAPI(); const me = myRes?.data || myRes; + console.log(myRes); if (me) { setMyScore(me.exp); diff --git a/src/components/lobby/LobbyNavBar.jsx b/src/components/lobby/LobbyNavBar.jsx index acbb4c1..c01e249 100644 --- a/src/components/lobby/LobbyNavBar.jsx +++ b/src/components/lobby/LobbyNavBar.jsx @@ -2,7 +2,7 @@ import { GAME1_ROBBY_URL, GAME2_ROBBY_URL, MY_PAGE_URL, - MY_RECORD_URL, + // MY_RECORD_URL, SETTING_URL, } from "constants/url"; import { useEffect, useState } from "react"; @@ -21,10 +21,10 @@ const gameNav = [ ]; const myInfoNav = [ - { - title: "전적", - url: MY_RECORD_URL, - }, + // { + // title: "전적", + // url: MY_RECORD_URL, + // }, { title: "내 정보", url: MY_PAGE_URL, diff --git a/src/pages/home/AnnouncePage.jsx b/src/pages/home/AnnouncePage.jsx index 82252a5..580d78c 100644 --- a/src/pages/home/AnnouncePage.jsx +++ b/src/pages/home/AnnouncePage.jsx @@ -27,9 +27,10 @@ const AnnouncePage = () => { // URL 파라미터에서 page, sort 가져오기 const currentPage = Number(searchParams.get("page")) || 1; const sortOrder = searchParams.get("sort") || "DATE_DESC"; + const tabType = searchParams.get("type") || ""; /** 공지사항 API 호출 */ - const fetchNotices = async (page = 1, sort = "DATE_DESC") => { + const fetchNotices = async (page = 1, sort = "DATE_DESC", type = "") => { try { setLoading(true); setError(null); @@ -38,6 +39,7 @@ const AnnouncePage = () => { keyword: "", page: page - 1, // 서버는 0부터 시작 sort, + type: type, }); if (res?.content && res.content.length > 0) { @@ -56,31 +58,41 @@ const AnnouncePage = () => { }; /** 페이지/정렬 변경 시 URL 갱신 */ - const updateSearchParams = (page = currentPage, sort = sortOrder) => { - setSearchParams({ page: String(page), sort }); + const updateSearchParams = ( + page = currentPage, + sort = sortOrder, + type = tabType + ) => { + setSearchParams({ page: String(page), sort, type }); }; /** 페이지 이동 핸들러 */ const handlePageChange = (newPage) => { - updateSearchParams(newPage, sortOrder); + updateSearchParams(newPage, sortOrder, tabType); }; /** 정렬 변경 핸들러 */ const handleSortChange = (order) => { const newOrder = order === "DATE_DESC" ? "DATE_DESC" : "DATE_ASC"; - updateSearchParams(1, newOrder); // 정렬 바꾸면 1페이지로 이동 + updateSearchParams(1, newOrder, tabType); // 정렬 바꾸면 1페이지로 이동 }; /** 탭 클릭 시 1페이지로 리셋 */ const handleTabClick = (tabName) => { setActiveTab(tabName); - updateSearchParams(1, sortOrder); + let newType = ""; + if (tabName === "이벤트") { + newType = "EVENT"; + } else if (tabName === "업데이트") { + newType = "UPDATE"; + } + updateSearchParams(1, sortOrder, newType); }; /** URL 변경 시마다 데이터 다시 불러오기 */ useEffect(() => { - fetchNotices(currentPage, sortOrder); - }, [currentPage, sortOrder]); + fetchNotices(currentPage, sortOrder, tabType); + }, [currentPage, sortOrder, tabType]); return (
diff --git a/src/styles/components/home/InformationContainer.scss b/src/styles/components/home/InformationContainer.scss index b9032b3..a2aa1a9 100644 --- a/src/styles/components/home/InformationContainer.scss +++ b/src/styles/components/home/InformationContainer.scss @@ -63,7 +63,7 @@ display: flex; flex-direction: column; align-items: center; - justify-content: center; + justify-content: start; .info-item { display: flex; @@ -81,6 +81,9 @@ .title { flex: 1; text-align: left; + + text-decoration: none; + color: inherit; } .date { @@ -107,4 +110,4 @@ } } } -} +} \ No newline at end of file