부가서비스

- 계좌성명조회 - 조회신청 API 연결

src/entities/additional-service/api/account-holder-search/use-extension-account-holder-search-detail-mutation.ts

@@ -8,7 +8,7 @@ import {
     ExtensionAccountHolderSearchDetailParams,
     ExtensionAccountHolderSearchDetailResponse,
     DetailInfo
-} from '../model/types';
+} from '../../model/types';
 import {
     useMutation,
     UseMutationOptions

src/entities/additional-service/api/account-holder-search/use-extension-account-holder-search-download-excel-mutation.ts

@@ -2,7 +2,7 @@ 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 { ExtensionAccountHolderSearchDownloadExcelParams, ExtensionAccountHolderSearchDownloadExcelResponse } from '../../model/types';
 import { 
   useMutation,
   UseMutationOptions

src/entities/additional-service/api/account-holder-search/use-extension-account-holder-search-list-mutation.ts

@@ -5,7 +5,7 @@ import { CBDCAxiosError } from '@/shared/@types/error';
 import {
     ExtensionAccountHolderSearchListParams,
     ExtensionAccountHolderSearchListResponse,
-} from '../model/types';
+} from '../../model/types';
 import {
     useMutation,
     UseMutationOptions

src/entities/additional-service/api/account-holder-search/use-extension-account-holder-search-reqeust-mutation.ts

@@ -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 { ExtensionAccountHolderSearchRequestParams, ExtensionAccountHolderSearchRequestResponse } from '../../model/types';
+import { 
+  useMutation,
+  UseMutationOptions
+} from '@tanstack/react-query';
+
+export const extensionAccountHolderSearchRequest = (params: ExtensionAccountHolderSearchRequestParams) => {
+  return resultify(
+    axios.post<ExtensionAccountHolderSearchRequestResponse>(API_URL_ADDITIONAL_SERVICE.extensionAccountHolderSearchRequest(), params),
+  );
+};
+
+export const useExtensionAccountHolderSearchRequestMutation = (options?: UseMutationOptions<ExtensionAccountHolderSearchRequestResponse, CBDCAxiosError, ExtensionAccountHolderSearchRequestParams>) => {
+  const mutation = useMutation<ExtensionAccountHolderSearchRequestResponse, CBDCAxiosError, ExtensionAccountHolderSearchRequestParams>({
+    ...options,
+    mutationFn: (params: ExtensionAccountHolderSearchRequestParams) => extensionAccountHolderSearchRequest(params),
+  });
+
+  return {
+    ...mutation,
+  };
+};

src/entities/additional-service/model/types.ts

@@ -568,6 +568,15 @@ export interface ExtensionAccountHolderSearchDetailResponse {
   requestWay: string;
 }
 
+export interface ExtensionAccountHolderSearchRequestParams extends ExtensionRequestParams {
+  bankCode: string;
+  accountNo: string;
+}
+
+export interface ExtensionAccountHolderSearchRequestResponse {
+  status : boolean;
+}
+
 export interface ExtensionAccountHolderSearchDownloadExcelParams extends ExtensionRequestParams { // Request
   searchCl: string;
   searchValue: string;
@@ -578,7 +587,7 @@ export interface ExtensionAccountHolderSearchDownloadExcelParams extends Extensi
 }
 
 export interface ExtensionAccountHolderSearchDownloadExcelResponse {
-
+  status: boolean;
 }
 // ========================================
 
@@ -614,7 +623,7 @@ export interface ExtensionKeyinDownloadExcelParams extends ExtensionRequestParam
 }
 
 export interface ExtensionKeyinDownloadExcelResponse {
-
+  status: boolean
 }
 
 export interface ExtensionKeyinApplyParams extends ExtensionRequestParams {

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

@@ -13,9 +13,9 @@ import {
   useSetFooterMode,
   useSetOnBack
 } from '@/widgets/sub-layout/use-sub-layout';
-import { useExtensionAccountHolderSearchListMutation } from '@/entities/additional-service/api/use-extension-account-holder-search-list-mutation';
+import { useExtensionAccountHolderSearchListMutation } from '@/entities/additional-service/api/account-holder-search/use-extension-account-holder-search-list-mutation';
 import { DEFAULT_PAGE_PARAM } from '@/entities/common/model/constant';
-import { useExtensionAccountHolderSearchDownloadExcelMutation } from '@/entities/additional-service/api/use-extension-account-holder-search-download-excel-mutation';
+import { useExtensionAccountHolderSearchDownloadExcelMutation } from '@/entities/additional-service/api/account-holder-search/use-extension-account-holder-search-download-excel-mutation';
 import { SortOptionsBox } from '@/entities/additional-service/ui/sort-options-box';
 import { AccountHolderSearchList } from '@/entities/additional-service/ui/account-holder-search/account-holder-search-list';
 
@@ -104,7 +104,7 @@ export const AccountHolderSearchPage = () => {
       bankCode: bank,
       resultStatus: processResult
     }).then((rs) => {
-
+      console.log('Excel Dowload Status : ' + rs.status)
     });
   };
 

src/pages/additional-service/account-holder-search/detail-page.tsx

@@ -9,7 +9,7 @@ import {
     useSetFooterMode,
     useSetOnBack
 } from '@/widgets/sub-layout/use-sub-layout';
