From caac3dfbeaebe38dede5ec6f356bdb93c0ef824a Mon Sep 17 00:00:00 2001 From: siwolee Date: Mon, 19 Aug 2024 12:10:43 +0900 Subject: [PATCH 01/21] feat: index ui --- components/agenda/utils/PageController.tsx | 0 pages/index.tsx | 57 ++++++++++++++++++--- public/image/ticket.png | Bin 0 -> 17757 bytes 3 files changed, 50 insertions(+), 7 deletions(-) create mode 100644 components/agenda/utils/PageController.tsx create mode 100644 public/image/ticket.png diff --git a/components/agenda/utils/PageController.tsx b/components/agenda/utils/PageController.tsx new file mode 100644 index 000000000..e69de29bb diff --git a/pages/index.tsx b/pages/index.tsx index 7b66a8f75..9081d0216 100644 --- a/pages/index.tsx +++ b/pages/index.tsx @@ -1,6 +1,33 @@ +import Image from 'next/image'; import { useRouter } from 'next/router'; import type { NextPage } from 'next'; +import AgendaInfo from 'components/agenda/Home/AgendaInfo'; +import PingpongIcon from 'public/image/takgu/ping-pong.svg'; import styles from 'styles/index.module.scss'; + +const mockAgendaData = { + agendaTitle: 'name', + agendaContents: 'contents', + agendaDeadLine: '2024-09-01T4:35:07', // format: 2024-09-01T04:35:07 + agendaStartTime: '2024-09-01T4:35:07', + agendaEndTime: '2024-09-01T4:35:07', + agendaMinTeam: 3, + agendaMaxTeam: 10, + agendaCurrentTeam: 10, + agendaMinPeople: 10, + agendaMaxPeople: 10, + agendaPoster: null, + agendaHost: 'host', + agendaLocation: 0, + agendaStatus: 0, + createdAt: '2024-09-01T4:35:07', + announcementTitle: 'sdf', + isOfficial: true, + isRanking: true, + agendaisRanking: true, + agendaKey: 23, +}; + const Index: NextPage = () => { const router = useRouter(); @@ -11,15 +38,31 @@ const Index: NextPage = () => { return (
-
GG
-
다른거
+ + +
+
+ + {/* */}
- - - +
); }; diff --git a/public/image/ticket.png b/public/image/ticket.png new file mode 100644 index 0000000000000000000000000000000000000000..2ccf0d00d0352816a0582ef0e26a3fdbccbe3a05 GIT binary patch literal 17757 zcmcJ1cQ~9u)bApQ9z-XSB}9uJy@VAcLZSp=qn9XAS7()|5rT*oHA1x2ds`uTjl?R^ ziLwOI>)w&C+~?lEzi*!>kG%VynK^UjoHM_f`OQW?(Nv`%WhR9{AQb9qFl`6~AN&^| za+L`D+4K5w0{&caQ&QKx3O;^UEhE4)iL;ua8w5hxarqA~k&luEe97dlV&JahWbN*0 z=4u7;^z^*@@|C@tg_*O}T_;zYv_G=U5Xeo4I_$o#*T>Ci?~iPH={Ovwz}MF#-u)od z;o7tN*NhDwz|`<>;n9$Euii0&-d+8&7(JNEbY36b=gInDB(UzSB*&*L2a=ro*Cwb5 z-^<;yoE`O@{XDo8yROLX9{) z8>G2CeC3*F1&SadLQVEVaak8*yEz#HfocqMo6;OTroMxM4g!VJ+3jdKSpT@AdEiga z;>92|L3y-AKNCwDSZHNTe2qG8+qj{3%*M5U5ba0C09mBm?%NH8CbY^7IlSe|KV31A)JvL_^%doP>Zg;VT4rxs#_+SWLebD+%cvv&|bOjLvF;S1kJ|Z z#?AidA$bZ9Ts-%3 zX885-Okz)7#IvU2U88n!$nVlum*H}RWrj|(am{!`K1b)T)Kn!8=9v+Qc0Y}N!K&)=|*5R>T`@JBivrbQSS zq4pYOU^YeGFA;W(md)xx#S>!q;*$O{ z`Nm{*TJ5ZRTu(hEbYz4XnCn`{2#VoTZ47Iheqd|^_*Q+F{RuU7KFau|)*k0JA_uoyLsDZlx5C_lo?%j0v6b5w*p*Zq zf(`cd6TTws%F&#ohpv2I@P$XSo0@5Ci^UkaRUp&;15kYa3EoYp9=6bAq9+u}FjqOu zsHvL%RM}-<>A8IQ2Dy$i8?5)Tj>6tVzD;rq$ zw^bu5szQ%P7F3(<(Ofm5DePLR_IDR~X=zI_m4G=5meN)qXJCYY>sg$wwdD*5YP^%Q7KfX(+KUTPSu$B|d2BN^23FI-5bn z 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 S`eqaaeAHDmVJIcj;Qs?J(9cQ$ literal 0 HcmV?d00001 From a6feeab05026ebb91cd1b6a47253d054450176df Mon Sep 17 00:00:00 2001 From: siwolee Date: Mon, 19 Aug 2024 13:44:24 +0900 Subject: [PATCH 02/21] feat: pageController ui --- components/agenda/utils/PageController.tsx | 59 +++++++++++++++++ pages/index.tsx | 12 ++-- .../agenda/utils/PageController.module.scss | 65 +++++++++++++++++++ 3 files changed, 132 insertions(+), 4 deletions(-) create mode 100644 styles/agenda/utils/PageController.module.scss diff --git a/components/agenda/utils/PageController.tsx b/components/agenda/utils/PageController.tsx index e69de29bb..81a0c8f26 100644 --- a/components/agenda/utils/PageController.tsx +++ b/components/agenda/utils/PageController.tsx @@ -0,0 +1,59 @@ +import { useState } from 'react'; +import styles from 'styles/agenda/utils/PageController.module.scss'; + +interface PageControllerNavigatorProps { + currentPage: number; + maxPage: number; + onClick: (page: number) => void; +} + +const PageControllerNavigator = ({ + currentPage, + maxPage, + onClick, +}: PageControllerNavigatorProps) => { + const buttons = []; + for (let i = 0; i < maxPage; i++) { + if (i === currentPage) + buttons.push( + -
- - {/* */} -
+ , + , + , + ]} + /> diff --git a/styles/agenda/utils/PageController.module.scss b/styles/agenda/utils/PageController.module.scss new file mode 100644 index 000000000..d4871fdb4 --- /dev/null +++ b/styles/agenda/utils/PageController.module.scss @@ -0,0 +1,65 @@ +@import 'styles/agenda/common.scss'; + +.container { + position: relative; + border: 1px solid red; +} + +.rest, +.current { + padding: 0; + margin: 0; + background-color: var(--color-text); + border: none; + border-radius: 100%; + box-shadow: var(--default-box-shadow); +} + +.current { + width: 0.7rem; + height: 0.7rem; +} + +.rest { + width: 0.4rem; + height: 0.4rem; + opacity: 0.5; +} + +.navContainer { + display: flex; + width: max-content; + max-width: 50%; + padding: 0.4rem; + margin: 0.5rem auto; + background: rgba(0, 0, 0, 0.01); + border-radius: 1rem; + box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25) inset; + gap: 0.8rem; + justify-content: center; + align-items: center; +} + +.prev, +.next { + position: absolute; + top: calc(50% - 1rem); + width: 2rem; + height: 2rem; + background: transparent; +} + +.prev { + left: 1.5rem; + border-top: 1rem solid transparent; + border-right: 1rem solid var(--color-text); + border-bottom: 1rem solid transparent; + border-left: 2rem solid transparent; +} +.next { + right: 1.5rem; + border-top: 1rem solid transparent; + border-right: 2rem solid transparent; + border-bottom: 1rem solid transparent; + border-left: 1rem solid var(--color-text); +} From 091f092eb3b445483c21acc6a7d95c994d89938a Mon Sep 17 00:00:00 2001 From: siwolee Date: Mon, 19 Aug 2024 14:18:07 +0900 Subject: [PATCH 03/21] =?UTF-8?q?feat:=20api=20=EC=97=B0=EA=B2=B0=20?= =?UTF-8?q?=EB=B0=8F=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/agenda/utils/PageController.tsx | 40 ++++++++++++++----- pages/index.tsx | 33 +-------------- .../agenda/utils/PageController.module.scss | 38 ++++++++++++------ 3 files changed, 58 insertions(+), 53 deletions(-) diff --git a/components/agenda/utils/PageController.tsx b/components/agenda/utils/PageController.tsx index 81a0c8f26..3654b4253 100644 --- a/components/agenda/utils/PageController.tsx +++ b/components/agenda/utils/PageController.tsx @@ -1,5 +1,8 @@ -import { useState } from 'react'; +import { useEffect, useState } from 'react'; +import { AgendaDataProps } from 'types/agenda/agendaDetail/agendaTypes'; +import { instanceInAgenda } from 'utils/axios'; import styles from 'styles/agenda/utils/PageController.module.scss'; +import AgendaInfo from '../Home/AgendaInfo'; interface PageControllerNavigatorProps { currentPage: number; @@ -28,13 +31,30 @@ const PageControllerNavigator = ({ ); }; -interface PageControllerProps { - compArray: React.ReactNode[]; -} - -const PageController = ({ compArray }: PageControllerProps) => { +const PageController = () => { const [current, setCurrent] = useState(0); - const max = compArray.length; + const [data, setData] = useState([]); + const max = data.length; + + const fetchAgendaList = async () => { + const url = '/list'; + const data = await instanceInAgenda + .get(url) + .then((res) => { + return res.data; + }) + .catch((error) => { + if (error.view === 403) return []; + else return []; // 에러처리 필요 ERROR + }); + return data; + }; + + useEffect(() => { + fetchAgendaList().then((data) => { + setData(data); + }); + }, []); return (
@@ -46,10 +66,12 @@ const PageController = ({ compArray }: PageControllerProps) => { className={styles.next} onClick={() => setCurrent(current + 1 < max ? current + 1 : 0)} /> - {compArray[current]} +
+ +
diff --git a/pages/index.tsx b/pages/index.tsx index d0cdc85f4..8904599e0 100644 --- a/pages/index.tsx +++ b/pages/index.tsx @@ -1,37 +1,12 @@ import Image from 'next/image'; import { useRouter } from 'next/router'; import type { NextPage } from 'next'; -import AgendaInfo from 'components/agenda/Home/AgendaInfo'; import PageController from 'components/agenda/utils/PageController'; import PingpongIcon from 'public/image/takgu/ping-pong.svg'; import styles from 'styles/index.module.scss'; -const mockAgendaData = { - agendaTitle: 'name', - agendaContents: 'contents', - agendaDeadLine: '2024-09-01T4:35:07', // format: 2024-09-01T04:35:07 - agendaStartTime: '2024-09-01T4:35:07', - agendaEndTime: '2024-09-01T4:35:07', - agendaMinTeam: 3, - agendaMaxTeam: 10, - agendaCurrentTeam: 10, - agendaMinPeople: 10, - agendaMaxPeople: 10, - agendaPoster: null, - agendaHost: 'host', - agendaLocation: 0, - agendaStatus: 0, - createdAt: '2024-09-01T4:35:07', - announcementTitle: 'sdf', - isOfficial: true, - isRanking: true, - agendaisRanking: true, - agendaKey: 23, -}; - const Index: NextPage = () => { const router = useRouter(); - const handleNavigation = (path: string) => { router.push(path); }; @@ -58,13 +33,7 @@ const Index: NextPage = () => { - , - , - , - ]} - /> + diff --git a/styles/agenda/utils/PageController.module.scss b/styles/agenda/utils/PageController.module.scss index d4871fdb4..8f10a49ab 100644 --- a/styles/agenda/utils/PageController.module.scss +++ b/styles/agenda/utils/PageController.module.scss @@ -2,27 +2,33 @@ .container { position: relative; - border: 1px solid red; + width: 100%; + height: max-content; +} + +.agendaInfoContainer { + @include container(1); } .rest, .current { - padding: 0; margin: 0; - background-color: var(--color-text); + background-color: var(--color-text-reverse); border: none; border-radius: 100%; box-shadow: var(--default-box-shadow); } - .current { - width: 0.7rem; - height: 0.7rem; + width: 0.8rem; + height: 0.8rem; + padding: 0; } .rest { - width: 0.4rem; - height: 0.4rem; + + width: 0.6rem; + height: 0.6rem; + padding: 0.2rem; opacity: 0.5; } @@ -43,23 +49,31 @@ .prev, .next { position: absolute; - top: calc(50% - 1rem); + top: calc(40% - 1rem); width: 2rem; height: 2rem; background: transparent; } .prev { - left: 1.5rem; + left: 0rem; border-top: 1rem solid transparent; - border-right: 1rem solid var(--color-text); + border-right: 1rem solid transparent; border-bottom: 1rem solid transparent; border-left: 2rem solid transparent; } +.prev:hover { + border-right: 1rem solid var(--color-text); +} + .next { - right: 1.5rem; + right: 0rem; border-top: 1rem solid transparent; border-right: 2rem solid transparent; border-bottom: 1rem solid transparent; + border-left: 1rem solid transparent; +} + +.next:hover { border-left: 1rem solid var(--color-text); } From 2e35a78de8dd7f8cb9b4a438ade983c28176b557 Mon Sep 17 00:00:00 2001 From: siwolee Date: Mon, 19 Aug 2024 14:33:09 +0900 Subject: [PATCH 04/21] =?UTF-8?q?fix:=20ui=20=EB=B0=8F=20=EB=A6=AC?= =?UTF-8?q?=EB=8B=A4=EC=9D=B4=EB=A0=89=EC=85=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/agenda/utils/PageController.tsx | 31 +++++++++++++------ pages/index.tsx | 2 +- .../agenda/utils/PageController.module.scss | 5 ++- 3 files changed, 24 insertions(+), 14 deletions(-) diff --git a/components/agenda/utils/PageController.tsx b/components/agenda/utils/PageController.tsx index 3654b4253..fd35af6f7 100644 --- a/components/agenda/utils/PageController.tsx +++ b/components/agenda/utils/PageController.tsx @@ -31,7 +31,11 @@ const PageControllerNavigator = ({ ); }; -const PageController = () => { +const PageController = ({ + handleNavigation, +}: { + handleNavigation: (path: string) => void; +}) => { const [current, setCurrent] = useState(0); const [data, setData] = useState([]); const max = data.length; @@ -59,16 +63,23 @@ const PageController = () => { return (
+ { - + diff --git a/styles/agenda/utils/PageController.module.scss b/styles/agenda/utils/PageController.module.scss index 8f10a49ab..8c2d51421 100644 --- a/styles/agenda/utils/PageController.module.scss +++ b/styles/agenda/utils/PageController.module.scss @@ -1,13 +1,13 @@ @import 'styles/agenda/common.scss'; .container { - position: relative; width: 100%; height: max-content; } .agendaInfoContainer { @include container(1); + position: relative; } .rest, @@ -25,7 +25,6 @@ } .rest { - width: 0.6rem; height: 0.6rem; padding: 0.2rem; @@ -49,7 +48,7 @@ .prev, .next { position: absolute; - top: calc(40% - 1rem); + top: calc(50% - 1rem); width: 2rem; height: 2rem; background: transparent; From 1ff71bcb38016c221f9ff9fa9430a79dc8245adf Mon Sep 17 00:00:00 2001 From: siwolee Date: Mon, 19 Aug 2024 14:45:47 +0900 Subject: [PATCH 05/21] =?UTF-8?q?fix:=20=EB=A9=94=EC=9D=B8=20=ED=8E=98?= =?UTF-8?q?=EC=9D=B4=EC=A7=80=20=EC=83=89=20=EB=B0=8F=20ui?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- Layout/LayoutProvider.tsx | 2 +- pages/index.tsx | 2 +- styles/agenda/Home/AgendaInfo.module.scss | 1 - styles/agenda/Home/AgendaList.module.scss | 2 -- .../agenda/utils/PageController.module.scss | 22 +++++++++++++++---- styles/index.module.scss | 4 +++- 6 files changed, 23 insertions(+), 10 deletions(-) diff --git a/Layout/LayoutProvider.tsx b/Layout/LayoutProvider.tsx index 6a20df4d7..af257cdcc 100644 --- a/Layout/LayoutProvider.tsx +++ b/Layout/LayoutProvider.tsx @@ -18,7 +18,7 @@ const LayoutProvider = ({ children }: LayoutProviderProps) => { // case "admin" : // return {children}; default: - return <>{children}; + return {children}; } }; diff --git a/pages/index.tsx b/pages/index.tsx index 5d55864c1..b97ae0d8a 100644 --- a/pages/index.tsx +++ b/pages/index.tsx @@ -13,6 +13,7 @@ const Index: NextPage = () => { return (
+
-
diff --git a/styles/agenda/Home/AgendaInfo.module.scss b/styles/agenda/Home/AgendaInfo.module.scss index 80e79a62d..6c48dbec3 100644 --- a/styles/agenda/Home/AgendaInfo.module.scss +++ b/styles/agenda/Home/AgendaInfo.module.scss @@ -2,7 +2,6 @@ .agendaInfoContainer { display: flex; - width: 100%; height: 4.5rem; gap: 1rem; } diff --git a/styles/agenda/Home/AgendaList.module.scss b/styles/agenda/Home/AgendaList.module.scss index 9ef279177..be6fa1190 100644 --- a/styles/agenda/Home/AgendaList.module.scss +++ b/styles/agenda/Home/AgendaList.module.scss @@ -45,8 +45,6 @@ .agendaListItemBtn { position: relative; display: flex; - width: 100%; - min-width: 352px; max-width: 750px; height: calc(150px + (100vw - 352px) * ((600 - 150) / (750 - 352))); min-height: 180px; diff --git a/styles/agenda/utils/PageController.module.scss b/styles/agenda/utils/PageController.module.scss index 8c2d51421..e83cbf2f3 100644 --- a/styles/agenda/utils/PageController.module.scss +++ b/styles/agenda/utils/PageController.module.scss @@ -8,6 +8,20 @@ .agendaInfoContainer { @include container(1); position: relative; + display: flex; + min-width: 352px; + max-width: 750px; + height: calc(150px + (100vw - 352px) * ((600 - 150) / (750 - 352))); + min-height: 180px; + max-height: 600px; + padding: 0.7rem 1.2rem; + cursor: pointer; + background: $agenda-list-bg; // poster img url 변수로 변경 예정 + border: var(--default-border); + border-radius: $radius-medium; + box-shadow: var(--default-box-shadow); + justify-content: flex-start; + align-items: flex-start; } .rest, @@ -19,14 +33,14 @@ box-shadow: var(--default-box-shadow); } .current { - width: 0.8rem; - height: 0.8rem; + width: 0.6rem; + height: 0.6rem; padding: 0; } .rest { - width: 0.6rem; - height: 0.6rem; + width: 0.4rem; + height: 0.4rem; padding: 0.2rem; opacity: 0.5; } diff --git a/styles/index.module.scss b/styles/index.module.scss index fae953707..ec612704f 100644 --- a/styles/index.module.scss +++ b/styles/index.module.scss @@ -1,5 +1,7 @@ @import 'styles/agenda/common.scss'; - +.layout { + max-width: 100%; +} .container { @include container(1); } From 4a58021ca789aea7333c52e46739caddea7c7fc4 Mon Sep 17 00:00:00 2001 From: siwolee Date: Mon, 19 Aug 2024 14:52:00 +0900 Subject: [PATCH 06/21] =?UTF-8?q?feat:=20agena=20=EB=B0=94=EB=A1=9C?= =?UTF-8?q?=EA=B0=80=EA=B8=B0=20=EC=83=9D=EC=84=B1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- pages/index.tsx | 4 ++++ styles/agenda/Home/AgendaInfo.module.scss | 1 + styles/index.module.scss | 7 +++++++ 3 files changed, 12 insertions(+) diff --git a/pages/index.tsx b/pages/index.tsx index b97ae0d8a..5dda91a8f 100644 --- a/pages/index.tsx +++ b/pages/index.tsx @@ -13,7 +13,11 @@ const Index: NextPage = () => { return (
+

handleNavigation('/agenda')}> + Agenda +

+

Ticket & PingPong

+ +
+ ) : ( + <> + ); +}; + +export default Ticket; diff --git a/pages/agenda/ticket.tsx b/pages/agenda/ticket.tsx new file mode 100644 index 000000000..66056d310 --- /dev/null +++ b/pages/agenda/ticket.tsx @@ -0,0 +1,14 @@ +import Ticket from 'components/agenda/Ticket/Ticket'; +interface TicketProps { + ticketCount: number; +} + +const ticket = () => { + return ( +
+ +
+ ); +}; + +export default ticket; diff --git a/styles/agenda/Ticket/Ticket.module.scss b/styles/agenda/Ticket/Ticket.module.scss new file mode 100644 index 000000000..d454b98e4 --- /dev/null +++ b/styles/agenda/Ticket/Ticket.module.scss @@ -0,0 +1,69 @@ +@import 'styles/agenda/common.scss'; + +.container { + @include container(1); + flex-direction: column; + gap: 1.5rem; +} + +.h1 { + @include text(sub-title); + width: 100%; +} + +.section { + justify-content: center; + align-items: center; + display: flex; + flex-direction: column; + > p { + text-align: center; + } +} + +.ticketSection { + display: flex; + justify-content: flex-end; + > h1 { + align-self: center; + @include text(sub-title); + margin-left: 0.5rem; + } +} +.ticketFrame { + width: 5rem; + height: 5rem; + background: var(--highlight-violet); + border: 2px solid var(--color-text); + border-radius: 3rem; + box-shadow: 0 0.3rem 0 0 var(--color-text); + justify-content: flex-end; + align-items: center; + > h1 { + font-size: $font-size-xxxl; + text-align: center; + } +} + +.line { + width: 100%; + height: 1px; + border-bottom: 1px solid var(--color-text); +} + +.arrowDown { + padding: 0; + margin: 0; + border-top: 0.6rem solid var(--highlight-violet); + border-right: 0.4rem solid transparent; + border-bottom: 0.6rem solid transparent; + border-left: 0.4rem solid transparent; +} + +.submitButton { + @include textButton(text, highlight); +} + +.logButton { + @include textButton(text, primary); +} diff --git a/styles/agenda/common.scss b/styles/agenda/common.scss index e91572d55..9d062fd4d 100644 --- a/styles/agenda/common.scss +++ b/styles/agenda/common.scss @@ -44,6 +44,7 @@ $font-pretendard: 'Pretendard', sans-serif; $font-logo: 'Overgrow', sans-serif; /* font-size */ +$font-size-xxxl: 4rem; // $ticket bold $font-size-xxl: 2.1rem; // $giant-big-font $font-size-xl: 1.8rem; // $big-giant-font $font-size-l: 1.5rem; // $giant-font @@ -104,15 +105,14 @@ $font-size-xs: 0.8rem; // $small-font border-radius: $radius-small; box-shadow: var(--default-box-shadow); - @if ($type == 'submit') { - width: 3rem; - height: 1.5rem; + @if ($type == 'text') { + width: 100%; + height: max-content; } @else if ($type == 'delete') { background: url('/buttons/delete.svg') no-repeat center; } @else { - // default - width: 3rem; - height: 1.5rem; + // default width: 100%; + height: max-content; } @if ($style == 'highlight') { diff --git a/types/aganda/ticketTypes.ts b/types/aganda/ticketTypes.ts new file mode 100644 index 000000000..c74dcdabc --- /dev/null +++ b/types/aganda/ticketTypes.ts @@ -0,0 +1 @@ +// ticketType : From da86508124a2cc1c35623d880f7ab0bd6f26db10 Mon Sep 17 00:00:00 2001 From: siwolee Date: Mon, 19 Aug 2024 16:53:51 +0900 Subject: [PATCH 09/21] =?UTF-8?q?feat:=20profile=20intraid=20=EB=B0=9B?= =?UTF-8?q?=EC=95=84=EC=98=A4=EB=8F=84=EB=A1=9D=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- pages/agenda/profile/[intraId]/index.tsx | 97 +++++++++++++++++++++ pages/agenda/profile/index.tsx | 102 ++--------------------- 2 files changed, 105 insertions(+), 94 deletions(-) create mode 100644 pages/agenda/profile/[intraId]/index.tsx diff --git a/pages/agenda/profile/[intraId]/index.tsx b/pages/agenda/profile/[intraId]/index.tsx new file mode 100644 index 000000000..a6bfa28ee --- /dev/null +++ b/pages/agenda/profile/[intraId]/index.tsx @@ -0,0 +1,97 @@ +import { AgendaHistoryItemProps } from 'types/agenda/profile/agendaHistoryTypes'; +import { CurrentTeamItemProps } from 'types/agenda/profile/currentTeamTypes'; +import { ProfileDataProps } from 'types/agenda/profile/profileDataTypes'; +import AgendaHistory from 'components/agenda/Profile/AgendaHistory'; +import AgendaUserSearchBar from 'components/agenda/Profile/AgendaUserSearchBar'; +import CurrentTeam from 'components/agenda/Profile/CurrentTeam'; +import ProfileCard from 'components/agenda/Profile/ProfileCard'; +import useFetchGet from 'hooks/agenda/useFetchGet'; +import styles from 'styles/agenda/Profile/AgendaProfile.module.scss'; + +//intraid 받아오는 페이지로 세팅 필요 +export default function AgendaProfile() { + const { data: profileData, getData: getProfileData } = + useFetchGet('/profile'); + + const currentTeamData = useFetchGet( + '/profile/current/list' + ).data; + + const agendaHistory = useFetchGet( + '/profile/history/list', + { + page: 1, + size: 20, + } + ).data; + + // currentTeam MOCK DATA + const currentTeamMockData: CurrentTeamItemProps[] = [ + { + agendaId: '123', + agendaTitle: 'PUSH SWAP CONTEST', + agendaLocation: 'SEOUL', + teamKey: 'TEAMKEY1', + isOfficial: true, + teamName: 'jeongrol', + }, + { + agendaId: '1234', + agendaTitle: 'League Of Legend 42', + agendaLocation: 'SEOUL', + teamKey: 'TEAMKEY2', + isOfficial: true, + teamName: '7-8기 멤버단', + }, + ]; + // history MOCK DATA + const historyMockData: AgendaHistoryItemProps[] = [ + { + agendaId: 'agendaId1', + agendaTitle: '아젠다 타이틀1', + agendaStartTime: new Date(), + agendaEndTime: new Date(), + agendaCurrentTeam: 8, + agendaLocation: 'seoul', + teamKey: 'team1', + isOfficial: false, + agendaMaxPeople: 100, + teamName: 'team Name', + teamMates: [ + { + intraId: 'intraId1', + coalition: 'GUN', + }, + { + intraId: 'intraId2', + coalition: 'GON', + }, + { + intraId: 'intraId3', + coalition: 'LEE', + }, + ], + }, + ]; + + return ( + <> +
+
+ +
+ {profileData && ( + + )} + {currentTeamData && } + {agendaHistory && } +
+ + ); +} diff --git a/pages/agenda/profile/index.tsx b/pages/agenda/profile/index.tsx index 0eeb8119d..522fcf62f 100644 --- a/pages/agenda/profile/index.tsx +++ b/pages/agenda/profile/index.tsx @@ -1,96 +1,10 @@ -import { AgendaHistoryItemProps } from 'types/agenda/profile/agendaHistoryTypes'; -import { CurrentTeamItemProps } from 'types/agenda/profile/currentTeamTypes'; -import { ProfileDataProps } from 'types/agenda/profile/profileDataTypes'; -import AgendaHistory from 'components/agenda/Profile/AgendaHistory'; -import AgendaUserSearchBar from 'components/agenda/Profile/AgendaUserSearchBar'; -import CurrentTeam from 'components/agenda/Profile/CurrentTeam'; -import ProfileCard from 'components/agenda/Profile/ProfileCard'; -import useFetchGet from 'hooks/agenda/useFetchGet'; -import styles from 'styles/agenda/Profile/AgendaProfile.module.scss'; +import { useRouter } from 'next/router'; +import { useUser } from 'hooks/agenda/Layout/useUser'; -export default function AgendaProfile() { - const { data: profileData, getData: getProfileData } = - useFetchGet('/profile'); +const Index = () => { + const router = useRouter(); + const { intraId } = useUser() || {}; + router.push('/agenda/profile/' + intraId); +}; - const currentTeamData = useFetchGet( - '/profile/current/list' - ).data; - - const agendaHistory = useFetchGet( - '/profile/history/list', - { - page: 1, - size: 20, - } - ).data; - - // currentTeam MOCK DATA - const currentTeamMockData: CurrentTeamItemProps[] = [ - { - agendaId: '123', - agendaTitle: 'PUSH SWAP CONTEST', - agendaLocation: 'SEOUL', - teamKey: 'TEAMKEY1', - isOfficial: true, - teamName: 'jeongrol', - }, - { - agendaId: '1234', - agendaTitle: 'League Of Legend 42', - agendaLocation: 'SEOUL', - teamKey: 'TEAMKEY2', - isOfficial: true, - teamName: '7-8기 멤버단', - }, - ]; - // history MOCK DATA - const historyMockData: AgendaHistoryItemProps[] = [ - { - agendaId: 'agendaId1', - agendaTitle: '아젠다 타이틀1', - agendaStartTime: new Date(), - agendaEndTime: new Date(), - agendaCurrentTeam: 8, - agendaLocation: 'seoul', - teamKey: 'team1', - isOfficial: false, - agendaMaxPeople: 100, - teamName: 'team Name', - teamMates: [ - { - intraId: 'intraId1', - coalition: 'GUN', - }, - { - intraId: 'intraId2', - coalition: 'GON', - }, - { - intraId: 'intraId3', - coalition: 'LEE', - }, - ], - }, - ]; - - return ( - <> -
-
- -
- {profileData && ( - - )} - {currentTeamData && } - {agendaHistory && } -
- - ); -} +export default Index; From 1fb9f183cc8a9bdac9f283e5aa61919b3d293b2a Mon Sep 17 00:00:00 2001 From: siwolee Date: Tue, 20 Aug 2024 12:09:51 +0900 Subject: [PATCH 10/21] =?UTF-8?q?feat:=20=EC=BB=B4=ED=8F=AC=EB=84=8C?= =?UTF-8?q?=ED=8A=B8=20ui=20=EB=B0=8F=20=ED=8B=B0=EC=BC=93=EB=B0=9C?= =?UTF-8?q?=EA=B8=89=20api=20=EC=97=B0=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/agenda/Ticket/Ticket.tsx | 58 ++++++++++++++++++++---- pages/agenda/profile/[intraId]/index.tsx | 2 + 2 files changed, 51 insertions(+), 9 deletions(-) diff --git a/components/agenda/Ticket/Ticket.tsx b/components/agenda/Ticket/Ticket.tsx index 9b74efbd8..24b00ad30 100644 --- a/components/agenda/Ticket/Ticket.tsx +++ b/components/agenda/Ticket/Ticket.tsx @@ -1,3 +1,6 @@ +import Link from 'next/link'; +import { useRef } from 'react'; +import { instanceInAgenda } from 'utils/axios'; import useFetchGet from 'hooks/agenda/useFetchGet'; import styles from 'styles/agenda/Ticket/Ticket.module.scss'; interface TicketProps { @@ -6,6 +9,7 @@ interface TicketProps { const Ticket = ({ type }: { type: string }) => { const { data } = useFetchGet('/ticket'); + let status = localStorage.getItem('ticket-issue-status') || false; return type === 'page' ? (

내 티켓

@@ -28,18 +32,54 @@ const Ticket = ({ type }: { type: string }) => {

현재 페이지로 돌아와 발급완료 누르기

- + {status ? ( + + ) : ( + + )}
) : ( - <> +
+

내 티켓

+
+ + + +
+
+

{data && data.ticketCount}

+
+

+
+
+
); }; diff --git a/pages/agenda/profile/[intraId]/index.tsx b/pages/agenda/profile/[intraId]/index.tsx index a6bfa28ee..f5aaa6abf 100644 --- a/pages/agenda/profile/[intraId]/index.tsx +++ b/pages/agenda/profile/[intraId]/index.tsx @@ -5,6 +5,7 @@ import AgendaHistory from 'components/agenda/Profile/AgendaHistory'; import AgendaUserSearchBar from 'components/agenda/Profile/AgendaUserSearchBar'; import CurrentTeam from 'components/agenda/Profile/CurrentTeam'; import ProfileCard from 'components/agenda/Profile/ProfileCard'; +import Ticket from 'components/agenda/Ticket/Ticket'; import useFetchGet from 'hooks/agenda/useFetchGet'; import styles from 'styles/agenda/Profile/AgendaProfile.module.scss'; @@ -89,6 +90,7 @@ export default function AgendaProfile() { getProfileData={getProfileData} /> )} + {currentTeamData && } {agendaHistory && }
From 95f02e8b0610133e93c18bbf0d32efc3a1f809f4 Mon Sep 17 00:00:00 2001 From: siwolee Date: Tue, 20 Aug 2024 13:54:17 +0900 Subject: [PATCH 11/21] =?UTF-8?q?feat:=20=ED=8B=B0=EC=BC=93=20=ED=9E=88?= =?UTF-8?q?=EC=8A=A4=ED=86=A0=EB=A6=AC=20=EC=A1=B0=ED=9A=8C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/agenda/Ticket/Ticket.tsx | 20 +++++-- components/agenda/Ticket/TicketHistory.tsx | 67 ++++++++++++++++++++++ pages/agenda/ticket.tsx | 14 ----- pages/agenda/ticket/history.tsx | 23 ++++++++ pages/agenda/ticket/index.tsx | 7 +++ 5 files changed, 111 insertions(+), 20 deletions(-) create mode 100644 components/agenda/Ticket/TicketHistory.tsx delete mode 100644 pages/agenda/ticket.tsx create mode 100644 pages/agenda/ticket/history.tsx create mode 100644 pages/agenda/ticket/index.tsx diff --git a/components/agenda/Ticket/Ticket.tsx b/components/agenda/Ticket/Ticket.tsx index 24b00ad30..59819e4d4 100644 --- a/components/agenda/Ticket/Ticket.tsx +++ b/components/agenda/Ticket/Ticket.tsx @@ -1,5 +1,4 @@ import Link from 'next/link'; -import { useRef } from 'react'; import { instanceInAgenda } from 'utils/axios'; import useFetchGet from 'hooks/agenda/useFetchGet'; import styles from 'styles/agenda/Ticket/Ticket.module.scss'; @@ -49,18 +48,27 @@ const Ticket = ({ type }: { type: string }) => { )} - + ) : (
diff --git a/components/agenda/Ticket/TicketHistory.tsx b/components/agenda/Ticket/TicketHistory.tsx new file mode 100644 index 000000000..a8c88fbb3 --- /dev/null +++ b/components/agenda/Ticket/TicketHistory.tsx @@ -0,0 +1,67 @@ +import { + TableCell, + TableRow, + Table, + TableHead, + TableBody, +} from '@mui/material'; +import styles from 'styles/agenda/Ticket/Ticket.module.scss'; + +interface TicketHistoryProps { + createdAt: string; // 발급 시작한 시 + issuedFrom: string; // Agenda 이름 or 42Intra + issuedFromKey: string | null; // AgendaKey UUID or null + usedTo: string; // Agenda 이름 or NotUsed or NotApporve + usedToKey: string | null; // AgendaKey UUID or null + approved: boolean; // true 발급완료, false 발급대기 + approvedAt: string | null; // 발급된 시간 or null + isUsed: boolean; // true 사용된 티켓, false 사용하지 않음 + usedAt: string | null; // +} + +const TicketHistory = ({ data }: { data: TicketHistoryProps[] | null }) => { + console.log(data); + return ( +
+

티켓 발급 내역

+ + + + idx + 발급요청일 + 승인여부 + 승인일 + 사용여부 + 사용처 + + + + {data && + data.map((d, index) => { + return ( + + + {index} + + {d.createdAt} + + {d.approved ? '✔︎' : '✕'} + + {d.approvedAt} + {d.isUsed ? '✔︎' : '✕'} + + {d.usedAt ? d.usedAt : ''} + + + ); + })} + +
+
+ ); +}; + +export default TicketHistory; diff --git a/pages/agenda/ticket.tsx b/pages/agenda/ticket.tsx deleted file mode 100644 index 66056d310..000000000 --- a/pages/agenda/ticket.tsx +++ /dev/null @@ -1,14 +0,0 @@ -import Ticket from 'components/agenda/Ticket/Ticket'; -interface TicketProps { - ticketCount: number; -} - -const ticket = () => { - return ( -
- -
- ); -}; - -export default ticket; diff --git a/pages/agenda/ticket/history.tsx b/pages/agenda/ticket/history.tsx new file mode 100644 index 000000000..dad8bcb45 --- /dev/null +++ b/pages/agenda/ticket/history.tsx @@ -0,0 +1,23 @@ +import TicketHistory from 'components/agenda/Ticket/TicketHistory'; +import useFetchGet from 'hooks/agenda/useFetchGet'; + +interface TicketHistoryProps { + createdAt: string; // 발급 시작한 시 + issuedFrom: string; // Agenda 이름 or 42Intra + issuedFromKey: string | null; // AgendaKey UUID or null + usedTo: string; // Agenda 이름 or NotUsed or NotApporve + usedToKey: string | null; // AgendaKey UUID or null + approved: boolean; // true 발급완료, false 발급대기 + approvedAt: string | null; // 발급된 시간 or null + isUsed: boolean; // true 사용된 티켓, false 사용하지 않음 + usedAt: string | null; // +} + +const TicketHistoryPage = () => { + const history = useFetchGet( + '/ticket/history?page=1&size=20' + ); + return ; +}; + +export default TicketHistoryPage; diff --git a/pages/agenda/ticket/index.tsx b/pages/agenda/ticket/index.tsx new file mode 100644 index 000000000..29e8baf52 --- /dev/null +++ b/pages/agenda/ticket/index.tsx @@ -0,0 +1,7 @@ +import Ticket from 'components/agenda/Ticket/Ticket'; + +const ticket = () => { + return ; +}; + +export default ticket; From 9632c9e687b8138161538bef0c19fcc03c15f8dd Mon Sep 17 00:00:00 2001 From: siwolee Date: Tue, 20 Aug 2024 14:29:41 +0900 Subject: [PATCH 12/21] =?UTF-8?q?feat:=20=EB=A9=94=EC=9D=B8=20=EB=A6=AC?= =?UTF-8?q?=EC=8A=A4=ED=8A=B8=20=ED=8B=B0=EC=BC=93=ED=99=95=EC=9D=B8=20?= =?UTF-8?q?=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/agenda/Home/AgendaTitle.tsx | 46 +++++++++++++++------- styles/agenda/Home/AgendaTitle.module.scss | 9 ++++- 2 files changed, 39 insertions(+), 16 deletions(-) diff --git a/components/agenda/Home/AgendaTitle.tsx b/components/agenda/Home/AgendaTitle.tsx index 3f196bd29..09bdc6b9b 100644 --- a/components/agenda/Home/AgendaTitle.tsx +++ b/components/agenda/Home/AgendaTitle.tsx @@ -5,21 +5,37 @@ import styles from 'styles/agenda/Home/AgendaTitle.module.scss'; const AgendaTitle = () => { return (
-
AGENDA
- - - +
AGENDA
+
+ + + + + + +
); }; diff --git a/styles/agenda/Home/AgendaTitle.module.scss b/styles/agenda/Home/AgendaTitle.module.scss index 01f51a71f..6d4d8b985 100644 --- a/styles/agenda/Home/AgendaTitle.module.scss +++ b/styles/agenda/Home/AgendaTitle.module.scss @@ -3,11 +3,18 @@ .agendaTitleContainer { display: flex; justify-content: space-between; - align-items: center; + align-items: flex-start; width: 100%; padding: 0 1rem; @include text(main-menu); + .agendaTitleButtonContainer { + display: flex; + flex-direction: column; + gap: 1rem; + align-items: flex-end; + } + .agendaCreateBtn { display: flex; cursor: pointer; From 06fcba35fd6a183f06b48d31dc9eccc67cd89888 Mon Sep 17 00:00:00 2001 From: siwolee Date: Tue, 20 Aug 2024 14:32:46 +0900 Subject: [PATCH 13/21] =?UTF-8?q?style:=20=EB=A7=88=EC=9D=B4=EC=95=84?= =?UTF-8?q?=EC=A0=A0=EB=8B=A4=20=EC=9A=B0=EC=A0=95=EB=A0=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- styles/agenda/Home/MyAgendaBtn.module.scss | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/styles/agenda/Home/MyAgendaBtn.module.scss b/styles/agenda/Home/MyAgendaBtn.module.scss index cc089aa7e..f155729d8 100644 --- a/styles/agenda/Home/MyAgendaBtn.module.scss +++ b/styles/agenda/Home/MyAgendaBtn.module.scss @@ -2,6 +2,7 @@ .myAgendaContainer { display: flex; + align-self: flex-end; width: 12.5rem; height: 3rem; flex-direction: column; @@ -9,9 +10,9 @@ overflow: hidden; background-color: var(--box-bg-2); border: var(--default-border); - border-left-style: none; - border-top-right-radius: $radius-big; - border-bottom-right-radius: $radius-big; + border-right-style: none; + border-top-left-radius: $radius-big; + border-bottom-left-radius: $radius-big; box-shadow: var(--default-box-shadow); transition: width 0.15s ease, height 0.15s ease; gap: 1rem; From 3e28f364fb6300da48a1c3f74af976cc6a198d69 Mon Sep 17 00:00:00 2001 From: siwolee Date: Tue, 20 Aug 2024 14:37:55 +0900 Subject: [PATCH 14/21] =?UTF-8?q?feat:=20=ED=8B=B0=EC=BC=93=EB=82=B4?= =?UTF-8?q?=EC=97=AD=20=EB=B0=94=EB=A1=9C=EA=B0=80=EA=B8=B0=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/agenda/Ticket/Ticket.tsx | 13 +++---------- 1 file changed, 3 insertions(+), 10 deletions(-) diff --git a/components/agenda/Ticket/Ticket.tsx b/components/agenda/Ticket/Ticket.tsx index 59819e4d4..bacf92cfb 100644 --- a/components/agenda/Ticket/Ticket.tsx +++ b/components/agenda/Ticket/Ticket.tsx @@ -59,16 +59,9 @@ const Ticket = ({ type }: { type: string }) => { 발급 시작 )} - + + +
) : (
From 3cb5f61406b471941df893869095173f02a4918b Mon Sep 17 00:00:00 2001 From: siwolee Date: Tue, 20 Aug 2024 15:00:27 +0900 Subject: [PATCH 15/21] =?UTF-8?q?style:=20=EB=84=98=EA=B8=B0=EB=8A=94=20?= =?UTF-8?q?=EB=AA=A8=EC=96=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/agenda/utils/PageController.tsx | 12 +++-- .../agenda/utils/PageController.module.scss | 44 ++++++++++++++----- 2 files changed, 40 insertions(+), 16 deletions(-) diff --git a/components/agenda/utils/PageController.tsx b/components/agenda/utils/PageController.tsx index fd35af6f7..7781ef360 100644 --- a/components/agenda/utils/PageController.tsx +++ b/components/agenda/utils/PageController.tsx @@ -71,13 +71,17 @@ const PageController = ({ } > Date: Tue, 20 Aug 2024 15:18:37 +0900 Subject: [PATCH 16/21] =?UTF-8?q?feat:=20=EC=BA=90=EB=9F=AC=EC=85=80=20?= =?UTF-8?q?=EC=9E=90=EB=8F=99=EC=A0=84=ED=99=98=20=EB=B0=8F=20=EC=A4=91?= =?UTF-8?q?=EB=B3=B5=ED=81=B4=EB=A6=AD=20=EB=B0=A9=EC=A7=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/agenda/utils/PageController.tsx | 32 +++++++++++++++---- .../agenda/utils/PageController.module.scss | 1 + 2 files changed, 26 insertions(+), 7 deletions(-) diff --git a/components/agenda/utils/PageController.tsx b/components/agenda/utils/PageController.tsx index 7781ef360..bceca8f22 100644 --- a/components/agenda/utils/PageController.tsx +++ b/components/agenda/utils/PageController.tsx @@ -59,26 +59,44 @@ const PageController = ({ setData(data); }); }, []); + useEffect(() => { + const interval = setInterval(moveNext, 2000); + return () => clearInterval(interval); + }); + + function moveNext() { + setCurrent(current + 1 < max ? current + 1 : 0); + } + function movePrev() { + setCurrent(current - 1 >= 0 ? current - 1 : max - 1); + } return (
diff --git a/styles/agenda/utils/PageController.module.scss b/styles/agenda/utils/PageController.module.scss index 965b0ef5d..8827076fc 100644 --- a/styles/agenda/utils/PageController.module.scss +++ b/styles/agenda/utils/PageController.module.scss @@ -8,6 +8,7 @@ .agendaInfoContainer { @include container(1); position: relative; + z-index: 0; display: flex; min-width: 352px; max-width: 750px; From a5e5c8d2e1dcb99aa648d3220bd0a8147fe95dce Mon Sep 17 00:00:00 2001 From: siwolee Date: Tue, 20 Aug 2024 18:55:10 +0900 Subject: [PATCH 17/21] fix: conflict --- stories/agenda/agendaDetail/AgendaInfo.stories.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/stories/agenda/agendaDetail/AgendaInfo.stories.tsx b/stories/agenda/agendaDetail/AgendaInfo.stories.tsx index b210f36ec..be5d2778f 100644 --- a/stories/agenda/agendaDetail/AgendaInfo.stories.tsx +++ b/stories/agenda/agendaDetail/AgendaInfo.stories.tsx @@ -11,7 +11,7 @@ import AgendaInfo from 'components/agenda/agendaDetail/AgendaInfo'; const baseMockData = { agendaTitle: '아 기다리고 기다리던 대회', agendaHost: 'iamgroot', - agendaStatus: AgendaStatus.ON_GOING, + agendaStatus: AgendaStatus.OPEN, agendaDeadLine: new Date('2024-07-20'), agendaStartTime: new Date('2024-07-25'), agendaEndTime: new Date('2024-07-30'), From ec35ee3142d6fda0fab3ea72acb6a5079cbe17fe Mon Sep 17 00:00:00 2001 From: siwolee Date: Wed, 21 Aug 2024 17:15:02 +0900 Subject: [PATCH 18/21] =?UTF-8?q?fix:=20=ED=8E=98=EC=9D=B4=EC=A7=80?= =?UTF-8?q?=EB=84=A4=EC=9D=B4=EC=85=98=EC=9C=BC=EB=A1=9C=20=EB=B0=94?= =?UTF-8?q?=EB=80=8C=EC=96=B4=EC=84=9C=20=ED=8C=8C=EC=8B=B1=20=ED=84=B0?= =?UTF-8?q?=EC=A7=84=20=EB=B6=80=EB=B6=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/agenda/Ticket/TicketHistory.tsx | 14 +--------- pages/agenda/ticket/history.tsx | 31 ++++++++++++---------- types/aganda/ticketTypes.ts | 16 +++++++++++ 3 files changed, 34 insertions(+), 27 deletions(-) diff --git a/components/agenda/Ticket/TicketHistory.tsx b/components/agenda/Ticket/TicketHistory.tsx index a8c88fbb3..bb05f125c 100644 --- a/components/agenda/Ticket/TicketHistory.tsx +++ b/components/agenda/Ticket/TicketHistory.tsx @@ -5,22 +5,10 @@ import { TableHead, TableBody, } from '@mui/material'; +import { TicketHistoryProps } from 'types/aganda/ticketTypes'; import styles from 'styles/agenda/Ticket/Ticket.module.scss'; -interface TicketHistoryProps { - createdAt: string; // 발급 시작한 시 - issuedFrom: string; // Agenda 이름 or 42Intra - issuedFromKey: string | null; // AgendaKey UUID or null - usedTo: string; // Agenda 이름 or NotUsed or NotApporve - usedToKey: string | null; // AgendaKey UUID or null - approved: boolean; // true 발급완료, false 발급대기 - approvedAt: string | null; // 발급된 시간 or null - isUsed: boolean; // true 사용된 티켓, false 사용하지 않음 - usedAt: string | null; // -} - const TicketHistory = ({ data }: { data: TicketHistoryProps[] | null }) => { - console.log(data); return (

티켓 발급 내역

diff --git a/pages/agenda/ticket/history.tsx b/pages/agenda/ticket/history.tsx index dad8bcb45..76c4c5b14 100644 --- a/pages/agenda/ticket/history.tsx +++ b/pages/agenda/ticket/history.tsx @@ -1,23 +1,26 @@ +import { TicketHistoryAPIProps } from 'types/aganda/ticketTypes'; import TicketHistory from 'components/agenda/Ticket/TicketHistory'; +import PageNation from 'components/Pagination'; import useFetchGet from 'hooks/agenda/useFetchGet'; -interface TicketHistoryProps { - createdAt: string; // 발급 시작한 시 - issuedFrom: string; // Agenda 이름 or 42Intra - issuedFromKey: string | null; // AgendaKey UUID or null - usedTo: string; // Agenda 이름 or NotUsed or NotApporve - usedToKey: string | null; // AgendaKey UUID or null - approved: boolean; // true 발급완료, false 발급대기 - approvedAt: string | null; // 발급된 시간 or null - isUsed: boolean; // true 사용된 티켓, false 사용하지 않음 - usedAt: string | null; // -} - const TicketHistoryPage = () => { - const history = useFetchGet( + const history = useFetchGet( '/ticket/history?page=1&size=20' ); - return ; + if (!history.data) history.data = { totalSize: 0, content: [] }; + + return ( +
+ + { + console.log(pageNumber); + }} + /> +
+ ); }; export default TicketHistoryPage; diff --git a/types/aganda/ticketTypes.ts b/types/aganda/ticketTypes.ts index c74dcdabc..660bc6282 100644 --- a/types/aganda/ticketTypes.ts +++ b/types/aganda/ticketTypes.ts @@ -1 +1,17 @@ // ticketType : +export interface TicketHistoryAPIProps { + totalSize: number; + content: TicketHistoryProps[] | null; +} + +export interface TicketHistoryProps { + createdAt: string; // 발급 시작한 시 + issuedFrom: string; // Agenda 이름 or 42Intra + issuedFromKey: string | null; // AgendaKey UUID or null + usedTo: string; // Agenda 이름 or NotUsed or NotApporve + usedToKey: string | null; // AgendaKey UUID or null + approved: boolean; // true 발급완료, false 발급대기 + approvedAt: string | null; // 발급된 시간 or null + isUsed: boolean; // true 사용된 티켓, false 사용하지 않음 + usedAt: string | null; //} +} From a879d071d00ba81dd4bcc1dc9502110b740c112c Mon Sep 17 00:00:00 2001 From: siwolee Date: Wed, 21 Aug 2024 19:50:50 +0900 Subject: [PATCH 19/21] feat: usePageNation --- components/agenda/Ticket/TicketHistory.tsx | 2 +- hooks/agenda/usePageNation.ts | 51 ++++++++++++++++++++++ pages/agenda/ticket/history.tsx | 25 ++++++----- types/aganda/ticketTypes.ts | 2 + 4 files changed, 67 insertions(+), 13 deletions(-) create mode 100644 hooks/agenda/usePageNation.ts diff --git a/components/agenda/Ticket/TicketHistory.tsx b/components/agenda/Ticket/TicketHistory.tsx index bb05f125c..45664803f 100644 --- a/components/agenda/Ticket/TicketHistory.tsx +++ b/components/agenda/Ticket/TicketHistory.tsx @@ -32,7 +32,7 @@ const TicketHistory = ({ data }: { data: TicketHistoryProps[] | null }) => { sx={{ '&:last-child td, &:last-child th': { border: 0 } }} > - {index} + {d.idx} {d.createdAt} diff --git a/hooks/agenda/usePageNation.ts b/hooks/agenda/usePageNation.ts new file mode 100644 index 000000000..10dfa09e4 --- /dev/null +++ b/hooks/agenda/usePageNation.ts @@ -0,0 +1,51 @@ +import { useEffect, useRef, useState } from 'react'; +import { instanceInAgenda } from 'utils/axios'; + +const usePageNation = ({ + url, + size, + useIdx, +}: { + url: string; + size?: number; // 페이지 사이즈 + useIdx?: boolean; // 인덱싱 추가 여부 : 해당 데이터 타입에 idx?: number; 추가 필요 +}) => { + if (!size) size = 20; + const getData = async (page: number) => { + const res = await instanceInAgenda.get(`${url}?page=${page}&size=${size}`); + res.data.totalSize ? res.data.totalSize : 0; + res.data.content ? res.data.content : []; + if (useIdx) { + res.data.content = res.data.content.map((c: T, idx: number) => { + const temp = c as T & { idx: number }; + temp.idx = idx + 1 + size * (page - 1); + return temp; + }); + } + return res.data as { totalSize: number; content: T[] }; + }; + // const data = getData(0); + const [currentPage, setCurrentPage] = useState(1); + const [content, setContent] = useState(null); + const totalPages = useRef(1); + + const pageChangeHandler = async (pageNumber: number) => { + if (pageNumber < 1 || pageNumber > totalPages.current) return; + await getData(pageNumber).then((res) => { + setCurrentPage(pageNumber); + setContent(res.content); + }); + }; + + useEffect(() => { + const fetchData = async () => { + const data = await getData(currentPage); + totalPages.current = Math.ceil(data.totalSize / size); + setContent(data.content); + }; + fetchData(); + }); + return { currentPage, totalPages, pageChangeHandler, content }; +}; + +export default usePageNation; diff --git a/pages/agenda/ticket/history.tsx b/pages/agenda/ticket/history.tsx index 76c4c5b14..1dbdaad74 100644 --- a/pages/agenda/ticket/history.tsx +++ b/pages/agenda/ticket/history.tsx @@ -1,23 +1,24 @@ -import { TicketHistoryAPIProps } from 'types/aganda/ticketTypes'; +import { TicketHistoryProps } from 'types/aganda/ticketTypes'; import TicketHistory from 'components/agenda/Ticket/TicketHistory'; import PageNation from 'components/Pagination'; -import useFetchGet from 'hooks/agenda/useFetchGet'; +import usePageNation from 'hooks/agenda/usePageNation'; const TicketHistoryPage = () => { - const history = useFetchGet( - '/ticket/history?page=1&size=20' - ); - if (!history.data) history.data = { totalSize: 0, content: [] }; + const size = 5; + const res = usePageNation({ + url: '/ticket/history', + size: size, + useIdx: true, + }); + const { currentPage, totalPages, pageChangeHandler, content } = res; return (
- + { - console.log(pageNumber); - }} + curPage={currentPage} + totalPages={totalPages.current} + pageChangeHandler={pageChangeHandler} />
); diff --git a/types/aganda/ticketTypes.ts b/types/aganda/ticketTypes.ts index 660bc6282..f2508befe 100644 --- a/types/aganda/ticketTypes.ts +++ b/types/aganda/ticketTypes.ts @@ -14,4 +14,6 @@ export interface TicketHistoryProps { approvedAt: string | null; // 발급된 시간 or null isUsed: boolean; // true 사용된 티켓, false 사용하지 않음 usedAt: string | null; //} + + idx?: number; } From eb494cc3d9051043a02c49f3bf4e015b221108b2 Mon Sep 17 00:00:00 2001 From: siwolee Date: Wed, 21 Aug 2024 20:01:10 +0900 Subject: [PATCH 20/21] =?UTF-8?q?feat:=20=EC=BD=94=EB=93=9C=20=EB=8B=A8?= =?UTF-8?q?=EC=88=9C=ED=99=94?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- hooks/agenda/usePageNation.ts | 9 ++++++++- pages/agenda/ticket/history.tsx | 19 ++++++++----------- 2 files changed, 16 insertions(+), 12 deletions(-) diff --git a/hooks/agenda/usePageNation.ts b/hooks/agenda/usePageNation.ts index 10dfa09e4..b8fea902c 100644 --- a/hooks/agenda/usePageNation.ts +++ b/hooks/agenda/usePageNation.ts @@ -45,7 +45,14 @@ const usePageNation = ({ }; fetchData(); }); - return { currentPage, totalPages, pageChangeHandler, content }; + + const PagaNationElementProps = { + curPage: currentPage, + totalPages: totalPages.current, + pageChangeHandler: pageChangeHandler, + }; + + return { content, PagaNationElementProps }; }; export default usePageNation; diff --git a/pages/agenda/ticket/history.tsx b/pages/agenda/ticket/history.tsx index 1dbdaad74..1e32e34ad 100644 --- a/pages/agenda/ticket/history.tsx +++ b/pages/agenda/ticket/history.tsx @@ -5,21 +5,18 @@ import usePageNation from 'hooks/agenda/usePageNation'; const TicketHistoryPage = () => { const size = 5; - const res = usePageNation({ - url: '/ticket/history', - size: size, - useIdx: true, - }); + const { PagaNationElementProps, content } = usePageNation( + { + url: '/ticket/history', + size: size, + useIdx: true, + } + ); - const { currentPage, totalPages, pageChangeHandler, content } = res; return (
- +
); }; From 3f8376cb26fa377568f1c75d9db536989675db68 Mon Sep 17 00:00:00 2001 From: siwolee Date: Wed, 21 Aug 2024 20:23:40 +0900 Subject: [PATCH 21/21] =?UTF-8?q?feat:=20=ED=8B=B0=EC=BC=93=20=EB=B0=9C?= =?UTF-8?q?=EA=B8=89=EC=A4=91=EC=9D=B8=EC=A7=80=20=ED=99=95=EC=9D=B8?= =?UTF-8?q?=ED=95=98=EB=8A=94=20=EB=A1=9C=EC=A7=81=20api=EC=97=90=EC=84=9C?= =?UTF-8?q?=20=EB=B0=9B=EC=95=84=EC=98=A4=EB=8A=94=20=EA=B2=83=EC=9C=BC?= =?UTF-8?q?=EB=A1=9C=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/agenda/Ticket/Ticket.tsx | 8 ++------ 1 file changed, 2 insertions(+), 6 deletions(-) diff --git a/components/agenda/Ticket/Ticket.tsx b/components/agenda/Ticket/Ticket.tsx index bacf92cfb..a55a0cfc7 100644 --- a/components/agenda/Ticket/Ticket.tsx +++ b/components/agenda/Ticket/Ticket.tsx @@ -4,11 +4,11 @@ import useFetchGet from 'hooks/agenda/useFetchGet'; import styles from 'styles/agenda/Ticket/Ticket.module.scss'; interface TicketProps { ticketCount: number; + setupTicket: boolean; } const Ticket = ({ type }: { type: string }) => { const { data } = useFetchGet('/ticket'); - let status = localStorage.getItem('ticket-issue-status') || false; return type === 'page' ? (

내 티켓

@@ -31,14 +31,12 @@ const Ticket = ({ type }: { type: string }) => {

현재 페이지로 돌아와 발급완료 누르기

- {status ? ( + {data && data.setupTicket ? (