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

- 자금이체_ 이체요청 Request,Response 수정

Browse Source
This commit is contained in:
HyeonJongKim
2025-10-17 14:15:36 +09:00
parent e00bb69832
commit 92150880dd
3 changed files with 110 additions and 84 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/entities/additional-service/model/fund-account/types.ts
View File

@@ -20,16 +20,15 @@ export enum FundAccountReceiveAccountNameNo {
export interface ExtensionFundAccountTransferRequestParams { export interface ExtensionFundAccountTransferRequestParams {
mid?: string; mid?: string;
transferAmount?: number; bankCode: string;
receiveBankCode?: string; accountNo: string;
receiveAccountNo?: string; accountName: string;
receiveAccountName?: string; amount: number;
transferMemo?: string; moid: string;
depositParameter?: string;
}; };
export interface ExtensionFundAccountTransferRequestResponse { export interface ExtensionFundAccountTransferRequestResponse {
tid: string; status: boolean;
result: string;
message: string;
}; };
export enum FundAccountSearchCl { export enum FundAccountSearchCl {
@@ -96,7 +95,8 @@ export interface ExtensionFundAccountTransferDetailResponse {
resultStatus: FundAccountStatus; resultStatus: FundAccountStatus;
requestDate: string; requestDate: string;
resultMessage: string; resultMessage: string;
bankName: string; bankCode: string;
moid: string;
}; };
export interface ExtensionFundAccountResultSummaryParams { export interface ExtensionFundAccountResultSummaryParams {
mid: string; mid: string;

54
src/pages/additional-service/fund-account/transfer-detail-page.tsx
View File

@@ -1,17 +1,17 @@
import { PATHS } from '@/shared/constants/paths'; import { PATHS } from '@/shared/constants/paths';
import { useNavigate } from '@/shared/lib/hooks/use-navigate'; import { useNavigate } from '@/shared/lib/hooks/use-navigate';
import { HeaderType } from '@/entities/common/model/types'; import { HeaderType } from '@/entities/common/model/types';
import { import {
useSetHeaderTitle, useSetHeaderTitle,
useSetHeaderType, useSetHeaderType,
useSetFooterMode, useSetFooterMode,
useSetOnBack useSetOnBack
} from '@/widgets/sub-layout/use-sub-layout'; } from '@/widgets/sub-layout/use-sub-layout';
import { useLocation } from 'react-router'; import { useLocation } from 'react-router';
import { useEffect, useState } from 'react'; import { useEffect, useState } from 'react';
import { NumericFormat } from 'react-number-format'; import { NumericFormat } from 'react-number-format';
import { useExtensionFundAccountTransferDetailMutation } from '@/entities/additional-service/api/fund-account/use-extension-fund-account-transfer-detail-mutation'; import { useExtensionFundAccountTransferDetailMutation } from '@/entities/additional-service/api/fund-account/use-extension-fund-account-transfer-detail-mutation';
import { ExtensionFundAccountTransferDetailParams, ExtensionFundAccountTransferDetailResponse, ExtensionFundAccountTransferRequestParams, ExtensionFundAccountTransferRequestResponse } from '@/entities/additional-service/model/fund-account/types'; import { ExtensionFundAccountTransferDetailParams, ExtensionFundAccountTransferDetailResponse, ExtensionFundAccountTransferRequestParams, ExtensionFundAccountTransferRequestResponse, FundAccountStatus } from '@/entities/additional-service/model/fund-account/types';
import { getFundAccountStatusName } from '@/entities/additional-service/model/fund-account/constant'; import { getFundAccountStatusName } from '@/entities/additional-service/model/fund-account/constant';
import moment from 'moment'; import moment from 'moment';
import { useExtensionFundAccountTransferRequestMutation } from '@/entities/additional-service/api/fund-account/use-extension-fund-account-transfer-request-mutation'; import { useExtensionFundAccountTransferRequestMutation } from '@/entities/additional-service/api/fund-account/use-extension-fund-account-transfer-request-mutation';
@@ -27,7 +27,7 @@ export const FundAccountTransferDetailPage = () => {
const { mutateAsync: extensionFundAccountTransferDetail } = useExtensionFundAccountTransferDetailMutation(); const { mutateAsync: extensionFundAccountTransferDetail } = useExtensionFundAccountTransferDetailMutation();
const { mutateAsync: extensionFundAccountTransferRequest } = useExtensionFundAccountTransferRequestMutation(); const { mutateAsync: extensionFundAccountTransferRequest } = useExtensionFundAccountTransferRequestMutation();
const callDetail = () => { const callDetail = () => {
let params: ExtensionFundAccountTransferDetailParams = { let params: ExtensionFundAccountTransferDetailParams = {
tid: tid, tid: tid,
@@ -51,18 +51,23 @@ export const FundAccountTransferDetailPage = () => {
callDetail(); callDetail();
}, []); }, []);
const onClickToRequest = () =>{ const onClickToRequest = () => {
if (!detail) {
alert('상세 정보를 불러오는 중입니다.');
return;
}
let params: ExtensionFundAccountTransferRequestParams = { let params: ExtensionFundAccountTransferRequestParams = {
mid: mid, mid: mid,
transferAmount: 0, bankCode: detail.bankCode || '',
receiveBankCode: '', accountNo: detail.accountNo || '',
receiveAccountNo: '', accountName: detail.accountName || '',
receiveAccountName: '', amount: detail.amount || 0,
transferMemo: '' moid: detail.moid || ''
}; };
extensionFundAccountTransferRequest(params).then((rs: ExtensionFundAccountTransferRequestResponse) => { extensionFundAccountTransferRequest(params).then((rs: ExtensionFundAccountTransferRequestResponse) => {
console.log(rs) console.log(rs)
alert(rs.message); alert(rs.status ? '이체 요청이 완료되었습니다.' : '이체 요청에 실패했습니다.');
navigate(PATHS.additionalService.fundAccount.transferList); navigate(PATHS.additionalService.fundAccount.transferList);
}); });
}; };
@@ -76,14 +81,14 @@ export const FundAccountTransferDetailPage = () => {
<div className="num-amount"> <div className="num-amount">
<span className="amount"> <span className="amount">
<NumericFormat <NumericFormat
value={ detail?.amount } value={detail?.amount}
thousandSeparator thousandSeparator
displayType="text" displayType="text"
suffix='원' suffix='원'
></NumericFormat> ></NumericFormat>
</span> </span>
</div> </div>
<div className="num-store">{ detail?.amount }({ detail?.accountName })</div> <div className="num-store">{detail?.amount}({detail?.accountName})</div>
<div className="num-day"> <div className="num-day">
{detail?.registDate ? moment(detail.registDate, 'YYYYMMDDHHmmss').format('YYYY.MM.DD') : '-'} {detail?.registDate ? moment(detail.registDate, 'YYYYMMDDHHmmss').format('YYYY.MM.DD') : '-'}
</div> </div>
@@ -100,7 +105,7 @@ export const FundAccountTransferDetailPage = () => {
</li> </li>
<li className="kv-row"> <li className="kv-row">
<span className="k">처리결과</span> <span className="k">처리결과</span>
<span className="v">{ getFundAccountStatusName(detail?.resultStatus) || '-' }</span> <span className="v">{getFundAccountStatusName(detail?.resultStatus) || '-'}</span>
</li> </li>
<li className="kv-row"> <li className="kv-row">
<span className="k">요청일자</span> <span className="k">요청일자</span>
@@ -110,31 +115,32 @@ export const FundAccountTransferDetailPage = () => {
</li> </li>
<li className="kv-row"> <li className="kv-row">
<span className="k">이체결과</span> <span className="k">이체결과</span>
<span className="v">{ detail?.resultMessage || '-' }</span> <span className="v">{detail?.resultMessage || '-'}</span>
</li> </li>
<li className="kv-row"> <li className="kv-row">
<span className="k">수취인명</span> <span className="k">수취인명</span>
<span className="v">{ detail?.accountName }</span> <span className="v">{detail?.accountName}</span>
</li> </li>
<li className="kv-row"> <li className="kv-row">
<span className="k">은행</span> <span className="k">은행</span>
<span className="v">{ detail?.bankName }</span> <span className="v">{detail?.bankCode}</span>
</li> </li>
<li className="kv-row"> <li className="kv-row">
<span className="k">계좌번호</span> <span className="k">계좌번호</span>
<span className="v">{ detail?.accountNo }</span> <span className="v">{detail?.accountNo}</span>
</li> </li>
<li className="kv-row"> <li className="kv-row">
<span className="k">MID</span> <span className="k">MID</span>
<span className="v">{ detail?.mid }</span> <span className="v">{detail?.mid}</span>
</li> </li>
</ul> </ul>
</div> </div>
<div className="apply-row"> <div className="apply-row">
<button <button
className="btn-50 btn-blue flex-1" className="btn-50 btn-blue flex-1"
onClick={ () => onClickToRequest() } onClick={() => onClickToRequest()}
disabled={detail?.resultStatus !== FundAccountStatus.REGIST_COMPLETE}
>이체 요청</button> >이체 요청</button>
</div> </div>
</div> </div>

122
src/pages/additional-service/fund-account/transfer-request-page.tsx
View File

@@ -1,10 +1,10 @@
import { PATHS } from '@/shared/constants/paths'; import { PATHS } from '@/shared/constants/paths';
import { useNavigate } from '@/shared/lib/hooks/use-navigate'; import { useNavigate } from '@/shared/lib/hooks/use-navigate';
import { HeaderType } from '@/entities/common/model/types'; import { HeaderType } from '@/entities/common/model/types';
import { import {
useSetHeaderTitle, useSetHeaderTitle,
useSetHeaderType, useSetHeaderType,
useSetFooterMode, useSetFooterMode,
useSetOnBack useSetOnBack
} from '@/widgets/sub-layout/use-sub-layout'; } from '@/widgets/sub-layout/use-sub-layout';
import { useState } from 'react'; import { useState } from 'react';
@@ -16,17 +16,19 @@ import { useStore } from '@/shared/model/store';
export const FundAccountTransferRequestPage = () => { export const FundAccountTransferRequestPage = () => {
const { navigate } = useNavigate(); const { navigate } = useNavigate();
const userMid = useStore.getState().UserStore.mid; const userMid = useStore.getState().UserStore.mid;
const midOptions = useStore.getState().UserStore.selectOptionsMids;
const [mid, setMid] = useState<string>(userMid); const [mid, setMid] = useState<string>(userMid);
const [transferAmount, setTransferAmount] = useState<number>(0); const [bankCode, setBankCode] = useState<string>('');
const [receiveBankCode, setReceiveBankCode] = useState<string>(''); const [accountNo, setAccountNo] = useState<string>('');
const [receiveAccountNo, setReceiveAccountNo] = useState<string>(''); const [accountName, setAccountName] = useState<string>('');
const [receiveAccountName, setReceiveAccountName] = useState<string>(''); const [amount, setAmount] = useState<number>(0);
const [transferMemo, setTransferMemo] = useState<string>(''); const [moid, setMoid] = useState<string>('');
const [depositParameter, setDepositParameter] = useState<string>('');
const { mutateAsync: extensionFundAccountRequest } = useExtensionFundAccountTransferRequestMutation(); const { mutateAsync: extensionFundAccountRequest } = useExtensionFundAccountTransferRequestMutation();
useSetHeaderTitle('자금이체 이체등록'); useSetHeaderTitle('자금이체 이체등록');
useSetHeaderType(HeaderType.RightClose); useSetHeaderType(HeaderType.RightClose);
useSetFooterMode(false); useSetFooterMode(false);
@@ -37,11 +39,12 @@ export const FundAccountTransferRequestPage = () => {
const callExtensionFundAccountTransferRequest = () => { const callExtensionFundAccountTransferRequest = () => {
let params: ExtensionFundAccountTransferRequestParams = { let params: ExtensionFundAccountTransferRequestParams = {
mid: mid, mid: mid,
transferAmount: transferAmount, bankCode: bankCode,
receiveBankCode: receiveBankCode, accountNo: accountNo,
receiveAccountNo: receiveAccountNo, accountName: accountName,
receiveAccountName: receiveAccountName, amount: amount,
transferMemo: transferMemo moid: moid,
depositParameter: depositParameter
}; };
extensionFundAccountRequest(params).then((rs: ExtensionFundAccountTransferRequestResponse) => { extensionFundAccountRequest(params).then((rs: ExtensionFundAccountTransferRequestResponse) => {
navigate(PATHS.additionalService.payout.list); navigate(PATHS.additionalService.payout.list);
@@ -50,12 +53,15 @@ export const FundAccountTransferRequestPage = () => {
const isFormValid = () => { const isFormValid = () => {
return ( return (
receiveAccountNo.trim() !== '' && mid.trim() !== '' &&
receiveAccountName.trim() !== '' && //bankCode.trim() !== '' &&
transferAmount >0 accountNo.trim() !== '' &&
accountName.trim() !== '' &&
amount > 0 &&
moid.trim() !== ''
) )
} }
return ( return (
<> <>
<main> <main>
@@ -64,62 +70,76 @@ export const FundAccountTransferRequestPage = () => {
<div className="ing-list"> <div className="ing-list">
<div className="billing-form gap-30"> <div className="billing-form gap-30">
<div className="billing-row"> <div className="billing-row">
<div className="billing-label">가맹점</div> <div className="billing-label">가맹점<span>*</span></div>
<div className="billing-field"> <div className="billing-field">
<select> <select value={mid} onChange={(e) => setMid(e.target.value)}>
<option>userMid</option> {
midOptions.map((value, index) => (
<option
key={value.value}
value={value.value}
>{value.name}</option>
))
}
</select> </select>
</div> </div>
</div> </div>
<div className="billing-row"> <div className="billing-row">
<div className="billing-label">은행</div> <div className="billing-label">은행<span>*</span></div>
<div className="billing-field"> <div className="billing-field">
<select></select> <select value={bankCode} onChange={(e) => setBankCode(e.target.value)}>
<option value="">선택하세요</option>
{/* TODO: 은행 목록 옵션 추가 필요 */}
</select>
</div> </div>
</div> </div>
<div className="billing-row"> <div className="billing-row">
<div className="billing-label">계좌번호</div> <div className="billing-label">계좌번호<span>*</span></div>
<div className="billing-field"> <div className="billing-field">
<input <input
type="text" type="text"
value={ receiveAccountNo } value={accountNo}
onChange={ (e) => setReceiveAccountNo(e.target.value) } onChange={(e) => setAccountNo(e.target.value)}
/> />
</div> </div>
</div> </div>
<div className="billing-row"> <div className="billing-row">
<div className="billing-label">예금주명</div> <div className="billing-label">예금주명<span>*</span></div>
<div className="billing-field"> <div className="billing-field">
<input <input
type="text" type="text"
value={ receiveAccountName } value={accountName}
onChange={ (e) => setReceiveAccountName(e.target.value) } onChange={(e) => setAccountName(e.target.value)}
/> />
</div> </div>
</div> </div>
<div className="billing-row"> <div className="billing-row">
<div className="billing-label">이체금액</div> <div className="billing-label">이체금액<span>*</span></div>
<div className="billing-field"> <div className="billing-field">
<input <input
type="text" type="text"
value={ transferAmount } value={amount}
onChange={ (e) => setTransferAmount(parseInt(e.target.value)) } onChange={(e) => setAmount(parseInt(e.target.value))}
/> />
</div> </div>
</div> </div>
<div className="billing-row"> <div className="billing-row">
<div className="billing-label">주문번호</div> <div className="billing-label">주문번호<span>*</span></div>
<div className="billing-field"> <div className="billing-field" style={{ display: 'flex', gap: '8px', alignItems: 'center' }}>
<input <input
type="text" type="text"
value={moid}
onChange={(e) => setMoid(e.target.value)}
/> />
</div> </div>
</div> </div>
<div className="billing-row"> <div className="billing-row">
<div className="billing-label">입금인자</div> <div className="billing-label">입금인자</div>
<div className="billing-field"> <div className="billing-field">
<input <input
type="text" type="text"
value={depositParameter}
onChange={(e) => setDepositParameter(e.target.value)}
/> />
</div> </div>
</div> </div>
@@ -129,10 +149,10 @@ export const FundAccountTransferRequestPage = () => {
</div> </div>
</main> </main>
<div className="apply-row"> <div className="apply-row">
<button <button
className="btn-50 btn-blue flex-1" className="btn-50 btn-blue flex-1"
onClick={ callExtensionFundAccountTransferRequest } onClick={callExtensionFundAccountTransferRequest}
disabled={!isFormValid} disabled={!isFormValid()}
>등록</button> >등록</button>
</div> </div>
</> </>