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

페이징 방어코드 추가

Browse Source
This commit is contained in:
focp212@naver.com
2025-10-26 12:35:09 +09:00
parent f4b8ee29d8
commit fdedc3d519
22 changed files with 459 additions and 254 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -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<boolean>(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
);
});

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

@@ -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
);
});

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

@@ -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
);
});

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

@@ -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
);
});

1
src/entities/alarm/ui/alarm-list.tsx
View File

@@ -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');
}
}

6
src/entities/settlement/ui/list-wrap.tsx
View File

@@ -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
);
});

3
src/entities/vat-return/ui/list-wrap.tsx
View File

@@ -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
);
});

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

@@ -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<boolean>(false);
const [sortType, setSortType] = useState<SortTypeKeys>(SortTypeKeys.LATEST);
const [listItems, setListItems] = useState<Array<ExtensionAccountHolderAuthContentItem>>([]);
const [filterOn, setFilterOn] = useState<boolean>(false);
@@ -52,26 +54,71 @@ export const AccountHolderAuthPage = () => {
const { mutateAsync: accountHolderAuthList } = useExtensionAccountHolderAuthListMutation();
const { mutateAsync: downloadExcel } = useExtensionAccountHolderAuthDownloadExcelMutation();
const onIntersect: IntersectionObserverCallback = (entries: Array<IntersectionObserverEntry>) => {
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}
></AccountHolderAuthList>
<div ref={ setTarget }></div>
</div>
</div>
</main>

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

@@ -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<boolean>(false);
const [sortType, setSortType] = useState<SortTypeKeys>(SortTypeKeys.LATEST);
const [listItems, setListItems] = useState<Array<AccountHolderSearchListItem>>([]);
const [pageParam, setPageParam] = useState<DefaultRequestPagination>(DEFAULT_PAGE_PARAM);
@@ -56,11 +58,29 @@ export const AccountHolderSearchPage = () => {
const { mutateAsync: accountHolderSearchList } = useExtensionAccountHolderSearchListMutation();
const { mutateAsync: downloadExcel } = useExtensionAccountHolderSearchDownloadExcelMutation();
const onIntersect: IntersectionObserverCallback = (entries: Array<IntersectionObserverEntry>) => {
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}
></AccountHolderSearchList>
<div ref={ setTarget }></div>
</div>
</div>
</main>

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

@@ -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
);
});

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

@@ -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
);
});

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

