From 97407f52d728a5ebda589b1d79fa15e58125b1cd Mon Sep 17 00:00:00 2001 From: HyeonJongKim Date: Mon, 17 Nov 2025 20:17:49 +0900 Subject: [PATCH] =?UTF-8?q?-=20=EC=8B=A0=EC=9A=A9=EC=B9=B4=EB=93=9CARS,?= =?UTF-8?q?=EC=A7=80=EA=B8=89=EB=8C=80=ED=96=89,=EB=A7=81=ED=81=AC?= =?UTF-8?q?=EA=B2=B0=EC=A0=9C,=EC=9E=90=EA=B8=88=EC=9D=B4=EC=B2=B4-?= =?UTF-8?q?=EA=B2=B0=EA=B3=BC=EB=8C=80=EA=B8=B0=20=ED=95=84=ED=84=B0=20?= =?UTF-8?q?=EC=82=AC=EC=9A=A9=EC=A4=91=20=ED=91=9C=EC=8B=9C=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 --- .../ui/fund-account/result-list-wrap.tsx | 186 ++++++++++-------- .../link-payment-history-wrap.tsx | 94 ++++++--- .../link-payment-wait-send-wrap.tsx | 129 +++++++----- .../additional-service/alimtalk/list-page.tsx | 4 +- .../additional-service/ars/list-page.tsx | 64 ++++-- .../additional-service/payout/list-page.tsx | 87 ++++---- 6 files changed, 335 insertions(+), 229 deletions(-) diff --git a/src/entities/additional-service/ui/fund-account/result-list-wrap.tsx b/src/entities/additional-service/ui/fund-account/result-list-wrap.tsx index 23c8803..e76ba86 100644 --- a/src/entities/additional-service/ui/fund-account/result-list-wrap.tsx +++ b/src/entities/additional-service/ui/fund-account/result-list-wrap.tsx @@ -23,6 +23,16 @@ import { checkGrant } from '@/shared/lib/check-grant'; import { showAlert } from '@/widgets/show-alert'; import { snackBar } from '@/shared/lib'; +const defaultParams = { + fromDate: moment().format('YYYYMMDD'), + toDate: moment().format('YYYYMMDD'), + searchDateType: FundAccountSearchDateType.REQUEST_DATE, + searchCl: FundAccountSearchCl.ACCOUNT_NAME, + searchValue: '', + bankCode: '', + resultStatus: FundAccountResultStatus.ALL +} + export const FundAccountResultListWrap = () => { const { navigate } = useNavigate(); const { t } = useTranslation(); @@ -46,6 +56,7 @@ export const FundAccountResultListWrap = () => { const [bankCode, setBankCode] = useState(''); const [resultStatus, setResultStatus] = useState(FundAccountResultStatus.ALL); + const [filterUsed, setFilterUsed] = useState(false); const [downloadBottomSheetOn, setDownloadBottomSheetOn] = useState(false); const [totalRequestCount, setTotalRequestCount] = useState(0); @@ -61,7 +72,7 @@ export const FundAccountResultListWrap = () => { const [groupDate, setGroupDate] = useState(''); const [groupDateOn, setGroupDateOn] = useState(false); - + const [listHeight, setListHeight] = useState(0); const { mutateAsync: extensionFundAccountResultList } = useExtensionFundAccountResultListMutation(); @@ -69,20 +80,20 @@ export const FundAccountResultListWrap = () => { const { mutateAsync: extensionFundAccountResultSummary } = useExtensionFundAccountResultSummaryMutation(); const onIntersect: IntersectionObserverCallback = (entries: Array) => { entries.forEach((entry: IntersectionObserverEntry) => { - if(entry.isIntersecting){ - if(onActionIntersect && !!pageParam.cursor){ + if (entry.isIntersecting) { + if (onActionIntersect && !!pageParam.cursor) { setOnActionIntersect(false); callList('page'); - } + } } }); }; - const { setTarget } = useIntersectionObserver({ - threshold: 1, - onIntersect + const { setTarget } = useIntersectionObserver({ + threshold: 1, + onIntersect }); - + const callList = (type?: string) => { setOnActionIntersect(false); let listParams: ExtensionFundAccountResultListParams = { @@ -95,34 +106,34 @@ export const FundAccountResultListWrap = () => { bankCode: bankCode, resultStatus: resultStatus, page: { - ...pageParam, - ...{ sortType: sortType } - } + ...pageParam, + ...{ sortType: sortType } + } }; - if(type !== 'page' && listParams.page){ + if (type !== 'page' && listParams.page) { listParams.page.cursor = null; } extensionFundAccountResultList(listParams).then((rs: any) => { - if(type === 'page'){ + if (type === 'page') { setListItems([ ...listItems, ...rs.content ]); } - else{ + else { setListItems(rs.content); } - if(rs.hasNext + if (rs.hasNext && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size - ){ + ) { setPageParam({ ...pageParam, ...{ cursor: rs.nextCursor } }); } - else{ + else { setPageParam({ ...pageParam, ...{ cursor: null } @@ -130,11 +141,11 @@ export const FundAccountResultListWrap = () => { } setOnActionIntersect( !!rs.hasNext - && rs.nextCursor !== pageParam.cursor + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ); }).catch((e: any) => { - if(e.response?.data?.error?.message){ + if (e.response?.data?.error?.message) { snackBar(e.response?.data?.error?.message); return; } @@ -155,7 +166,7 @@ export const FundAccountResultListWrap = () => { setTotalFailCount(rs.totalFailCount); setTotalFailAmount(rs.totalFailAmount); }).catch((e: any) => { - if(e.response?.data?.error?.message){ + if (e.response?.data?.error?.message) { snackBar(e.response?.data?.error?.message); return; } @@ -171,12 +182,12 @@ export const FundAccountResultListWrap = () => { }; const onRequestDownloadExcel = ( - selectedMode: DownloadSelectedMode, - userEmail?: string - ) => { - if(selectedMode === DownloadSelectedMode.EMAIL + selectedMode: DownloadSelectedMode, + userEmail?: string + ) => { + if (selectedMode === DownloadSelectedMode.EMAIL && userEmail - ){ + ) { let params: ExtensionFundAccountResultExcelParams = { mid: mid, email: userEmail, @@ -187,7 +198,7 @@ export const FundAccountResultListWrap = () => { extensionFundAccountResultExcel(params).then((rs: ExtensionFundAccountResultExcelResponse) => { console.log('Excel Download Status:', rs); }).catch((e: any) => { - if(e.response?.data?.error?.message){ + if (e.response?.data?.error?.message) { snackBar(e.response?.data?.error?.message); return; } @@ -201,10 +212,10 @@ export const FundAccountResultListWrap = () => { const setDetailData = (detailData: DetailData) => { setDetailOn(detailData.detailOn); - if(detailData.mid){ + if (detailData.mid) { setDetailMid(detailData.mid); } - if(detailData.tid){ + if (detailData.tid) { setDetailTid(detailData.tid); } }; @@ -233,12 +244,12 @@ export const FundAccountResultListWrap = () => { if (list.length > 0) { rs.push( ); } @@ -252,29 +263,44 @@ export const FundAccountResultListWrap = () => { if (list.length > 0) { rs.push( ); } return rs; }; + const checkUsedFilter = () => { + let rs: boolean = true; + if (fromDate === defaultParams.fromDate + && toDate === defaultParams.toDate + && searchCl === defaultParams.searchCl + && searchValue === defaultParams.searchValue + && searchDateType === defaultParams.searchDateType + && bankCode === defaultParams.bankCode + && resultStatus === defaultParams.resultStatus + ) { + rs = false; + } + setFilterUsed(rs); + } + useEffect(() => { callSummary(); ListScrollOn(true); let heightList = GetListHeight(); setListHeight(heightList.listHeight); - + let tabContent = document.querySelector('.tab-content'); tabContent?.addEventListener('scroll', (e: Event) => { setScrollAction(e, setGroupDate, setGroupDateOn); }); - + return () => { ListScrollOn(false); tabContent?.removeEventListener('scroll', (e: Event) => { @@ -285,6 +311,7 @@ export const FundAccountResultListWrap = () => { useEffect(() => { callList(); + checkUsedFilter(); }, [ mid, searchCl, @@ -320,18 +347,21 @@ export const FundAccountResultListWrap = () => { - + {groupDateOn && +
+ {groupDate} +
+ + +
- } -
0)? listHeight + 'px': 'unset' }} + style={{ height: (listHeight > 0) ? listHeight + 'px' : 'unset' }} > - { getListDateGroup() } + {getListDateGroup()}
-
+
{ setResultStatus={setResultStatus} > - { !!downloadBottomSheetOn && + {!!downloadBottomSheetOn && } diff --git a/src/entities/additional-service/ui/link-payment/link-payment-history-wrap.tsx b/src/entities/additional-service/ui/link-payment/link-payment-history-wrap.tsx index d046d24..9c2e051 100644 --- a/src/entities/additional-service/ui/link-payment/link-payment-history-wrap.tsx +++ b/src/entities/additional-service/ui/link-payment/link-payment-history-wrap.tsx @@ -30,6 +30,18 @@ const getPaymentResultBtnGroup = (t: any) => [ { name: t('additionalService.linkPayment.paymentStopped'), value: LinkPaymentPaymentStatus.INACTIVE }, ]; +const defaultParams = { + fromDate: moment().format('YYYYMMDD'), + toDate: moment().format('YYYYMMDD'), + searchCl: LinkPaymentSearchCl.PHONE, + searchValue: '', + paymentMethod: LinkPaymentPaymentMethod.CARD, + paymentStatus: LinkPaymentPaymentStatus.ALL, + sendStatus: LinkPaymentSendStatus.ALL, + sendMethod: LinkPaymentSendMethod.ALL +} + + export const LinkPaymentHistoryWrap = () => { const { t } = useTranslation(); const { navigate } = useNavigate(); @@ -42,17 +54,19 @@ export const LinkPaymentHistoryWrap = () => { const [pageParam, setPageParam] = useState(DEFAULT_PAGE_PARAM); const [mid, setMid] = useState(userMid); - const [searchCl, setSearchCl] = useState(LinkPaymentSearchCl.PHONE); - const [searchValue, setSearchValue] = useState(''); - const [paymentMethod, setPaymentMethod] = useState(LinkPaymentPaymentMethod.CARD); - const [fromDate, setFromDate] = useState(moment().format('YYYYMMDD')); - const [toDate, setToDate] = useState(moment().format('YYYYMMDD')); - const [paymentStatus, setPaymentStatus] = useState(LinkPaymentPaymentStatus.ALL); - const [sendStatus, setSendStatus] = useState(LinkPaymentSendStatus.ALL); - const [sendMethod, setSendMethod] = useState(LinkPaymentSendMethod.ALL); - + const [searchCl, setSearchCl] = useState(defaultParams.searchCl); + const [searchValue, setSearchValue] = useState(defaultParams.searchValue); + const [paymentMethod, setPaymentMethod] = useState(defaultParams.paymentMethod); + const [fromDate, setFromDate] = useState(defaultParams.fromDate); + const [toDate, setToDate] = useState(defaultParams.toDate); + const [paymentStatus, setPaymentStatus] = useState(defaultParams.paymentStatus); + const [sendStatus, setSendStatus] = useState(defaultParams.sendStatus); + const [sendMethod, setSendMethod] = useState(defaultParams.sendMethod); + + const [filterUsed, setFilterUsed] = useState(false); + const [downloadBottomSheetOn, setDownloadBottomSheetOn] = useState(false); - + const [detailOn, setDetailOn] = useState(false); const [detailMid, setDetailMid] = useState(''); const [detailRequestId, setDetailRequestId] = useState(''); @@ -60,7 +74,7 @@ export const LinkPaymentHistoryWrap = () => { const { mutateAsync: linkPayHistoryList } = useExtensionLinkPayHistoryListMutation(); const { mutateAsync: downloadExcel } = useExtensionLinkPayHistoryDownloadExcelMutation(); - + const onIntersect: IntersectionObserverCallback = (entries: Array) => { entries.forEach((entry: IntersectionObserverEntry) => { if (entry.isIntersecting) { @@ -140,7 +154,7 @@ export const LinkPaymentHistoryWrap = () => { && rs.content.length === DEFAULT_PAGE_PARAM.size ); }).catch((e: any) => { - if(e.response?.data?.error?.message){ + if (e.response?.data?.error?.message) { snackBar(e.response?.data?.error?.message); return; } @@ -159,9 +173,9 @@ export const LinkPaymentHistoryWrap = () => { selectedMode: DownloadSelectedMode, userEmail?: string ) => { - if(selectedMode === DownloadSelectedMode.EMAIL - && userEmail - ){ + if (selectedMode === DownloadSelectedMode.EMAIL + && userEmail + ) { downloadExcel({ mid: mid, email: userEmail, @@ -176,11 +190,11 @@ export const LinkPaymentHistoryWrap = () => { }).then((rs) => { console.log('Excel Download Status: ' + rs.status); }).catch((e: any) => { - if(e.response?.data?.error?.message){ - snackBar(e.response?.data?.error?.message); - return; - } - }); + if (e.response?.data?.error?.message) { + snackBar(e.response?.data?.error?.message); + return; + } + }); } }; @@ -209,8 +223,25 @@ export const LinkPaymentHistoryWrap = () => { } }; + const checkUsedFilter = () => { + let rs: boolean = true; + if (fromDate === defaultParams.fromDate + && toDate === defaultParams.toDate + && searchCl === defaultParams.searchCl + && searchValue === defaultParams.searchValue + && paymentMethod === defaultParams.paymentMethod + && paymentStatus === defaultParams.paymentStatus + && sendMethod === defaultParams.sendMethod + && sendStatus === defaultParams.sendStatus + ) { + rs = false; + } + setFilterUsed(rs); + } + useEffect(() => { callList(); + checkUsedFilter(); }, [ mid, searchCl, @@ -240,14 +271,17 @@ export const LinkPaymentHistoryWrap = () => { {t('common.searchOptions')} + {filterUsed && + + }