-import { useExtensionAccountHolderSearchDetailMutation } from '@/entities/additional-service/api/use-extension-account-holder-search-detail-mutation';
+import { useExtensionAccountHolderSearchDetailMutation } from '@/entities/additional-service/api/account-holder-search/use-extension-account-holder-search-detail-mutation';
 import { AdditionalServiceCategory, DetailInfo, DetailResponse, ExtensionAccountHolderSearchDetailParams, TitleInfo } from '@/entities/additional-service/model/types';
 import { TitleInfoWrap } from '@/entities/additional-service/ui/info-wrap/title-info-wrap';
 import { useLocation } from 'react-router';

src/pages/additional-service/account-holder-search/request-page.tsx

@@ -1,7 +1,6 @@
 import { useState } from 'react';
 import { PATHS } from '@/shared/constants/paths';
 import { useNavigate } from '@/shared/lib/hooks/use-navigate';
-import { IMAGE_ROOT } from '@/shared/constants/common';
 import { HeaderType } from '@/entities/common/model/types';
 import {
     useSetHeaderTitle,
@@ -9,11 +8,12 @@ import {
     useSetFooterMode,
     useSetOnBack
 } from '@/widgets/sub-layout/use-sub-layout';
+import { useExtensionAccountHolderSearchRequestMutation } from '@/entities/additional-service/api/account-holder-search/use-extension-account-holder-search-reqeust-mutation';
+import { ExtensionAccountHolderSearchRequestParams } from '@/entities/additional-service/model/types';
 
 export const AccountHolderSearchRequestPage = () => {
     const { navigate } = useNavigate();
 
-
     useSetHeaderTitle('계좌성명조회_신청');
     useSetHeaderType(HeaderType.LeftArrow);
     useSetFooterMode(false);
@@ -21,25 +21,35 @@ export const AccountHolderSearchRequestPage = () => {
         navigate(PATHS.additionalService.accountHolderSearch.list);
     });
 
+    const { mutateAsync: accountHolderSearchRequest } = useExtensionAccountHolderSearchRequestMutation();
+
     const [formData, setFormData] = useState({
         mid: 'nictest001m',
-        bank: '',
+        bankCode: '',
-        accountNum: ''
+        accountNo: ''
     })
 
     const handleInputChange = (field: string, value: string) => {
-        setFormData(prev => ({
+        setFormData({ ...formData, [field]: value });
-            ...prev,
-            [field]: value
-        }));
     };
 
-    useSetOnBack(() => {
-        navigate(PATHS.additionalService.accountHolderSearch.list);
-    });
-
     const onClickToRequest = () => {
-        navigate(PATHS.additionalService.accountHolderSearch.list)
+        const reuqestParams: ExtensionAccountHolderSearchRequestParams = {
+            mid: formData.mid,
+            bankCode: formData.bankCode, // 추후 진짜 은행코드 삽입 필요
+            accountNo: formData.accountNo
+        }
+
+        console.log("계좌성명 조회 조회신청 요청 파라미터 : ", reuqestParams);
+
+        accountHolderSearchRequest(reuqestParams)
+        .then((response) => {
+            console.log("계좌성명 조회 조회 신청 성공 응답: ", response.status)
+            navigate(PATHS.additionalService.accountHolderSearch.list);
+        })
+        .catch((error) => {
+            console.error("계좌성명 조회 조회 신청 실패: ", error)
+        })
     };
 
     return (
@@ -67,8 +77,8 @@ export const AccountHolderSearchRequestPage = () => {
                                     <div className="billing-field">
                                         <select
                                             className="wid-100"
-                                            value={formData.bank}
+                                            value={formData.bankCode}
-                                            onChange={(e) => handleInputChange('bank', e.target.value)}
+                                            onChange={(e) => handleInputChange('bankCode', e.target.value)}
                                         >
                                             <option>우리은행</option>
                                             <option>카카오뱅크</option>
@@ -80,9 +90,11 @@ export const AccountHolderSearchRequestPage = () => {
                                     <div className="billing-label">계좌번호</div>
                                     <div className="billing-field">
                                         <input
-                                            type="number"
+                                        type="number"
-                                            value="10002464******"
+                                        placeholder=''
-                                        />
+                                        value={formData.accountNo}
+                                        onChange={(e) => handleInputChange('accountNo', e.target.value)}
+                                        ></input>
                                     </div>
                                 </div>
                             </div>
@@ -90,7 +102,7 @@ export const AccountHolderSearchRequestPage = () => {
                         <div className="apply-row">
                             <button
                                 className="btn-50 btn-blue flex-1"
-                                onClick={() => onClickToRequest() }
+                                onClick={() => onClickToRequest()}
                             >신청</button>
                         </div>
                     </div>

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

@@ -122,7 +122,7 @@ export const KeyInPaymentPage = () => {
       minAmount: newMinAmount,
       maxAmount: newMaxAmount
     }).then((rs) => {
-
+      console.log('Excel Dowload Status : ' + rs.status)
     });
   };
 

src/shared/api/api-url-additional-service.ts

@@ -17,6 +17,10 @@ export const API_URL_ADDITIONAL_SERVICE = {
     // POST: 계좌성명조회 엑셀 다운
     return `${API_BASE_URL}/api/v1/${API_URL_KEY}/extension/search-account-name/excel`;
   },
+  extensionAccountHolderSearchRequest: () => {
+    // POST: 계좌성명조회 조회 신청
+    return `${API_BASE_URL}/api/v1/${API_URL_KEY}/extension/search-account-name/request`;
+  },
   extensionLinkPaymentHistoryList: () => {
     // POST: 링크결제 - 발송내역 리스트 조회
     return `${API_BASE_URL}/api/v1/${API_URL_KEY}/extension/linkpay/history/list`;