- 부가서비스 : 계좌성명조회 목업 API 연결

- 부가서비스 Types 정리
This commit is contained in:
HyeonJongKim
2025-09-17 18:45:54 +09:00
parent aaf1b3bb40
commit 22bdd45f0a
12 changed files with 884 additions and 577 deletions

View File

@@ -0,0 +1,26 @@
import axios from 'axios';
import { API_URL_ADDITIONAL_SERVICE } from '@/shared/api/api-url-additional-service';
import { resultify } from '@/shared/lib/resultify';
import { CBDCAxiosError } from '@/shared/@types/error';
import { ExtensionAccountHolderSearchDownloadExcelParams, ExtensionAccountHolderSearchDownloadExcelResponse } from '../model/types';
import {
useMutation,
UseMutationOptions
} from '@tanstack/react-query';
export const extensionAccountHolderSearchDownloadExcel = (params: ExtensionAccountHolderSearchDownloadExcelParams) => {
return resultify(
axios.post<ExtensionAccountHolderSearchDownloadExcelResponse>(API_URL_ADDITIONAL_SERVICE.extensionKeyinDownloadExcel(), params),
);
};
export const useExtensionAccountHolderSearchDownloadExcelMutation = (options?: UseMutationOptions<ExtensionAccountHolderSearchDownloadExcelResponse, CBDCAxiosError, ExtensionAccountHolderSearchDownloadExcelParams>) => {
const mutation = useMutation<ExtensionAccountHolderSearchDownloadExcelResponse, CBDCAxiosError, ExtensionAccountHolderSearchDownloadExcelParams>({
...options,
mutationFn: (params: ExtensionAccountHolderSearchDownloadExcelParams) => extensionAccountHolderSearchDownloadExcel(params),
});
return {
...mutation,
};
};

View File

@@ -0,0 +1,28 @@
import axios from 'axios';
import { API_URL_ADDITIONAL_SERVICE } from '@/shared/api/api-url-additional-service';
import { resultify } from '@/shared/lib/resultify';
import { CBDCAxiosError } from '@/shared/@types/error';
import {
ExtensionAccountHolderSearchListParams,
ExtensionAccountHolderSearchListResponse,
} from '../model/types';
import {
useMutation,
UseMutationOptions
} from '@tanstack/react-query';
export const extensionAccountHolderSearchList = (params: ExtensionAccountHolderSearchListParams) => {
return resultify(
axios.post<ExtensionAccountHolderSearchListResponse>(API_URL_ADDITIONAL_SERVICE.extensionAccountHolderSearchList(), params),
);
};
export const useExtensionAccountHolderSearchListMutation = (options?: UseMutationOptions<ExtensionAccountHolderSearchListResponse, CBDCAxiosError, ExtensionAccountHolderSearchListParams>) => {
const mutation = useMutation<ExtensionAccountHolderSearchListResponse, CBDCAxiosError, ExtensionAccountHolderSearchListParams>({
...options,
mutationFn: (params: ExtensionAccountHolderSearchListParams) => extensionAccountHolderSearchList(params),
});
return {
...mutation,
};
}

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,46 @@
import { PATHS } from '@/shared/constants/paths';
import { useNavigate } from '@/shared/lib/hooks/use-navigate';
import { ListDateGroup } from '../list-date-group';
import { AccountHolderSearchListProps } from '../../model/types'
export const AccountHolderSearchList = ({
additionalServiceCategory,
listItems,
mid
}: AccountHolderSearchListProps) => {
const { navigate } = useNavigate();
const getListDateGroup = () => {
let rs = [];
for (const [key, value] of Object.entries(listItems)) {
rs.push(
<ListDateGroup
additionalServiceCategory={additionalServiceCategory}
key={key}
date={key}
items={value}
mid={mid}
></ListDateGroup>
);
}
return rs;
};
const onClickToNavigate = () => {
navigate(PATHS.additionalService.accountHolderSearch.request)
};
return (
<>
<div className="transaction-list">
{getListDateGroup()}
<div className="apply-row">
<button
className="btn-50 btn-blue flex-1"
onClick={() => onClickToNavigate()}
> </button>
</div>
</div>
</>
);
}

View File

