From cc22ae8348ebec2c10aa56ac36f8d15486621b9b Mon Sep 17 00:00:00 2001 From: "focp212@naver.com" Date: Mon, 22 Sep 2025 13:50:32 +0900 Subject: [PATCH] =?UTF-8?q?=EC=A7=80=EA=B8=89=EB=8C=80=ED=96=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../additional-service/model/payout/types.ts | 14 +- .../additional-service/model/types.ts | 5 +- .../ui/filter/payout-filter.tsx | 5 +- .../additional-service/ui/list-date-group.tsx | 5 + .../additional-service/ui/list-item.tsx | 43 ++++- .../additional-service/payout/list-page.tsx | 167 ++++++++++-------- 6 files changed, 150 insertions(+), 89 deletions(-) diff --git a/src/entities/additional-service/model/payout/types.ts b/src/entities/additional-service/model/payout/types.ts index f4345ac..aba4520 100644 --- a/src/entities/additional-service/model/payout/types.ts +++ b/src/entities/additional-service/model/payout/types.ts @@ -31,13 +31,13 @@ export interface ExtensionPayoutListResponse extends DefaulResponsePagination{ content: Array }; export interface PayoutContent { - tid: string; - submallId: string; - requestDate: string; - settlementDate: string; - companyName: string; - disbursementStatus: PayoutDisbursementStatus; - disbursementAmount: number; + tid?: string; + submallId?: string; + requestDate?: string; + settlementDate?: string; + companyName?: string; + disbursementStatus?: PayoutDisbursementStatus; + disbursementAmount?: number; }; export interface ExtensionPayoutExcelParams extends ExtensionPayoutListParams {}; diff --git a/src/entities/additional-service/model/types.ts b/src/entities/additional-service/model/types.ts index 53d27ce..111c1a3 100644 --- a/src/entities/additional-service/model/types.ts +++ b/src/entities/additional-service/model/types.ts @@ -1,4 +1,5 @@ import { DefaulResponsePagination, DefaultRequestPagination } from '@/entities/common/model/types'; +import { PayoutContent } from './payout/types'; // ======================================== // 공통 Enums 및 타입들 @@ -28,6 +29,7 @@ export enum AdditionalServiceCategory { LinkPaymentPending = 'LinkPaymentPending', FundTransfer = 'FundTransfer', SettlementAgency = 'SettlementAgency', + Payout = 'Payout', } // ======================================== @@ -319,7 +321,8 @@ export interface SettlementAgencyBottomAgreeProps { export interface ListItemProps extends KeyInPaymentListItem, AccountHolderSearchListItem, -LinkPaymentShippingListItem, LinkPaymentPendingListItem +LinkPaymentShippingListItem, LinkPaymentPendingListItem, +PayoutContent { additionalServiceCategory?: AdditionalServiceCategory; mid?: string diff --git a/src/entities/additional-service/ui/filter/payout-filter.tsx b/src/entities/additional-service/ui/filter/payout-filter.tsx index c1fa64c..671acf3 100644 --- a/src/entities/additional-service/ui/filter/payout-filter.tsx +++ b/src/entities/additional-service/ui/filter/payout-filter.tsx @@ -18,6 +18,7 @@ import { FilterMotionStyle, FilterMotionVariants } from '@/entities/common/model/constant'; +import moment from 'moment'; export interface PayoutFilterProps { filterOn: boolean; @@ -59,8 +60,8 @@ export const PayoutFilter = ({ const [filterMid, setFilterMid] = useState(mid); const [filterSearchCl, setFilterSearchCl] = useState(searchCl); - const [filterFromDate, setFilterFromDate] = useState(fromDate); - const [filterToDate, setFilterToDate] = useState(toDate); + const [filterFromDate, setFilterFromDate] = useState(moment(fromDate).format('YYYY.MM.DD')); + const [filterToDate, setFilterToDate] = useState(moment(toDate).format('YYYY.MM.DD')); const [filterDisbursementStatus, setFilterDisbursementStatus] = useState(disbursementStatus); const [filterMinAmount, setFilterMinAmount] = useState(minAmount || ''); const [filterMaxAmount, setFilterMaxAmount] = useState(maxAmount || ''); diff --git a/src/entities/additional-service/ui/list-date-group.tsx b/src/entities/additional-service/ui/list-date-group.tsx index ca6246a..d2d130d 100644 --- a/src/entities/additional-service/ui/list-date-group.tsx +++ b/src/entities/additional-service/ui/list-date-group.tsx @@ -40,6 +40,11 @@ export const ListDateGroup = ({ scheduledSendDate={ items[i]?.scheduledSendDate} processStatus={ items[i]?.processStatus} + submallId={ items[i]?.submallId } + settlementDate={ items[i]?.settlementDate } + companyName={ items[i]?. companyName } + disbursementStatus={ items[i]?.disbursementStatus } + disbursementAmount={ items[i]?.disbursementAmount } > ) } diff --git a/src/entities/additional-service/ui/list-item.tsx b/src/entities/additional-service/ui/list-item.tsx index 218a81f..1fdeccd 100644 --- a/src/entities/additional-service/ui/list-item.tsx +++ b/src/entities/additional-service/ui/list-item.tsx @@ -11,7 +11,10 @@ export const ListItem = ({ requestDate, bankName, accountNo, resultStatus, amount, sendDate, sendStatus, sendMethod, - scheduledSendDate, processStatus + scheduledSendDate, processStatus, + + submallId, settlementDate, companyName, + disbursementStatus, disbursementAmount }: ListItemProps) => { const { navigate } = useNavigate(); const getItemClass = () => { @@ -121,6 +124,15 @@ export const ListItem = ({ } else if (additionalServiceCategory === AdditionalServiceCategory.SettlementAgency) { + } + else if(additionalServiceCategory === AdditionalServiceCategory.Payout){ + navigate(PATHS.additionalService.payout.detail, { + state: { + additionalServiceCategory: additionalServiceCategory, + mid: mid, + tid: tid + } + }); } else { alert('additionalServiceCategory가 존재하지 않습니다.'); @@ -144,7 +156,7 @@ export const ListItem = ({ }; const getTitle = () => { - let str = ''; + let str: string | undefined = ''; if (additionalServiceCategory === AdditionalServiceCategory.KeyInPayment) { str = `${tid}(${amount})`; } @@ -160,6 +172,9 @@ export const ListItem = ({ str = `${"buyerName"}(${"이메일"})` } } + else if (additionalServiceCategory === AdditionalServiceCategory.Payout){ + str = companyName; + } return str; }; @@ -214,6 +229,15 @@ export const ListItem = ({ ); } + else if(additionalServiceCategory === AdditionalServiceCategory.Payout){ + rs.push( +
+ { disbursementStatus } + | + { submallId } +
+ ); + } return rs; }; @@ -252,6 +276,21 @@ export const ListItem = ({ ) } + else if(additionalServiceCategory === AdditionalServiceCategory.Payout){ + rs.push( +
+ +
+ ) + } return rs; } diff --git a/src/pages/additional-service/payout/list-page.tsx b/src/pages/additional-service/payout/list-page.tsx index fdbf053..705898c 100644 --- a/src/pages/additional-service/payout/list-page.tsx +++ b/src/pages/additional-service/payout/list-page.tsx @@ -3,7 +3,15 @@ import { useNavigate } from '@/shared/lib/hooks/use-navigate'; import { HeaderType, SortByKeys } from '@/entities/common/model/types'; import { IMAGE_ROOT } from '@/shared/constants/common'; import { useExtensionPayoutListMutation } from '@/entities/additional-service/api/payout/use-extension-payout-list-mutation'; -import { ExtensionPayoutExcelParams, ExtensionPayoutExcelResponse, ExtensionPayoutListParams, ExtensionPayoutListResponse, PayoutDisbursementStatus, PayoutSearchCl } from '@/entities/additional-service/model/payout/types'; +import { + ExtensionPayoutExcelParams, + ExtensionPayoutExcelResponse, + ExtensionPayoutListParams, + ExtensionPayoutListResponse, + PayoutContent, + PayoutDisbursementStatus, + PayoutSearchCl +} from '@/entities/additional-service/model/payout/types'; import { useEffect, useState } from 'react'; import { DEFAULT_PAGE_PARAM } from '@/entities/common/model/constant'; import { @@ -15,12 +23,16 @@ import { import moment from 'moment'; import { SortOptionsBox } from '@/entities/common/ui/sort-options-box'; import { useExtensionPayoutExcelMutation } from '@/entities/additional-service/api/payout/use-extension-payout-excel-mutation'; +import { PayoutFilter } from '@/entities/additional-service/ui/filter/payout-filter'; +import { PayoutDisbursementStatusBtnGroup } from '@/entities/additional-service/model/payout/constant'; +import { ListDateGroup } from '@/entities/additional-service/ui/list-date-group'; +import { AdditionalServiceCategory } from '@/entities/additional-service/model/types'; export const PayoutListPage = () => { const { navigate } = useNavigate(); - const [sortBy, setSortBy] = useState(SortByKeys.New); + const [listItems, setListItems] = useState>>({}); const [filterOn, setFilterOn] = useState(false); const [pageParam, setPageParam] = useState(DEFAULT_PAGE_PARAM); const [mid, setMid] = useState('nictest001m'); @@ -79,7 +91,7 @@ export const PayoutListPage = () => { page: pageParam }; extensionPayoutList(params).then((rs: ExtensionPayoutListResponse) => { - + setListItems(assembleData(rs.content)); }); }; @@ -98,6 +110,29 @@ export const PayoutListPage = () => { }); }; + const assembleData = (content: Array) => { + let data: any = {}; + if(content && content.length > 0){ + for(let i=0;i { callDownloadExcel(); }; @@ -108,7 +143,7 @@ export const PayoutListPage = () => { setSortBy(sort); callExtensionPayoutList({sortBy: sort}); }; - const onClickToRequestStatus = (val: PayoutDisbursementStatus) => { + const onClickToDisbursementStatus = (val: PayoutDisbursementStatus) => { setDisbursementStatus(val); callExtensionPayoutList({val: val}); }; @@ -118,6 +153,23 @@ export const PayoutListPage = () => { callExtensionPayoutList(); }, []); + const getPayoutList = () => { + let rs = []; + if(Object.keys(listItems).length > 0){ + for (const [key, value] of Object.entries(listItems)) { + rs.push( + + ); + } + } + return rs; + } + return ( <>
@@ -173,87 +225,48 @@ export const PayoutListPage = () => { >
- 전체 - 요청 - 성공 - 실패 + { + PayoutDisbursementStatusBtnGroup.map((value, index) => ( + onClickToDisbursementStatus(value.value) } + >{ value.name } + )) + }
- -
-
25.06.08(일)
-
onClickToGoDetail() } - > -
-
-
-
-
카카오스타일
-
- 요청 - ㅣ - cruiquis01m -
-
-
5,254,000원
+
+ { getPayoutList() } +
+
-
-
-
-
-
-
카카오스타일
-
- 요청 - ㅣ - cruiquis01m -
-
-
5,254,000원
-
- -
25.06.08(일)
-
-
-
-
-
-
카카오스타일
-
- 요청 - ㅣ - cruiquis01m -
-
-
5,254,000원
-
-
-
-
-
-
-
카카오스타일
-
- 요청 - ㅣ - cruiquis01m -
-
-
5,254,000원
-
-
-
-
+ ); }; \ No newline at end of file