From d538174fde47abd0757339759aa80e8497c5fdae Mon Sep 17 00:00:00 2001 From: PHJoon Date: Mon, 14 Aug 2023 11:02:11 +0900 Subject: [PATCH 1/7] =?UTF-8?q?[Fix]=20[GGFE-177]=20item=20=ED=83=80?= =?UTF-8?q?=EC=9E=85=20=EC=9D=B4=EB=A6=84=20=EB=B3=80=EA=B2=BD=EC=97=90=20?= =?UTF-8?q?=EB=94=B0=EB=A5=B8=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/admin/store/ItemList.tsx | 6 +-- components/admin/store/itemHistory.tsx | 6 +-- components/modal/admin/AdminEditItem.tsx | 5 +- constants/admin/table.ts | 4 +- .../api/pingpong/admin/items/history/index.ts | 10 ++-- pages/api/pingpong/items/store.ts | 51 ++++--------------- types/admin/adminStoreTypes.ts | 2 +- types/itemTypes.ts | 2 +- 8 files changed, 27 insertions(+), 59 deletions(-) diff --git a/components/admin/store/ItemList.tsx b/components/admin/store/ItemList.tsx index b5a994630..a634120d8 100644 --- a/components/admin/store/ItemList.tsx +++ b/components/admin/store/ItemList.tsx @@ -19,7 +19,7 @@ import { toastState } from 'utils/recoil/toast'; const itemListTableTitle: { [key: string]: string } = { itemId: 'ID', - name: '아이템명', + itemName: '아이템명', content: '설명', itemType: '타입', imageUri: '이미지', @@ -32,7 +32,7 @@ const itemListTableTitle: { [key: string]: string } = { const tableColumnName = [ 'itemId', - 'name', + 'itemName', 'content', 'itemType', 'imageUri', @@ -84,7 +84,7 @@ function ItemList() { const openDetailModal = (item: Item) => { setModal({ modalName: 'ADMIN-DETAIL_CONTENT', - detailTitle: item.name, + detailTitle: item.itemName, detailContent: item.content, }); }; diff --git a/components/admin/store/itemHistory.tsx b/components/admin/store/itemHistory.tsx index 97930448d..a4671f936 100644 --- a/components/admin/store/itemHistory.tsx +++ b/components/admin/store/itemHistory.tsx @@ -22,7 +22,7 @@ import { modalState } from 'utils/recoil/modal'; const itemHistoryTableTitle: { [key: string]: string } = { itemId: 'ID', createdAt: '변경일', - name: '이름', + itemName: '이름', content: '설명', imageUri: '이미지', price: '원가', @@ -35,7 +35,7 @@ const itemHistoryTableTitle: { [key: string]: string } = { const tableColumnName = [ 'itemId', 'createdAt', - 'name', + 'itemName', 'content', 'imageUri', 'price', @@ -91,7 +91,7 @@ function ItemHistory() { const openDetailModal = (itemHistory: IitemHistory) => { setModal({ modalName: 'ADMIN-DETAIL_CONTENT', - detailTitle: itemHistory.name, + detailTitle: itemHistory.itemName, detailContent: itemHistory.content, }); }; diff --git a/components/modal/admin/AdminEditItem.tsx b/components/modal/admin/AdminEditItem.tsx index 39ee841c4..17582a107 100644 --- a/components/modal/admin/AdminEditItem.tsx +++ b/components/modal/admin/AdminEditItem.tsx @@ -9,7 +9,8 @@ import { userState } from 'utils/recoil/layout'; import { Item } from 'types/itemTypes'; export default function AdminEditItemModal(props: Item) { - const { itemId, name, content, imageUri, originalPrice, discount } = props; + const { itemId, itemName, content, imageUri, originalPrice, discount } = + props; const creator = useRecoilValue(userState).intraId; const setModal = useSetRecoilState(modalState); const setSnackBar = useSetRecoilState(toastState); @@ -103,7 +104,7 @@ export default function AdminEditItemModal(props: Item) { className={styles.nameBlank} type='text' name='name' - defaultValue={name} + defaultValue={itemName} required /> diff --git a/constants/admin/table.ts b/constants/admin/table.ts index beb813f91..c16721199 100644 --- a/constants/admin/table.ts +++ b/constants/admin/table.ts @@ -96,7 +96,7 @@ export const tableFormat: TableFormat = { name: '상점 아이템 목록', columns: [ 'itemId', - 'name', + 'itemName', 'content', 'itemType', 'imageUri', @@ -110,7 +110,7 @@ export const tableFormat: TableFormat = { columns: [ 'itemId', 'createdAt', - 'name', + 'itemName', 'content', 'imageUri', 'price', diff --git a/pages/api/pingpong/admin/items/history/index.ts b/pages/api/pingpong/admin/items/history/index.ts index 5786ebdc5..096ad049a 100644 --- a/pages/api/pingpong/admin/items/history/index.ts +++ b/pages/api/pingpong/admin/items/history/index.ts @@ -9,7 +9,7 @@ interface IitemHistoryRes { const itemHistory1: IitemHistory = { itemId: 1, createdAt: new Date('2023-08-05 20:10:10'), - name: '확성기', + itemName: '확성기', content: '설명입니다설명입니다설명입니다설명입니다설명입니다설명입니다설명입니다설명입니다설명입니다설명입니다설명입니다', imageUri: '/image/menu_manual.svg', @@ -23,7 +23,7 @@ const itemHistory1: IitemHistory = { const itemHistory2: IitemHistory = { itemId: 2, createdAt: new Date('2023-08-04 20:10:10'), - name: '프로필 변경권', + itemName: '프로필 변경권', content: '설명입니다', imageUri: '/image/menu_manual.svg', price: 50, @@ -36,7 +36,7 @@ const itemHistory2: IitemHistory = { const itemHistory3: IitemHistory = { itemId: 3, createdAt: new Date('2023-08-03 20:10:10'), - name: '프로필 배경 변경권', + itemName: '프로필 배경 변경권', content: '설명입니다설명입니다설명입니다설명입니다설명입니다설명입니다설명입니다설명입니다설명입니다설명입니다설명입니다설명입니다설명입니다', imageUri: '/image/menu_manual.svg', @@ -50,7 +50,7 @@ const itemHistory3: IitemHistory = { const itemHistory4: IitemHistory = { itemId: 4, createdAt: new Date('2023-08-02 20:10:10'), - name: '프로필 테두리 변경권', + itemName: '프로필 테두리 변경권', content: '설명입니다', imageUri: '/image/menu_manual.svg', price: 10, @@ -63,7 +63,7 @@ const itemHistory4: IitemHistory = { const itemHistory5: IitemHistory = { itemId: 5, createdAt: new Date('2023-08-01 20:10:10'), - name: '확성기', + itemName: '확성기', content: '설명입니다', imageUri: '/image/menu_manual.svg', price: 42, diff --git a/pages/api/pingpong/items/store.ts b/pages/api/pingpong/items/store.ts index d42ca8f1f..e1d4a7938 100644 --- a/pages/api/pingpong/items/store.ts +++ b/pages/api/pingpong/items/store.ts @@ -6,8 +6,9 @@ const itemList: Item[] = [ itemId: 1, itemName: '프로필 사진 변경권', content: '42gg의 프로필 사진을 변경할 수 있는 아이템', - imageUrl: '/image/fallBackSrc.jpeg', - price: 100, + itemType: 'PROF', + imageUri: '/image/fallBackSrc.jpeg', + originalPrice: 100, discount: 10, salePrice: 90, }, @@ -15,8 +16,9 @@ const itemList: Item[] = [ itemId: 2, itemName: '확성기', content: '확성기 설명', - imageUrl: '/image/fallBackSrc.jpeg', - price: 80, + itemType: 'MEGA', + imageUri: '/image/fallBackSrc.jpeg', + originalPrice: 80, discount: 0, salePrice: 80, }, @@ -24,8 +26,9 @@ const itemList: Item[] = [ itemId: 3, itemName: '아이템3', content: '아이템3 설명', - imageUrl: '/image/fallBackSrc.jpeg', - price: 300, + itemType: 'ITEM', + imageUri: '/image/fallBackSrc.jpeg', + originalPrice: 300, discount: 20, salePrice: 240, }, @@ -39,41 +42,5 @@ export default function handler( req: NextApiRequest, res: NextApiResponse ) { - const itemList: Item[] = [ - { - itemId: 1, - name: '프로필 사진 변경권', - content: '42gg의 프로필 사진을 변경할 수 있는 아이템', - itemType: 'PROF', - imageUri: '/image/fallBackSrc.jpeg', - originalPrice: 1000, - discount: 10, - salePrice: 900, - }, - { - itemId: 2, - name: '확성기', - content: '확성기 설명', - itemType: 'MEGA', - imageUri: '/image/fallBackSrc.jpeg', - originalPrice: 2000, - discount: 0, - salePrice: 2000, - }, - { - itemId: 3, - name: '아이템3', - content: '아이템3 설명', - itemType: 'ITEM', - imageUri: '/image/fallBackSrc.jpeg', - originalPrice: 3000, - discount: 30, - salePrice: 2100, - }, - ]; - - const itemListData: ItemList = { - itemList: itemList, - }; res.status(200).json(itemListData); } diff --git a/types/admin/adminStoreTypes.ts b/types/admin/adminStoreTypes.ts index 8106be6c5..4c438ae74 100644 --- a/types/admin/adminStoreTypes.ts +++ b/types/admin/adminStoreTypes.ts @@ -1,7 +1,7 @@ export interface IitemHistory { itemId: number; createdAt: Date; - name: string; + itemName: string; content: string; imageUri: string; price: number; diff --git a/types/itemTypes.ts b/types/itemTypes.ts index e95c142a8..f71309f93 100644 --- a/types/itemTypes.ts +++ b/types/itemTypes.ts @@ -1,6 +1,6 @@ export interface Item { itemId: number; - name: string; + itemName: string; content: string; itemType: string; imageUri: string; From f638c5d96bbfdfd9d086ab0f73c7814e08f72736 Mon Sep 17 00:00:00 2001 From: PHJoon Date: Mon, 14 Aug 2023 11:14:39 +0900 Subject: [PATCH 2/7] =?UTF-8?q?[Feat]=20[GGFE-177]=20=EA=B1=B0=EB=9E=98?= =?UTF-8?q?=EB=82=B4=EC=97=AD=20=EC=9C=A0=EC=A0=80=20=EA=B2=80=EC=83=89=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/admin/receipt/ReceiptList.tsx | 39 ++++++++++++++++++++++-- 1 file changed, 36 insertions(+), 3 deletions(-) diff --git a/components/admin/receipt/ReceiptList.tsx b/components/admin/receipt/ReceiptList.tsx index fa59abac6..1f6cb51bd 100644 --- a/components/admin/receipt/ReceiptList.tsx +++ b/components/admin/receipt/ReceiptList.tsx @@ -16,6 +16,7 @@ import styles from 'styles/admin/receipt/ReceiptList.module.scss'; import { useSetRecoilState } from 'recoil'; import { mockInstance } from 'utils/mockAxios'; import { toastState } from 'utils/recoil/toast'; +import AdminSearchBar from '../common/AdminSearchBar'; const receiptListTableTitle: { [key: string]: string } = { receiptId: 'ID', @@ -44,12 +45,41 @@ function ReceiptList() { currentPage: 0, }); const [currentPage, setCurrentPage] = useState(1); + const [intraId, setIntraId] = useState(''); const setSnackBar = useSetRecoilState(toastState); // 특정 유저 확성기 사용내역만 가져오는 api 추가되면 handler 추가 + 유저 검색 컴포넌트 추가 + const initSeaerch = useCallback((intraId?: string) => { + setIntraId(intraId || ''); + setCurrentPage(1); + }, []); + + const getUserReceiptHandler = useCallback(async () => { + try { + const res = await mockInstance.get( + `/admin/receipt/?intraId=${intraId}page=${currentPage}&size=10` + ); + setIntraId(intraId); + setReceiptData({ + receiptList: res.data.receiptList.map((receipt: Ireceipt) => { + const { year, month, date, hour, min } = getFormattedDateToString( + new Date(receipt.createdAt) + ); + return { + ...receipt, + createdAt: `${year}-${month}-${date} ${hour}:${min}`, + }; + }), + totalPage: res.data.totalPage, + currentPage: currentPage, + }); + } catch (e) { + console.error('HJ00'); + } + }, [intraId, currentPage]); // instanceInManage로 변경 - const getReceiptHandler = useCallback(async () => { + const getAllReceiptHandler = useCallback(async () => { try { const res = await mockInstance.get( `/admin/receipt/?page=${currentPage}&size=10` @@ -78,11 +108,14 @@ function ReceiptList() { }, [currentPage]); useEffect(() => { - getReceiptHandler(); - }, [currentPage]); + intraId ? getUserReceiptHandler() : getAllReceiptHandler(); + }, [intraId, getUserReceiptHandler, getAllReceiptHandler, currentPage]); return ( <> +
+ +
From e59f470e4beb6ae4a475343f6c7a6d3532874e6d Mon Sep 17 00:00:00 2001 From: PHJoon Date: Mon, 14 Aug 2023 12:26:26 +0900 Subject: [PATCH 3/7] =?UTF-8?q?[Test]=20[GGFE-177]=20=ED=8A=B9=EC=A0=95=20?= =?UTF-8?q?=EC=9C=A0=EC=A0=80=20=EA=B1=B0=EB=9E=98=EB=82=B4=EC=97=AD=20?= =?UTF-8?q?=EC=A1=B0=ED=9A=8C=20mock=20api=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/admin/receipt/ReceiptList.tsx | 4 +- pages/api/pingpong/admin/receipt/index.ts | 293 ++++++++++++---------- 2 files changed, 158 insertions(+), 139 deletions(-) diff --git a/components/admin/receipt/ReceiptList.tsx b/components/admin/receipt/ReceiptList.tsx index 1f6cb51bd..eeb299463 100644 --- a/components/admin/receipt/ReceiptList.tsx +++ b/components/admin/receipt/ReceiptList.tsx @@ -57,7 +57,7 @@ function ReceiptList() { const getUserReceiptHandler = useCallback(async () => { try { const res = await mockInstance.get( - `/admin/receipt/?intraId=${intraId}page=${currentPage}&size=10` + `/admin/receipt/?intraId=${intraId}&page=${currentPage}&size=10` ); setIntraId(intraId); setReceiptData({ @@ -109,7 +109,7 @@ function ReceiptList() { useEffect(() => { intraId ? getUserReceiptHandler() : getAllReceiptHandler(); - }, [intraId, getUserReceiptHandler, getAllReceiptHandler, currentPage]); + }, [intraId, getUserReceiptHandler, getAllReceiptHandler]); return ( <> diff --git a/pages/api/pingpong/admin/receipt/index.ts b/pages/api/pingpong/admin/receipt/index.ts index 0748d1381..57a2f4be4 100644 --- a/pages/api/pingpong/admin/receipt/index.ts +++ b/pages/api/pingpong/admin/receipt/index.ts @@ -1,149 +1,168 @@ import { NextApiRequest, NextApiResponse } from 'next'; +import { Ireceipt } from 'types/admin/adminReceiptType'; -const testData1 = { - receiptList: [ - { - receiptId: 13, - createdAt: '2023-08-05 20:10:10', - itemName: '확성기', - itemPrice: 42, - purchaserIntra: 'admin', - ownerIntra: 'hyungjpa', - itemStatus: '사용 전', - }, - { - receiptId: 12, - createdAt: '2023-08-05 19:20:10', - itemName: '프로필 사진 변경권', - itemPrice: 21, - purchaserIntra: 'admin', - ownerIntra: 'hyungjpa', - itemStatus: '사용 완료', - }, - { - receiptId: 11, - createdAt: '2023-08-04 10:10:10', - itemName: '프로필 색상 변경권', - itemPrice: 10, - purchaserIntra: 'admin', - ownerIntra: 'hyungjpa', - itemStatus: '사용 완료', - }, - { - receiptId: 10, - createdAt: '2023-08-04 05:30:10', - itemName: '확성기', - itemPrice: 42, - purchaserIntra: 'admin', - ownerIntra: 'hyungjpa', - itemStatus: '사용 전', - }, - { - receiptId: 9, - createdAt: '2023-08-01 21:29:10', - itemName: '프로필 사진 변경권', - itemPrice: 21, - purchaserIntra: 'admin', - ownerIntra: 'hyungjpa', - itemStatus: '사용 완료', - }, - { - receiptId: 8, - createdAt: '2023-07-29 18:24:10', - itemName: '프로필 색상 변경권', - itemPrice: 10, - purchaserIntra: 'admin', - ownerIntra: 'hyungjpa', - itemStatus: '사용 완료', - }, - { - receiptId: 7, - createdAt: '2023-07-28 10:10:10', - itemName: '확성기', - itemPrice: 42, - purchaserIntra: 'admin', - ownerIntra: 'hyungjpa', - itemStatus: '사용 전', - }, - { - receiptId: 6, - createdAt: '2023-06-30 21:10:10', - itemName: '프로필 사진 변경권', - itemPrice: 21, - purchaserIntra: 'admin', - ownerIntra: 'hyungjpa', - itemStatus: '사용 완료', - }, - { - receiptId: 5, - createdAt: '2023-06-21 20:13:10', - itemName: '프로필 색상 변경권', - itemPrice: 10, - purchaserIntra: 'admin', - ownerIntra: 'hyungjpa', - itemStatus: '사용 완료', - }, - ], - totalPage: 2, +interface IreceiptRes { + receiptList: Array; + totalPage: number; +} + +const receipt1: Ireceipt = { + receiptId: 1, + createdAt: new Date('2023-08-05 20:10:10'), + itemName: '확성기', + itemPrice: 42, + purchaserIntra: 'hyungjpa', + ownerIntra: 'hyungjpa', + itemStatus: '사용 전', +}; + +const receipt2: Ireceipt = { + receiptId: 2, + createdAt: new Date('2023-08-05 19:20:10'), + itemName: '프로필 사진 변경권', + itemPrice: 21, + purchaserIntra: 'jeyoon', + ownerIntra: 'hyobicho', + itemStatus: '사용 완료', +}; + +const receipt3: Ireceipt = { + receiptId: 3, + createdAt: new Date('2023-08-04 10:10:10'), + itemName: '프로필 색상 변경권', + itemPrice: 10, + purchaserIntra: 'sangmipa', + ownerIntra: 'jeyoon', + itemStatus: '사용 완료', +}; + +const receipt4: Ireceipt = { + receiptId: 4, + createdAt: new Date('2023-08-04 05:30:10'), + itemName: '확성기', + itemPrice: 42, + purchaserIntra: 'hyobicho', + ownerIntra: 'sangmipa', + itemStatus: '사용 전', +}; + +const receipt5: Ireceipt = { + receiptId: 5, + createdAt: new Date('2023-08-01 21:29:10'), + itemName: '프로필 사진 변경권', + itemPrice: 21, + purchaserIntra: 'jeyoon', + ownerIntra: 'hyungjpa', + itemStatus: '사용 완료', +}; + +const receipt6: Ireceipt = { + receiptId: 6, + createdAt: new Date('2023-07-29 18:24:10'), + itemName: '프로필 색상 변경권', + itemPrice: 10, + purchaserIntra: 'hyungjpa', + ownerIntra: 'hyobicho', + itemStatus: '사용 완료', +}; + +const receipt7: Ireceipt = { + receiptId: 7, + createdAt: new Date('2023-07-28 10:10:10'), + itemName: '확성기', + itemPrice: 42, + purchaserIntra: 'hyobicho', + ownerIntra: 'jeyoon', + itemStatus: '사용 전', }; -const testData2 = { - receiptList: [ - { - receiptId: 4, - createdAt: '2023-04-05 10:10:10', - itemName: '확성기', - itemPrice: 42, - purchaserIntra: 'admin', - ownerIntra: 'hyungjpa', - itemStatus: '사용 전', - }, - { - receiptId: 3, - createdAt: '2023-03-05 10:10:10', - itemName: '프로필 사진 변경권', - itemPrice: 21, - purchaserIntra: 'admin', - ownerIntra: 'hyungjpa', - itemStatus: '사용 완료', - }, - { - receiptId: 2, - createdAt: '2023-02-05 10:10:10', - itemName: '프로필 색상 변경권', - itemPrice: 10, - purchaserIntra: 'admin', - ownerIntra: 'hyungjpa', - itemStatus: '사용 완료', - }, - { - receiptId: 1, - createdAt: '2023-01-05 10:10:10', - itemName: '확성기', - itemPrice: 42, - purchaserIntra: 'admin', - ownerIntra: 'hyungjpa', - itemStatus: '사용 전', - }, - { - receiptId: 0, - createdAt: '2023-01-03 10:10:10', - itemName: '확성기', - itemPrice: 42, - purchaserIntra: 'admin', - ownerIntra: 'hyungjpa', - itemStatus: '사용 전', - }, - ], - totalPage: 2, +const receipt8: Ireceipt = { + receiptId: 8, + createdAt: new Date('2023-06-30 21:10:10'), + itemName: '프로필 사진 변경권', + itemPrice: 21, + purchaserIntra: 'sangmipa', + ownerIntra: 'sangmipa', + itemStatus: '사용 완료', +}; + +const receipt9: Ireceipt = { + receiptId: 9, + createdAt: new Date('2023-06-21 20:13:10'), + itemName: '프로필 색상 변경권', + itemPrice: 10, + purchaserIntra: 'jeyoon', + ownerIntra: 'hyungjpa', + itemStatus: '사용 완료', +}; + +const receipt10: Ireceipt = { + receiptId: 10, + createdAt: new Date('2023-06-21 20:13:10'), + itemName: '프로필 색상 변경권', + itemPrice: 10, + purchaserIntra: 'sangmipa', + ownerIntra: 'hyungjpa', + itemStatus: '사용 완료', +}; + +const receiptList: Array = [ + receipt1, + receipt2, + receipt3, + receipt4, + receipt5, + receipt6, + receipt7, + receipt8, + receipt9, + receipt10, +]; + +const resEmpty: IreceiptRes = { + receiptList: [], + totalPage: 0, +}; + +const resOne: IreceiptRes = { + receiptList: receiptList.slice(0, 7), + totalPage: 1, +}; + +const resTwo: IreceiptRes = { + receiptList: receiptList, + totalPage: 3, }; export default function handler(req: NextApiRequest, res: NextApiResponse) { const { method, query } = req; - const { page } = query as { page: string }; + const { intraId, page } = query as { intraId: string; page: string }; + + // const temp: IreceiptRes = resEmpty; + // const temp: IreceiptRes = resOne; + const temp: IreceiptRes = resTwo; + + const resData: IreceiptRes = { + receiptList: [], + totalPage: temp.totalPage, + }; if (method === 'GET') { - if (page === '1') res.status(200).json(testData1); - else res.status(200).json(testData2); + if (intraId) { + resData.receiptList = temp.receiptList.filter( + (receipt: Ireceipt) => + receipt.ownerIntra === intraId || receipt.purchaserIntra === intraId + ); + } else { + if (page) { + if (parseInt(page) === resData.totalPage) { + resData.receiptList = temp.receiptList.slice(0, 4); + } else { + resData.receiptList = temp.receiptList; + } + } + } + + res.status(200).json(resData); } } From edcc4d4a8d3d29e035a3819cdfd8cccd011a605f Mon Sep 17 00:00:00 2001 From: PHJoon Date: Mon, 14 Aug 2023 13:13:45 +0900 Subject: [PATCH 4/7] =?UTF-8?q?[Feat]=20[GGFE-177]=20=ED=99=95=EC=84=B1?= =?UTF-8?q?=EA=B8=B0,=20=ED=94=84=EB=A1=9C=ED=95=84=20=EB=82=B4=EC=97=AD?= =?UTF-8?q?=20=EA=B2=80=EC=83=89=20=EA=B8=B0=EB=8A=A5=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/admin/receipt/MegaphoneList.tsx | 48 +++++++++++++++++-- components/admin/receipt/ProfileList.tsx | 48 +++++++++++++++++-- components/admin/receipt/ReceiptList.tsx | 15 ++++-- .../admin/receipt/MegaphoneList.module.scss | 9 ++++ styles/admin/receipt/ProfileList.module.scss | 9 ++++ styles/admin/receipt/ReceiptList.module.scss | 9 ++++ 6 files changed, 123 insertions(+), 15 deletions(-) diff --git a/components/admin/receipt/MegaphoneList.tsx b/components/admin/receipt/MegaphoneList.tsx index 3efae4498..993e8b48b 100644 --- a/components/admin/receipt/MegaphoneList.tsx +++ b/components/admin/receipt/MegaphoneList.tsx @@ -1,5 +1,5 @@ import { useCallback, useEffect, useState } from 'react'; -import { useSetRecoilState } from 'recoil'; +import { useRecoilState, useSetRecoilState } from 'recoil'; import { Imegaphone, ImegaphoneTable } from 'types/admin/adminReceiptType'; import { modalState } from 'utils/recoil/modal'; import { tableFormat } from 'constants/admin/table'; @@ -17,6 +17,7 @@ import { import styles from 'styles/admin/receipt/MegaphoneList.module.scss'; import { mockInstance } from 'utils/mockAxios'; import { toastState } from 'utils/recoil/toast'; +import AdminSearchBar from '../common/AdminSearchBar'; const megaPhoneTableTitle: { [key: string]: string } = { megaphoneId: 'ID', @@ -45,13 +46,47 @@ function MegaphoneList() { currentPage: 0, }); const [currentPage, setCurrentPage] = useState(1); - const setModal = useSetRecoilState(modalState); + const [intraId, setIntraId] = useState(''); + const [modal, setModal] = useRecoilState(modalState); const setSnackBar = useSetRecoilState(toastState); // 특정 유저 확성기 사용내역만 가져오는 api 추가되면 handler 추가 + 유저 검색 컴포넌트 추가 + const initSearch = useCallback((intraId?: string) => { + setIntraId(intraId || ''); + setCurrentPage(1); + }, []); + + const getUserMegaphoneHandler = useCallback(async () => { + try { + const res = await mockInstance.get( + `/admin/megaphones/history?intraId=${intraId}&page=${currentPage}&size=10` + ); + setIntraId(intraId); + setMegaphoneData({ + megaphoneList: res.data.megaphoneList.map((megaphone: Imegaphone) => { + const { year, month, date, hour, min } = getFormattedDateToString( + new Date(megaphone.usedAt) + ); + return { + ...megaphone, + usedAt: `${year}-${month}-${date} ${hour}:${min}`, + }; + }), + totalPage: res.data.totalPage, + currentPage: currentPage, + }); + } catch (e: unknown) { + setSnackBar({ + toastName: 'get user megaphone', + severity: 'error', + message: `API 요청에 문제가 발생했습니다.`, + clicked: true, + }); + } + }, [intraId, currentPage]); // instanceInManage로 변경 - const getMegaphoneHandler = useCallback(async () => { + const getAllMegaphoneHandler = useCallback(async () => { try { const res = await mockInstance.get( `/admin/megaphones/history?page=${currentPage}&size=10` @@ -95,11 +130,14 @@ function MegaphoneList() { }; useEffect(() => { - getMegaphoneHandler(); - }, [currentPage]); + intraId ? getUserMegaphoneHandler() : getAllMegaphoneHandler(); + }, [intraId, getUserMegaphoneHandler, getAllMegaphoneHandler, modal]); return ( <> +
+ +
diff --git a/components/admin/receipt/ProfileList.tsx b/components/admin/receipt/ProfileList.tsx index 5d806a8a1..421a00915 100644 --- a/components/admin/receipt/ProfileList.tsx +++ b/components/admin/receipt/ProfileList.tsx @@ -1,6 +1,6 @@ import Image from 'next/image'; import { useCallback, useEffect, useState } from 'react'; -import { useSetRecoilState } from 'recoil'; +import { useRecoilState, useSetRecoilState } from 'recoil'; import { Iprofile, IprofileTable } from 'types/admin/adminReceiptType'; import { modalState } from 'utils/recoil/modal'; import { tableFormat } from 'constants/admin/table'; @@ -18,6 +18,7 @@ import { import styles from 'styles/admin/receipt/ProfileList.module.scss'; import { mockInstance } from 'utils/mockAxios'; import { toastState } from 'utils/recoil/toast'; +import AdminSearchBar from '../common/AdminSearchBar'; const profileTableTitle: { [key: string]: string } = { profileId: 'ID', @@ -36,13 +37,47 @@ function ProfileList() { currentPage: 0, }); const [currentPage, setCurrentPage] = useState(1); - const setModal = useSetRecoilState(modalState); + const [intraId, setIntraId] = useState(''); + const [modal, setModal] = useRecoilState(modalState); const setSnackBar = useSetRecoilState(toastState); // 특정 유저 확성기 사용내역만 가져오는 api 추가되면 handler 추가 + 유저 검색 컴포넌트 추가 + const initSearch = useCallback((intraId?: string) => { + setIntraId(intraId || ''); + setCurrentPage(1); + }, []); + + const getUserProfileHandler = useCallback(async () => { + try { + const res = await mockInstance.get( + `/admin/images?intraId=${intraId}&page=${currentPage}&size=5` + ); + setIntraId(intraId); + setProfileData({ + profileList: res.data.profileList.map((profile: Iprofile) => { + const { year, month, date, hour, min } = getFormattedDateToString( + new Date(profile.date) + ); + return { + ...profile, + date: `${year}-${month}-${date} ${hour}:${min}`, + }; + }), + totalPage: res.data.totalPage, + currentPage: currentPage, + }); + } catch (e: unknown) { + setSnackBar({ + toastName: 'get user profile', + severity: 'error', + message: `API 요청에 문제가 발생했습니다.`, + clicked: true, + }); + } + }, [intraId, currentPage]); // instanceInManage로 변경 - const getProfileHandler = useCallback(async () => { + const getAllProfileHandler = useCallback(async () => { try { const res = await mockInstance.get( `/admin/images?page=${currentPage}&size=5` @@ -78,11 +113,14 @@ function ProfileList() { }; useEffect(() => { - getProfileHandler(); - }, [currentPage]); + intraId ? getUserProfileHandler() : getAllProfileHandler(); + }, [intraId, getUserProfileHandler, getAllProfileHandler]); return ( <> +
+ +
diff --git a/components/admin/receipt/ReceiptList.tsx b/components/admin/receipt/ReceiptList.tsx index eeb299463..dfc81f4eb 100644 --- a/components/admin/receipt/ReceiptList.tsx +++ b/components/admin/receipt/ReceiptList.tsx @@ -49,7 +49,7 @@ function ReceiptList() { const setSnackBar = useSetRecoilState(toastState); // 특정 유저 확성기 사용내역만 가져오는 api 추가되면 handler 추가 + 유저 검색 컴포넌트 추가 - const initSeaerch = useCallback((intraId?: string) => { + const initSearch = useCallback((intraId?: string) => { setIntraId(intraId || ''); setCurrentPage(1); }, []); @@ -73,8 +73,13 @@ function ReceiptList() { totalPage: res.data.totalPage, currentPage: currentPage, }); - } catch (e) { - console.error('HJ00'); + } catch (e: unknown) { + setSnackBar({ + toastName: 'get user receipt', + severity: 'error', + message: `API 요청에 문제가 발생했습니다.`, + clicked: true, + }); } }, [intraId, currentPage]); @@ -113,8 +118,8 @@ function ReceiptList() { return ( <> -
- +
+
diff --git a/styles/admin/receipt/MegaphoneList.module.scss b/styles/admin/receipt/MegaphoneList.module.scss index 12c9d0128..035a75a09 100644 --- a/styles/admin/receipt/MegaphoneList.module.scss +++ b/styles/admin/receipt/MegaphoneList.module.scss @@ -35,6 +35,15 @@ } } +.searchWrap { + display: flex; + justify-content: flex-end; + align-items: center; + :nth-child(2) { + margin: 0 0 0 20px; + } +} + .deleteBtn { justify-content: center; align-items: center; diff --git a/styles/admin/receipt/ProfileList.module.scss b/styles/admin/receipt/ProfileList.module.scss index 12c9d0128..035a75a09 100644 --- a/styles/admin/receipt/ProfileList.module.scss +++ b/styles/admin/receipt/ProfileList.module.scss @@ -35,6 +35,15 @@ } } +.searchWrap { + display: flex; + justify-content: flex-end; + align-items: center; + :nth-child(2) { + margin: 0 0 0 20px; + } +} + .deleteBtn { justify-content: center; align-items: center; diff --git a/styles/admin/receipt/ReceiptList.module.scss b/styles/admin/receipt/ReceiptList.module.scss index c1f897bce..0669043e1 100644 --- a/styles/admin/receipt/ReceiptList.module.scss +++ b/styles/admin/receipt/ReceiptList.module.scss @@ -35,4 +35,13 @@ } } +.searchWrap { + display: flex; + justify-content: flex-end; + align-items: center; + :nth-child(2) { + margin: 0 0 0 20px; + } +} + @include pagination; From 26bca94c7fb486de1b7188df8409a6e2a8148314 Mon Sep 17 00:00:00 2001 From: PHJoon Date: Mon, 14 Aug 2023 13:33:11 +0900 Subject: [PATCH 5/7] =?UTF-8?q?[Test]=20[GGFE-177]=20=ED=99=95=EC=84=B1?= =?UTF-8?q?=EA=B8=B0,=20=ED=94=84=EB=A1=9C=ED=95=84=20=EA=B2=80=EC=83=89?= =?UTF-8?q?=20mock=20api=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/admin/receipt/ProfileList.tsx | 2 +- pages/api/pingpong/admin/images/index.ts | 64 +++++++++++++++---- .../admin/megaphones/history/index.ts | 29 +++++---- pages/api/pingpong/admin/receipt/index.ts | 1 + 4 files changed, 73 insertions(+), 23 deletions(-) diff --git a/components/admin/receipt/ProfileList.tsx b/components/admin/receipt/ProfileList.tsx index 421a00915..8cfda2dce 100644 --- a/components/admin/receipt/ProfileList.tsx +++ b/components/admin/receipt/ProfileList.tsx @@ -114,7 +114,7 @@ function ProfileList() { useEffect(() => { intraId ? getUserProfileHandler() : getAllProfileHandler(); - }, [intraId, getUserProfileHandler, getAllProfileHandler]); + }, [intraId, getUserProfileHandler, getAllProfileHandler, modal]); return ( <> diff --git a/pages/api/pingpong/admin/images/index.ts b/pages/api/pingpong/admin/images/index.ts index dc82e3fa3..05f68a997 100644 --- a/pages/api/pingpong/admin/images/index.ts +++ b/pages/api/pingpong/admin/images/index.ts @@ -41,17 +41,52 @@ const profile5: Iprofile = { imageUri: '/image/noti_empty.svg', }; +const profile6: Iprofile = { + profileId: 6, + date: new Date('2023-08-05 10:10:10'), + intraId: 'hyungjpa', + imageUri: '/image/noti_empty.svg', +}; + +const profile7: Iprofile = { + profileId: 7, + date: new Date('2023-08-04 20:30:10'), + intraId: 'hyobicho', + imageUri: '/image/noti_empty.svg', +}; + +const profile8: Iprofile = { + profileId: 8, + date: new Date('2023-07-05 10:10:10'), + intraId: 'sangmipa', + imageUri: '/image/noti_empty.svg', +}; + +const profile9: Iprofile = { + profileId: 9, + date: new Date('2023-07-04 20:30:10'), + intraId: 'jeyoon', + imageUri: '/image/noti_empty.svg', +}; + +const profile10: Iprofile = { + profileId: 5, + date: new Date('2023-07-01 10:10:10'), + intraId: 'hyungjpa1', + imageUri: '/image/noti_empty.svg', +}; + const profileList: Array = [ profile1, profile2, profile3, profile4, profile5, - profile1, - profile2, - profile3, - profile4, - profile5, + profile6, + profile7, + profile8, + profile9, + profile10, ]; const resEmpty: IprofileRes = { @@ -71,7 +106,7 @@ const resTwo: IprofileRes = { export default function handler(req: NextApiRequest, res: NextApiResponse) { const { method, query } = req; - const { page } = query as { page: string }; + const { intraId, page } = query as { intraId: string; page: string }; // const temp: IprofileRes = resEmpty; // const temp: IprofileRes = resOne; @@ -83,11 +118,18 @@ export default function handler(req: NextApiRequest, res: NextApiResponse) { }; if (method === 'GET') { - if (page) { - if (parseInt(page) === resData.totalPage) { - resData.profileList = temp.profileList.slice(0, 5); - } else { - resData.profileList = temp.profileList; + if (intraId) { + resData.profileList = temp.profileList.filter( + (profile: Iprofile) => profile.intraId === intraId + ); + resData.totalPage = 1; + } else { + if (page) { + if (parseInt(page) === resData.totalPage) { + resData.profileList = temp.profileList.slice(0, 5); + } else { + resData.profileList = temp.profileList; + } } } res.status(200).json(resData); diff --git a/pages/api/pingpong/admin/megaphones/history/index.ts b/pages/api/pingpong/admin/megaphones/history/index.ts index 9a67ee36b..4c61df56e 100644 --- a/pages/api/pingpong/admin/megaphones/history/index.ts +++ b/pages/api/pingpong/admin/megaphones/history/index.ts @@ -45,7 +45,7 @@ const megaphone5: Imegaphone = { content: '확성기입니다', usedAt: new Date('2023-07-02 10:20:10'), status: '사용 대기', - intraId: 'Hyungjpa', + intraId: 'hyungjpa', }; const megaphone6: Imegaphone = { @@ -53,7 +53,7 @@ const megaphone6: Imegaphone = { content: '확성기입니다', usedAt: new Date('2023-06-05 10:10:10'), status: '사용 대기', - intraId: 'hyungjpa', + intraId: 'jeyoon', }; const megaphone7: Imegaphone = { @@ -69,7 +69,7 @@ const megaphone8: Imegaphone = { content: '확성기입니다', usedAt: new Date('2023-05-05 10:10:10'), status: '사용 완료', - intraId: 'hyungjpa', + intraId: 'sangmipa', }; const megaphone9: Imegaphone = { @@ -77,7 +77,7 @@ const megaphone9: Imegaphone = { content: '확성기입니다', usedAt: new Date('2023-05-04 10:10:10'), status: '사용 완료', - intraId: 'hyungjpa', + intraId: 'sangmipa', }; const megaphone10: Imegaphone = { @@ -85,7 +85,7 @@ const megaphone10: Imegaphone = { content: '확성기입니다', usedAt: new Date('2023-05-03 10:10:10'), status: '사용 완료', - intraId: 'hyungjpa', + intraId: 'hyobicho', }; const megaphoneList: Array = [ @@ -118,7 +118,7 @@ const resTwo: ImegaphoneRes = { export default function handler(req: NextApiRequest, res: NextApiResponse) { const { method, query } = req; - const { page } = query as { page: string }; + const { intraId, page } = query as { intraId: string; page: string }; // const temp: ImegaphoneTable = resEmpty; // const temp: ImegaphoneTable = resOne; @@ -130,11 +130,18 @@ export default function handler(req: NextApiRequest, res: NextApiResponse) { }; if (method === 'GET') { - if (page) { - if (parseInt(page) === resData.totalPage) { - resData.megaphoneList = temp.megaphoneList.slice(0, 5); - } else { - resData.megaphoneList = temp.megaphoneList; + if (intraId) { + resData.megaphoneList = temp.megaphoneList.filter( + (megaphone: Imegaphone) => megaphone.intraId === intraId + ); + resData.totalPage = 1; + } else { + if (page) { + if (parseInt(page) === resData.totalPage) { + resData.megaphoneList = temp.megaphoneList.slice(0, 5); + } else { + resData.megaphoneList = temp.megaphoneList; + } } } res.status(200).json(resData); diff --git a/pages/api/pingpong/admin/receipt/index.ts b/pages/api/pingpong/admin/receipt/index.ts index 57a2f4be4..c51e0f4b2 100644 --- a/pages/api/pingpong/admin/receipt/index.ts +++ b/pages/api/pingpong/admin/receipt/index.ts @@ -153,6 +153,7 @@ export default function handler(req: NextApiRequest, res: NextApiResponse) { (receipt: Ireceipt) => receipt.ownerIntra === intraId || receipt.purchaserIntra === intraId ); + resData.totalPage = 1; } else { if (page) { if (parseInt(page) === resData.totalPage) { From 006c993ff0dc2dda44adeea08385523a517e764e Mon Sep 17 00:00:00 2001 From: PHJoon Date: Mon, 14 Aug 2023 15:23:16 +0900 Subject: [PATCH 6/7] =?UTF-8?q?[Style]=20[GGFE-177]=20=EA=B2=80=EC=83=89?= =?UTF-8?q?=EB=B0=94=20=EC=8A=A4=ED=83=80=EC=9D=BC=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- styles/admin/receipt/MegaphoneList.module.scss | 1 + styles/admin/receipt/MenuTab.module.scss | 1 - styles/admin/receipt/ProfileList.module.scss | 1 + styles/admin/receipt/ReceiptList.module.scss | 1 + 4 files changed, 3 insertions(+), 1 deletion(-) diff --git a/styles/admin/receipt/MegaphoneList.module.scss b/styles/admin/receipt/MegaphoneList.module.scss index 035a75a09..2e83791ba 100644 --- a/styles/admin/receipt/MegaphoneList.module.scss +++ b/styles/admin/receipt/MegaphoneList.module.scss @@ -39,6 +39,7 @@ display: flex; justify-content: flex-end; align-items: center; + padding-bottom: 0.3rem; :nth-child(2) { margin: 0 0 0 20px; } diff --git a/styles/admin/receipt/MenuTab.module.scss b/styles/admin/receipt/MenuTab.module.scss index 47ccb2d7f..9aa643be4 100644 --- a/styles/admin/receipt/MenuTab.module.scss +++ b/styles/admin/receipt/MenuTab.module.scss @@ -23,7 +23,6 @@ justify-content: space-around; align-items: center; font-weight: 500; - padding-bottom: 0.3rem; } .active { diff --git a/styles/admin/receipt/ProfileList.module.scss b/styles/admin/receipt/ProfileList.module.scss index 035a75a09..2e83791ba 100644 --- a/styles/admin/receipt/ProfileList.module.scss +++ b/styles/admin/receipt/ProfileList.module.scss @@ -39,6 +39,7 @@ display: flex; justify-content: flex-end; align-items: center; + padding-bottom: 0.3rem; :nth-child(2) { margin: 0 0 0 20px; } diff --git a/styles/admin/receipt/ReceiptList.module.scss b/styles/admin/receipt/ReceiptList.module.scss index 0669043e1..e297151a1 100644 --- a/styles/admin/receipt/ReceiptList.module.scss +++ b/styles/admin/receipt/ReceiptList.module.scss @@ -39,6 +39,7 @@ display: flex; justify-content: flex-end; align-items: center; + padding-bottom: 0.3rem; :nth-child(2) { margin: 0 0 0 20px; } From 1f54d507ea706920431958e8b0db38631c6fb7f1 Mon Sep 17 00:00:00 2001 From: PHJoon Date: Mon, 14 Aug 2023 16:31:32 +0900 Subject: [PATCH 7/7] =?UTF-8?q?[Fix]=20[GGFE-177]=20pr=20=ED=94=BC?= =?UTF-8?q?=EB=93=9C=EB=B0=B1=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/admin/receipt/MegaphoneList.tsx | 1 - components/admin/receipt/ProfileList.tsx | 1 - components/admin/receipt/ReceiptList.tsx | 1 - pages/api/pingpong/admin/images/index.ts | 2 +- 4 files changed, 1 insertion(+), 4 deletions(-) diff --git a/components/admin/receipt/MegaphoneList.tsx b/components/admin/receipt/MegaphoneList.tsx index 993e8b48b..59be0438e 100644 --- a/components/admin/receipt/MegaphoneList.tsx +++ b/components/admin/receipt/MegaphoneList.tsx @@ -61,7 +61,6 @@ function MegaphoneList() { const res = await mockInstance.get( `/admin/megaphones/history?intraId=${intraId}&page=${currentPage}&size=10` ); - setIntraId(intraId); setMegaphoneData({ megaphoneList: res.data.megaphoneList.map((megaphone: Imegaphone) => { const { year, month, date, hour, min } = getFormattedDateToString( diff --git a/components/admin/receipt/ProfileList.tsx b/components/admin/receipt/ProfileList.tsx index 8cfda2dce..89d008d11 100644 --- a/components/admin/receipt/ProfileList.tsx +++ b/components/admin/receipt/ProfileList.tsx @@ -52,7 +52,6 @@ function ProfileList() { const res = await mockInstance.get( `/admin/images?intraId=${intraId}&page=${currentPage}&size=5` ); - setIntraId(intraId); setProfileData({ profileList: res.data.profileList.map((profile: Iprofile) => { const { year, month, date, hour, min } = getFormattedDateToString( diff --git a/components/admin/receipt/ReceiptList.tsx b/components/admin/receipt/ReceiptList.tsx index dfc81f4eb..86fbf4496 100644 --- a/components/admin/receipt/ReceiptList.tsx +++ b/components/admin/receipt/ReceiptList.tsx @@ -59,7 +59,6 @@ function ReceiptList() { const res = await mockInstance.get( `/admin/receipt/?intraId=${intraId}&page=${currentPage}&size=10` ); - setIntraId(intraId); setReceiptData({ receiptList: res.data.receiptList.map((receipt: Ireceipt) => { const { year, month, date, hour, min } = getFormattedDateToString( diff --git a/pages/api/pingpong/admin/images/index.ts b/pages/api/pingpong/admin/images/index.ts index 05f68a997..ec3294a21 100644 --- a/pages/api/pingpong/admin/images/index.ts +++ b/pages/api/pingpong/admin/images/index.ts @@ -70,7 +70,7 @@ const profile9: Iprofile = { }; const profile10: Iprofile = { - profileId: 5, + profileId: 10, date: new Date('2023-07-01 10:10:10'), intraId: 'hyungjpa1', imageUri: '/image/noti_empty.svg',