@@ -7,7 +7,7 @@ import {
AccountHolderSearchType,
AccountHolderSearchFilterProps,
ProcessResult
} from '../../model/types';
} from '../../../model/types';
import { FilterSelect } from '@/shared/ui/filter/select';
import { FilterSelectInput } from '@/shared/ui/filter/select-input';
import { FilterDateOptions } from '@/entities/common/model/types';
@@ -66,6 +66,7 @@ export const AccountHolderSearchFilter = ({
setEndDate(filterEndDate);
setBank(filterBank);
setProcessResult(filterProcessResult);
onClickToClose();
};
let MidOptions = [
@@ -74,19 +75,19 @@ export const AccountHolderSearchFilter = ({
];
let bankOptions = [
{ name: '우리은행', value: '우리은행'},
{ name: '토스뱅킹', value: '토스뱅킹'}
{ name: '우리은행', value: '우리은행' },
{ name: '토스뱅킹', value: '토스뱅킹' }
]
let searchTypeOption = [
{ name: '예금주', value: AccountHolderSearchType.ACCOUNT_HOLDER },
{ name: '계좌번호', value: AccountHolderSearchType.ACCOUNT_NUMBER },
{ name: '예금주', value: AccountHolderSearchType.ACCOUNT_NAME },
{ name: '계좌번호', value: AccountHolderSearchType.ACCOUNT_NO },
]
let processResultBtnGroup = [
{ name: '전체', value: ProcessResult.ALL },
{ name: '성공', value: ProcessResult.SUCCESS },
{ name: '실패', value: ProcessResult.FAILURE },
{ name: '실패', value: ProcessResult.FAIL },
];
return (

View File

@@ -4,22 +4,22 @@ import { KeyInPaymentListProps } from '../../model/types'
import { ListDateGroup } from '../list-date-group';
export const KeyInPaymentList = ({
additionalServiceCategory,
listItems
}: KeyInPaymentListProps ) => {
const { navigate } = useNavigate();
additionalServiceCategory,
listItems
}: KeyInPaymentListProps) => {
const { navigate } = useNavigate();
const getListDateGroup = () => {
let rs = [];
for (const [key, value] of Object.entries(listItems)) {
rs.push(
<ListDateGroup
additionalServiceCategory ={ additionalServiceCategory }
key={ key }
date={ key }
items={ value }
additionalServiceCategory={additionalServiceCategory}
key={key}
date={key}
items={value}
></ListDateGroup>
);
);
}
return rs;
};
@@ -27,18 +27,18 @@ export const KeyInPaymentList = ({
const onClickToNavigate = () => {
navigate(PATHS.additionalService.keyInPayment.request)
};
return (
<>
<div className="transaction-list">
{ getListDateGroup() }
{getListDateGroup()}
<div className="apply-row">
<button
<button
className="btn-50 btn-blue flex-1"
onClick={ () => onClickToNavigate() }
onClick={() => onClickToNavigate()}
> </button>
</div>
</div>
</div>
</>
);
}

View File

@@ -98,7 +98,7 @@ export const LinkPaymentShippingHistoryFilter = ({
let processResultOption = [
{ name: '전체', value: ProcessResult.ALL },
{ name: '성공', value: ProcessResult.SUCCESS },
{ name: '실패', value: ProcessResult.FAILURE },
{ name: '실패', value: ProcessResult.FAIL },
]
let sendMethodOption = [

View File

@@ -12,7 +12,7 @@ import { LinkPaymentSearchType, } from "../../model/types";
const processResultBtnGroup = [
{ name: '전체', value: ProcessResult.ALL },
{ name: '성공', value: ProcessResult.SUCCESS },
{ name: '실패', value: ProcessResult.FAILURE }
{ name: '실패', value: ProcessResult.FAIL }
]
export const LinkPaymentShippingHistoryWrap = () => {

View File

@@ -6,7 +6,8 @@ import { ListItem } from '../ui/list-item';
export const ListDateGroup = ({
additionalServiceCategory,
date,
items
items,
mid
}: ListDateGroupProps) => {
moment.locale('ko');
const getStateDate = () => {
@@ -27,12 +28,10 @@ export const ListDateGroup = ({
paymentDate= { items[i]?.paymentDate}
paymentStatus={ items[i]?.paymentStatus}
requestId={ items[i]?.requestId }
requestDate={ items[i]?.requestDate }
bank={ items[i]?.bank }
accountNumber={ items[i]?.accountNumber }
accountHolder={ items[i]?.accountHolder }
processResult={ items[i]?.processResult }
bankName={ items[i]?.bankName}
accountNo={ items[i]?.accountNo }
resultStatus={ items[i]?.resultStatus }
transactionId={ items[i]?.transactionId }
customerName={ items[i]?.customerName }

View File

@@ -6,10 +6,9 @@ import moment from 'moment';
export const ListItem = ({
additionalServiceCategory,
tid, paymentDate, paymentStatus,
mid, tid, paymentDate, paymentStatus,
requestId, requestDate, bank, accountNumber,
accountHolder, processResult,
requestDate, bankName, accountNo, resultStatus,
transactionId, customerName, status, channel,
amount, sendDate, transactionDate
@@ -34,46 +33,67 @@ export const ListItem = ({
const getDotClass = (str?: string) => {
let rs = '';
if (paymentStatus === '') {
rs = '';
if (additionalServiceCategory === AdditionalServiceCategory.KeyInPayment) {
if (paymentStatus === '') {
rs = '';
}
else if (paymentStatus === "APPROVAL") {
rs = 'blue';
}
else if (paymentStatus === "ALL_CANCEL") {
rs = 'gray';
}
else if (paymentStatus === 'AFTER_CANCEL') {
rs = 'gray';
}
}
else if (paymentStatus === "APPROVAL") {
rs = 'blue';
}
else if (paymentStatus === "ALL_CANCEL") {
rs = 'gray';
}
else if (paymentStatus === 'AFTER_CANCEL') {
rs = 'gray';
else if (additionalServiceCategory === AdditionalServiceCategory.AccountHolderSearch) {
if (resultStatus === "SUCCESS") {
rs = 'blue';
}
else if (resultStatus === "FAIL") {
rs = 'gray';
}
}
return rs;
};
const onClickToNavigate = () => {
if (additionalServiceCategory === AdditionalServiceCategory.KeyInPayment) {
return;
}
else if (additionalServiceCategory === AdditionalServiceCategory.AccountHolderSearch) {
navigate(PATHS.additionalService.accountHolderSearch.detail, {
state: {
requestId: requestId
mid: mid,
tid: tid
}
});
}
else if (additionalServiceCategory === AdditionalServiceCategory.LinkPaymentShipping) {
navigate(PATHS.additionalService.linkPayment.detail, {
state: {
transactionId: transactionId
mid: mid,
tid: tid
}
});
}
else if (additionalServiceCategory === AdditionalServiceCategory.LinkPaymentPending) {
navigate(PATHS.additionalService.linkPayment.detail, {
state: {
transactionId: transactionId
mid: mid,
tid: tid
}
});
}
else if (additionalServiceCategory === AdditionalServiceCategory.FundTransfer) {
}
else if (additionalServiceCategory === AdditionalServiceCategory.SettlementAgency) {
}
else {
alert('additionalServiceCategory가 존재하지 않습니다.');
@@ -87,7 +107,8 @@ export const ListItem = ({
timeStr = time?.substring(0, 2) + ':' + time?.substring(2, 4);
}
else if (additionalServiceCategory === AdditionalServiceCategory.AccountHolderSearch) {
timeStr = moment(requestDate).format('HH:mm');
let time = requestDate?.substring(8, 14);
timeStr = time?.substring(0, 2) + ':' + time?.substring(2, 4) + ':' + time?.substring(4, 6);
}
else if (additionalServiceCategory === AdditionalServiceCategory.LinkPaymentShipping) {
timeStr = moment(transactionDate).format('HH:mm');
@@ -104,7 +125,7 @@ export const ListItem = ({
str = `${tid}(${amount})`;
}
else if (additionalServiceCategory === AdditionalServiceCategory.AccountHolderSearch) {
str = `${accountHolder}(${accountNumber})`
str = `${accountNo}`
}
else if (additionalServiceCategory === AdditionalServiceCategory.LinkPaymentShipping) {
str = `${customerName}(${transactionId})`
@@ -131,9 +152,7 @@ export const ListItem = ({
<div className="transaction-details">
<span>{getTime()}</span>
<span className="separator">|</span>
<span>{bank}</span>
<span className="separator">|</span>
<span>{processResult}</span>
<span>{bankName}</span>
</div>
);
}
@@ -162,6 +181,30 @@ export const ListItem = ({
return rs;
};
const getAmount = () => {
let rs: any[] = [];
if (additionalServiceCategory === AdditionalServiceCategory.AccountHolderSearch) {
rs.push(
<div className={`status-label ${resultStatus === 'SUCCESS' ? 'success' : 'fail'}`}>
{resultStatus === 'SUCCESS' ? '성공' : '실패'}
</div>
);
}
else if (additionalServiceCategory === AdditionalServiceCategory.KeyInPayment) {
rs.push(
<div className="transaction-amount">
<NumericFormat
value={amount}
thousandSeparator
displayType="text"
suffix={'원'}
></NumericFormat>
</div>
);
}
return rs;
}
return (
<>
<div
@@ -175,14 +218,7 @@ export const ListItem = ({
<div className="transaction-title">{getTitle()}</div>
{getDetail()}
</div>
<div className="transaction-amount">
<NumericFormat
value={amount}
thousandSeparator
displayType="text"
suffix={'원'}
></NumericFormat>
</div>
{getAmount()}
</div>
</>
);