diff --git a/src/app/mypage/notice/[id]/page.tsx b/src/app/mypage/notice/[id]/page.tsx new file mode 100644 index 0000000..b4d6209 --- /dev/null +++ b/src/app/mypage/notice/[id]/page.tsx @@ -0,0 +1,63 @@ +import Image from 'next/image'; +const NoticeDetailPage = () => { + return ( +
+ Left Arrow +
+
23기 배당금 지급 안내
+ +
2024.06.06
+ +
+
+ 공지자료 내용 안내 노출란입니다. 공지자료 내용 안내 노출란입니다. 공지자료 내용 + 안내 노출란입니다. 공지자료 내용 안내 노출란입니다. 공지자료 내용 안내 + 노출란입니다. 공지자료 내용 안내 노출란입니다. 공지자료 내용 안내 노출란입니다. + 공지자료 내용 안내 노출란입니다. +
+ +
+
+ File Text +
1호 23기 배당 안내문 1.pdf
+
+ Download Simple +
+
+
+ File Text +
2호 23기 배당 안내문 1.pdf
+
+ Download Simple +
+
+
+ ); +}; +export default NoticeDetailPage; diff --git a/src/app/mypage/notice/page.tsx b/src/app/mypage/notice/page.tsx new file mode 100644 index 0000000..2395a97 --- /dev/null +++ b/src/app/mypage/notice/page.tsx @@ -0,0 +1,76 @@ +'use client'; +import Container from '@/components/common/Container'; +import NoticeItemSkeleton from '@/components/skeleton/NoticeItemSkeleton'; +import UseNoticeLists from '@/factory/useNoticeLists'; +import { INoticeItem } from '@/types/BuildingProductType'; +import { useCallback } from 'react'; +import { Virtuoso } from 'react-virtuoso'; +import Image from 'next/image'; +import { useRouter } from 'next/navigation'; +const NoticePage = () => { + const router = useRouter(); + const category = 'sou.8'; + + const { data, fetchNextPage, hasNextPage, isFetching, isFetchingNextPage, isLoading } = + UseNoticeLists(category); + + const loadMore = useCallback(() => { + if (hasNextPage && !isFetching && !isFetchingNextPage && !isLoading) { + setTimeout(() => { + fetchNextPage(); + }, 200); + } + }, [fetchNextPage, hasNextPage, isFetching, isFetchingNextPage, isLoading]); + + // const allPosts = data?.pages?.flat() || []; + const allPosts = data?.pages.flatMap((page) => page.notice) || []; + // const allPosts = data?.pages[0].notice; + + return ( + + Left Arrow router.back()} + /> +
+
+ 공지사항 +
+ +
+ {isLoading ? ( + Array.from({ length: 5 }).map((_, i) => ) + ) : ( + ( + + )} + /> + )} +
+
+ + ); +}; + +export default NoticePage; + +const NoticeItem = ({ content, id, noticeDay, title }: INoticeItem) => { + return ( +
+
{title}
+
{noticeDay}
+
+ ); +}; diff --git a/src/app/product/detail/music/[id]/page.tsx b/src/app/product/detail/music/[id]/page.tsx index df1f379..4a9eb05 100644 --- a/src/app/product/detail/music/[id]/page.tsx +++ b/src/app/product/detail/music/[id]/page.tsx @@ -63,19 +63,24 @@ const MusicDetailpage = (props: any) => { className="object-cover w-[181px] h-[181px] rounded-[8px] " /> -
+
{CATEGORY[data?.category as string]}
-
{data?.platform}
+
{data?.platform}
- -
- {data?.name} +
+
{data?.name}
+ {data?.singer}
- -
+
+ 과거 1년 저작권료(1주){' '} + + {data?.yearDvide.toLocaleString()} ({data?.yearDvideRate}%) + +
+
해당 플랫폼으로 이동
@@ -110,7 +115,7 @@ const MusicDetailpage = (props: any) => {
-
+
{CATEGORY[data?.category || '']}
{data?.platform}
@@ -119,6 +124,13 @@ const MusicDetailpage = (props: any) => {
{data?.name}
+
{data?.singer}
+
+ 과거 1년 저작권료(1주) + + {data?.yearDvide.toLocaleString()} ({data?.yearDvideRate}%) + +
diff --git a/src/components/common/Navbar.tsx b/src/components/common/Navbar.tsx index 95f2478..acb96ad 100644 --- a/src/components/common/Navbar.tsx +++ b/src/components/common/Navbar.tsx @@ -23,7 +23,7 @@ const Navbar = () => { onClick={() => { router.push('/newissue'); }} - className={`px-4 py-3 flex-1 flex justify-center items-center cursor-pointer text-body5 desk2:text-heading4 + className={` desk:whitespace-nowrap px-4 py-3 flex-1 flex justify-center items-center cursor-pointer text-body5 desk2:text-heading4 ${pathname === '/newissue' ? 'text-black border-b-[2px] border-black' : 'text-gray300'} `}> 최신이슈 @@ -32,7 +32,7 @@ const Navbar = () => { onClick={() => { router.push('/product'); }} - className={`px-4 py-3 flex-1 flex justify-center items-center cursor-pointer text-body5 desk2:text-heading4 + className={` desk:whitespace-nowrap px-4 py-3 flex-1 flex justify-center items-center cursor-pointer text-body5 desk2:text-heading4 ${pathname === '/product' ? 'text-black border-b-[2px] border-black' : 'text-gray300'} `}> 조각투자 상품 @@ -41,7 +41,7 @@ const Navbar = () => { onClick={() => { router.push('/practicepage'); }} - className={`px-4 py-3 flex-1 flex justify-center items-center cursor-pointer text-body5 desk2:text-heading4 + className={` desk:whitespace-nowrap px-4 py-3 flex-1 flex justify-center items-center cursor-pointer text-body5 desk2:text-heading4 ${pathname === '/practicepage' ? 'text-black border-b-[2px] border-black' : 'text-gray300'} `}> 학습하기 diff --git a/src/components/product/Bookmark.tsx b/src/components/product/Bookmark.tsx index a57372c..ea80e55 100644 --- a/src/components/product/Bookmark.tsx +++ b/src/components/product/Bookmark.tsx @@ -13,6 +13,7 @@ import ProductBookmarkContentList from './contentlist/ProductBookmarkContentList import Image from 'next/image'; import { useQuery } from '@tanstack/react-query'; import { axiosInstance } from '@/service/axiosInstance'; +import Link from 'next/link'; interface IProductBuildingProps { content: | IProductDealDetailData['product'] @@ -53,71 +54,73 @@ const Bookmark = ({ content, totalPages, pageNumber }: IProductBuildingProps) => if (isLoading) return
; if (error) return
; return ( -
+
- + + + -
- 관심종목{' '} - {bookmarks} -
-
-
{ - setCategory('all'); - }} - className={`pb-3 whitespace-nowrap sm:pb-5 cursor-pointer ${category === 'all' || category == null ? ' text-gray700 border-b-2 border-normal ' : 'text-gray300'}`}> - 전체 -
-
{ - setCategory('building'); - }} - className={`pb-3 whitespace-nowrap sm:pb-5 cursor-pointer ${category === 'building' ? ' text-gray700 border-b-2 border-normal ' : 'text-gray300'}`}> - 부동산 -
-
{ - setCategory('music'); - }} - className={`pb-3 whitespace-nowrap sm:pb-5 cursor-pointer ${category === 'music' ? ' text-gray700 border-b-2 border-normal ' : 'text-gray300'}`}> - 음악저작권 +
+ 관심종목{' '} + {bookmarks}
-
{ - setCategory('cow'); - }} - className={`pb-3 whitespace-nowrap sm:pb-5 cursor-pointer ${category === 'cow' ? ' text-gray700 border-b-2 border-normal ' : 'text-gray300'}`}> - 한우 +
+
{ + setCategory('all'); + }} + className={`pb-3 whitespace-nowrap sm:pb-5 cursor-pointer ${category === 'all' || category == null ? ' text-gray700 border-b-2 border-normal ' : 'text-gray300'}`}> + 전체 +
+
{ + setCategory('building'); + }} + className={`pb-3 whitespace-nowrap sm:pb-5 cursor-pointer ${category === 'building' ? ' text-gray700 border-b-2 border-normal ' : 'text-gray300'}`}> + 부동산 +
+
{ + setCategory('music'); + }} + className={`pb-3 whitespace-nowrap sm:pb-5 cursor-pointer ${category === 'music' ? ' text-gray700 border-b-2 border-normal ' : 'text-gray300'}`}> + 음악저작권 +
+
{ + setCategory('cow'); + }} + className={`pb-3 whitespace-nowrap sm:pb-5 cursor-pointer ${category === 'cow' ? ' text-gray700 border-b-2 border-normal ' : 'text-gray300'}`}> + 한우 +
+
{ + setCategory('art'); + }} + className={`pb-3 whitespace-nowrap sm:pb-5 cursor-pointer ${category === 'art' ? ' text-gray700 border-b-2 border-normal ' : 'text-gray300'}`}> + 미술품 +
+
{ + setCategory('content'); + }} + className={`pb-3 whitespace-nowrap sm:pb-5 cursor-pointer ${category === 'content' ? ' text-gray700 border-b-2 border-normal ' : 'text-gray300'}`}> + 콘텐츠 +
-
{ - setCategory('art'); - }} - className={`pb-3 whitespace-nowrap sm:pb-5 cursor-pointer ${category === 'art' ? ' text-gray700 border-b-2 border-normal ' : 'text-gray300'}`}> - 미술품 -
-
{ - setCategory('content'); - }} - className={`pb-3 whitespace-nowrap sm:pb-5 cursor-pointer ${category === 'content' ? ' text-gray700 border-b-2 border-normal ' : 'text-gray300'}`}> - 콘텐츠 -
-
- +
diff --git a/src/components/product/Filter.tsx b/src/components/product/Filter.tsx index a2ea054..055f51d 100644 --- a/src/components/product/Filter.tsx +++ b/src/components/product/Filter.tsx @@ -7,9 +7,24 @@ const Filter = () => { const sort = searchParams.get('category'); const handleClick = (key: string) => { + const scrollPosition = window.innerHeight * 0.7; + + // 현재 미술품 콘텐츠가 없어서 특정하게 설정한 로직 + params.set('subcategory', 'trade'); + params.set('sort', 'lastDivide_rate desc'); + if (key === 'art' || key === 'content') { + params.set('subcategory', 'end'); + params.set('sort', 'end'); + } + ////////////////// + params.set('category', key); params.set('page', '1'); router.replace(`?${params.toString()}`, { scroll: false }); + window.scrollTo({ + top: scrollPosition, + behavior: 'smooth' + }); }; interface FilterElementType { [key: string]: { name: string; img: string }; diff --git a/src/components/product/Product.tsx b/src/components/product/Product.tsx index 07c026e..6b914f8 100644 --- a/src/components/product/Product.tsx +++ b/src/components/product/Product.tsx @@ -50,7 +50,6 @@ const Product = ({ return (
- {/* */}
diff --git a/src/components/product/TopProduct.tsx b/src/components/product/TopProduct.tsx index 62099f1..1fdab0b 100644 --- a/src/components/product/TopProduct.tsx +++ b/src/components/product/TopProduct.tsx @@ -9,7 +9,7 @@ import Image from 'next/image'; import { memo, useState } from 'react'; import { ISummary } from '@/types/Diviend'; import Link from 'next/link'; - +import { CATEGORY } from '@/static/category'; interface TopProductProps { summary: ISummary[]; } @@ -112,7 +112,7 @@ const TopProduct = memo(({ summary }: TopProductProps) => {
- 부동산 + {CATEGORY[item.category]}
{item.platform} diff --git a/src/components/product/detail/News.tsx b/src/components/product/detail/News.tsx index 4288a44..2a41d30 100644 --- a/src/components/product/detail/News.tsx +++ b/src/components/product/detail/News.tsx @@ -8,6 +8,8 @@ import { INewsItem } from '@/types/BuildingProductType'; import Link from 'next/link'; import { usePathname } from 'next/navigation'; import { CATEGORY } from '@/static/category'; +import { axiosInstance } from '@/service/axiosInstance'; +import { useMutation } from '@tanstack/react-query'; const News = () => { const pathname = usePathname(); @@ -46,13 +48,32 @@ const News = () => { export default News; const NewsItem = ({ title, date, id, category, link, imgUrl }: INewsItem) => { + const fetchData = async ({ id }: { id: number }) => { + console.log(id); + const response = await axiosInstance.post(`https://api.moaguide.com/news/view/${id}`); + return response.data; + }; + + const CountupView = () => { + const view = useMutation({ + mutationFn: fetchData, + onError: () => {} + }); + return view; + }; + + const view = CountupView(); + const Category = CATEGORY; - console.log(imgUrl); + return ( + className=" flex justify-between border-b-[1px] border-gray-200 py-[20px] px-[20px] rounded-lg" + onClick={() => { + view.mutate({ id }); + }}>
{ + const router = useRouter(); const pathname = usePathname(); const lastSegment = pathname.split('/').pop(); @@ -27,7 +28,10 @@ const MusicSchedule = () => { data?.map((item, index) => (
+ className="flex border-gray-200 border-2 p-2 rounded-2xl" + onClick={() => { + router.push(`${item.link}`); + }}>
{item.title}
{item.place}
diff --git a/src/factory/ProductDetail/MusicProductDetail.ts b/src/factory/ProductDetail/MusicProductDetail.ts index 3157d8f..8769ce9 100644 --- a/src/factory/ProductDetail/MusicProductDetail.ts +++ b/src/factory/ProductDetail/MusicProductDetail.ts @@ -5,9 +5,7 @@ import axios from 'axios'; const fetchMusicProductDetail = async (context: QueryFunctionContext) => { const product_id = context.queryKey[1] as string; - const { data } = await axios.get( - `https://api.moaguide.com/detail/building/${product_id}` - ); + const { data } = await axios.get(`https://api.moaguide.com/detail/music/${product_id}`); return data; }; diff --git a/src/types/MusicProductType.ts b/src/types/MusicProductType.ts index 0a30759..88f0b48 100644 --- a/src/types/MusicProductType.ts +++ b/src/types/MusicProductType.ts @@ -12,6 +12,8 @@ export interface IMusicProductDetail { divideCycle: number; link: string; bookmark: boolean; + yearDvide: number; + yearDvideRate: number; } export interface IMusicProductProfitDetail { @@ -71,6 +73,7 @@ export interface IMusicScheduleData { place: string; period: string; imageUrl: string; + link: string; } export type IMusicSchedule = IMusicScheduleData[];