From 27a6b2637887909492fc97da98f22e2177241f7b Mon Sep 17 00:00:00 2001 From: Junho Jeon Date: Thu, 9 Nov 2023 20:08:21 +0900 Subject: [PATCH 1/6] =?UTF-8?q?[Feat]=20API=20=EB=B0=9B=EC=95=84=EC=98=A4?= =?UTF-8?q?=EB=8A=94=EA=B1=B0=20=EC=B6=94=EA=B0=80#1083?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/tournament/TournamentCard.tsx | 29 ++++++- pages/tournament.tsx | 103 ++++++++++++++++++----- 2 files changed, 110 insertions(+), 22 deletions(-) diff --git a/components/tournament/TournamentCard.tsx b/components/tournament/TournamentCard.tsx index 5af6c76e3..7a7622e65 100644 --- a/components/tournament/TournamentCard.tsx +++ b/components/tournament/TournamentCard.tsx @@ -1,4 +1,7 @@ -import { TournamentInfo } from 'types/modalTypes'; +import { totalmem } from 'os'; +import { useSetRecoilState } from 'recoil'; +import { TournamentInfo , Modal } from 'types/modalTypes'; +import { modalState } from 'utils/recoil/modal'; import styles from 'styles/tournament/TournamentCard.module.scss'; export default function TournamentCard({ @@ -12,8 +15,30 @@ export default function TournamentCard({ winnerImage, endDate, }: TournamentInfo) { + const setModal = useSetRecoilState(modalState); + + const openTournamentInfoModal = () => { + setModal({ + modalName: 'TOURNAMENT-REGISTRY', + tournamentInfo: { + tournametId: tournametId, + title: title, + contents: contents, + startDate: startDate, + status: status, + type: type, + winnerId: winnerId, + winnerImage: winnerImage, + endDate: endDate, + }, + }); + }; + return ( -
+
{title}
); diff --git a/pages/tournament.tsx b/pages/tournament.tsx index 5626b6070..eb5f92602 100644 --- a/pages/tournament.tsx +++ b/pages/tournament.tsx @@ -1,6 +1,8 @@ +import { useQuery } from 'react-query'; import { useSetRecoilState } from 'recoil'; -import { Modal } from 'types/modalTypes'; -import { modalState } from 'utils/recoil/modal'; +import { TournamentInfo } from 'types/modalTypes'; +import { instance } from 'utils/axios'; +import { errorState } from 'utils/recoil/error'; import TournamentCard from 'components/tournament/TournamentCard'; import styles from 'styles/tournament/TournamentContainer.module.scss'; @@ -21,7 +23,62 @@ const tempData = { }, { tournametId: 6, - title: '6회 마스터 토너먼트', + title: '7회 마스터 토너먼트', + contents: '블라블라 하이하이', + startDate: '2023-11-12', + status: '진행중', + type: 'master', + winnerId: 'hannkim', + winnerImage: '', + endDate: '2023-11-12', + }, + { + tournametId: 6, + title: '8회 마스터 토너먼트', + contents: '블라블라 하이하이', + startDate: '2023-11-12', + status: '진행중', + type: 'master', + winnerId: 'hannkim', + winnerImage: '', + endDate: '2023-11-12', + }, + { + tournametId: 6, + title: '9회 마스터 토너먼트', + contents: '블라블라 하이하이', + startDate: '2023-11-12', + status: '진행중', + type: 'master', + winnerId: 'hannkim', + winnerImage: '', + endDate: '2023-11-12', + }, + { + tournametId: 6, + title: '10회 마스터 토너먼트', + contents: '블라블라 하이하이', + startDate: '2023-11-12', + status: '진행중', + type: 'master', + winnerId: 'hannkim', + winnerImage: '', + endDate: '2023-11-12', + }, + { + tournametId: 6, + title: '11회 마스터 토너먼트', + contents: '블라블라 하이하이', + startDate: '2023-11-12', + status: '진행중', + type: 'master', + winnerId: 'hannkim', + winnerImage: '', + endDate: '2023-11-12', + }, + { + tournametId: 6, + title: '12회 마스터 토너먼트', contents: '블라블라 하이하이', startDate: '2023-11-12', status: '진행중', @@ -35,24 +92,30 @@ const tempData = { }; export default function Tournament() { - const setModal = useSetRecoilState(modalState); + const setError = useSetRecoilState(errorState); + + const openTorunamentInfo = useQuery( + 'openTorunamentInfo', + () => + instance + .get('pingpong/tournaments?page=*&type=*&status=진행중') + .then((res) => res.data), + { retry: 1, staleTime: 60000 /* 60초 */ } + ); + + const waitTournamentInfo = useQuery( + 'waitTournamentInfo', + () => + instance + .get('pingpong/tournaments?page=*&type=*&status=예정') + .then((res) => res.data), + { retry: 1, staleTime: 60000 /* 60초 */ } + ); + + if (openTorunamentInfo.isError || waitTournamentInfo.isError) { + setError('junhjeon'); + } - const handleTournament = () => { - setModal({ - modalName: 'TOURNAMENT-REGISTRY', - tournamentInfo: { - tournametId: 5, - title: '5회 루키 토너먼트', - contents: '블라블라', - startDate: '2023-11-11', - status: '종료', - type: 'rookie', - winnerId: 'hannkim', - winnerImage: '', - endDate: '2023-11-11', - }, - }); - }; return (

Tournament

From 01d8d4b7b7c9c45aa6531acc47b6ea7d94d64db3 Mon Sep 17 00:00:00 2001 From: Junho jeon Date: Tue, 14 Nov 2023 15:45:09 +0900 Subject: [PATCH 2/6] =?UTF-8?q?[FIX]=20=EC=82=AC=EC=9A=A9=ED=95=A0?= =?UTF-8?q?=EC=88=98=20=EC=97=86=EB=8A=94=20api=EC=A3=BC=EC=84=9D=20?= =?UTF-8?q?=EC=B2=98=EB=A6=AC#1083?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../tournament/TournamentRegistryModal.tsx | 18 ++++----- pages/tournament.tsx | 38 +++++++++---------- 2 files changed, 28 insertions(+), 28 deletions(-) diff --git a/components/modal/tournament/TournamentRegistryModal.tsx b/components/modal/tournament/TournamentRegistryModal.tsx index 6485a6c45..0c020c2c0 100644 --- a/components/modal/tournament/TournamentRegistryModal.tsx +++ b/components/modal/tournament/TournamentRegistryModal.tsx @@ -7,7 +7,7 @@ import { ModalButtonContainer, ModalButton, } from 'components/modal/ModalButton'; -import styles from 'styles/modal/event/AnnouncementModal.module.scss'; +import styles from 'styles/modal/event/TournamentRegistryModal.module.scss'; import 'react-quill/dist/quill.bubble.css'; const Quill = dynamic(() => import('react-quill'), { @@ -35,8 +35,15 @@ export default function TournamentRegistryModal({ return (
+
+ +
{title}
-
{startTime.toString()}
+
{startTime.toString()}
- - - ( - 'openTorunamentInfo', - () => - instance - .get('pingpong/tournaments?page=*&type=*&status=진행중') - .then((res) => res.data), - { retry: 1, staleTime: 60000 /* 60초 */ } - ); + // const openTorunamentInfo = useQuery( + // 'openTorunamentInfo', + // () => + // instance + // .get('pingpong/tournaments?page=*&type=*&status=진행중') + // .then((res) => res.data), + // { retry: 1, staleTime: 60000 /* 60초 */ } + // ); - const waitTournamentInfo = useQuery( - 'waitTournamentInfo', - () => - instance - .get('pingpong/tournaments?page=*&type=*&status=예정') - .then((res) => res.data), - { retry: 1, staleTime: 60000 /* 60초 */ } - ); + // const waitTournamentInfo = useQuery( + // 'waitTournamentInfo', + // () => + // instance + // .get('pingpong/tournaments?page=*&type=*&status=예정') + // .then((res) => res.data), + // { retry: 1, staleTime: 60000 /* 60초 */ } + // ); - if (openTorunamentInfo.isError || waitTournamentInfo.isError) { - setError('junhjeon'); - } + // if (openTorunamentInfo.isError || waitTournamentInfo.isError) { + // setError('junhjeon'); + // } return (
From 4f7b27a4c00f1482277147074c34a096d45de9aa Mon Sep 17 00:00:00 2001 From: Junho jeon Date: Tue, 14 Nov 2023 15:45:53 +0900 Subject: [PATCH 3/6] =?UTF-8?q?[Style]=20=ED=86=A0=EB=84=88=EB=A8=BC?= =?UTF-8?q?=ED=8A=B8=20=EB=AA=A8=EB=8B=AC=20=EC=8A=A4=ED=83=80=EC=9D=BC=20?= =?UTF-8?q?=EC=88=98=EC=A0=95#1083?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../event/TournamentRegistryModal.module.scss | 66 +++++++++++++++++++ 1 file changed, 66 insertions(+) create mode 100644 styles/modal/event/TournamentRegistryModal.module.scss diff --git a/styles/modal/event/TournamentRegistryModal.module.scss b/styles/modal/event/TournamentRegistryModal.module.scss new file mode 100644 index 000000000..eb6e2c10a --- /dev/null +++ b/styles/modal/event/TournamentRegistryModal.module.scss @@ -0,0 +1,66 @@ +@import 'styles/common.scss'; + +.container { + @include modalContainer('SKYPINK'); + width: 80vw; + max-width: 22rem; +} + +.title { + @include modalTitle; + padding-bottom: 1rem; + color: rgba(18, 23, 37, 1); +} + +.startTime { + font-size: 0.7rem; + color: rgba(18, 23, 37, 1); +} + +.quillViewer { + width: 100%; + min-width: 10rem; + max-width: 15rem; + height: 100%; + max-height: 19rem; + padding-bottom: 1rem; + overflow-y: scroll; + color: rgba(18, 23, 37, 1); +} + +.quillViewer::-webkit-scrollbar { + display: inherit; + width: 5px; + height: 1rem; +} + +.quillViewer::-webkit-scrollbar-thumb { + background: white; + border-radius: 10px; +} + +.checkBox { + margin-bottom: 0.5rem; + input { + position: relative; + top: 2px; + display: inline-block; + width: 1rem; + height: 1rem; + margin: 0 0.5rem 0 0; + cursor: pointer; + } + label { + display: inline-block; + color: white; + cursor: pointer; + } +} + +.closeButtonContainer { + display: flex; + margin-left: auto; + background-color: rgba(255, 0, 0, 1); + justify-content: center; + align-items: center; +} From c0f3dd137bff16ddf0d84ba00f017017e3cc840f Mon Sep 17 00:00:00 2001 From: Junho Jeon Date: Tue, 14 Nov 2023 18:29:24 +0900 Subject: [PATCH 4/6] =?UTF-8?q?[S[Style]=20=EB=AA=A8=EB=8B=AC=20X=20?= =?UTF-8?q?=EB=B2=84=ED=8A=BC=ED=81=B4=EB=A6=AD=EC=9C=BC=EB=A1=9C=20?= =?UTF-8?q?=EB=82=98=EA=B0=80=EA=B8=B0#1083?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/modal/ModalButton.tsx | 2 +- .../modal/tournament/TournamentRegistryModal.tsx | 12 +++++++----- styles/common.scss | 15 +++++++++++++++ .../event/TournamentRegistryModal.module.scss | 3 --- 4 files changed, 23 insertions(+), 9 deletions(-) diff --git a/components/modal/ModalButton.tsx b/components/modal/ModalButton.tsx index c248c8e0f..39a6a0250 100644 --- a/components/modal/ModalButton.tsx +++ b/components/modal/ModalButton.tsx @@ -2,7 +2,7 @@ import LoadingButton from 'components/modal/LoadingButton'; import styles from 'styles/modal/Modal.module.scss'; type ButtonProps = { - style: 'positive' | 'negative'; + style: 'positive' | 'negative' | 'close'; value: string; form?: string; isLoading?: boolean; diff --git a/components/modal/tournament/TournamentRegistryModal.tsx b/components/modal/tournament/TournamentRegistryModal.tsx index 0c020c2c0..c1a466eff 100644 --- a/components/modal/tournament/TournamentRegistryModal.tsx +++ b/components/modal/tournament/TournamentRegistryModal.tsx @@ -36,11 +36,13 @@ export default function TournamentRegistryModal({ return (
- + + +
{title}
{startTime.toString()}
diff --git a/styles/common.scss b/styles/common.scss index f2f27944d..ee80234fd 100644 --- a/styles/common.scss +++ b/styles/common.scss @@ -331,6 +331,7 @@ $vip-background: linear-gradient( justify-content: center; align-items: center; } + .negative { input { margin-right: 1rem; @@ -352,6 +353,20 @@ $vip-background: linear-gradient( ); } } + .close { + input { + padding: 0.5rem 1rem; + color: rgba(255, 255, 255, 1); + cursor: pointer; + background: linear-gradient( + 180deg, + #c66bf2 0%, + rgba(96, 6, 138, 0.52) 100% + ); + border: 0; + border-radius: 0.625rem; + } + } } @mixin txtColor($color: black) { diff --git a/styles/modal/event/TournamentRegistryModal.module.scss b/styles/modal/event/TournamentRegistryModal.module.scss index eb6e2c10a..991f2654c 100644 --- a/styles/modal/event/TournamentRegistryModal.module.scss +++ b/styles/modal/event/TournamentRegistryModal.module.scss @@ -60,7 +60,4 @@ .closeButtonContainer { display: flex; margin-left: auto; - background-color: rgba(255, 0, 0, 1); - justify-content: center; - align-items: center; } From 86a4c57c79f76676d5996f0b3094fb2d990a9e42 Mon Sep 17 00:00:00 2001 From: Junho Jeon Date: Tue, 14 Nov 2023 19:08:05 +0900 Subject: [PATCH 5/6] =?UTF-8?q?[Style]=20=20=EB=AA=A8=EB=8B=AC=20=EC=B0=B8?= =?UTF-8?q?=EA=B0=80=EC=9D=B8=EC=9B=90=20=EC=B6=94=EA=B0=80=20#1083?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../modal/tournament/TournamentRegistryModal.tsx | 6 +++++- styles/modal/event/TournamentRegistryModal.module.scss | 10 ++++++++++ 2 files changed, 15 insertions(+), 1 deletion(-) diff --git a/components/modal/tournament/TournamentRegistryModal.tsx b/components/modal/tournament/TournamentRegistryModal.tsx index c1a466eff..50595047c 100644 --- a/components/modal/tournament/TournamentRegistryModal.tsx +++ b/components/modal/tournament/TournamentRegistryModal.tsx @@ -24,6 +24,7 @@ export default function TournamentRegistryModal({ endTime, }: TournamentInfo) { const setModal = useSetRecoilState(modalState); + const Date = startTime.toString().split(':').slice(0, 2).join(':'); const registTournament = () => { console.log('토너먼트에 등록하시겠습니까.'); @@ -45,7 +46,10 @@ export default function TournamentRegistryModal({
{title}
-
{startTime.toString()}
+
+
{Date}
+
현재인원 / 최대인원
+
Date: Tue, 14 Nov 2023 19:48:54 +0900 Subject: [PATCH 6/6] =?UTF-8?q?[Style]=20=EB=AA=A8=EB=8B=AC=20=20=EB=82=B4?= =?UTF-8?q?=EB=B6=80=20=ED=85=8D=EC=8A=A4=ED=8A=B8=20=EC=A4=91=EC=95=99?= =?UTF-8?q?=EC=A0=95=EB=A0=AC=20#1083?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- styles/modal/event/TournamentRegistryModal.module.scss | 5 ----- 1 file changed, 5 deletions(-) diff --git a/styles/modal/event/TournamentRegistryModal.module.scss b/styles/modal/event/TournamentRegistryModal.module.scss index d11c823ab..92f9fe936 100644 --- a/styles/modal/event/TournamentRegistryModal.module.scss +++ b/styles/modal/event/TournamentRegistryModal.module.scss @@ -65,9 +65,4 @@ .tournamentInfo { justify-content: center; align-items: center; - - .startTime, - .participants { - margin-right: 1rem; - } }