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

sort 관련 정리

Browse Source
This commit is contained in:
focp212@naver.com
2025-10-15 17:12:57 +09:00
parent 368b553bda
commit faccd7bd91
30 changed files with 439 additions and 258 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -10,22 +10,12 @@ import type { ExtensionSmsDetailResponse } from './sms-payment/types';
// 공통 Enums 및 타입들
// ========================================
export enum SortByKeys {
New = 'New',
Amount = 'Amount',
}
export enum ProcessResult {
ALL = 'ALL',
SUCCESS = 'SUCCESS',
FAIL = 'FAIL'
}
export interface SortOptionsBoxProps {
sortBy: SortByKeys;
onClickToSort: (sortBy: SortByKeys) => void;
}
// 부가서비스 카테고리 enum
export enum AdditionalServiceCategory {
KeyInPayment = 'KeyInPayment',

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

@@ -1,5 +1,5 @@
import moment from 'moment';
import { SortByKeys } from '@/entities/common/model/types';
import { SortTypeKeys } from '@/entities/common/model/types';
import { IMAGE_ROOT } from '@/shared/constants/common';
import { useNavigate } from '@/shared/lib/hooks/use-navigate';
import { useEffect, useState } from 'react';
@@ -12,7 +12,7 @@ import { useExtensionFundAccountResultExcelMutation } from '../../api/fund-accou
import { useExtensionFundAccountResultListMutation } from '../../api/fund-account/use-extension-fund-account-result-list-mutation';
import { PATHS } from '@/shared/constants/paths';
import { NumericFormat } from 'react-number-format';
import { SortOptionsBox } from '@/entities/common/ui/sort-options-box';
import { SortTypeBox } from '@/entities/common/ui/sort-type-box';
import { FundAccountStatusBtnGroup } from '../../model/fund-account/constant';
import { FundAccountResultFilter } from '../filter/fund-account-result-filter';
import { useStore } from '@/shared/model/store';
@@ -21,7 +21,7 @@ export const FundAccountResultListWrap = () => {
const { navigate } = useNavigate();
const userMid = useStore.getState().UserStore.mid;
const [sortBy, setSortBy] = useState<SortByKeys>(SortByKeys.New);
const [sortType, setSortType] = useState<SortTypeKeys>(SortTypeKeys.LATEST);
const [listItems, setListItems] = useState<Record<string, Array<FundAccountResultContentItem>>>({});
const [filterOn, setFilterOn] = useState<boolean>(false);
const [pageParam, setPageParam] = useState(DEFAULT_PAGE_PARAM);
@@ -48,11 +48,11 @@ export const FundAccountResultListWrap = () => {
const { mutateAsync: extensionFundAccountResultSummary } = useExtensionFundAccountResultSummaryMutation();
const callList = (option?: {
sortBy?: string,
sortType?: SortTypeKeys,
val?: string
}) => {
pageParam.sortBy = (option?.sortBy)? option.sortBy: sortBy;
pageParam.sortType = (option?.sortType)? option.sortType: sortType;
setPageParam(pageParam);
let params: ExtensionFundAccountResultListParams = {
@@ -124,10 +124,10 @@ export const FundAccountResultListWrap = () => {
setFilterOn(!filterOn);
};
const onClickToSort = (sort: SortByKeys) => {
setSortBy(sort);
const onClickToSort = (sort: SortTypeKeys) => {
setSortType(sort);
callList({
sortBy: sort
sortType: sort
});
};
const onClickToStatus = (val: FundAccountStatus) => {
@@ -268,10 +268,10 @@ export const FundAccountResultListWrap = () => {
</section>
<section className="filter-section">
<SortOptionsBox
sortBy={ sortBy }
<SortTypeBox
sortType={ sortType }
onClickToSort={ onClickToSort }
></SortOptionsBox>
></SortTypeBox>
<div className="excrow mr-0">
<div className="full-menu-keywords no-padding">
{

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

@@ -1,4 +1,4 @@
import { SortByKeys } from '@/entities/common/model/types';
import { SortTypeKeys } from '@/entities/common/model/types';
import { IMAGE_ROOT } from '@/shared/constants/common';
import { useNavigate } from '@/shared/lib/hooks/use-navigate';
import { useEffect, useState } from 'react';
@@ -18,7 +18,7 @@ import moment from 'moment';
import { useExtensionFundAccountTransferListMutation } from '../../api/fund-account/use-extension-fund-account-transfer-list-mutation';
import { ListDateGroup } from '../list-date-group';
import { AdditionalServiceCategory } from '../../model/types';
import { SortOptionsBox } from '@/entities/common/ui/sort-options-box';
import { SortTypeBox } from '@/entities/common/ui/sort-type-box';
import { useExtensionFundAccountTransferExcelMutation } from '../../api/fund-account/use-extension-fund-account-transfer-excel-mutation';
import { FundAccountStatusBtnGroup } from '../../model/fund-account/constant';
import { useExtensionFundAccountBalanceMutation } from '../../api/fund-account/use-extension-fund-account-balance-mutation';
@@ -31,7 +31,7 @@ export const FundAccountTransferListWrap = () => {
const { navigate } = useNavigate();
const userMid = useStore.getState().UserStore.mid;
const [sortBy, setSortBy] = useState<SortByKeys>(SortByKeys.New);
const [sortType, setSortType] = useState<SortTypeKeys>(SortTypeKeys.LATEST);
const [listItems, setListItems] = useState<Record<string, Array<FundAccountTransferContentItem>>>({});
const [filterOn, setFilterOn] = useState<boolean>(false);
const [pageParam, setPageParam] = useState(DEFAULT_PAGE_PARAM);
@@ -50,11 +50,11 @@ export const FundAccountTransferListWrap = () => {
const { mutateAsync: extensionFundAccountBalance } = useExtensionFundAccountBalanceMutation();
const callList = (option?: {
sortBy?: string,
sortType?: SortTypeKeys,
val?: string
}) => {
pageParam.sortBy = (option?.sortBy)? option.sortBy: sortBy;
pageParam.sortType = (option?.sortType)? option.sortType: sortType;
setPageParam(pageParam);
let params: ExtensionFundAccountTransferListParams = {
@@ -119,13 +119,15 @@ export const FundAccountTransferListWrap = () => {
setFilterOn(!filterOn);
};
const onClickToSort = (sort: SortByKeys) => {
setSortBy(sort);
callList({sortBy: sort});
const onClickToSort = (sort: SortTypeKeys) => {
setSortType(sort);
callList({sortType: sort});
};
const onClickToStatus = (val: FundAccountStatus) => {
setStatus(val);
callList({val: val});
callList({
val: val
});
};
const getListDateGroup = () => {
@@ -208,10 +210,10 @@ export const FundAccountTransferListWrap = () => {
</section>
<section className="filter-section">
<SortOptionsBox
sortBy={ sortBy }
<SortTypeBox
sortType={ sortType }
onClickToSort={ onClickToSort }
></SortOptionsBox>
></SortTypeBox>
<div className="excrow mr-0">
<div className="full-menu-keywords no-padding">
{

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

@@ -5,8 +5,9 @@ import { LinkPaymentHistoryFilter } from "./filter/link-payment-history-filter";
import { useNavigate } from '@/shared/lib/hooks/use-navigate';
import { PATHS } from "@/shared/constants/paths";
import { LinkPaymentHistoryList } from "./link-payment-history-list";
import { SortOptionsBox } from "../sort-options-box";
import { AdditionalServiceCategory, LinkPaymentSendMethod, LinkPaymentHistoryListItem, LinkPaymentTransactionStatus, ProcessResult, SortByKeys } from "../../model/types";
import { SortTypeBox } from '@/entities/common/ui/sort-type-box';
import { SortTypeKeys } from '@/entities/common/model/types';
import { AdditionalServiceCategory, LinkPaymentSendMethod, LinkPaymentHistoryListItem, LinkPaymentTransactionStatus, ProcessResult } from "../../model/types";
import { LinkPaymentSearchType, } from "../../model/types";
import { useExtensionLinkPayHistoryListMutation } from '../../api/link-payment/use-extension-link-pay-history-list-mutation';
import { DEFAULT_PAGE_PARAM } from '@/entities/common/model/constant';
@@ -24,7 +25,7 @@ export const LinkPaymentHistoryWrap = () => {
const userMid = useStore.getState().UserStore.mid;
const [filterOn, setFilterOn] = useState<boolean>(false);
const [sortBy, setSortBy] = useState<SortByKeys>(SortByKeys.New);
const [sortType, setSortType] = useState<SortTypeKeys>(SortTypeKeys.LATEST);
const [listItems, setListItems] = useState({});
const [pageParam, setPageParam] = useState(DEFAULT_PAGE_PARAM);
const [mid, setMid] = useState<string>(userMid);
@@ -44,10 +45,10 @@ export const LinkPaymentHistoryWrap = () => {
};
const callList = (option?: {
sortBy?: string,
sortType?: SortTypeKeys,
val?: string
}) => {
pageParam.sortBy = (option?.sortBy) ? option.sortBy : sortBy;
pageParam.sortType = (option?.sortType) ? option.sortType : sortType;
setPageParam(pageParam);
let listParams = {
@@ -106,9 +107,11 @@ export const LinkPaymentHistoryWrap = () => {
setProcessResult(val);
}
const onClickToSort = (sort: SortByKeys) => {
setSortBy(sort);
callList({ sortBy: sort });
const onClickToSort = (sort: SortTypeKeys) => {
setSortType(sort);
callList({
sortType: sort
});
};
const onClickToOpenFilter = () => {
@@ -153,11 +156,11 @@ export const LinkPaymentHistoryWrap = () => {
</section>
<div className="filter-section">
<SortOptionsBox
sortBy={sortBy}
onClickToSort={onClickToSort}
<SortTypeBox
sortType={ sortType }
onClickToSort={ onClickToSort }
>
</SortOptionsBox>
</SortTypeBox>
<div className="excrow">
<div className="full-menu-keywords no-padding">
{

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

@@ -5,8 +5,9 @@ import { LinkPaymentWaitSendFilter } from "./filter/link-payment-pending-send-fi
import { useNavigate } from '@/shared/lib/hooks/use-navigate';
import { PATHS } from "@/shared/constants/paths";
import { LinkPaymentWaitList } from "./link-payment-wait-list";
import { AdditionalServiceCategory, LinkPaymentWaitListItem, LinkPaymentSearchType, LinkPaymentSendingStatus, LinkPaymentSendMethod, SortByKeys } from "../../model/types";
import { SortOptionsBox } from '../sort-options-box';
import { AdditionalServiceCategory, LinkPaymentWaitListItem, LinkPaymentSearchType, LinkPaymentSendingStatus, LinkPaymentSendMethod } from "../../model/types";
import { SortTypeBox } from '@/entities/common/ui/sort-type-box';
import { SortTypeKeys } from '@/entities/common/model/types';
import { useExtensionLinkPayWaitListMutation } from '../../api/link-payment/use-extension-link-pay-wait-list-mutation';
import { DEFAULT_PAGE_PARAM } from '@/entities/common/model/constant';
import { useExtensionLinkPayWaitDownloadExcelMutation } from '../../api/link-payment/use-extension-link-pay-wait-download-excel-mutation';
@@ -22,7 +23,7 @@ export const LinkPaymentWaitSendWrap = () => {
const { navigate } = useNavigate();
const userMid = useStore.getState().UserStore.mid;
const [sortBy, setSortBy] = useState<SortByKeys>(SortByKeys.New);
const [sortType, setSortType] = useState<SortTypeKeys>(SortTypeKeys.LATEST);
const [filterOn, setFilterOn] = useState<boolean>(false);
const [mid, setMid] = useState<string>(userMid);
const [searchType, setSearchType] = useState<LinkPaymentSearchType>(LinkPaymentSearchType.ALL)
@@ -45,10 +46,10 @@ export const LinkPaymentWaitSendWrap = () => {
}
const callList = (option?: {
sortBy?: string,
sortType?: SortTypeKeys,
val?: string
}) => {
pageParam.sortBy = (option?.sortBy) ? option.sortBy : sortBy;
pageParam.sortType = (option?.sortType) ? option.sortType : sortType;
setPageParam(pageParam);
let listParams = {
@@ -101,8 +102,8 @@ export const LinkPaymentWaitSendWrap = () => {
});
};
const onClickToSort = (sort: SortByKeys) => {
setSortBy(sort);
const onClickToSort = (sort: SortTypeKeys) => {
setSortType(sort);
};
const onClickSendingStatus = (val: LinkPaymentSendingStatus) => {
@@ -147,10 +148,10 @@ export const LinkPaymentWaitSendWrap = () => {
</section>
<div className="filter-section">
<SortOptionsBox
sortBy={sortBy}
onClickToSort={onClickToSort}
></SortOptionsBox>
<SortTypeBox
sortType={ sortType }
onClickToSort={ onClickToSort }
></SortTypeBox>
<div className="excrow">
<div className="full-menu-keywords no-padding">
{

25
src/entities/additional-service/ui/sort-options-box.tsx
View File

@@ -1,25 +0,0 @@
import {
SortByKeys,
SortOptionsBoxProps
} from '../model/types';
export const SortOptionsBox = ({
sortBy,
onClickToSort
}: SortOptionsBoxProps) => {
return (
<>
<div className="sort-options">
<button
className={ `sort-btn ${(sortBy === SortByKeys.New)? 'active': ''}` }
onClick={ () => onClickToSort(SortByKeys.New) }
>최신순</button>
<span className="sort-divider">|</span>
<button
className={ `sort-btn ${(sortBy === SortByKeys.Amount)? 'active': ''}` }
onClick={ () => onClickToSort(SortByKeys.Amount) }
>고액순</button>
</div>
</>
);
};