nicepayments/nice-app-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

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

Browse Source 
- 자금이체,알림톡 스크롤 중 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
Download Patch File Download Diff File Expand all files Collapse all files

1
src/entities/additional-service/model/account-holder-auth/types.ts
View File

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

1
src/entities/additional-service/model/account-holder-search/types.ts
View File

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

1
src/entities/additional-service/model/ars/types.ts
View File

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

1
src/entities/additional-service/model/key-in/types.ts
View File

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

2
src/entities/additional-service/model/link-pay/types.ts
View File

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

1
src/entities/additional-service/model/payout/types.ts
View File

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

1
src/entities/additional-service/model/sms-payment/types.ts
View File

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

42
src/entities/additional-service/ui/account-holder-auth/account-holder-auth-list.tsx
View File

@@ -9,6 +9,7 @@ export const AccountHolderAuthList = ({
listItems, listItems,
mid, mid,
setDetailData, setDetailData,
filterUsed,
onClickToOpenFilter, onClickToOpenFilter,
onClickToOpenDownloadBottomSheet onClickToOpenDownloadBottomSheet
}: AccountHolderAuthListProps) => { }: AccountHolderAuthListProps) => {
@@ -37,12 +38,12 @@ export const AccountHolderAuthList = ({
if (list.length > 0) { if (list.length > 0) {
rs.push( rs.push(
<ListDateGroup <ListDateGroup
additionalServiceCategory={ additionalServiceCategory } additionalServiceCategory={additionalServiceCategory}
key={ date + '-' + i } key={date + '-' + i}
mid={ mid } mid={mid}
date={ date } date={date}
items={ list } items={list}
setDetailData={ setDetailData } setDetailData={setDetailData}
></ListDateGroup> ></ListDateGroup>
); );
} }
@@ -56,12 +57,12 @@ export const AccountHolderAuthList = ({
if (list.length > 0) { if (list.length > 0) {
rs.push( rs.push(
<ListDateGroup <ListDateGroup
additionalServiceCategory={ additionalServiceCategory } additionalServiceCategory={additionalServiceCategory}
mid={ mid } mid={mid}
key={ date + '-last' } key={date + '-last'}
date={ date } date={date}
items={ list } items={list}
setDetailData={ setDetailData } setDetailData={setDetailData}
></ListDateGroup> ></ListDateGroup>
) )
} }
@@ -88,22 +89,25 @@ export const AccountHolderAuthList = ({
return ( return (
<> <>
{ groupDateOn && {groupDateOn &&
<div className="summary-amount scroll-group-date"> <div className="summary-amount scroll-group-date">
<span className="amount-text">{ groupDate }</span> <span className="amount-text">{groupDate}</span>
<div className="summary-actions"> <div className="summary-actions">
<button className="filter-btn"> <button className="filter-btn">
<img <img
src={ IMAGE_ROOT + '/ico_setting.svg' } src={IMAGE_ROOT + '/ico_setting.svg'}
alt={t('transaction.searchOptions')} alt={t('transaction.searchOptions')}
onClick={ onClickToOpenFilter } onClick={onClickToOpenFilter}
/> />
{filterUsed &&
<span className="notification-badge2"></span>
}
</button> </button>
<button className="download-btn"> <button className="download-btn">
<img <img
src={ IMAGE_ROOT + '/ico_download.svg' } src={IMAGE_ROOT + '/ico_download.svg'}
alt={t('transaction.download')} alt={t('transaction.download')}
onClick={ onClickToOpenDownloadBottomSheet } onClick={onClickToOpenDownloadBottomSheet}
/> />
</button> </button>
</div> </div>
@@ -111,7 +115,7 @@ export const AccountHolderAuthList = ({
} }
<div <div
className="transaction-list" className="transaction-list"
style={{ height: (listHeight > 0)? listHeight + 'px': 'unset' }} style={{ height: (listHeight > 0) ? listHeight + 'px' : 'unset' }}
> >
{getListDateGroup()} {getListDateGroup()}
</div> </div>

5
src/entities/additional-service/ui/account-holder-search/account-holder-search-list.tsx
View File

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

34
src/entities/additional-service/ui/ars/ars-list.tsx
View File

@@ -10,6 +10,7 @@ export const ArsList = ({
listItems, listItems,
mid, mid,
setDetailData, setDetailData,
filterUsed,
onClickToOpenFilter, onClickToOpenFilter,
onClickToOpenDownloadBottomSheet onClickToOpenDownloadBottomSheet
}: ArsListProps) => { }: ArsListProps) => {
@@ -24,17 +25,17 @@ export const ArsList = ({
let rs = []; let rs = [];
let date = ''; let date = '';
let list: Array<ListItemProps> = []; let list: Array<ListItemProps> = [];
for(let i=0;i<listItems.length;i++){ for (let i = 0; i < listItems.length; i++) {
let item = listItems[i]; let item = listItems[i];
if(!!item){ if (!!item) {
let orderDate = item?.orderDate || ''; let orderDate = item?.orderDate || '';
let itemDate = orderDate.substring(0, 8); let itemDate = orderDate.substring(0, 8);
if(!!itemDate){ if (!!itemDate) {
if(i === 0){ if (i === 0) {
date = itemDate; date = itemDate;
} }
if(date !== itemDate){ if (date !== itemDate) {
if(list.length > 0){ if (list.length > 0) {
rs.push( rs.push(
<ListDateGroup <ListDateGroup
additionalServiceCategory={additionalServiceCategory} additionalServiceCategory={additionalServiceCategory}
@@ -53,7 +54,7 @@ export const ArsList = ({
} }
} }
} }
if(list.length > 0){ if (list.length > 0) {
rs.push( rs.push(
<ListDateGroup <ListDateGroup
additionalServiceCategory={additionalServiceCategory} additionalServiceCategory={additionalServiceCategory}
@@ -88,22 +89,25 @@ export const ArsList = ({
return ( return (
<> <>
{ groupDateOn && {groupDateOn &&
<div className="summary-amount scroll-group-date"> <div className="summary-amount scroll-group-date">
<span className="amount-text">{ groupDate }</span> <span className="amount-text">{groupDate}</span>
<div className="summary-actions"> <div className="summary-actions">
<button className="filter-btn"> <button className="filter-btn">
<img <img
src={ IMAGE_ROOT + '/ico_setting.svg' } src={IMAGE_ROOT + '/ico_setting.svg'}
alt={t('transaction.searchOptions')} alt={t('transaction.searchOptions')}
onClick={ onClickToOpenFilter } onClick={onClickToOpenFilter}
/> />
{ filterUsed &&
<span className="notification-badge2"></span>
}
</button> </button>
<button className="download-btn"> <button className="download-btn">
<img <img
src={ IMAGE_ROOT + '/ico_download.svg' } src={IMAGE_ROOT + '/ico_download.svg'}
alt={t('transaction.download')} alt={t('transaction.download')}
onClick={ onClickToOpenDownloadBottomSheet } onClick={onClickToOpenDownloadBottomSheet}
/> />
</button> </button>
</div> </div>
@@ -111,9 +115,9 @@ export const ArsList = ({
} }
<section <section
className="transaction-list" className="transaction-list"
style={{ height: (listHeight > 0)? listHeight + 'px': 'unset' }} style={{ height: (listHeight > 0) ? listHeight + 'px' : 'unset' }}
> >
{ getListDateGroup() } {getListDateGroup()}
</section> </section>
</> </>
); );

22
src/entities/additional-service/ui/fund-account/result-list-wrap.tsx
View File

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

116
src/entities/additional-service/ui/fund-account/transfer-list-wrap.tsx
View File

@@ -78,8 +78,8 @@ export const FundAccountTransferListWrap = () => {
const { mutateAsync: extensionFundAccountBalance } = useExtensionFundAccountBalanceMutation(); const { mutateAsync: extensionFundAccountBalance } = useExtensionFundAccountBalanceMutation();
const onIntersect: IntersectionObserverCallback = (entries: Array<IntersectionObserverEntry>) => { const onIntersect: IntersectionObserverCallback = (entries: Array<IntersectionObserverEntry>) => {
entries.forEach((entry: IntersectionObserverEntry) => { entries.forEach((entry: IntersectionObserverEntry) => {
if(entry.isIntersecting){ if (entry.isIntersecting) {
if(onActionIntersect && !!pageParam.cursor){ if (onActionIntersect && !!pageParam.cursor) {
setOnActionIntersect(false); setOnActionIntersect(false);
callList('page'); callList('page');
} }
@@ -107,30 +107,30 @@ export const FundAccountTransferListWrap = () => {
...{ sortType: sortType } ...{ sortType: sortType }
} }
}; };
if(type !== 'page' && listParams.page){ if (type !== 'page' && listParams.page) {
listParams.page.cursor = null; listParams.page.cursor = null;
} }
extensionFundAccountTransferList(listParams).then((rs: any) => { extensionFundAccountTransferList(listParams).then((rs: any) => {
if(type === 'page'){ if (type === 'page') {
setListItems([ setListItems([
...listItems, ...listItems,
...rs.content ...rs.content
]); ]);
} }
else{ else {
setListItems(rs.content); setListItems(rs.content);
} }
if(rs.hasNext if (rs.hasNext
&& rs.nextCursor !== pageParam.cursor && rs.nextCursor !== pageParam.cursor
&& rs.content.length === DEFAULT_PAGE_PARAM.size && rs.content.length === DEFAULT_PAGE_PARAM.size
){ ) {
setPageParam({ setPageParam({
...pageParam, ...pageParam,
...{ cursor: rs.nextCursor } ...{ cursor: rs.nextCursor }
}); });
} }
else{ else {
setPageParam({ setPageParam({
...pageParam, ...pageParam,
...{ cursor: null } ...{ cursor: null }
@@ -142,7 +142,7 @@ export const FundAccountTransferListWrap = () => {
&& rs.content.length === DEFAULT_PAGE_PARAM.size && rs.content.length === DEFAULT_PAGE_PARAM.size
); );
}).catch((e: any) => { }).catch((e: any) => {
if(e.response?.data?.error?.message){ if (e.response?.data?.error?.message) {
snackBar(e.response?.data?.error?.message); snackBar(e.response?.data?.error?.message);
return; return;
} }
@@ -160,7 +160,7 @@ export const FundAccountTransferListWrap = () => {
const setDetailData = (detailData: DetailData) => { const setDetailData = (detailData: DetailData) => {
setDetailOn(detailData.detailOn); setDetailOn(detailData.detailOn);
if(detailData.seq){ if (detailData.seq) {
setDetailSeq(detailData.seq); setDetailSeq(detailData.seq);
} }
}; };
@@ -169,9 +169,9 @@ export const FundAccountTransferListWrap = () => {
selectedMode: DownloadSelectedMode, selectedMode: DownloadSelectedMode,
userEmail?: string userEmail?: string
) => { ) => {
if(selectedMode === DownloadSelectedMode.EMAIL if (selectedMode === DownloadSelectedMode.EMAIL
&& userEmail && userEmail
){ ) {
const params: ExtensionFundAccountTransferExcelParams = { const params: ExtensionFundAccountTransferExcelParams = {
mid: mid, mid: mid,
email: userEmail, email: userEmail,
@@ -181,7 +181,7 @@ export const FundAccountTransferListWrap = () => {
extensionFundAccountTransferExcel(params).then((rs: ExtensionFundAccountTransferExcelResponse) => { extensionFundAccountTransferExcel(params).then((rs: ExtensionFundAccountTransferExcelResponse) => {
console.log('Excel Download Status:', rs.status); console.log('Excel Download Status:', rs.status);
}).catch((e: any) => { }).catch((e: any) => {
if(e.response?.data?.error?.message){ if (e.response?.data?.error?.message) {
snackBar(e.response?.data?.error?.message); snackBar(e.response?.data?.error?.message);
return; return;
} }
@@ -196,7 +196,7 @@ export const FundAccountTransferListWrap = () => {
extensionFundAccountBalance(params).then((rs: ExtensionFundAccountBalanceResponse) => { extensionFundAccountBalance(params).then((rs: ExtensionFundAccountBalanceResponse) => {
setBalance(rs.balance); setBalance(rs.balance);
}).catch((e: any) => { }).catch((e: any) => {
if(e.response?.data?.error?.message){ if (e.response?.data?.error?.message) {
snackBar(e.response?.data?.error?.message); snackBar(e.response?.data?.error?.message);
return; return;
} }
@@ -232,11 +232,11 @@ export const FundAccountTransferListWrap = () => {
if (list.length > 0) { if (list.length > 0) {
rs.push( rs.push(
<ListDateGroup <ListDateGroup
additionalServiceCategory={ AdditionalServiceCategory.FundAccountTransfer } additionalServiceCategory={AdditionalServiceCategory.FundAccountTransfer}
key={ date + '-' + i } key={date + '-' + i}
date={ date } date={date}
items={ list } items={list}
setDetailData={ setDetailData } setDetailData={setDetailData}
></ListDateGroup> ></ListDateGroup>
); );
} }
@@ -250,12 +250,12 @@ export const FundAccountTransferListWrap = () => {
if (list.length > 0) { if (list.length > 0) {
rs.push( rs.push(
<ListDateGroup <ListDateGroup
additionalServiceCategory={ AdditionalServiceCategory.FundAccountTransfer } additionalServiceCategory={AdditionalServiceCategory.FundAccountTransfer}
mid={ mid } mid={mid}
key={ date + '-last' } key={date + '-last'}
date={ date } date={date}
items={ list } items={list}
setDetailData={ setDetailData } setDetailData={setDetailData}
></ListDateGroup> ></ListDateGroup>
); );
} }
@@ -272,13 +272,13 @@ export const FundAccountTransferListWrap = () => {
const checkUsedFilter = () => { const checkUsedFilter = () => {
let rs: boolean = true; let rs: boolean = true;
if(searchCl === defaultParams.searchCl if (searchCl === defaultParams.searchCl
&& searchValue === defaultParams.searchValue && searchValue === defaultParams.searchValue
&& fromDate === defaultParams.fromDate && fromDate === defaultParams.fromDate
&& toDate === defaultParams.toDate && toDate === defaultParams.toDate
&& status === defaultParams.status && status === defaultParams.status
&& bankCode === defaultParams.bankCode && bankCode === defaultParams.bankCode
){ ) {
rs = false; rs = false;
} }
setFilterUsed(rs); setFilterUsed(rs);
@@ -303,16 +303,24 @@ export const FundAccountTransferListWrap = () => {
let heightList = GetListHeight(); let heightList = GetListHeight();
setListHeight(heightList.listHeight); setListHeight(heightList.listHeight);
// DOM이 렌더링된 후에 이벤트 리스너 등록
const timer = setTimeout(() => {
let tabContent = document.querySelector('.tab-content'); let tabContent = document.querySelector('.tab-content');
tabContent?.addEventListener('scroll', (e: Event) => {
const handleScroll = (e: Event) => {
setScrollAction(e, setGroupDate, setGroupDateOn); setScrollAction(e, setGroupDate, setGroupDateOn);
}); };
tabContent?.addEventListener('scroll', handleScroll);
return () => {
tabContent?.removeEventListener('scroll', handleScroll);
};
}, 100);
return () => { return () => {
ListScrollOn(false); ListScrollOn(false);
tabContent?.removeEventListener('scroll', (e: Event) => { clearTimeout(timer);
setScrollAction(e, setGroupDate, setGroupDateOn);
});
}; };
}, []); }, []);
@@ -330,13 +338,13 @@ export const FundAccountTransferListWrap = () => {
<button <button
className="filter-btn" className="filter-btn"
aria-label="필터" aria-label="필터"
onClick={ onClickToOpenFilter } onClick={onClickToOpenFilter}
> >
<img <img
src={IMAGE_ROOT + '/ico_setting.svg'} src={IMAGE_ROOT + '/ico_setting.svg'}
alt="검색옵션" alt="검색옵션"
/> />
{ filterUsed && {filterUsed &&
<span className="notification-badge2"></span> <span className="notification-badge2"></span>
} }
</button> </button>
@@ -344,7 +352,7 @@ export const FundAccountTransferListWrap = () => {
<button <button
className="download-btn" className="download-btn"
aria-label="다운로드" aria-label="다운로드"
onClick={ onClickToOpenDownloadBottomSheet } onClick={onClickToOpenDownloadBottomSheet}
> >
<img <img
src={IMAGE_ROOT + '/ico_download.svg'} src={IMAGE_ROOT + '/ico_download.svg'}
@@ -386,22 +394,25 @@ export const FundAccountTransferListWrap = () => {
</div> </div>
</div> </div>
</section> </section>
{ groupDateOn && {groupDateOn &&
<div className="summary-amount scroll-group-date"> <div className="summary-amount scroll-group-date">
<span className="amount-text">{ groupDate }</span> <span className="amount-text">{groupDate}</span>
<div className="summary-actions"> <div className="summary-actions">
<button className="filter-btn"> <button className="filter-btn">
<img <img
src={ IMAGE_ROOT + '/ico_setting.svg' } src={IMAGE_ROOT + '/ico_setting.svg'}
alt={t('transaction.searchOptions')} alt={t('transaction.searchOptions')}
onClick={ onClickToOpenFilter } onClick={onClickToOpenFilter}
/> />
{filterUsed &&
<span className="notification-badge2"></span>
}
</button> </button>
<button className="download-btn"> <button className="download-btn">
<img <img
src={ IMAGE_ROOT + '/ico_download.svg' } src={IMAGE_ROOT + '/ico_download.svg'}
alt={t('transaction.download')} alt={t('transaction.download')}
onClick={ onClickToOpenDownloadBottomSheet } onClick={onClickToOpenDownloadBottomSheet}
/> />
</button> </button>
</div> </div>
@@ -409,11 +420,10 @@ export const FundAccountTransferListWrap = () => {
} }
<section <section
className="transaction-list pb-86" className="transaction-list pb-86"
style={{ height: (listHeight > 0)? listHeight + 'px': 'unset' }}
> >
{ getListDateGroup() } {getListDateGroup()}
</section> </section>
<div ref={ setTarget }></div> <div ref={setTarget}></div>
<div className="apply-row"> <div className="apply-row">
<button <button
className="btn-50 btn-blue flex-1" className="btn-50 btn-blue flex-1"
@@ -439,17 +449,17 @@ export const FundAccountTransferListWrap = () => {
setStatus={setStatus} setStatus={setStatus}
></FundAccountTransactionFilter> ></FundAccountTransactionFilter>
<FundAccountTransferDetail <FundAccountTransferDetail
detailOn={ detailOn } detailOn={detailOn}
setDetailOn={ setDetailOn } setDetailOn={setDetailOn}
seq={ detailSeq } seq={detailSeq}
></FundAccountTransferDetail> ></FundAccountTransferDetail>
{ !!downloadBottomSheetOn && {!!downloadBottomSheetOn &&
<DownloadBottomSheet <DownloadBottomSheet
bottomSheetOn={ downloadBottomSheetOn } bottomSheetOn={downloadBottomSheetOn}
setBottomSheetOn={ setDownloadBottomSheetOn } setBottomSheetOn={setDownloadBottomSheetOn}
imageMode={ false } imageMode={false}
emailMode={ true } emailMode={true}
sendRequest={ onRequestDownloadExcel } sendRequest={onRequestDownloadExcel}
></DownloadBottomSheet> ></DownloadBottomSheet>
} }
</> </>

17
src/entities/additional-service/ui/key-in-payment/key-in-payment-list.tsx
View File

@@ -12,6 +12,7 @@ export const KeyInPaymentList = ({
additionalServiceCategory, additionalServiceCategory,
listItems, listItems,
mid, mid,
filterUsed,
onClickToOpenFilter, onClickToOpenFilter,
onClickToOpenDownloadBottomSheet onClickToOpenDownloadBottomSheet
}: KeyInPaymentListProps) => { }: KeyInPaymentListProps) => {
@@ -96,22 +97,25 @@ export const KeyInPaymentList = ({
return ( return (
<> <>
{ groupDateOn && {groupDateOn &&
<div className="summary-amount scroll-group-date"> <div className="summary-amount scroll-group-date">
<span className="amount-text">{ groupDate }</span> <span className="amount-text">{groupDate}</span>
<div className="summary-actions"> <div className="summary-actions">
<button className="filter-btn"> <button className="filter-btn">
<img <img
src={ IMAGE_ROOT + '/ico_setting.svg' } src={IMAGE_ROOT + '/ico_setting.svg'}
alt={t('transaction.searchOptions')} alt={t('transaction.searchOptions')}
onClick={ onClickToOpenFilter } onClick={onClickToOpenFilter}
/> />
{filterUsed &&
<span className="notification-badge2"></span>
}
</button> </button>
<button className="download-btn"> <button className="download-btn">
<img <img
src={ IMAGE_ROOT + '/ico_download.svg' } src={IMAGE_ROOT + '/ico_download.svg'}
alt={t('transaction.download')} alt={t('transaction.download')}
onClick={ onClickToOpenDownloadBottomSheet } onClick={onClickToOpenDownloadBottomSheet}
/> />
</button> </button>
</div> </div>
@@ -119,7 +123,6 @@ export const KeyInPaymentList = ({
} }
<section <section
className="transaction-list" className="transaction-list"
style={{ height: (listHeight > 0)? listHeight + 'px': 'unset' }}
> >
{getListDateGroup()} {getListDateGroup()}
</section> </section>

41
src/entities/additional-service/ui/link-payment/link-payment-history-list.tsx
View File

@@ -9,6 +9,7 @@ export const LinkPaymentHistoryList = ({
listItems, listItems,
mid, mid,
setDetailData, setDetailData,
filterUsed,
onClickToOpenFilter, onClickToOpenFilter,
onClickToOpenDownloadBottomSheet onClickToOpenDownloadBottomSheet
}: LinkPaymentHistoryListProps) => { }: LinkPaymentHistoryListProps) => {
@@ -36,12 +37,12 @@ export const LinkPaymentHistoryList = ({
if (list.length > 0) { if (list.length > 0) {
rs.push( rs.push(
<ListDateGroup <ListDateGroup
additionalServiceCategory={ additionalServiceCategory } additionalServiceCategory={additionalServiceCategory}
mid={ mid } mid={mid}
key={ date + '-' + i } key={date + '-' + i}
date={ date } date={date}
items={ list } items={list}
setDetailData={ setDetailData } setDetailData={setDetailData}
></ListDateGroup> ></ListDateGroup>
); );
} }
@@ -55,12 +56,12 @@ export const LinkPaymentHistoryList = ({
if (list.length > 0) { if (list.length > 0) {
rs.push( rs.push(
<ListDateGroup <ListDateGroup
additionalServiceCategory={ additionalServiceCategory } additionalServiceCategory={additionalServiceCategory}
mid={ mid } mid={mid}
key={ date + '-last' } key={date + '-last'}
date={ date } date={date}
items={ list } items={list}
setDetailData={ setDetailData } setDetailData={setDetailData}
></ListDateGroup> ></ListDateGroup>
); );
} }
@@ -87,22 +88,25 @@ export const LinkPaymentHistoryList = ({
return ( return (
<> <>
{ groupDateOn && {groupDateOn &&
<div className="summary-amount scroll-group-date"> <div className="summary-amount scroll-group-date">
<span className="amount-text">{ groupDate }</span> <span className="amount-text">{groupDate}</span>
<div className="summary-actions"> <div className="summary-actions">
<button className="filter-btn"> <button className="filter-btn">
<img <img
src={ IMAGE_ROOT + '/ico_setting.svg' } src={IMAGE_ROOT + '/ico_setting.svg'}
alt={t('transaction.searchOptions')} alt={t('transaction.searchOptions')}
onClick={ onClickToOpenFilter } onClick={onClickToOpenFilter}
/> />
{filterUsed &&
<span className="notification-badge2"></span>
}
</button> </button>
<button className="download-btn"> <button className="download-btn">
<img <img
src={ IMAGE_ROOT + '/ico_download.svg' } src={IMAGE_ROOT + '/ico_download.svg'}
alt={t('transaction.download')} alt={t('transaction.download')}
onClick={ onClickToOpenDownloadBottomSheet } onClick={onClickToOpenDownloadBottomSheet}
/> />
</button> </button>
</div> </div>
@@ -110,7 +114,6 @@ export const LinkPaymentHistoryList = ({
} }
<div <div
className="transaction-list" className="transaction-list"
style={{ height: (listHeight > 0)? listHeight + 'px': 'unset' }}
> >
{getListDateGroup()} {getListDateGroup()}
</div> </div>

1
src/entities/additional-service/ui/link-payment/link-payment-history-wrap.tsx
View File

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

41
src/entities/additional-service/ui/link-payment/link-payment-wait-list.tsx
View File

@@ -9,6 +9,7 @@ export const LinkPaymentWaitList = ({
listItems, listItems,
mid, mid,
setDetailData, setDetailData,
filterUsed,
onClickToOpenFilter, onClickToOpenFilter,
onClickToOpenDownloadBottomSheet onClickToOpenDownloadBottomSheet
}: LinkPaymentWaitListProps) => { }: LinkPaymentWaitListProps) => {
@@ -36,12 +37,12 @@ export const LinkPaymentWaitList = ({
if (list.length > 0) { if (list.length > 0) {
rs.push( rs.push(
<ListDateGroup <ListDateGroup
additionalServiceCategory={ additionalServiceCategory } additionalServiceCategory={additionalServiceCategory}
key={ date + '-' + i } key={date + '-' + i}
mid={ mid } mid={mid}
date={ date } date={date}
items={ list } items={list}
setDetailData={ setDetailData } setDetailData={setDetailData}
></ListDateGroup> ></ListDateGroup>
); );
} }
@@ -55,12 +56,12 @@ export const LinkPaymentWaitList = ({
if (list.length > 0) { if (list.length > 0) {
rs.push( rs.push(
<ListDateGroup <ListDateGroup
additionalServiceCategory={ additionalServiceCategory } additionalServiceCategory={additionalServiceCategory}
mid={ mid } mid={mid}
key={ date + '-last' } key={date + '-last'}
date={ date } date={date}
items={ list } items={list}
setDetailData={ setDetailData } setDetailData={setDetailData}
></ListDateGroup> ></ListDateGroup>
); );
} }
@@ -87,22 +88,25 @@ export const LinkPaymentWaitList = ({
return ( return (
<> <>
{ groupDateOn && {groupDateOn &&
<div className="summary-amount scroll-group-date"> <div className="summary-amount scroll-group-date">
<span className="amount-text">{ groupDate }</span> <span className="amount-text">{groupDate}</span>
<div className="summary-actions"> <div className="summary-actions">
<button className="filter-btn"> <button className="filter-btn">
<img <img
src={ IMAGE_ROOT + '/ico_setting.svg' } src={IMAGE_ROOT + '/ico_setting.svg'}
alt={t('transaction.searchOptions')} alt={t('transaction.searchOptions')}
onClick={ onClickToOpenFilter } onClick={onClickToOpenFilter}
/> />
{filterUsed &&
<span className="notification-badge2"></span>
}
</button> </button>
<button className="download-btn"> <button className="download-btn">
<img <img
src={ IMAGE_ROOT + '/ico_download.svg' } src={IMAGE_ROOT + '/ico_download.svg'}
alt={t('transaction.download')} alt={t('transaction.download')}
onClick={ onClickToOpenDownloadBottomSheet } onClick={onClickToOpenDownloadBottomSheet}
/> />
</button> </button>
</div> </div>
@@ -110,7 +114,6 @@ export const LinkPaymentWaitList = ({
} }
<div <div
className="transaction-list" className="transaction-list"
style={{ height: (listHeight > 0)? listHeight + 'px': 'unset' }}
> >
{getListDateGroup()} {getListDateGroup()}
</div> </div>

1
src/entities/additional-service/ui/link-payment/link-payment-wait-send-wrap.tsx
View File

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

31
src/entities/additional-service/ui/payout/payout-list.tsx
View File

@@ -10,6 +10,7 @@ export const PayoutList = ({
searchDateType, searchDateType,
mid, mid,
setDetailData, setDetailData,
filterUsed,
onClickToOpenFilter, onClickToOpenFilter,
onClickToOpenDownloadBottomSheet onClickToOpenDownloadBottomSheet
}: PayoutListProps) => { }: PayoutListProps) => {
@@ -24,20 +25,20 @@ export const PayoutList = ({
let rs = []; let rs = [];
let date = ''; let date = '';
let list = []; let list = [];
for (let i=0;i<listItems.length;i++){ for (let i = 0; i < listItems.length; i++) {
let itemDateStr = ''; let itemDateStr = '';
if(searchDateType === PayoutSearchDateType.REQUEST_DATE){ if (searchDateType === PayoutSearchDateType.REQUEST_DATE) {
itemDateStr = listItems[i]?.requestDate || ''; itemDateStr = listItems[i]?.requestDate || '';
} }
else if(searchDateType === PayoutSearchDateType.SETTLEMENT_DATE){ else if (searchDateType === PayoutSearchDateType.SETTLEMENT_DATE) {
itemDateStr = listItems[i]?.settlementDate || ''; itemDateStr = listItems[i]?.settlementDate || '';
} }
let itemDate = itemDateStr.substring(0, 8); let itemDate = itemDateStr.substring(0, 8);
if(i === 0){ if (i === 0) {
date = itemDate; date = itemDate;
} }
if(date !== itemDate){ if (date !== itemDate) {
if(list.length > 0){ if (list.length > 0) {
rs.push( rs.push(
<ListDateGroup <ListDateGroup
additionalServiceCategory={additionalServiceCategory} additionalServiceCategory={additionalServiceCategory}
@@ -54,7 +55,7 @@ export const PayoutList = ({
} }
list.push(listItems[i] as any); list.push(listItems[i] as any);
} }
if(list.length > 0){ if (list.length > 0) {
rs.push( rs.push(
<ListDateGroup <ListDateGroup
additionalServiceCategory={additionalServiceCategory} additionalServiceCategory={additionalServiceCategory}
@@ -89,22 +90,25 @@ export const PayoutList = ({
return ( return (
<> <>
{ groupDateOn && {groupDateOn &&
<div className="summary-amount scroll-group-date"> <div className="summary-amount scroll-group-date">
<span className="amount-text">{ groupDate }</span> <span className="amount-text">{groupDate}</span>
<div className="summary-actions"> <div className="summary-actions">
<button className="filter-btn"> <button className="filter-btn">
<img <img
src={ IMAGE_ROOT + '/ico_setting.svg' } src={IMAGE_ROOT + '/ico_setting.svg'}
alt={t('transaction.searchOptions')} alt={t('transaction.searchOptions')}
onClick={ onClickToOpenFilter } onClick={onClickToOpenFilter}
/> />
{filterUsed &&
<span className="notification-badge2"></span>
}
</button> </button>
<button className="download-btn"> <button className="download-btn">
<img <img
src={ IMAGE_ROOT + '/ico_download.svg' } src={IMAGE_ROOT + '/ico_download.svg'}
alt={t('transaction.download')} alt={t('transaction.download')}
onClick={ onClickToOpenDownloadBottomSheet } onClick={onClickToOpenDownloadBottomSheet}
/> />
</button> </button>
</div> </div>
@@ -112,7 +116,6 @@ export const PayoutList = ({
} }
<section <section
className="transaction-list" className="transaction-list"
style={{ height: (listHeight > 0)? listHeight + 'px': 'unset' }}
> >
{getListDateGroup()} {getListDateGroup()}
</section> </section>

33
src/entities/additional-service/ui/sms-payment/sms-payment-list.tsx
View File

@@ -9,6 +9,7 @@ export const SmsPaymentList = ({
additionalServiceCategory, additionalServiceCategory,
mid, mid,
onResendClick, onResendClick,
filterUsed,
onClickToOpenFilter, onClickToOpenFilter,
onClickToOpenDownloadBottomSheet onClickToOpenDownloadBottomSheet
}: SmsPaymentListProps) => { }: SmsPaymentListProps) => {
@@ -25,23 +26,23 @@ export const SmsPaymentList = ({
let list = []; let list = [];
for (let i = 0; i < listItems.length; i++) { for (let i = 0; i < listItems.length; i++) {
let items = listItems[i]; let items = listItems[i];
if(!!items) { if (!!items) {
let sendDate = items?.sendDate; let sendDate = items?.sendDate;
sendDate = sendDate?.substring(0, 8); sendDate = sendDate?.substring(0, 8);
if(!!sendDate) { if (!!sendDate) {
if(i === 0) { if (i === 0) {
date = sendDate; date = sendDate;
} }
if(date !== sendDate) { if (date !== sendDate) {
if(list.length > 0) { if (list.length > 0) {
rs.push( rs.push(
<ListDateGroup <ListDateGroup
onResendClick={onResendClick} onResendClick={onResendClick}
additionalServiceCategory={additionalServiceCategory} additionalServiceCategory={additionalServiceCategory}
key={ date + '-' + i} key={date + '-' + i}
mid={mid} mid={mid}
date={ date } date={date}
items={ list } items={list}
></ListDateGroup> ></ListDateGroup>
); );
} }
@@ -87,22 +88,25 @@ export const SmsPaymentList = ({
return ( return (
<> <>
{ groupDateOn && {groupDateOn &&
<div className="summary-amount scroll-group-date"> <div className="summary-amount scroll-group-date">
<span className="amount-text">{ groupDate }</span> <span className="amount-text">{groupDate}</span>
<div className="summary-actions"> <div className="summary-actions">
<button className="filter-btn"> <button className="filter-btn">
<img <img
src={ IMAGE_ROOT + '/ico_setting.svg' } src={IMAGE_ROOT + '/ico_setting.svg'}
alt={t('transaction.searchOptions')} alt={t('transaction.searchOptions')}
onClick={ onClickToOpenFilter } onClick={onClickToOpenFilter}
/> />
{filterUsed &&
<span className="notification-badge2"></span>
}
</button> </button>
<button className="download-btn"> <button className="download-btn">
<img <img
src={ IMAGE_ROOT + '/ico_download.svg' } src={IMAGE_ROOT + '/ico_download.svg'}
alt={t('transaction.download')} alt={t('transaction.download')}
onClick={ onClickToOpenDownloadBottomSheet } onClick={onClickToOpenDownloadBottomSheet}
/> />
</button> </button>
</div> </div>
@@ -110,7 +114,6 @@ export const SmsPaymentList = ({
} }
<section <section
className="transaction-list" className="transaction-list"
style={{ height: (listHeight > 0)? listHeight + 'px': 'unset' }}
> >
{getListDateGroup()} {getListDateGroup()}
</section> </section>

1
src/pages/additional-service/account-holder-auth/account-holder-auth-page.tsx
View File

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

1
src/pages/additional-service/account-holder-search/account-holder-search-page.tsx
View File

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

21
src/pages/additional-service/alimtalk/list-page.tsx
View File

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

1
src/pages/additional-service/ars/list-page.tsx
View File

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

83
src/pages/additional-service/face-auth/face-auth-page.tsx
View File

@@ -78,8 +78,8 @@ export const FaceAuthPage = () => {
const { mutateAsync: downloadExcel } = useExtensionFaceAuthDownloadExcelMutation(); const { mutateAsync: downloadExcel } = useExtensionFaceAuthDownloadExcelMutation();
const onIntersect: IntersectionObserverCallback = (entries: Array<IntersectionObserverEntry>) => { const onIntersect: IntersectionObserverCallback = (entries: Array<IntersectionObserverEntry>) => {
entries.forEach((entry: IntersectionObserverEntry) => { entries.forEach((entry: IntersectionObserverEntry) => {
if(entry.isIntersecting){ if (entry.isIntersecting) {
if(onActionIntersect && !!pageParam.cursor){ if (onActionIntersect && !!pageParam.cursor) {
setOnActionIntersect(false); setOnActionIntersect(false);
callList('page'); callList('page');
} }
@@ -105,30 +105,30 @@ export const FaceAuthPage = () => {
...{ sortType: sortType } ...{ sortType: sortType }
} }
}; };
if(type !== 'page' && listParams.page){ if (type !== 'page' && listParams.page) {
listParams.page.cursor = null; listParams.page.cursor = null;
} }
faceAuthHistoryList(listParams).then((rs: ExtensionFaceAuthListResponse) => { faceAuthHistoryList(listParams).then((rs: ExtensionFaceAuthListResponse) => {
if(type === 'page'){ if (type === 'page') {
setListItems([ setListItems([
...listItems, ...listItems,
...rs.content ...rs.content
]); ]);
} }
else{ else {
setListItems(rs.content); setListItems(rs.content);
} }
if(rs.hasNext if (rs.hasNext
&& rs.nextCursor !== pageParam.cursor && rs.nextCursor !== pageParam.cursor
&& rs.content.length === DEFAULT_PAGE_PARAM.size && rs.content.length === DEFAULT_PAGE_PARAM.size
){ ) {
setPageParam({ setPageParam({
...pageParam, ...pageParam,
...{ cursor: rs.nextCursor } ...{ cursor: rs.nextCursor }
}); });
} }
else{ else {
setPageParam({ setPageParam({
...pageParam, ...pageParam,
...{ cursor: null } ...{ cursor: null }
@@ -140,7 +140,7 @@ export const FaceAuthPage = () => {
&& rs.content.length === DEFAULT_PAGE_PARAM.size && rs.content.length === DEFAULT_PAGE_PARAM.size
); );
}).catch((e: any) => { }).catch((e: any) => {
if(e.response?.data?.error?.message){ if (e.response?.data?.error?.message) {
snackBar(e.response?.data?.error?.message); snackBar(e.response?.data?.error?.message);
return; return;
} }
@@ -159,9 +159,9 @@ export const FaceAuthPage = () => {
selectedMode: DownloadSelectedMode, selectedMode: DownloadSelectedMode,
userEmail?: string userEmail?: string
) => { ) => {
if(selectedMode === DownloadSelectedMode.EMAIL if (selectedMode === DownloadSelectedMode.EMAIL
&& userEmail && userEmail
){ ) {
const params: ExtensionFaceAuthExcelDownlaodPrams = { const params: ExtensionFaceAuthExcelDownlaodPrams = {
mid: mid, mid: mid,
email: userEmail, email: userEmail,
@@ -171,7 +171,7 @@ export const FaceAuthPage = () => {
downloadExcel(params).then((rs: ExtensionFaceAuthExcelDownlaodResponse) => { downloadExcel(params).then((rs: ExtensionFaceAuthExcelDownlaodResponse) => {
console.log('Excel Download Status:', rs.status); console.log('Excel Download Status:', rs.status);
}).catch((e: any) => { }).catch((e: any) => {
if(e.response?.data?.error?.message){ if (e.response?.data?.error?.message) {
snackBar(e.response?.data?.error?.message); snackBar(e.response?.data?.error?.message);
return; return;
} }
@@ -195,17 +195,17 @@ export const FaceAuthPage = () => {
let rs = []; let rs = [];
let date = ''; let date = '';
let list = []; let list = [];
for(let i = 0; i < listItems.length; i++){ for (let i = 0; i < listItems.length; i++) {
let item = listItems[i]; let item = listItems[i];
if(!!item){ if (!!item) {
let requestDate = item?.requestDate; let requestDate = item?.requestDate;
requestDate = requestDate?.substring(0, 8); requestDate = requestDate?.substring(0, 8);
if(!!requestDate){ if (!!requestDate) {
if(i === 0){ if (i === 0) {
date = requestDate; date = requestDate;
} }
if(date !== requestDate){ if (date !== requestDate) {
if(list.length > 0){ if (list.length > 0) {
rs.push( rs.push(
<ListDateGroup <ListDateGroup
additionalServiceCategory={AdditionalServiceCategory.FaceAuth} additionalServiceCategory={AdditionalServiceCategory.FaceAuth}
@@ -223,7 +223,7 @@ export const FaceAuthPage = () => {
} }
} }
} }
if(list.length > 0){ if (list.length > 0) {
rs.push( rs.push(
<ListDateGroup <ListDateGroup
additionalServiceCategory={AdditionalServiceCategory.FaceAuth} additionalServiceCategory={AdditionalServiceCategory.FaceAuth}
@@ -239,12 +239,12 @@ export const FaceAuthPage = () => {
const checkUsedFilter = () => { const checkUsedFilter = () => {
let rs: boolean = true; let rs: boolean = true;
if(userMallId === defaultParams.userMallId if (userMallId === defaultParams.userMallId
&& fromDate === defaultParams.fromDate && fromDate === defaultParams.fromDate
&& toDate === defaultParams.toDate && toDate === defaultParams.toDate
&& transType === defaultParams.transType && transType === defaultParams.transType
&& authResult === defaultParams.authResult && authResult === defaultParams.authResult
){ ) {
rs = false; rs = false;
} }
setFilterUsed(rs); setFilterUsed(rs);
@@ -278,7 +278,7 @@ export const FaceAuthPage = () => {
}; };
}, []); }, []);
if(!hasAccess){ if (!hasAccess) {
return <AccessDeniedDialog />; return <AccessDeniedDialog />;
} }
@@ -303,9 +303,9 @@ export const FaceAuthPage = () => {
<img <img
src={IMAGE_ROOT + '/ico_setting.svg'} src={IMAGE_ROOT + '/ico_setting.svg'}
alt={t('transaction.searchOptions')} alt={t('transaction.searchOptions')}
onClick={ onClickToOpenFilter } onClick={onClickToOpenFilter}
/> />
{ filterUsed && {filterUsed &&
<span className="notification-badge2"></span> <span className="notification-badge2"></span>
} }
</button> </button>
@@ -313,7 +313,7 @@ export const FaceAuthPage = () => {
<button <button
className="download-btn" className="download-btn"
aria-label={t('transaction.download')} aria-label={t('transaction.download')}
onClick={ onClickToOpenDownloadBottomSheet } onClick={onClickToOpenDownloadBottomSheet}
> >
<img <img
src={IMAGE_ROOT + '/ico_download.svg'} src={IMAGE_ROOT + '/ico_download.svg'}
@@ -346,22 +346,25 @@ export const FaceAuthPage = () => {
</div> </div>
</div> </div>
</div> </div>
{ groupDateOn && {groupDateOn &&
<div className="summary-amount scroll-group-date"> <div className="summary-amount scroll-group-date">
<span className="amount-text">{ groupDate }</span> <span className="amount-text">{groupDate}</span>
<div className="summary-actions"> <div className="summary-actions">
<button className="filter-btn"> <button className="filter-btn">
<img <img
src={ IMAGE_ROOT + '/ico_setting.svg' } src={IMAGE_ROOT + '/ico_setting.svg'}
alt={t('transaction.searchOptions')} alt={t('transaction.searchOptions')}
onClick={ onClickToOpenFilter } onClick={onClickToOpenFilter}
/> />
{ filterUsed &&
<span className="notification-badge2"></span>
}
</button> </button>
<button className="download-btn"> <button className="download-btn">
<img <img
src={ IMAGE_ROOT + '/ico_download.svg' } src={IMAGE_ROOT + '/ico_download.svg'}
alt={t('transaction.download')} alt={t('transaction.download')}
onClick={ onClickToOpenDownloadBottomSheet } onClick={onClickToOpenDownloadBottomSheet}
/> />
</button> </button>
</div> </div>
@@ -369,11 +372,11 @@ export const FaceAuthPage = () => {
} }
<section <section
className="transaction-list" className="transaction-list"
style={{ height: (listHeight > 0)? listHeight + 'px': 'unset' }} style={{ height: (listHeight > 0) ? listHeight + 'px' : 'unset' }}
> >
{ getListDateGroup() } {getListDateGroup()}
</section> </section>
<div ref={ setTarget }></div> <div ref={setTarget}></div>
</div> </div>
</div> </div>
</main> </main>
@@ -393,13 +396,13 @@ export const FaceAuthPage = () => {
setTransType={setTransType} setTransType={setTransType}
setAuthResult={setAuthResult} setAuthResult={setAuthResult}
/> />
{ !!downloadBottomSheetOn && {!!downloadBottomSheetOn &&
<DownloadBottomSheet <DownloadBottomSheet
bottomSheetOn={ downloadBottomSheetOn } bottomSheetOn={downloadBottomSheetOn}
setBottomSheetOn={ setDownloadBottomSheetOn } setBottomSheetOn={setDownloadBottomSheetOn}
imageMode={ false } imageMode={false}
emailMode={ true } emailMode={true}
sendRequest={ onRequestDownloadExcel } sendRequest={onRequestDownloadExcel}
></DownloadBottomSheet> ></DownloadBottomSheet>
} }
</> </>

1
src/pages/additional-service/key-in-payment/key-in-payment-page.tsx
View File

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

1
src/pages/additional-service/payout/list-page.tsx
View File

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

1
src/pages/additional-service/sms-payment/sms-payment-page.tsx
View File

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