@@ -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>(SortTypeKeys.LATEST);
const [listItems, setListItems] = useState<Array<FaceAuthListItem>>([]);
const [filterOn, setFilterOn] = useState<boolean>(false);
const [pageParam, setPageParam] = useState<DefaultRequestPagination>(DEFAULT_PAGE_PARAM);
const [mid, setMid] = useState<string>(userMid);
const [userMallId, setUserMallId] = useState<string>('');
const [fromDate, setFromDate] = useState<string>(moment().format('YYYYMMDD'));
const [toDate, setToDate] = useState<string>(moment().format('YYYYMMDD'));
const [transType, setTransType] = useState<FaceAuthTransType>(FaceAuthTransType.ALL);
const [authResult, setAuthResult] = useState<FaceAuthResult>(FaceAuthResult.ALL);
const [emailBottomSheetOn, setEmailBottomSheetOn] = useState<boolean>(false);
// 권한 체크
const { hasAccess, AccessDeniedDialog } = useExtensionAccessCheck({
extensionCode: 'FACE_AUTH'
});
const [onActionIntersect, setOnActionIntersect] = useState<boolean>(false);
const [sortType, setSortType] = useState<SortTypeKeys>(SortTypeKeys.LATEST);
const [listItems, setListItems] = useState<Array<FaceAuthListItem>>([]);
const [filterOn, setFilterOn] = useState<boolean>(false);
const [pageParam, setPageParam] = useState<DefaultRequestPagination>(DEFAULT_PAGE_PARAM);
const [mid, setMid] = useState<string>(userMid);
const [userMallId, setUserMallId] = useState<string>('');
const [fromDate, setFromDate] = useState<string>(moment().format('YYYYMMDD'));
const [toDate, setToDate] = useState<string>(moment().format('YYYYMMDD'));
const [transType, setTransType] = useState<FaceAuthTransType>(FaceAuthTransType.ALL);
const [authResult, setAuthResult] = useState<FaceAuthResult>(FaceAuthResult.ALL);
const [emailBottomSheetOn, setEmailBottomSheetOn] = useState<boolean>(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<IntersectionObserverEntry>) => {
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(
<ListDateGroup
additionalServiceCategory={AdditionalServiceCategory.FaceAuth}
mid={mid}
key={date + '-' + i}
date={date}
items={list as any}
></ListDateGroup>
);
}
date = requestDate;
list = [];
}
list.push(item);
}
}
}
if (list.length > 0) {
rs.push(
<ListDateGroup
additionalServiceCategory={AdditionalServiceCategory.FaceAuth}
mid={mid}
key={date + '-last'}
date={date}
items={list as any}
></ListDateGroup>
);
}
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(
<ListDateGroup
additionalServiceCategory={AdditionalServiceCategory.FaceAuth}
mid={mid}
key={date + '-' + i}
date={date}
items={list as any}
></ListDateGroup>
);
}
date = requestDate;
list = [];
}
list.push(item);
}
}
}
if(list.length > 0){
rs.push(
<ListDateGroup
additionalServiceCategory={AdditionalServiceCategory.FaceAuth}
mid={mid}
key={date + '-last'}
date={date}
items={list as any}
></ListDateGroup>
);
}
return rs;
};
useEffect(() => {
callList();
}, [mid, userMallId, fromDate, toDate, transType, authResult]);
useEffect(() => {
callList();
}, [
mid, userMallId,
fromDate, toDate,
transType, authResult,
sortType
]);
// if (!hasAccess) {
// return <AccessDeniedDialog />;
// }
// if (!hasAccess) {
// return <AccessDeniedDialog />;
// }
return (
<>
<main>
<div className="tab-content">
<div className="tab-pane sub active">
<section className="summary-section">
<div className="credit-controls">
<div>
<input
className="credit-period"
type="text"
value={moment(fromDate).format('YYYY.MM.DD') + '-' + moment(toDate).format('YYYY.MM.DD')}
readOnly={true}
/>
<button
className="filter-btn"
aria-label="필터"
>
<img
src={IMAGE_ROOT + '/ico_setting.svg'}
alt="검색옵션"
onClick={() => onClickToOpenFilter()}
/>
</button>
</div>
<button
className="download-btn"
aria-label="다운로드"
onClick={() => onClickToOpenEmailBottomSheet()}
>
<img
src={IMAGE_ROOT + '/ico_download.svg'}
alt="다운로드"
/>
</button>
</div>
</section>
return (
<>
<main>
<div className="tab-content">
<div className="tab-pane sub active">
<section className="summary-section">
<div className="credit-controls">
<div>
<input
className="credit-period"
type="text"
value={moment(fromDate).format('YYYY.MM.DD') + '-' + moment(toDate).format('YYYY.MM.DD')}
readOnly={true}
/>
<button
className="filter-btn"
aria-label="필터"
>
<img
src={IMAGE_ROOT + '/ico_setting.svg'}
alt="검색옵션"
onClick={() => onClickToOpenFilter()}
/>
</button>
</div>
<button
className="download-btn"
aria-label="다운로드"
onClick={() => onClickToOpenEmailBottomSheet()}
>
<img
src={IMAGE_ROOT + '/ico_download.svg'}
alt="다운로드"
/>
</button>
</div>
</section>
<div className="filter-section">
<SortTypeBox
sortType={sortType}
onClickToSort={onClickToSort}
sortOptions={[
{ key: SortTypeKeys.LATEST, label: '최신순' },
{ key: SortTypeKeys.OLDEST, label: '오래된순' }
]}
></SortTypeBox>
<div className="excrow">
<div className="full-menu-keywords no-padding">
{
AuthResultBtnGroup.map((value, index) => (
<span
key={`key-service-code=${index}`}
className={`keyword-tag ${(authResult === value.value) ? 'active' : ''}`}
onClick={() => onClickToAuthResult(value.value)}
>{value.name}</span>
))
}
</div>
</div>
</div>
<section className="transaction-list">
{getListDateGroup()}
</section>
</div>
</div>
</main>
<FaceAuthFilter
filterOn={filterOn}
setFilterOn={setFilterOn}
mid={mid}
userMallId={userMallId}
fromDate={fromDate}
toDate={toDate}
transType={transType}
authResult={authResult}
setMid={setMid}
setUserMallId={setUserMallId}
setFromDate={setFromDate}
setToDate={setToDate}
setTransType={setTransType}
setAuthResult={setAuthResult}
/>
<EmailBottomSheet
bottomSheetOn={emailBottomSheetOn}
setBottomSheetOn={setEmailBottomSheetOn}
imageSave={false}
sendEmail={true}
sendRequest={onSendRequest}
></EmailBottomSheet>
</>
);
<div className="filter-section">
<SortTypeBox
sortType={sortType}
onClickToSort={onClickToSort}
sortOptions={[
{ key: SortTypeKeys.LATEST, label: '최신순' },
{ key: SortTypeKeys.OLDEST, label: '오래된순' }
]}
></SortTypeBox>
<div className="excrow">
<div className="full-menu-keywords no-padding">
{
AuthResultBtnGroup.map((value, index) => (
<span
key={`key-service-code=${index}`}
className={`keyword-tag ${(authResult === value.value) ? 'active' : ''}`}
onClick={() => onClickToAuthResult(value.value)}
>{value.name}</span>
))
}
</div>
</div>
</div>
<section className="transaction-list">
{ getListDateGroup() }
</section>
<div ref={ setTarget }></div>
</div>
</div>
</main>
<FaceAuthFilter
filterOn={filterOn}
setFilterOn={setFilterOn}
mid={mid}
userMallId={userMallId}
fromDate={fromDate}
toDate={toDate}
transType={transType}
authResult={authResult}
setMid={setMid}
setUserMallId={setUserMallId}
setFromDate={setFromDate}
setToDate={setToDate}
setTransType={setTransType}
setAuthResult={setAuthResult}
/>
<EmailBottomSheet
bottomSheetOn={emailBottomSheetOn}
setBottomSheetOn={setEmailBottomSheetOn}
imageSave={false}
sendEmail={true}
sendRequest={onSendRequest}
></EmailBottomSheet>
</>
);
};

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

@@ -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
);
});

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

@@ -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
);
});

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

@@ -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
);
});

3
src/pages/support/faq/list-page.tsx
View File

@@ -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
);
});

3
src/pages/support/notice/list-page.tsx
View File

@@ -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
);
});

3
src/pages/support/qna/list-page.tsx
View File

@@ -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
);
});

3
src/pages/transaction/all-transaction/list-page.tsx
View File

@@ -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
);
});

3
src/pages/transaction/billing/list-page.tsx
View File

@@ -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
);
});

3
src/pages/transaction/cash-receipt/list-page.tsx
View File

@@ -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
);
});

3
src/pages/transaction/escrow/list-page.tsx
View File

@@ -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
);
});