- 부가서비스 스크롤 중 필터 체크 마크 추가

- 자금이체,알림톡 스크롤 중 DateGroup 누락 수정
This commit is contained in:
HyeonJongKim
2025-11-20 15:27:19 +09:00
parent 3face63c36
commit 21089bb779
27 changed files with 522 additions and 446 deletions

View File

@@ -28,6 +28,7 @@ export interface AccountHolderAuthListProps {
listItems: Array<AccountHolderAuthItem>;
mid: string;
setDetailData: (detailData: DetailData) => void;
filterUsed: boolean;
onClickToOpenFilter: () => void;
onClickToOpenDownloadBottomSheet: () => void;
};

View File

@@ -25,6 +25,7 @@ export interface AccountHolderSearchListProps {
listItems: Array<AccountHolderSearchListItem>;
mid: string;
setDetailData: (detailData: DetailData) => void;
filterUsed: boolean;
onClickToOpenFilter: () => void;
onClickToOpenDownloadBottomSheet: () => void;
};

View File

@@ -26,6 +26,7 @@ export interface ArsListProps {
listItems: Array<ListItemProps>;
mid: string;
setDetailData: (detailData: DetailData) => void;
filterUsed: boolean;
onClickToOpenFilter: () => void;
onClickToOpenDownloadBottomSheet: () => void;
}

View File

@@ -34,6 +34,7 @@ export interface KeyInPaymentListProps {
additionalServiceCategory: AdditionalServiceCategory;
listItems: Array<KeyInPaymentListItem>;
mid?: string;
filterUsed: boolean;
onClickToOpenFilter: () => void;
onClickToOpenDownloadBottomSheet: () => void;
};

View File

@@ -105,6 +105,7 @@ export interface LinkPaymentHistoryListProps {
listItems: Array<LinkPaymentHistoryListItem>;
mid: string;
setDetailData: (detailData: DetailData) => void;
filterUsed: boolean;
onClickToOpenFilter: () => void;
onClickToOpenDownloadBottomSheet: () => void;
};
@@ -114,6 +115,7 @@ export interface LinkPaymentWaitListProps {
listItems: Array<LinkPaymentWaitListItem>;
mid: string;
setDetailData: (detailData: DetailData) => void;
filterUsed: boolean;
onClickToOpenFilter: () => void;
onClickToOpenDownloadBottomSheet: () => void;
};

View File

@@ -19,6 +19,7 @@ export interface PayoutListProps {
searchDateType: PayoutSearchDateType
mid: string;
setDetailData: (detailData: DetailData) => void;
filterUsed: boolean;
onClickToOpenFilter: () => void;
onClickToOpenDownloadBottomSheet: () => void;
};

View File

@@ -30,6 +30,7 @@ export interface SmsPaymentListProps {
additionalServiceCategory: AdditionalServiceCategory;
mid: string;
onResendClick?: (seq: number) => void;
filterUsed: boolean;
onClickToOpenFilter: () => void;
onClickToOpenDownloadBottomSheet: () => void;
};

View File

