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 d816915..0b9e5cb 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 @@ -22,6 +22,8 @@ import useIntersectionObserver from '@/widgets/intersection-observer'; export const FundAccountResultListWrap = () => { const { navigate } = useNavigate(); + let recentCursor = null; + const userMid = useStore.getState().UserStore.mid; const [onActionIntersect, setOnActionIntersect] = useState(false); @@ -56,6 +58,7 @@ export const FundAccountResultListWrap = () => { if(entry.isIntersecting){ console.log('Element is now intersecting with the root. [' + onActionIntersect + ']'); if(onActionIntersect && !!pageParam.cursor){ + setOnActionIntersect(false); callList('page'); } } @@ -101,6 +104,7 @@ export const FundAccountResultListWrap = () => { setListItems(rs.content); } if(rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ){ setPageParam({ @@ -115,7 +119,8 @@ export const FundAccountResultListWrap = () => { }); } setOnActionIntersect( - !!rs.hasNext + !!rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ); }); diff --git a/src/entities/additional-service/ui/fund-account/transfer-list-wrap.tsx b/src/entities/additional-service/ui/fund-account/transfer-list-wrap.tsx index d7da6c8..c8a8a2a 100644 --- a/src/entities/additional-service/ui/fund-account/transfer-list-wrap.tsx +++ b/src/entities/additional-service/ui/fund-account/transfer-list-wrap.tsx @@ -57,6 +57,7 @@ export const FundAccountTransferListWrap = () => { if(entry.isIntersecting){ console.log('Element is now intersecting with the root. [' + onActionIntersect + ']'); if(onActionIntersect && !!pageParam.cursor){ + setOnActionIntersect(false); callList('page'); } } @@ -100,7 +101,8 @@ export const FundAccountTransferListWrap = () => { else{ setListItems(rs.content); } - if(rs.hasNext + if(rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ){ setPageParam({ @@ -115,7 +117,8 @@ export const FundAccountTransferListWrap = () => { }); } setOnActionIntersect( - !!rs.hasNext + !!rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ); }); 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 8f00aaa..99e013f 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 @@ -53,6 +53,7 @@ export const LinkPaymentHistoryWrap = () => { if(entry.isIntersecting){ console.log('Element is now intersecting with the root. [' + onActionIntersect + ']'); if(onActionIntersect && !!pageParam.cursor){ + setOnActionIntersect(false); callList('page'); } } @@ -102,6 +103,7 @@ export const LinkPaymentHistoryWrap = () => { setListItems(rs.content); } if(rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ){ setPageParam({ @@ -116,7 +118,8 @@ export const LinkPaymentHistoryWrap = () => { }); } setOnActionIntersect( - !!rs.hasNext + !!rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ); }); diff --git a/src/entities/additional-service/ui/link-payment/link-payment-wait-send-wrap.tsx b/src/entities/additional-service/ui/link-payment/link-payment-wait-send-wrap.tsx index c9563b6..d9db651 100644 --- a/src/entities/additional-service/ui/link-payment/link-payment-wait-send-wrap.tsx +++ b/src/entities/additional-service/ui/link-payment/link-payment-wait-send-wrap.tsx @@ -45,6 +45,7 @@ export const LinkPaymentWaitSendWrap = () => { if(entry.isIntersecting){ console.log('Element is now intersecting with the root. [' + onActionIntersect + ']'); if(onActionIntersect && !!pageParam.cursor){ + setOnActionIntersect(false); callList('page'); } } @@ -96,6 +97,7 @@ export const LinkPaymentWaitSendWrap = () => { setListItems(rs.content); } if(rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ){ setPageParam({ @@ -110,7 +112,8 @@ export const LinkPaymentWaitSendWrap = () => { }); } setOnActionIntersect( - !!rs.hasNext + !!rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ); }); diff --git a/src/entities/alarm/ui/alarm-list.tsx b/src/entities/alarm/ui/alarm-list.tsx index 4fa53b3..d686b93 100644 --- a/src/entities/alarm/ui/alarm-list.tsx +++ b/src/entities/alarm/ui/alarm-list.tsx @@ -51,6 +51,7 @@ export const AlarmList = ({ if(entry.isIntersecting){ console.log('Element is now intersecting with the root. [' + onActionIntersect + ']'); if(onActionIntersect && !!pageParam.cursor){ + setOnActionIntersect(false); callList('page'); } } diff --git a/src/entities/settlement/ui/list-wrap.tsx b/src/entities/settlement/ui/list-wrap.tsx index f6a791f..5c07c9d 100644 --- a/src/entities/settlement/ui/list-wrap.tsx +++ b/src/entities/settlement/ui/list-wrap.tsx @@ -148,6 +148,7 @@ export const ListWrap = ({ setSettlementDateListItems(rs.content); } if(rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ){ setPageParam({ @@ -162,7 +163,8 @@ export const ListWrap = ({ }); } setOnActionIntersect( - !!rs.hasNext + !!rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ); }); @@ -212,6 +214,7 @@ export const ListWrap = ({ setTransactionDateListItems(rs.content); } if(rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ){ setPageParam({ @@ -227,6 +230,7 @@ export const ListWrap = ({ } setOnActionIntersect( !!rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ); }); diff --git a/src/entities/vat-return/ui/list-wrap.tsx b/src/entities/vat-return/ui/list-wrap.tsx index 9efad74..411c5f9 100644 --- a/src/entities/vat-return/ui/list-wrap.tsx +++ b/src/entities/vat-return/ui/list-wrap.tsx @@ -40,6 +40,7 @@ export const ListWrap = () => { if(entry.isIntersecting){ console.log('Element is now intersecting with the root. [' + onActionIntersect + ']'); if(onActionIntersect && !!pageParam.cursor){ + setOnActionIntersect(false); callList('page'); } } @@ -79,6 +80,7 @@ export const ListWrap = () => { setListItems(rs.content); } if(rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ){ setPageParam({ @@ -94,6 +96,7 @@ export const ListWrap = () => { } setOnActionIntersect( !!rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ); }); diff --git a/src/pages/additional-service/account-holder-auth/account-holder-auth-page.tsx b/src/pages/additional-service/account-holder-auth/account-holder-auth-page.tsx index d9d46a3..7f2224d 100644 --- a/src/pages/additional-service/account-holder-auth/account-holder-auth-page.tsx +++ b/src/pages/additional-service/account-holder-auth/account-holder-auth-page.tsx @@ -23,6 +23,7 @@ import { AccountHolderAuthListItem, AccountHolderAuthStatus, ExtensionAccountHol import { AdditionalServiceCategory } from '@/entities/additional-service/model/types'; import { EmailBottomSheet } from '@/entities/common/ui/email-bottom-sheet'; import { useExtensionAccessCheck } from '@/shared/lib/hooks/use-extension-access-check'; +import useIntersectionObserver from '@/widgets/intersection-observer'; export const AccountHolderAuthPage = () => { const { navigate } = useNavigate(); @@ -34,6 +35,7 @@ export const AccountHolderAuthPage = () => { extensionCode: 'ACCOUNT_AUTH' }); + const [onActionIntersect, setOnActionIntersect] = useState(false); const [sortType, setSortType] = useState(SortTypeKeys.LATEST); const [listItems, setListItems] = useState>([]); const [filterOn, setFilterOn] = useState(false); @@ -52,26 +54,71 @@ export const AccountHolderAuthPage = () => { const { mutateAsync: accountHolderAuthList } = useExtensionAccountHolderAuthListMutation(); const { mutateAsync: downloadExcel } = useExtensionAccountHolderAuthDownloadExcelMutation(); + const onIntersect: IntersectionObserverCallback = (entries: Array) => { + entries.forEach((entry: IntersectionObserverEntry) => { + if(entry.isIntersecting){ + console.log('Element is now intersecting with the root. [' + onActionIntersect + ']'); + if(onActionIntersect && !!pageParam.cursor){ + setOnActionIntersect(false); + callList('page'); + } + } + else{ + console.log('Element is no longer intersecting with the root.'); + } + }); + }; - const callList = (option?: { - sortType?: SortTypeKeys, - status?: AccountHolderAuthStatus - }) => { + const { setTarget } = useIntersectionObserver({ + threshold: 1, + onIntersect + }); + + const callList = (type?: string) => { let listParams = { mid: mid, fromDate: fromDate, toDate: toDate, authStatus: authStatus, - page: pageParam + page: { + ...pageParam, + ...{ sortType: sortType } + } }; - - if (listParams.page) { - listParams.page.sortType = option?.sortType || sortType; - setPageParam(listParams.page); + if(type !== 'page' && listParams.page){ + listParams.page.cursor = null; } accountHolderAuthList(listParams).then((rs) => { - setListItems(rs.content); + if(type === 'page'){ + setListItems([ + ...listItems, + ...rs.content + ]); + } + else{ + setListItems(rs.content); + } + if(rs.hasNext + && rs.nextCursor !== pageParam.cursor + && rs.content.length === DEFAULT_PAGE_PARAM.size + ){ + setPageParam({ + ...pageParam, + ...{ cursor: rs.nextCursor } + }); + } + else{ + setPageParam({ + ...pageParam, + ...{ cursor: null } + }); + } + setOnActionIntersect( + !!rs.hasNext + && rs.nextCursor !== pageParam.cursor + && rs.content.length === DEFAULT_PAGE_PARAM.size + ); }); }; @@ -82,9 +129,6 @@ export const AccountHolderAuthPage = () => { const onClickToSort = (sort: SortTypeKeys) => { setSortType(sort); - callList({ - sortType: sort - }); }; const onClickToAuthStatus = (val: AccountHolderAuthStatus) => { @@ -118,7 +162,8 @@ export const AccountHolderAuthPage = () => { mid, fromDate, toDate, - authStatus + authStatus, + sortType ]); if (!hasAccess) { @@ -191,6 +236,7 @@ export const AccountHolderAuthPage = () => { listItems={listItems} mid={mid} > +
diff --git a/src/pages/additional-service/account-holder-search/account-holder-search-page.tsx b/src/pages/additional-service/account-holder-search/account-holder-search-page.tsx index fcbbc6a..32a95ea 100644 --- a/src/pages/additional-service/account-holder-search/account-holder-search-page.tsx +++ b/src/pages/additional-service/account-holder-search/account-holder-search-page.tsx @@ -23,6 +23,7 @@ import { AccountHolderSearchListItem, AccountHolderSearchCl, AccountHolderResult import { resultStatusBtnGroup } from '@/entities/additional-service/model/account-holder-search/constant'; import { EmailBottomSheet } from '@/entities/common/ui/email-bottom-sheet'; import { useExtensionAccessCheck } from '@/shared/lib/hooks/use-extension-access-check'; +import useIntersectionObserver from '@/widgets/intersection-observer'; export const AccountHolderSearchPage = () => { const { navigate } = useNavigate(); @@ -34,6 +35,7 @@ export const AccountHolderSearchPage = () => { extensionCode: 'SEARCH_ACCOUNT_NAME' }); + const [onActionIntersect, setOnActionIntersect] = useState(false); const [sortType, setSortType] = useState(SortTypeKeys.LATEST); const [listItems, setListItems] = useState>([]); const [pageParam, setPageParam] = useState(DEFAULT_PAGE_PARAM); @@ -56,11 +58,29 @@ export const AccountHolderSearchPage = () => { const { mutateAsync: accountHolderSearchList } = useExtensionAccountHolderSearchListMutation(); const { mutateAsync: downloadExcel } = useExtensionAccountHolderSearchDownloadExcelMutation(); + const onIntersect: IntersectionObserverCallback = (entries: Array) => { + entries.forEach((entry: IntersectionObserverEntry) => { + if(entry.isIntersecting){ + console.log('Element is now intersecting with the root. [' + onActionIntersect + ']'); + if(onActionIntersect && !!pageParam.cursor){ + setOnActionIntersect(false); + callList('page'); + } + } + else{ + console.log('Element is no longer intersecting with the root.'); + } + }); + }; - const callList = (option?: { - sortType?: SortTypeKeys, - resultStatus?: AccountHolderResultStatus - }) => { + const { setTarget } = useIntersectionObserver({ + threshold: 1, + onIntersect + }); + + + const callList = (type?: string) => { + setOnActionIntersect(false); let listParams = { mid: mid, searchCl: searchCl, @@ -68,17 +88,46 @@ export const AccountHolderSearchPage = () => { fromDate: startDate, toDate: endDate, bankCode: bank, - resultStatus: option?.resultStatus ?? resultStatus, - page: pageParam + resultStatus: resultStatus, + page: { + ...pageParam, + ...{ sortType: sortType } + } } - - if (listParams.page) { - listParams.page.sortType = option?.sortType || sortType; - setPageParam(listParams.page); + if(type !== 'page' && listParams.page){ + listParams.page.cursor = null; } accountHolderSearchList(listParams).then((rs) => { - setListItems(rs.content); + if(type === 'page'){ + setListItems([ + ...listItems, + ...rs.content + ]); + } + else{ + setListItems(rs.content); + } + if(rs.hasNext + && rs.nextCursor !== pageParam.cursor + && rs.content.length === DEFAULT_PAGE_PARAM.size + ){ + setPageParam({ + ...pageParam, + ...{ cursor: rs.nextCursor } + }); + } + else{ + setPageParam({ + ...pageParam, + ...{ cursor: null } + }); + } + setOnActionIntersect( + !!rs.hasNext + && rs.nextCursor !== pageParam.cursor + && rs.content.length === DEFAULT_PAGE_PARAM.size + ); }); } @@ -110,9 +159,6 @@ export const AccountHolderSearchPage = () => { const onClickToSort = (sort: SortTypeKeys) => { setSortType(sort); - callList({ - sortType: sort - }); }; const onClickToTransactionStatus = (val: AccountHolderResultStatus) => { @@ -128,7 +174,8 @@ export const AccountHolderSearchPage = () => { startDate, endDate, bank, - resultStatus + resultStatus, + sortType ]); if (!hasAccess) { @@ -199,6 +246,7 @@ export const AccountHolderSearchPage = () => { listItems={listItems} mid={mid} > +
diff --git a/src/pages/additional-service/alimtalk/list-page.tsx b/src/pages/additional-service/alimtalk/list-page.tsx index d4482c5..d69ccb5 100644 --- a/src/pages/additional-service/alimtalk/list-page.tsx +++ b/src/pages/additional-service/alimtalk/list-page.tsx @@ -65,6 +65,7 @@ export const AlimtalkListPage = () => { if(entry.isIntersecting){ console.log('Element is now intersecting with the root. [' + onActionIntersect + ']'); if(onActionIntersect && !!pageParam.cursor){ + setOnActionIntersect(false); callList('page'); } } @@ -114,6 +115,7 @@ export const AlimtalkListPage = () => { setListItems(rs.content); } if(rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ){ setPageParam({ @@ -129,6 +131,7 @@ export const AlimtalkListPage = () => { } setOnActionIntersect( !!rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ); }); diff --git a/src/pages/additional-service/ars/list-page.tsx b/src/pages/additional-service/ars/list-page.tsx index b8751e8..fa1b148 100644 --- a/src/pages/additional-service/ars/list-page.tsx +++ b/src/pages/additional-service/ars/list-page.tsx @@ -56,6 +56,7 @@ export const ArsListPage = () => { if(entry.isIntersecting){ console.log('Element is now intersecting with the root. [' + onActionIntersect + ']'); if(onActionIntersect && !!pageParam.cursor){ + setOnActionIntersect(false); callList('page'); } } @@ -108,6 +109,7 @@ export const ArsListPage = () => { setListItems(rs.content); } if(rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ){ setPageParam({ @@ -123,6 +125,7 @@ export const ArsListPage = () => { } setOnActionIntersect( !!rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ); }); diff --git a/src/pages/additional-service/face-auth/face-auth-page.tsx b/src/pages/additional-service/face-auth/face-auth-page.tsx index d4d444a..c1ea5bf 100644 --- a/src/pages/additional-service/face-auth/face-auth-page.tsx +++ b/src/pages/additional-service/face-auth/face-auth-page.tsx @@ -9,10 +9,10 @@ import { JSX, useEffect, useState } from 'react'; import { useStore } from '@/shared/model/store'; import { PATHS } from '@/shared/constants/paths'; import { - useSetHeaderTitle, - useSetHeaderType, - useSetFooterMode, - useSetOnBack + useSetHeaderTitle, + useSetHeaderType, + useSetFooterMode, + useSetOnBack } from '@/widgets/sub-layout/use-sub-layout'; import { FaceAuthFilter } from '@/entities/additional-service/ui/face-auth/filter/face-auth-filter'; @@ -23,238 +23,291 @@ import { useExtensionFaceAuthListtMutation } from '@/entities/additional-service import { useExtensionFaceAuthDownloadExcelMutation } from '@/entities/additional-service/api/face-auth/use-extension-face-auth-download-excel-mutation'; import { ListDateGroup } from '@/entities/additional-service/ui/list-date-group'; import { useExtensionAccessCheck } from '@/shared/lib/hooks/use-extension-access-check'; +import useIntersectionObserver from '@/widgets/intersection-observer'; export const FaceAuthPage = () => { - const { navigate } = useNavigate(); - const userMid = useStore.getState().UserStore.mid; + const { navigate } = useNavigate(); + const userMid = useStore.getState().UserStore.mid; + let recentCursor: null | string = null; - // 권한 체크 - const { hasAccess, AccessDeniedDialog } = useExtensionAccessCheck({ - extensionCode: 'FACE_AUTH' - }); - - const [sortType, setSortType] = useState(SortTypeKeys.LATEST); - const [listItems, setListItems] = useState>([]); - const [filterOn, setFilterOn] = useState(false); - const [pageParam, setPageParam] = useState(DEFAULT_PAGE_PARAM); - const [mid, setMid] = useState(userMid); - const [userMallId, setUserMallId] = useState(''); - const [fromDate, setFromDate] = useState(moment().format('YYYYMMDD')); - const [toDate, setToDate] = useState(moment().format('YYYYMMDD')); - const [transType, setTransType] = useState(FaceAuthTransType.ALL); - const [authResult, setAuthResult] = useState(FaceAuthResult.ALL); - const [emailBottomSheetOn, setEmailBottomSheetOn] = useState(false); + // 권한 체크 + const { hasAccess, AccessDeniedDialog } = useExtensionAccessCheck({ + extensionCode: 'FACE_AUTH' + }); + + const [onActionIntersect, setOnActionIntersect] = useState(false); + const [sortType, setSortType] = useState(SortTypeKeys.LATEST); + const [listItems, setListItems] = useState>([]); + const [filterOn, setFilterOn] = useState(false); + const [pageParam, setPageParam] = useState(DEFAULT_PAGE_PARAM); + const [mid, setMid] = useState(userMid); + const [userMallId, setUserMallId] = useState(''); + const [fromDate, setFromDate] = useState(moment().format('YYYYMMDD')); + const [toDate, setToDate] = useState(moment().format('YYYYMMDD')); + const [transType, setTransType] = useState(FaceAuthTransType.ALL); + const [authResult, setAuthResult] = useState(FaceAuthResult.ALL); + const [emailBottomSheetOn, setEmailBottomSheetOn] = useState(false); - useSetHeaderTitle('안면인증'); - useSetHeaderType(HeaderType.LeftArrow); - useSetFooterMode(false); - useSetOnBack(() => { - navigate(PATHS.home); - }); + useSetHeaderTitle('안면인증'); + useSetHeaderType(HeaderType.LeftArrow); + useSetFooterMode(false); + useSetOnBack(() => { + navigate(PATHS.home); + }); - const { mutateAsync: faceAuthHistoryList } = useExtensionFaceAuthListtMutation(); - const { mutateAsync: downloadExcel } = useExtensionFaceAuthDownloadExcelMutation(); + const { mutateAsync: faceAuthHistoryList } = useExtensionFaceAuthListtMutation(); + const { mutateAsync: downloadExcel } = useExtensionFaceAuthDownloadExcelMutation(); + const onIntersect: IntersectionObserverCallback = (entries: Array) => { + entries.forEach((entry: IntersectionObserverEntry) => { + if(entry.isIntersecting){ + console.log('Element is now intersecting with the root. [' + onActionIntersect + ']'); + if(onActionIntersect && !!pageParam.cursor){ + setOnActionIntersect(false); + callList('page'); + } + } + else{ + console.log('Element is no longer intersecting with the root.'); + } + }); + }; - const callList = (option?: { - sortType?: SortTypeKeys, - authResult?: FaceAuthResult - }) => { - let params: ExtensionFaceAuthListParams = { - mid: "faceauth0m", - userMallId: userMallId, - fromDate: fromDate, - toDate: toDate, - transType: transType, - authResult: option?.authResult ?? authResult, - page: pageParam - }; + const { setTarget } = useIntersectionObserver({ + threshold: 1, + onIntersect + }); - if (params.page) { - params.page.sortType = option?.sortType || sortType; - setPageParam(params.page); - } + const callList = (type?: string) => { + let listParams: ExtensionFaceAuthListParams = { + mid: "faceauth0m", + userMallId: userMallId, + fromDate: fromDate, + toDate: toDate, + transType: transType, + authResult: authResult, + page: { + ...pageParam, + ...{ sortType: sortType } + } + }; + if(type !== 'page' && listParams.page){ + listParams.page.cursor = null; + } - faceAuthHistoryList(params).then((rs: ExtensionFaceAuthListResponse) => { - setListItems(rs.content); + faceAuthHistoryList(listParams).then((rs: ExtensionFaceAuthListResponse) => { + if(type === 'page'){ + setListItems([ + ...listItems, + ...rs.content + ]); + } + else{ + setListItems(rs.content); + } + if(rs.hasNext + && rs.nextCursor !== pageParam.cursor + && rs.content.length === DEFAULT_PAGE_PARAM.size + ){ + setPageParam({ + ...pageParam, + ...{ cursor: rs.nextCursor } }); - }; + } + else{ + setPageParam({ + ...pageParam, + ...{ cursor: null } + }); + } + setOnActionIntersect( + !!rs.hasNext + && rs.nextCursor !== pageParam.cursor + && rs.content.length === DEFAULT_PAGE_PARAM.size + ); + }); + }; - const onClickToOpenEmailBottomSheet = () => { - setEmailBottomSheetOn(true); - }; + const onClickToOpenEmailBottomSheet = () => { + setEmailBottomSheetOn(true); + }; - const onSendRequest = (selectedEmail?: string) => { - if (selectedEmail) { - const params: ExtensionFaceAuthExcelDownlaodPrams = { - mid: "faceauth0m", - email: selectedEmail, - fromDate: fromDate, - toDate: toDate - }; - downloadExcel(params).then((rs: ExtensionFaceAuthExcelDownlaodResponse) => { - console.log('Excel Download Status:', rs.status); - }); - } - setEmailBottomSheetOn(false); - }; + const onSendRequest = (selectedEmail?: string) => { + if(selectedEmail){ + const params: ExtensionFaceAuthExcelDownlaodPrams = { + mid: "faceauth0m", + email: selectedEmail, + fromDate: fromDate, + toDate: toDate + }; + downloadExcel(params).then((rs: ExtensionFaceAuthExcelDownlaodResponse) => { + console.log('Excel Download Status:', rs.status); + }); + } + setEmailBottomSheetOn(false); + }; - const onClickToOpenFilter = () => { - setFilterOn(!filterOn); - }; + const onClickToOpenFilter = () => { + setFilterOn(!filterOn); + }; - const onClickToSort = (sort: SortTypeKeys) => { - setSortType(sort); - callList({ sortType: sort }); - }; + const onClickToSort = (sort: SortTypeKeys) => { + setSortType(sort); + }; - const onClickToAuthResult = (val: FaceAuthResult) => { - setAuthResult(val); - }; + const onClickToAuthResult = (val: FaceAuthResult) => { + setAuthResult(val); + }; - const getListDateGroup = () => { - let rs = []; - let date = ''; - let list = []; - for (let i = 0; i < listItems.length; i++) { - let item = listItems[i]; - if (!!item) { - let requestDate = item?.requestDate; - requestDate = requestDate?.substring(0, 8); - if (!!requestDate) { - if (i === 0) { - date = requestDate; - } - if (date !== requestDate) { - if (list.length > 0) { - rs.push( - - ); - } - date = requestDate; - list = []; - } - list.push(item); - } - } - } - if (list.length > 0) { - rs.push( - - ); - } - return rs; - }; + const getListDateGroup = () => { + let rs = []; + let date = ''; + let list = []; + for(let i = 0; i < listItems.length; i++){ + let item = listItems[i]; + if(!!item){ + let requestDate = item?.requestDate; + requestDate = requestDate?.substring(0, 8); + if(!!requestDate){ + if(i === 0){ + date = requestDate; + } + if(date !== requestDate){ + if(list.length > 0){ + rs.push( + + ); + } + date = requestDate; + list = []; + } + list.push(item); + } + } + } + if(list.length > 0){ + rs.push( + + ); + } + return rs; + }; - useEffect(() => { - callList(); - }, [mid, userMallId, fromDate, toDate, transType, authResult]); + useEffect(() => { + callList(); + }, [ + mid, userMallId, + fromDate, toDate, + transType, authResult, + sortType + ]); - // if (!hasAccess) { - // return ; - // } + // if (!hasAccess) { + // return ; + // } - return ( - <> -
-
-
-
-
-
- - -
- -
-
+ return ( + <> +
+
+
+
+
+
+ + +
+ +
+
-
- -
-
- { - AuthResultBtnGroup.map((value, index) => ( - onClickToAuthResult(value.value)} - >{value.name} - )) - } -
-
-
-
- {getListDateGroup()} -
-
-
-
- - - - ); +
+ +
+
+ { + AuthResultBtnGroup.map((value, index) => ( + onClickToAuthResult(value.value)} + >{value.name} + )) + } +
+
+
+
+ { getListDateGroup() } +
+
+
+
+
+ + + + ); }; \ No newline at end of file diff --git a/src/pages/additional-service/key-in-payment/key-in-payment-page.tsx b/src/pages/additional-service/key-in-payment/key-in-payment-page.tsx index 7a6249d..11bffe9 100644 --- a/src/pages/additional-service/key-in-payment/key-in-payment-page.tsx +++ b/src/pages/additional-service/key-in-payment/key-in-payment-page.tsx @@ -61,6 +61,7 @@ export const KeyInPaymentPage = () => { if(entry.isIntersecting){ console.log('Element is now intersecting with the root. [' + onActionIntersect + ']'); if(onActionIntersect && !!pageParam.cursor){ + setOnActionIntersect(false); callList('page'); } } @@ -104,6 +105,7 @@ export const KeyInPaymentPage = () => { setListItems(rs.content); } if(rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ){ setPageParam({ @@ -119,6 +121,7 @@ export const KeyInPaymentPage = () => { } setOnActionIntersect( !!rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ); }); diff --git a/src/pages/additional-service/payout/list-page.tsx b/src/pages/additional-service/payout/list-page.tsx index 2fc574d..109b43a 100644 --- a/src/pages/additional-service/payout/list-page.tsx +++ b/src/pages/additional-service/payout/list-page.tsx @@ -61,6 +61,7 @@ export const PayoutListPage = () => { if(entry.isIntersecting){ console.log('Element is now intersecting with the root. [' + onActionIntersect + ']'); if(onActionIntersect && !!pageParam.cursor){ + setOnActionIntersect(false); callList('page'); } } @@ -116,6 +117,7 @@ export const PayoutListPage = () => { setListItems(rs.content); } if(rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ){ setPageParam({ @@ -131,6 +133,7 @@ export const PayoutListPage = () => { } setOnActionIntersect( !!rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ); }); diff --git a/src/pages/additional-service/sms-payment/sms-payment-page.tsx b/src/pages/additional-service/sms-payment/sms-payment-page.tsx index 8d6255d..567d97e 100644 --- a/src/pages/additional-service/sms-payment/sms-payment-page.tsx +++ b/src/pages/additional-service/sms-payment/sms-payment-page.tsx @@ -58,6 +58,7 @@ export const SmsPaymentPage = () => { if(entry.isIntersecting){ console.log('Element is now intersecting with the root. [' + onActionIntersect + ']'); if(onActionIntersect && !!pageParam.cursor){ + setOnActionIntersect(false); callList('page'); } } @@ -104,6 +105,7 @@ export const SmsPaymentPage = () => { setListItems(rs.content); } if(rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ){ setPageParam({ @@ -119,6 +121,7 @@ export const SmsPaymentPage = () => { } setOnActionIntersect( !!rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ); }); diff --git a/src/pages/support/faq/list-page.tsx b/src/pages/support/faq/list-page.tsx index e320eef..77b925f 100644 --- a/src/pages/support/faq/list-page.tsx +++ b/src/pages/support/faq/list-page.tsx @@ -39,6 +39,7 @@ export const FaqListPage = () => { if(entry.isIntersecting){ console.log('Element is now intersecting with the root. [' + onActionIntersect + ']'); if(onActionIntersect && !!pageParam.cursor){ + setOnActionIntersect(false); callList('page'); } } @@ -76,6 +77,7 @@ export const FaqListPage = () => { setResultList(rs.content); } if(rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ){ setPageParam({ @@ -91,6 +93,7 @@ export const FaqListPage = () => { } setOnActionIntersect( !!rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ); }); diff --git a/src/pages/support/notice/list-page.tsx b/src/pages/support/notice/list-page.tsx index 1627d02..1118fe1 100644 --- a/src/pages/support/notice/list-page.tsx +++ b/src/pages/support/notice/list-page.tsx @@ -39,6 +39,7 @@ export const NoticeListPage = () => { if(entry.isIntersecting){ console.log('Element is now intersecting with the root. [' + onActionIntersect + ']'); if(onActionIntersect && !!pageParam.cursor){ + setOnActionIntersect(false); callList('page'); } } @@ -76,6 +77,7 @@ export const NoticeListPage = () => { setResultList(rs.content); } if(rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ){ setPageParam({ @@ -91,6 +93,7 @@ export const NoticeListPage = () => { } setOnActionIntersect( !!rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ); }); diff --git a/src/pages/support/qna/list-page.tsx b/src/pages/support/qna/list-page.tsx index 23c7b60..a7cac88 100644 --- a/src/pages/support/qna/list-page.tsx +++ b/src/pages/support/qna/list-page.tsx @@ -43,6 +43,7 @@ export const QnaListPage = () => { if(entry.isIntersecting){ console.log('Element is now intersecting with the root. [' + onActionIntersect + ']'); if(onActionIntersect && !!pageParam.cursor){ + setOnActionIntersect(false); callList('page'); } } @@ -78,6 +79,7 @@ export const QnaListPage = () => { setResultList(rs.content); } if(rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ){ setPageParam({ @@ -93,6 +95,7 @@ export const QnaListPage = () => { } setOnActionIntersect( !!rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ); }); diff --git a/src/pages/transaction/all-transaction/list-page.tsx b/src/pages/transaction/all-transaction/list-page.tsx index e59dbc7..e2c5219 100644 --- a/src/pages/transaction/all-transaction/list-page.tsx +++ b/src/pages/transaction/all-transaction/list-page.tsx @@ -79,6 +79,7 @@ export const AllTransactionListPage = () => { if(entry.isIntersecting){ console.log('Element is now intersecting with the root. [' + onActionIntersect + ']'); if(onActionIntersect && !!pageParam.cursor){ + setOnActionIntersect(false); callList('page'); } } @@ -136,6 +137,7 @@ export const AllTransactionListPage = () => { setListItems(rs.content); } if(rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ){ setPageParam({ @@ -151,6 +153,7 @@ export const AllTransactionListPage = () => { } setOnActionIntersect( !!rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ); }); diff --git a/src/pages/transaction/billing/list-page.tsx b/src/pages/transaction/billing/list-page.tsx index 271efff..a6289e5 100644 --- a/src/pages/transaction/billing/list-page.tsx +++ b/src/pages/transaction/billing/list-page.tsx @@ -68,6 +68,7 @@ export const BillingListPage = () => { if(entry.isIntersecting){ console.log('Element is now intersecting with the root. [' + onActionIntersect + ']'); if(onActionIntersect && !!pageParam.cursor){ + setOnActionIntersect(false); callList('page'); } } @@ -115,6 +116,7 @@ export const BillingListPage = () => { setListItems(rs.content); } if(rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ){ setPageParam({ @@ -130,6 +132,7 @@ export const BillingListPage = () => { } setOnActionIntersect( !!rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ); }); diff --git a/src/pages/transaction/cash-receipt/list-page.tsx b/src/pages/transaction/cash-receipt/list-page.tsx index 085d08a..a176dc0 100644 --- a/src/pages/transaction/cash-receipt/list-page.tsx +++ b/src/pages/transaction/cash-receipt/list-page.tsx @@ -75,6 +75,7 @@ export const CashReceiptListPage = () => { if(entry.isIntersecting){ console.log('Element is now intersecting with the root. [' + onActionIntersect + ']'); if(onActionIntersect && !!pageParam.cursor){ + setOnActionIntersect(false); callList('page'); } } @@ -124,6 +125,7 @@ export const CashReceiptListPage = () => { setListItems(rs.content); } if(rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ){ setPageParam({ @@ -139,6 +141,7 @@ export const CashReceiptListPage = () => { } setOnActionIntersect( !!rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ); }); diff --git a/src/pages/transaction/escrow/list-page.tsx b/src/pages/transaction/escrow/list-page.tsx index 1fb0b1f..36a3a62 100644 --- a/src/pages/transaction/escrow/list-page.tsx +++ b/src/pages/transaction/escrow/list-page.tsx @@ -67,6 +67,7 @@ export const EscrowListPage = () => { if(entry.isIntersecting){ console.log('Element is now intersecting with the root. [' + onActionIntersect + ']'); if(onActionIntersect && !!pageParam.cursor){ + setOnActionIntersect(false); callList('page'); } } @@ -113,6 +114,7 @@ export const EscrowListPage = () => { setListItems(rs.content); } if(rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ){ setPageParam({ @@ -128,6 +130,7 @@ export const EscrowListPage = () => { } setOnActionIntersect( !!rs.hasNext + && rs.nextCursor !== pageParam.cursor && rs.content.length === DEFAULT_PAGE_PARAM.size ); });