Merge pull request #931 from 42organization/GGFE-177-관리자-거래내역-특정유저-조회-기능

[GGFE-177] 관리자 거래내역 특정유저 조회 기능
42organization · Aug 16, 2023 · f984dd9 · f984dd9
2 parents 0fbd6c7 + 0e214de
commit f984dd9
Show file tree

Hide file tree

Showing 17 changed files with 399 additions and 226 deletions.
diff --git 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,46 @@ function MegaphoneList() {
     currentPage: 0,
   });
   const [currentPage, setCurrentPage] = useState<number>(1);
-  const setModal = useSetRecoilState(modalState);
+  const [intraId, setIntraId] = useState<string>('');
+  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`
+      );
+      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 +129,14 @@ function MegaphoneList() {
   };
 
   useEffect(() => {
-    getMegaphoneHandler();
-  }, [currentPage]);
+    intraId ? getUserMegaphoneHandler() : getAllMegaphoneHandler();
+  }, [intraId, getUserMegaphoneHandler, getAllMegaphoneHandler, modal]);
 
   return (
     <>
+      <div className={styles.searchWrap}>
+        <AdminSearchBar initSearch={initSearch} />
+      </div>
       <TableContainer className={styles.tableContainer} component={Paper}>
         <Table className={styles.table} aria-label='customized table'>
           <TableHead className={styles.tableHeader}>

diff --git 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,46 @@ function ProfileList() {
     currentPage: 0,
   });
   const [currentPage, setCurrentPage] = useState<number>(1);
-  const setModal = useSetRecoilState(modalState);
+  const [intraId, setIntraId] = useState<string>('');
+  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`
+      );
+      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 +112,14 @@ function ProfileList() {
   };
 
   useEffect(() => {
-    getProfileHandler();
-  }, [currentPage]);
+    intraId ? getUserProfileHandler() : getAllProfileHandler();
+  }, [intraId, getUserProfileHandler, getAllProfileHandler, modal]);
 
   return (
     <>
+      <div className={styles.searchWrap}>
+        <AdminSearchBar initSearch={initSearch} />
+      </div>
       <TableContainer className={styles.tableContainer} component={Paper}>
         <Table className={styles.table} aria-label='customized table'>
           <TableHead className={styles.tableHeader}>

diff --git 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,45 @@ function ReceiptList() {
     currentPage: 0,
   });
   const [currentPage, setCurrentPage] = useState<number>(1);
+  const [intraId, setIntraId] = useState<string>('');
   const setSnackBar = useSetRecoilState(toastState);
 
   // 특정 유저 확성기 사용내역만 가져오는 api 추가되면 handler 추가 + 유저 검색 컴포넌트 추가
+  const initSearch = 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`
+      );
+      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: unknown) {
+      setSnackBar({
+        toastName: 'get user receipt',
+        severity: 'error',
+        message: `API 요청에 문제가 발생했습니다.`,
+        clicked: true,
+      });
+    }
+  }, [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 +112,14 @@ function ReceiptList() {
   }, [currentPage]);
 
   useEffect(() => {
-    getReceiptHandler();
-  }, [currentPage]);
+    intraId ? getUserReceiptHandler() : getAllReceiptHandler();
+  }, [intraId, getUserReceiptHandler, getAllReceiptHandler]);
 
   return (
     <>
+      <div className={styles.searchWrap}>
+        <AdminSearchBar initSearch={initSearch} />
+      </div>
       <TableContainer className={styles.tableContainer} component={Paper}>
         <Table className={styles.table} aria-label='customized table'>
           <TableHead className={styles.tableHeader}>

diff --git 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
@@ -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
@@ -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
               />
             </div>

diff --git 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',