@@ -9,6 +9,7 @@ export const AccountHolderAuthList = ({
listItems,
mid,
setDetailData,
filterUsed,
onClickToOpenFilter,
onClickToOpenDownloadBottomSheet
}: AccountHolderAuthListProps) => {
@@ -98,6 +99,9 @@ export const AccountHolderAuthList = ({
alt={t('transaction.searchOptions')}
onClick={onClickToOpenFilter}
/>
{filterUsed &&
<span className="notification-badge2"></span>
}
</button>
<button className="download-btn">
<img

View File

@@ -13,6 +13,7 @@ export const AccountHolderSearchList = ({
listItems,
mid,
setDetailData,
filterUsed,
onClickToOpenFilter,
onClickToOpenDownloadBottomSheet
}: AccountHolderSearchListProps) => {
@@ -111,6 +112,9 @@ export const AccountHolderSearchList = ({
alt={t('transaction.searchOptions')}
onClick={ onClickToOpenFilter }
/>
{ filterUsed &&
<span className="notification-badge2"></span>
}
</button>
<button className="download-btn">
<img
@@ -124,7 +128,6 @@ export const AccountHolderSearchList = ({
}
<section
className="transaction-list"
style={{ height: (listHeight > 0)? listHeight + 'px': 'unset' }}
>
{ getListDateGroup() }
</section>

View File

@@ -10,6 +10,7 @@ export const ArsList = ({
listItems,
mid,
setDetailData,
filterUsed,
onClickToOpenFilter,
onClickToOpenDownloadBottomSheet
}: ArsListProps) => {
@@ -98,6 +99,9 @@ export const ArsList = ({
alt={t('transaction.searchOptions')}
onClick={onClickToOpenFilter}
/>
{ filterUsed &&
<span className="notification-badge2"></span>
}
</button>
<button className="download-btn">
<img

View File

@@ -296,16 +296,24 @@ export const FundAccountResultListWrap = () => {
let heightList = GetListHeight();
setListHeight(heightList.listHeight);
// DOM이 렌더링된 후에 이벤트 리스너 등록
const timer = setTimeout(() => {
let tabContent = document.querySelector('.tab-content');
tabContent?.addEventListener('scroll', (e: Event) => {
const handleScroll = (e: Event) => {
setScrollAction(e, setGroupDate, setGroupDateOn);
});
};
tabContent?.addEventListener('scroll', handleScroll);
return () => {
tabContent?.removeEventListener('scroll', handleScroll);
};
}, 100);
return () => {
ListScrollOn(false);
tabContent?.removeEventListener('scroll', (e: Event) => {
setScrollAction(e, setGroupDate, setGroupDateOn);
});
clearTimeout(timer);
};
}, []);
@@ -425,6 +433,9 @@ export const FundAccountResultListWrap = () => {
alt={t('transaction.searchOptions')}
onClick={onClickToOpenFilter}
/>
{filterUsed &&
<span className="notification-badge2"></span>
}
</button>
<button className="download-btn">
<img
@@ -438,7 +449,6 @@ export const FundAccountResultListWrap = () => {
}
<section
className="transaction-list"
style={{ height: (listHeight > 0) ? listHeight + 'px' : 'unset' }}
>
{getListDateGroup()}
</section>

View File

@@ -303,16 +303,24 @@ export const FundAccountTransferListWrap = () => {
let heightList = GetListHeight();
setListHeight(heightList.listHeight);
// DOM이 렌더링된 후에 이벤트 리스너 등록
const timer = setTimeout(() => {
let tabContent = document.querySelector('.tab-content');
tabContent?.addEventListener('scroll', (e: Event) => {
const handleScroll = (e: Event) => {
setScrollAction(e, setGroupDate, setGroupDateOn);
});
};
tabContent?.addEventListener('scroll', handleScroll);
return () => {
tabContent?.removeEventListener('scroll', handleScroll);
};
}, 100);
return () => {
ListScrollOn(false);
tabContent?.removeEventListener('scroll', (e: Event) => {
setScrollAction(e, setGroupDate, setGroupDateOn);
});
clearTimeout(timer);
};
}, []);
@@ -396,6 +404,9 @@ export const FundAccountTransferListWrap = () => {
alt={t('transaction.searchOptions')}
onClick={onClickToOpenFilter}
/>
{filterUsed &&
<span className="notification-badge2"></span>
}
</button>
<button className="download-btn">
<img
@@ -409,7 +420,6 @@ export const FundAccountTransferListWrap = () => {
}
<section
className="transaction-list pb-86"
style={{ height: (listHeight > 0)? listHeight + 'px': 'unset' }}
>
{getListDateGroup()}
</section>

View File

@@ -12,6 +12,7 @@ export const KeyInPaymentList = ({
additionalServiceCategory,
listItems,
mid,
filterUsed,
onClickToOpenFilter,
onClickToOpenDownloadBottomSheet
}: KeyInPaymentListProps) => {
@@ -106,6 +107,9 @@ export const KeyInPaymentList = ({
alt={t('transaction.searchOptions')}
onClick={onClickToOpenFilter}
/>
{filterUsed &&
<span className="notification-badge2"></span>
}
</button>
<button className="download-btn">
<img
@@ -119,7 +123,6 @@ export const KeyInPaymentList = ({
}
<section
className="transaction-list"
style={{ height: (listHeight > 0)? listHeight + 'px': 'unset' }}
>
{getListDateGroup()}
</section>

View File

@@ -9,6 +9,7 @@ export const LinkPaymentHistoryList = ({
listItems,
mid,
setDetailData,
filterUsed,
onClickToOpenFilter,
onClickToOpenDownloadBottomSheet
}: LinkPaymentHistoryListProps) => {
@@ -97,6 +98,9 @@ export const LinkPaymentHistoryList = ({
alt={t('transaction.searchOptions')}
onClick={onClickToOpenFilter}
/>
{filterUsed &&
<span className="notification-badge2"></span>
}
</button>
<button className="download-btn">
<img
@@ -110,7 +114,6 @@ export const LinkPaymentHistoryList = ({
}
<div
className="transaction-list"
style={{ height: (listHeight > 0)? listHeight + 'px': 'unset' }}
>
{getListDateGroup()}
</div>

View File

@@ -316,6 +316,7 @@ export const LinkPaymentHistoryWrap = () => {
additionalServiceCategory={AdditionalServiceCategory.LinkPaymentHistory}
mid={mid}
setDetailData={setDetailData}
filterUsed={filterUsed}
onClickToOpenFilter={onClickToOpenFilter}
onClickToOpenDownloadBottomSheet={onClickToOpenDownloadBottomSheet}
></LinkPaymentHistoryList>

View File

@@ -9,6 +9,7 @@ export const LinkPaymentWaitList = ({
listItems,
mid,
setDetailData,
filterUsed,
onClickToOpenFilter,
onClickToOpenDownloadBottomSheet
}: LinkPaymentWaitListProps) => {
@@ -97,6 +98,9 @@ export const LinkPaymentWaitList = ({
alt={t('transaction.searchOptions')}
onClick={onClickToOpenFilter}
/>
{filterUsed &&
<span className="notification-badge2"></span>
}
</button>
<button className="download-btn">
<img
@@ -110,7 +114,6 @@ export const LinkPaymentWaitList = ({
}
<div
className="transaction-list"
style={{ height: (listHeight > 0)? listHeight + 'px': 'unset' }}
>
{getListDateGroup()}
</div>

View File

@@ -281,6 +281,7 @@ export const LinkPaymentWaitSendWrap = () => {
additionalServiceCategory={AdditionalServiceCategory.LinkPaymentWait}
mid={mid}
setDetailData={setDetailData}
filterUsed={filterUsed}
onClickToOpenFilter={onClickToOpenFilter}
onClickToOpenDownloadBottomSheet={onClickToOpenDownloadBottomSheet}
></LinkPaymentWaitList>

View File

@@ -10,6 +10,7 @@ export const PayoutList = ({
searchDateType,
mid,
setDetailData,
filterUsed,
onClickToOpenFilter,
onClickToOpenDownloadBottomSheet
}: PayoutListProps) => {
@@ -99,6 +100,9 @@ export const PayoutList = ({
alt={t('transaction.searchOptions')}
onClick={onClickToOpenFilter}
/>
{filterUsed &&
<span className="notification-badge2"></span>
}
</button>
<button className="download-btn">
<img
@@ -112,7 +116,6 @@ export const PayoutList = ({
}
<section
className="transaction-list"
style={{ height: (listHeight > 0)? listHeight + 'px': 'unset' }}
>
{getListDateGroup()}
</section>

View File

@@ -9,6 +9,7 @@ export const SmsPaymentList = ({
additionalServiceCategory,
mid,
onResendClick,
filterUsed,
onClickToOpenFilter,
onClickToOpenDownloadBottomSheet
}: SmsPaymentListProps) => {
@@ -97,6 +98,9 @@ export const SmsPaymentList = ({
alt={t('transaction.searchOptions')}
onClick={onClickToOpenFilter}
/>
{filterUsed &&
<span className="notification-badge2"></span>
}
</button>
<button className="download-btn">
<img
@@ -110,7 +114,6 @@ export const SmsPaymentList = ({
}
<section
className="transaction-list"
style={{ height: (listHeight > 0)? listHeight + 'px': 'unset' }}
>
{getListDateGroup()}
</section>

View File

@@ -291,6 +291,7 @@ export const AccountHolderAuthPage = () => {
listItems={listItems}
mid={mid}
setDetailData={setDetailData}
filterUsed={ filterUsed }
onClickToOpenFilter={ onClickToOpenFilter }
onClickToOpenDownloadBottomSheet={ onClickToOpenDownloadBottomSheet }
></AccountHolderAuthList>

View File

@@ -311,6 +311,7 @@ export const AccountHolderSearchPage = () => {
listItems={listItems}
mid={mid}
setDetailData={setDetailData}
filterUsed={filterUsed}
onClickToOpenFilter={ onClickToOpenFilter }
onClickToOpenDownloadBottomSheet={ onClickToOpenDownloadBottomSheet }
></AccountHolderSearchList>

View File

@@ -324,16 +324,24 @@ export const AlimtalkListPage = () => {
let heightList = GetListHeight();
setListHeight(heightList.listHeight);
// DOM이 렌더링된 후에 이벤트 리스너 등록
const timer = setTimeout(() => {
let tabContent = document.querySelector('.tab-content');
tabContent?.addEventListener('scroll', (e: Event) => {
const handleScroll = (e: Event) => {
setScrollAction(e, setGroupDate, setGroupDateOn);
});
};
tabContent?.addEventListener('scroll', handleScroll);
return () => {
tabContent?.removeEventListener('scroll', handleScroll);
};
}, 100);
return () => {
ListScrollOn(false);
tabContent?.removeEventListener('scroll', (e: Event) => {
setScrollAction(e, setGroupDate, setGroupDateOn);
});
clearTimeout(timer);
};
}, []);
@@ -393,6 +401,9 @@ export const AlimtalkListPage = () => {
alt={t('transaction.searchOptions')}
onClick={ onClickToOpenFilter }
/>
{ filterUsed &&
<span className="notification-badge2"></span>
}
</button>
<button className="download-btn">
<img

View File

@@ -321,6 +321,7 @@ export const ArsListPage = () => {
listItems={listItems}
mid={mid}
setDetailData={setDetailData}
filterUsed={filterUsed}
onClickToOpenFilter={onClickToOpenFilter}
onClickToOpenDownloadBottomSheet={onClickToOpenDownloadBottomSheet}
></ArsList>

View File

@@ -356,6 +356,9 @@ export const FaceAuthPage = () => {
alt={t('transaction.searchOptions')}
onClick={onClickToOpenFilter}
/>
{ filterUsed &&
<span className="notification-badge2"></span>
}
</button>
<button className="download-btn">
<img

View File

@@ -289,6 +289,7 @@ export const KeyInPaymentPage = () => {
listItems={listItems}
additionalServiceCategory={AdditionalServiceCategory.KeyInPayment}
mid={mid}
filterUsed={filterUsed}
onClickToOpenFilter={ onClickToOpenFilter }
onClickToOpenDownloadBottomSheet={ onClickToOpenDownloadBottomSheet }
></KeyInPaymentList>

View File

@@ -331,6 +331,7 @@ export const PayoutListPage = () => {
searchDateType={searchDateType}
mid={mid}
setDetailData={setDetailData}
filterUsed={filterUsed}
onClickToOpenFilter={onClickToOpenFilter}
onClickToOpenDownloadBottomSheet={onClickToOpenDownloadBottomSheet}
></PayoutList>

View File

@@ -278,6 +278,7 @@ export const SmsPaymentPage = () => {
additionalServiceCategory={AdditionalServiceCategory.SMSPayment}
mid={mid}
onResendClick={onClickToShowDetail}
filterUsed={filterUsed}
onClickToOpenFilter={ onClickToOpenFilter }
onClickToOpenDownloadBottomSheet={ onClickToOpenDownloadBottomSheet }
></SmsPaymentList>