From 601f92369cc291c8da823432f80c0abe21b518bd Mon Sep 17 00:00:00 2001 From: HyeonJongKim Date: Mon, 15 Sep 2025 10:33:27 +0900 Subject: [PATCH] =?UTF-8?q?=EB=A7=81=ED=81=AC=EA=B2=B0=EC=A0=9C[=EB=B0=9C?= =?UTF-8?q?=EC=86=A1=EB=82=B4=EC=97=AD,=EB=B0=9C=EC=86=A1=EB=8C=80?= =?UTF-8?q?=EA=B8=B0]=20=ED=95=84=ED=84=B0=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../additional-service/model/types.ts | 78 ++++++- .../account-holder-search-filter.tsx | 129 ++++-------- .../link-payment-pending-send-filter.tsx | 174 ++++++++++++++++ .../link-payment-shipping-history-filter.tsx | 195 ++++++++++++++++++ .../ui/link-payment/link-payment-filter.tsx | 193 ----------------- .../link-payment-pending-send-wrap.tsx | 39 +++- ...=> link-payment-shipping-history-wrap.tsx} | 38 +++- .../ui/link-payment/link-payment-tab.tsx | 8 +- .../transaction/ui/filter/billing-filter.tsx | 4 +- .../account-holder-search-page.tsx | 4 +- .../additional-service-pages.tsx | 4 +- .../additional-service/intro/intro-page.tsx | 2 +- .../link-payment/link-payment-detail-page.tsx | 6 +- .../link-payment-pending-send-page.tsx | 1 - ...=> link-payment-shipping-history-page.tsx} | 8 +- src/shared/constants/paths.ts | 4 +- src/shared/constants/route-names.ts | 2 +- src/shared/ui/menu/index.tsx | 2 +- 18 files changed, 569 insertions(+), 322 deletions(-) create mode 100644 src/entities/additional-service/ui/link-payment/filter/link-payment-pending-send-filter.tsx create mode 100644 src/entities/additional-service/ui/link-payment/filter/link-payment-shipping-history-filter.tsx delete mode 100644 src/entities/additional-service/ui/link-payment/link-payment-filter.tsx rename src/entities/additional-service/ui/link-payment/{link-payment-dispatch-list-wrap.tsx => link-payment-shipping-history-wrap.tsx} (71%) rename src/pages/additional-service/link-payment/{link-payment-dispatch-list-page.tsx => link-payment-shipping-history-page.tsx} (79%) diff --git a/src/entities/additional-service/model/types.ts b/src/entities/additional-service/model/types.ts index ecbff8c..f722ecc 100644 --- a/src/entities/additional-service/model/types.ts +++ b/src/entities/additional-service/model/types.ts @@ -8,7 +8,7 @@ export interface FundTransferTabProps { activeTab: FundTransferTabKeys; }; export enum LinkPaymentTabKeys { - DispatchList = 'DispatchList', + ShippingHistory = 'ShippingHistory', PendingSend = 'PendingSend' }; export interface LinkPaymentTabProps { @@ -23,16 +23,41 @@ export enum SortByKeys { New = 'New', Amount = 'Amount', }; +export enum ProcessResult { + ALL = 'ALL', + SUCCESS = 'SUCCESS', + FAILURE = 'FAILURE' +}; export enum AccountHolderSearchType { ALL = 'ALL', ACCOUNT_HOLDER = 'ACCOUNT_HOLDER', ACCOUNT_NUMBER = 'ACCOUNT_NUMBER' }; -export enum AccountHolderSearchProcessResult { - ALL = 'ALL', - SUCCESS = 'SUCCESS', - FAILURE = 'FAILURE' +export enum LinkPaymentSearchType { + ALL = "ALL", + PHONE = "PHONE", + EMAIL = "EMAIL" }; +export enum LinkPaymentSendMethod { + ALL = "ALL", + SMS = "SMS", + EMAIL = "EMAIL", + KAKAO = "KAKAO" +}; +export enum LinkPaymentTransactionStatus { + ALL = "ALL", + ACTIVATE = "ACTIVATE", + DEPOSIT_REQUEST = "DEPOSIT_REQUEST", + TRANSACTION_COMPLETE = "TRANSACTION_COMPLETE", + TRANSACTION_FAIL = "TRANSACTION_FAIL", + INACTIVE = "INACTIVE" +} +export enum LinkPaymentSendingStatus { + ALL = "ALL", + SEND_REQUEST = "SEND_REQUEST", + SEND_CANCEL = "SEND_CANCEL" +} + export interface SortOptionsBoxProps { sortBy: SortByKeys; onClickToSort: (sortBy: SortByKeys) => void; @@ -328,7 +353,7 @@ export interface FilterProps { filterOn: boolean; setFilterOn: (filterOn: boolean) => void; }; - +// 계좌성명 조회 필터 export interface AccountHolderSearchFilterProps extends FilterProps { mid: string; searchType: AccountHolderSearchType; @@ -336,17 +361,52 @@ export interface AccountHolderSearchFilterProps extends FilterProps { startDate: string; endDate: string; bank: string; - processResult: AccountHolderSearchProcessResult; + processResult: ProcessResult; setMid: (mid: string) => void; setSearchType: (searchType: AccountHolderSearchType) => void; setSearchKeyword: (searchKeyWorld: string) => void; setStartDate: (startDate: string) => void; setEndDate: (endDate: string) => void; setBank: (bank: string) => void; - setProcessResult: (processResult: AccountHolderSearchProcessResult) => void; + setProcessResult: (processResult: ProcessResult) => void; } -export interface LinkPaymentFilterProps extends FilterProps { +// 링크결제 - 발송내역 탭 필터 +export interface LinkPaymentShippingHistoryFilterProps extends FilterProps { + mid: string; + searchType: LinkPaymentSearchType; + searchKeyword: string; + startDate: string; + endDate: string; + transactionStatus: LinkPaymentTransactionStatus; + processResult: ProcessResult; + sendMethod: LinkPaymentSendMethod; + setMid: (mid: string) => void; + setSearchType: (searchType: LinkPaymentSearchType) => void; + setSearchKeyword: (searchKeyWorld: string) => void; + setStartDate: (startDate: string) => void; + setEndDate: (endDate: string) => void; + setTransactionStatus: (transactionStatus: LinkPaymentTransactionStatus) => void; + setProcessResult: (processResult: ProcessResult) => void; + setSendMethod: (sendMethod: LinkPaymentSendMethod) => void; +} + +// 링크결제 - 발송대기 탭 필터 +export interface LinkPaymentPendingSendFilterProps extends FilterProps { + mid: string; + searchType: LinkPaymentSearchType; + searchKeyword: string; + startDate: string; + endDate: string; + sendMethod: LinkPaymentSendMethod; + sendingStatus: LinkPaymentSendingStatus; + setMid: (mid: string) => void; + setSearchType: (searchType: LinkPaymentSearchType) => void; + setSearchKeyword: (searchKeyWorld: string) => void; + setStartDate: (startDate: string) => void; + setEndDate: (endDate: string) => void; + setSendMethod: (sendMethod: LinkPaymentSendMethod) => void; + setSendingStatus: (sendingStatus: LinkPaymentSendingStatus) => void; }; export enum DetailInfoSectionKeys { diff --git a/src/entities/additional-service/ui/account-holder-search/account-holder-search-filter.tsx b/src/entities/additional-service/ui/account-holder-search/account-holder-search-filter.tsx index c2329fa..474484f 100644 --- a/src/entities/additional-service/ui/account-holder-search/account-holder-search-filter.tsx +++ b/src/entities/additional-service/ui/account-holder-search/account-holder-search-filter.tsx @@ -1,12 +1,15 @@ import moment from 'moment'; +import { useEffect } from 'react'; import { IMAGE_ROOT } from '@/shared/constants/common'; import { motion } from 'framer-motion'; import { ChangeEvent, useState } from 'react'; import { AccountHolderSearchType, AccountHolderSearchFilterProps, - AccountHolderSearchProcessResult + ProcessResult } from '../../model/types'; +import { FilterSelect } from '@/shared/ui/filter/select'; +import { FilterSelectInput } from '@/shared/ui/filter/select-input'; import { FilterDateOptions } from '@/entities/common/model/types'; import { FilterCalendar } from '@/shared/ui/filter/filter-calendar'; import { FilterButtonGroups } from '@/shared/ui/filter/button-groups'; @@ -36,7 +39,7 @@ export const AccountHolderSearchFilter = ({ const [filterStartDate, setFilterStartDate] = useState(startDate); const [filterEndDate, setFilterEndDate] = useState(endDate); const [filterBank, setFilterBank] = useState(bank) - const [filterProcessResult, setFilterProcessResult] = useState(processResult); + const [filterProcessResult, setFilterProcessResult] = useState(processResult); const [dateReadOnly, setDateReadyOnly] = useState(true); const [filterDateOptionsBtn, setFilterDateOptionsBtn] = useState(FilterDateOptions.Input); @@ -50,38 +53,6 @@ export const AccountHolderSearchFilter = ({ const onClickToClose = () => { setFilterOn(false); }; - const setFilterDate = (dateOptions: FilterDateOptions) => { - if (dateOptions === FilterDateOptions.Today) { - setFilterStartDate(moment().format('YYYY-MM-DD')); - setFilterEndDate(moment().format('YYYY-MM-DD')); - setDateReadyOnly(true); - setFilterDateOptionsBtn(FilterDateOptions.Today); - } - else if (dateOptions === FilterDateOptions.Week) { - setFilterStartDate(moment().subtract(1, 'week').format('YYYY-MM-DD')); - setFilterEndDate(moment().format('YYYY-MM-DD')); - setDateReadyOnly(true); - setFilterDateOptionsBtn(FilterDateOptions.Week); - } - else if (dateOptions === FilterDateOptions.Month) { - setFilterStartDate(moment().subtract(1, 'month').format('YYYY-MM-DD')); - setFilterEndDate(moment().format('YYYY-MM-DD')); - setDateReadyOnly(true); - setFilterDateOptionsBtn(FilterDateOptions.Month); - } - else if (dateOptions === FilterDateOptions.Input) { - setDateReadyOnly(false); - setFilterDateOptionsBtn(FilterDateOptions.Input); - } - }; - const onClickToOpenCalendar = () => { - if (!dateReadOnly) { - setCalendarOpen(true); - } - else { - setCalendarOpen(false); - } - }; const setNewDate = (newDate: any) => { console.log(newDate) @@ -97,11 +68,27 @@ export const AccountHolderSearchFilter = ({ setProcessResult(filterProcessResult); }; - let processResultBtnGroup = [ - { name: '전체', value: AccountHolderSearchProcessResult.ALL }, - { name: '성공', value: AccountHolderSearchProcessResult.SUCCESS }, - { name: '실패', value: AccountHolderSearchProcessResult.FAILURE }, + let MidOptions = [ + { name: 'nictest001m', value: 'nictest001m' }, + { name: 'nictest002m', value: 'nictest002m' } ]; + + let bankOptions = [ + { name: '우리은행', value: '우리은행'}, + { name: '토스뱅킹', value: '토스뱅킹'} + ] + + let searchTypeOption = [ + { name: '예금주', value: AccountHolderSearchType.ACCOUNT_HOLDER }, + { name: '계좌번호', value: AccountHolderSearchType.ACCOUNT_NUMBER }, + ] + + let processResultBtnGroup = [ + { name: '전체', value: ProcessResult.ALL }, + { name: '성공', value: ProcessResult.SUCCESS }, + { name: '실패', value: ProcessResult.FAILURE }, + ]; + return ( <>
-
-
가맹점
-
- -
-
+ -
-
예금주/계좌번호
-
- - ) => setFilterSearchKeyword(e.target.value)} - /> -
-
+ -
-
은행
-
- -
-
+ { + + + const [filterMid, setFilterMid] = useState(mid); + const [filterSearchType, setFilterSearchType] = useState(searchType); + const [filterSearchKeyword, setFilterSearchKeyword] = useState(searchKeyword); + const [filterStartDate, setFilterStartDate] = useState(startDate); + const [filterEndDate, setFilterEndDate] = useState(endDate); + const [filterSendMethod, setFilterSendMethod] = useState(sendMethod) + const [filterSendingStatus, setFilterSendingStatus] = useState(sendingStatus); + const [dateReadOnly, setDateReadyOnly] = useState(true); + const [filterDateOptionsBtn, setFilterDateOptionsBtn] = useState(FilterDateOptions.Input); + + const [calendarOpen, setCalendarOpen] = useState(false); + + const variants = { + hidden: { x: '100%' }, + visible: { x: '0%' }, + }; + + const onClickToClose = () => { + setFilterOn(false); + }; + + const setNewDate = (newDate: any) => { + console.log(newDate) + }; + + const onClickToSetFilter = () => { + setMid(filterMid); + setSearchType(filterSearchType); + setSearchKeyword(filterSearchKeyword); + setStartDate(filterStartDate); + setEndDate(filterEndDate); + setSendMethod(filterSendMethod); + setSendingStatus(filterSendingStatus); + }; + + let MidOptions = [ + { name: 'nictest001m', value: 'nictest001m' }, + { name: 'nictest002m', value: 'nictest002m' } + ]; + + let searchTypeOption = [ + { name: '휴대폰번호', value: LinkPaymentSearchType.PHONE }, + { name: '이메일', value: LinkPaymentSearchType.EMAIL }, + ] + + let sendMethodOption = [ + { name: '전체', value: LinkPaymentSendMethod.ALL }, + { name: 'SMS', value: LinkPaymentSendMethod.SMS }, + { name: '이메일', value: LinkPaymentSendMethod.EMAIL }, + { name: '카카오', value: LinkPaymentSendMethod.KAKAO }, + ] + + let sendingStatusOption = [ + { name: '전체', value: LinkPaymentSendingStatus.ALL }, + { name: '발송요청', value: LinkPaymentSendingStatus.SEND_REQUEST }, + { name: '발송취소', value: LinkPaymentSendingStatus.SEND_CANCEL }, + ] + + return ( + <> + +
+
+
필터
+
+ +
+
+ +
+ + + + + + + + +
+
+ +
+
+ + + ) +} \ No newline at end of file diff --git a/src/entities/additional-service/ui/link-payment/filter/link-payment-shipping-history-filter.tsx b/src/entities/additional-service/ui/link-payment/filter/link-payment-shipping-history-filter.tsx new file mode 100644 index 0000000..086f6b2 --- /dev/null +++ b/src/entities/additional-service/ui/link-payment/filter/link-payment-shipping-history-filter.tsx @@ -0,0 +1,195 @@ +import moment from 'moment'; +import { useEffect } from 'react'; +import { IMAGE_ROOT } from '@/shared/constants/common'; +import { motion } from 'framer-motion'; +import { ChangeEvent, useState } from 'react'; +import { + LinkPaymentSearchType, + LinkPaymentSendMethod, + LinkPaymentShippingHistoryFilterProps, + LinkPaymentTransactionStatus, + ProcessResult +} from "../../../model/types"; +import { FilterSelect } from '@/shared/ui/filter/select'; +import { FilterSelectInput } from '@/shared/ui/filter/select-input'; +import { FilterDateOptions } from '@/entities/common/model/types'; +import { FilterCalendar } from '@/shared/ui/filter/filter-calendar'; +import { FilterButtonGroups } from '@/shared/ui/filter/button-groups'; + +export const LinkPaymentShippingHistoryFilter = ({ + filterOn, + setFilterOn, + mid, + searchType, + searchKeyword, + startDate, + endDate, + transactionStatus, + processResult, + sendMethod, + setMid, + setSearchType, + setSearchKeyword, + setStartDate, + setEndDate, + setTransactionStatus, + setProcessResult, + setSendMethod +}: LinkPaymentShippingHistoryFilterProps) => { + + + const [filterMid, setFilterMid] = useState(mid); + const [filterSearchType, setFilterSearchType] = useState(searchType); + const [filterSearchKeyword, setFilterSearchKeyword] = useState(searchKeyword); + const [filterStartDate, setFilterStartDate] = useState(startDate); + const [filterEndDate, setFilterEndDate] = useState(endDate); + const [filterTransactionStatus, setFilterTransactionStatus] = useState(transactionStatus) + const [filterProcessResult, setFilterProcessResult] = useState(processResult); + const [filterSendMethod, setFilterSendMethod] = useState(sendMethod); + const [dateReadOnly, setDateReadyOnly] = useState(true); + const [filterDateOptionsBtn, setFilterDateOptionsBtn] = useState(FilterDateOptions.Input); + + const [calendarOpen, setCalendarOpen] = useState(false); + + const variants = { + hidden: { x: '100%' }, + visible: { x: '0%' }, + }; + + const onClickToClose = () => { + setFilterOn(false); + }; + + const setNewDate = (newDate: any) => { + console.log(newDate) + }; + + const onClickToSetFilter = () => { + setMid(filterMid); + setSearchType(filterSearchType); + setSearchKeyword(filterSearchKeyword); + setStartDate(filterStartDate); + setEndDate(filterEndDate); + setTransactionStatus(filterTransactionStatus); + setProcessResult(filterProcessResult); + setSendMethod(filterSendMethod); + }; + + let MidOptions = [ + { name: 'nictest001m', value: 'nictest001m' }, + { name: 'nictest002m', value: 'nictest002m' } + ]; + + let searchTypeOption = [ + { name: '휴대폰번호', value: LinkPaymentSearchType.PHONE }, + { name: '이메일', value: LinkPaymentSearchType.EMAIL }, + ] + + let transactionStatusOption = [ + { name: '전체', value: LinkPaymentTransactionStatus.ALL }, + { name: '미완료/활성화', value: LinkPaymentTransactionStatus.ACTIVATE }, + { name: '입금요청', value: LinkPaymentTransactionStatus.DEPOSIT_REQUEST }, + { name: '결제완료', value: LinkPaymentTransactionStatus.TRANSACTION_COMPLETE }, + { name: '결제실패', value: LinkPaymentTransactionStatus.TRANSACTION_FAIL }, + { name: '결제중단/비활성화', value: LinkPaymentTransactionStatus.INACTIVE }, + ] + + let processResultOption = [ + { name: '전체', value: ProcessResult.ALL }, + { name: '성공', value: ProcessResult.SUCCESS }, + { name: '실패', value: ProcessResult.FAILURE }, + ] + + let sendMethodOption = [ + { name: '전체', value: LinkPaymentSendMethod.ALL }, + { name: 'SMS', value: LinkPaymentSendMethod.SMS }, + { name: '이메일', value: LinkPaymentSendMethod.EMAIL }, + { name: '카카오', value: LinkPaymentSendMethod.KAKAO }, + ] + + return ( + <> + +
+
+
필터
+
+ +
+
+ +
+ + + + + + + + + + +
+
+ +
+
+ + + ) +} \ No newline at end of file diff --git a/src/entities/additional-service/ui/link-payment/link-payment-filter.tsx b/src/entities/additional-service/ui/link-payment/link-payment-filter.tsx deleted file mode 100644 index 344a982..0000000 --- a/src/entities/additional-service/ui/link-payment/link-payment-filter.tsx +++ /dev/null @@ -1,193 +0,0 @@ -import { motion } from 'framer-motion'; -import {IMAGE_ROOT} from "@/shared/constants/common"; -import {LinkPaymentFilterProps} from "@/entities/additional-service/model/types"; - -export const LinkPaymentFilter = ({ - filterOn, - setFilterOn -}: LinkPaymentFilterProps) => { - const variants = { - hidden:{ x: '100%'}, - visible: {x: '0%'} - }; - - const onClickToClose = () => { - setFilterOn(false); - }; - return ( - <> - -
-
-
필터
-
- -
-
- -
-
-
가맹점
-
- -
-
- -
-
휴대폰번호, 이메일
-
- - -
-
- -
-
결제수단
-
- -
-
- -
-
조회기간
-
-
- 당일 - 일주일 - 1개월 - 직접입력 -
- -
-
- - -
- ~ -
- - -
-
-
-
- -
-
거래 구분
-
-
- 전체 - 미완료/
활성화 - 입금요청 - 결제완료 - -
-
-
-
- 결제실패 - 결제중단/
비활성화 - - -
-
-
- -
-
전송결과
-
-
- 전체 - 성공 - 실패 -
-
-
- -
-
발송수단
-
-
- 전체 - SMS - 이메일 - 카카오 -
-
-
- -
- -
- -
-
- - - ) -} \ No newline at end of file diff --git a/src/entities/additional-service/ui/link-payment/link-payment-pending-send-wrap.tsx b/src/entities/additional-service/ui/link-payment/link-payment-pending-send-wrap.tsx index f069648..e1a5fa2 100644 --- a/src/entities/additional-service/ui/link-payment/link-payment-pending-send-wrap.tsx +++ b/src/entities/additional-service/ui/link-payment/link-payment-pending-send-wrap.tsx @@ -1,22 +1,33 @@ +import moment from 'moment'; import { IMAGE_ROOT } from "@/shared/constants/common"; import { useState, useEffect } from "react"; -import { LinkPaymentFilter } from "./link-payment-filter"; +import { LinkPaymentPendingSendFilter } from "./filter/link-payment-pending-send-filter"; import { useNavigate } from '@/shared/lib/hooks/use-navigate'; import { PATHS } from "@/shared/constants/paths"; import { LinkPaymentPendingList } from "./link-payment-pending-list"; +import { LinkPaymentSearchType, LinkPaymentSendingStatus, LinkPaymentSendMethod } from "../../model/types"; export const LinkPaymentPendingSendWrap = () => { const { navigate } = useNavigate(); + const [filterOn, setFilterOn] = useState(false); + const [mid, setMid] = useState('nictest001m'); + const [searchType, setSearchType] = useState(LinkPaymentSearchType.ALL) + const [searchKeyword, setSearchKeyword] = useState(''); + const [startDate, setStartDate] = useState(moment().format('YYYY-MM-DD')); + const [endDate, setEndDate] = useState(moment().format('YYYY-MM-DD')); + const [sendMethod, setSendMethod] = useState(LinkPaymentSendMethod.ALL); + const [sendingStatus, setSendingStatus] = useState(LinkPaymentSendingStatus.ALL); + const [listItems, setListItems] = useState({}); - + const onClickToOpenFilter = () => { setFilterOn(!filterOn); }; const onClickToNavigate = () => { navigate(PATHS.additionalService.linkPayment.request) } - + const callList = () => { setListItems({ '20250608': [ @@ -28,7 +39,7 @@ export const LinkPaymentPendingSendWrap = () => { amount: 5254000 }, { - transactionId: 'pending2', + transactionId: 'pending2', customerName: '김*환(7000)', status: '발송요청', channel: 'SMS', @@ -111,7 +122,7 @@ export const LinkPaymentPendingSendWrap = () => {
-
@@ -120,10 +131,24 @@ export const LinkPaymentPendingSendWrap = () => { onClick={() => onClickToNavigate()} >결제 신청
- + mid={mid} + searchType={searchType} + searchKeyword={searchKeyword} + startDate={startDate} + endDate={endDate} + sendMethod={sendMethod} + sendingStatus={sendingStatus} + setMid={setMid} + setSearchType={setSearchType} + setSearchKeyword={setSearchKeyword} + setStartDate={setStartDate} + setEndDate={setEndDate} + setSendMethod={setSendMethod} + setSendingStatus={setSendingStatus} + > ) } \ No newline at end of file diff --git a/src/entities/additional-service/ui/link-payment/link-payment-dispatch-list-wrap.tsx b/src/entities/additional-service/ui/link-payment/link-payment-shipping-history-wrap.tsx similarity index 71% rename from src/entities/additional-service/ui/link-payment/link-payment-dispatch-list-wrap.tsx rename to src/entities/additional-service/ui/link-payment/link-payment-shipping-history-wrap.tsx index ae5c15d..eb483dd 100644 --- a/src/entities/additional-service/ui/link-payment/link-payment-dispatch-list-wrap.tsx +++ b/src/entities/additional-service/ui/link-payment/link-payment-shipping-history-wrap.tsx @@ -1,18 +1,28 @@ +import moment from 'moment'; import { IMAGE_ROOT } from "@/shared/constants/common"; import { useState, useEffect } from "react"; -import { LinkPaymentFilter } from "./link-payment-filter"; +import { LinkPaymentShippingHistoryFilter } from "./filter/link-payment-shipping-history-filter"; import { useNavigate } from '@/shared/lib/hooks/use-navigate'; import { PATHS } from "@/shared/constants/paths"; import { LinkPaymentList } from "./link-payment-list"; import { SortOptionsBox } from "./sort-options-box"; -import { SortByKeys } from "../../model/types"; +import { LinkPaymentSendMethod, LinkPaymentTransactionStatus, ProcessResult, SortByKeys } from "../../model/types"; +import { LinkPaymentSearchType, } from "../../model/types"; -export const LinkPaymentDispatchListWrap = () => { +export const LinkPaymentShippingHistoryWrap = () => { const { navigate } = useNavigate(); const [filterOn, setFilterOn] = useState(false); const [sortBy, setSortBy] = useState(SortByKeys.New); const [listItems, setListItems] = useState({}); + const [mid, setMid] = useState('nictest001m'); + const [searchType, setSearchType] = useState(LinkPaymentSearchType.ALL) + const [searchKeyword, setSearchKeyword] = useState(''); + const [startDate, setStartDate] = useState(moment().format('YYYY-MM-DD')); + const [endDate, setEndDate] = useState(moment().format('YYYY-MM-DD')); + const [transactionStatus, setTransactionStatus] = useState(LinkPaymentTransactionStatus.ALL) + const [processResult, setProcessResult] = useState(ProcessResult.ALL) + const [sendMethod, setSendMethod] = useState(LinkPaymentSendMethod.ALL) const onClickToOpenFilter = () => { setFilterOn(!filterOn); @@ -25,7 +35,7 @@ export const LinkPaymentDispatchListWrap = () => { callList({ sortBy: sort }); }; - const callList = (option?: {sortBy?: string, val?: string}) => { + const callList = (option?: { sortBy?: string, val?: string }) => { setListItems({ '20250608': [ { @@ -134,10 +144,26 @@ export const LinkPaymentDispatchListWrap = () => { onClick={() => onClickToNavigate()} >결제 신청 - + mid={mid} + searchType={searchType} + searchKeyword={searchKeyword} + startDate={startDate} + endDate={endDate} + transactionStatus={transactionStatus} + processResult={processResult} + sendMethod={sendMethod} + setMid={setMid} + setSearchType={setSearchType} + setSearchKeyword={setSearchKeyword} + setStartDate={setStartDate} + setEndDate={setEndDate} + setTransactionStatus={setTransactionStatus} + setProcessResult={setProcessResult} + setSendMethod={setSendMethod} + > ) } \ No newline at end of file diff --git a/src/entities/additional-service/ui/link-payment/link-payment-tab.tsx b/src/entities/additional-service/ui/link-payment/link-payment-tab.tsx index 1b38cff..75a9bfc 100644 --- a/src/entities/additional-service/ui/link-payment/link-payment-tab.tsx +++ b/src/entities/additional-service/ui/link-payment/link-payment-tab.tsx @@ -12,8 +12,8 @@ export const LinkPaymentTab = ({ const onClickToNavigation = (tab: LinkPaymentTabKeys) => { if(activeTab !== tab){ - if(tab === LinkPaymentTabKeys.DispatchList){ - navigate(PATHS.additionalService.linkPayment.dispatchList); + if(tab === LinkPaymentTabKeys.ShippingHistory){ + navigate(PATHS.additionalService.linkPayment.shippingHistory); } else if(tab === LinkPaymentTabKeys.PendingSend){ navigate(PATHS.additionalService.linkPayment.pendingSend); @@ -25,8 +25,8 @@ export const LinkPaymentTab = ({ <>