- 자금이체_처리결과: 리스트,필터,상세정보 수정

2025-10-17 17:08:44 +09:00
parent 3886e93b49
commit ec16b6ec11
11 changed files with 360 additions and 327 deletions
--- a/src/entities/additional-service/ui/filter/fund-account-result-filter.tsx
+++ b/src/entities/additional-service/ui/filter/fund-account-result-filter.tsx
@@ -1,12 +1,12 @@
 import { useEffect, useState } from 'react';
-import { FundAccountReceiveAccountNameNo, FundAccountResultType, FundAccountStatus } from '../../model/fund-account/types';
+import { FundAccountReceiveAccountNameNo, FundAccountResultStatus, FundAccountSearchCl, FundAccountSearchDateType } from '../../model/fund-account/types';
 import moment from 'moment';
 import { motion } from 'framer-motion';
 import { FilterMotionDuration, FilterMotionStyle, FilterMotionVariants } from '@/entities/common/model/constant';
 import { IMAGE_ROOT } from '@/shared/constants/common';
 import { FilterSelect } from '@/shared/ui/filter/select';
 import { FilterCalendar } from '@/shared/ui/filter/calendar';
-import { FundAccountReceiveAccountNameNoOptionsGroup, FundAccountReceiveBankCodeOptionsGroup, FundAccountResultTypeBtnGroup, FundAccountStatusBtnGroup } from '../../model/fund-account/constant';
+import { FundAccountReceiveAccountNameNoOptionsGroup, FundAccountReceiveBankCodeOptionsGroup, FundAccountResultSearchDateTypeBtnGroup, FundAccountStatusBtnGroup } from '../../model/fund-account/constant';
 import { FilterButtonGroups } from '@/shared/ui/filter/button-groups';
 import { FilterSelectInput } from '@/shared/ui/filter/select-input';
 import { useStore } from '@/shared/model/store';
@@ -15,60 +15,61 @@ export interface FundAccountResultFilterProps {
  filterOn: boolean;
  setFilterOn: (filterOn: boolean) => void;
  mid: string;
-  receiveAccountName: string;
-  receiveAccountNo: string;
-  resultType: FundAccountResultType;
+  searchCl: FundAccountSearchCl;
+  searchValue: string;
+  searchDateType: FundAccountSearchDateType;
  fromDate: string;
  toDate: string;
-  receiveBankCode: string;
-  status: FundAccountStatus;
+  bankCode: string;
+  resultStatus: FundAccountResultStatus;
  setMid: (mid: string) => void;
-  setReceiveAccountName: (receiveAccountName: string) => void;
-  setReceiveAccountNo: (receiveAccountNo: string) => void;
-  setResultType: (resultType: FundAccountResultType) => void;
+  setSearchCl: (searchCl: FundAccountSearchCl) => void;
+  setSearchValue: (searchValue: string) => void;
+  setSearchDateType: (searchDateType: FundAccountSearchDateType) => void;
  setFromDate: (fromDate: string) => void;
  setToDate: (toDate: string) => void;
-  setReceiveBankCode: (receiveBankCode: string) => void;
-  setStatus: (status: FundAccountStatus) => void;
+  setBankCode: (bankCode: string) => void;
+  setResultStatus: (resultStatus: FundAccountResultStatus) => void;
 };
 export const FundAccountResultFilter = ({
  filterOn,
  setFilterOn,
  mid,
-  receiveAccountName,
-  receiveAccountNo,
-  resultType,
+  searchCl,
+  searchValue,
+  searchDateType,
  fromDate,
  toDate,
-  receiveBankCode,
-  status,
+  bankCode,
+  resultStatus,
  setMid,
-  setReceiveAccountName,
-  setReceiveAccountNo,
-  setResultType,
+  setSearchCl,
+  setSearchValue,
+  setSearchDateType,
  setFromDate,
  setToDate,
-  setReceiveBankCode,
-  setStatus
+  setBankCode,
+  setResultStatus
 }: FundAccountResultFilterProps) => {

  const [filterMid, setFilterMid] = useState<string>(mid);
-  const [filterReceiveAccountName, setFilterReceiveAccountName] = useState<string>(receiveAccountName);
-  const [filterReceiveAccountNo, setFilterReceiveAccountNo] = useState<string>(receiveAccountNo);
+  const [filterSearchCl, setFilterSearchCl] = useState<FundAccountSearchCl>(searchCl);
+  const [filterSearchValue, setFilterSearchValue] = useState<string>(searchValue);
+  const [filterSearchDateType, setFilterSearchDateType] = useState<FundAccountSearchDateType>(searchDateType);
  const [filterFromDate, setFilterFromDate] = useState<string>(moment(fromDate).format('YYYY.MM.DD'));
  const [filterToDate, setFilterToDate] = useState<string>(moment(toDate).format('YYYY.MM.DD'));
-  const [filterReceiveBankCode, setFilterReceiveBankCode] = useState<string>(receiveBankCode);
-  const [filterStatus, setFilterStatus] = useState<FundAccountStatus>(status);
-  const [filterResultType, setFilterResultType] = useState<FundAccountResultType>(resultType);
+  const [filterBankCode, setFilterBankCode] = useState<string>(bankCode);
+  const [filterResultStatus, setFilterResultStatus] = useState<FundAccountResultStatus>(resultStatus);
+
  const [
    filterReceiveAccountNameNoSelectValue,
    setFilterReceiveAccountNameNoSelectValue
  ] = useState<FundAccountReceiveAccountNameNo>(FundAccountReceiveAccountNameNo.ReceiveAccountName);
  const [
-    filterReceiveAccountNameNoInputValue, 
+    filterReceiveAccountNameNoInputValue,
    setFilterReceiveAccountNameNoInputValue
  ] = useState<string>('');
-  
+
  const midOptions = useStore.getState().UserStore.selectOptionsMids;

  const onClickToClose = () => {
@@ -77,48 +78,48 @@ export const FundAccountResultFilter = ({

  const onClickToSetFilter = () => {
    setMid(filterMid);
-    if(filterReceiveAccountNameNoSelectValue === FundAccountReceiveAccountNameNo.ReceiveAccountName){
-      setReceiveAccountName(filterReceiveAccountNameNoInputValue);
-      setReceiveAccountNo('');
+    if(filterSearchCl === FundAccountSearchCl.ACCOUNT_NAME){
+      setSearchCl(filterSearchCl);
+      setSearchValue(filterSearchValue);
    }
-    else if(filterReceiveAccountNameNoSelectValue === FundAccountReceiveAccountNameNo.ReceiveAccountNo){
-      setReceiveAccountName('');
-      setReceiveAccountNo(filterReceiveAccountNameNoInputValue);  
+    else if(filterSearchCl === FundAccountSearchCl.ACCOUNT_NO){
+      setSearchCl(filterSearchCl);
+      setSearchValue(filterSearchValue);  
    }
-    setResultType(filterResultType);
+    setSearchDateType(filterSearchDateType);
    setFromDate(filterFromDate);
    setToDate(filterToDate);
-    setReceiveBankCode(filterReceiveBankCode);
-    setStatus(filterStatus);
+    setBankCode(filterBankCode);
+    setResultStatus(filterResultStatus);
    onClickToClose();
  };

  useEffect(() => {
-    setFilterStatus(status);
-  }, [status]);
+    setResultStatus(resultStatus);
+  }, [resultStatus]);

  return (
    <>
-      <motion.div 
-        className="full-menu-modal" 
+      <motion.div
+        className="full-menu-modal"
        initial="hidden"
-        animate={ (filterOn)? 'visible': 'hidden' }
-        variants={ FilterMotionVariants }
-        transition={ FilterMotionDuration }
-        style={ FilterMotionStyle }
+        animate={(filterOn) ? 'visible' : 'hidden'}
+        variants={FilterMotionVariants}
+        transition={FilterMotionDuration}
+        style={FilterMotionStyle}
      >
        <div className="full-menu-container">
          <div className="full-menu-header">
            <div className="full-menu-title center">필터</div>
            <div className="full-menu-actions">
-              <button 
+              <button
                id="closeFullMenu"
                className="full-menu-close"
              >
-                <img 
-                  src={ IMAGE_ROOT + '/ico_close.svg' }
+                <img
+                  src={IMAGE_ROOT + '/ico_close.svg'}
                  alt="닫기"
-                  onClick={ () => onClickToClose() }
+                  onClick={() => onClickToClose()}
                />
              </button>
            </div>
@@ -126,48 +127,48 @@ export const FundAccountResultFilter = ({
          <div className="option-list pt-16">
            <FilterSelect
              title='가맹점'
-              selectValue={ filterMid }
-              selectSetter={ setFilterMid }
-              selectOptions={ midOptions }
+              selectValue={filterMid}
+              selectSetter={setFilterMid}
+              selectOptions={midOptions}
            ></FilterSelect>
            <FilterSelectInput
              title='수취인/계좌번호'
-              selectValue={ filterReceiveAccountNameNoSelectValue }
-              selectSetter={ setFilterReceiveAccountNameNoSelectValue }
-              selectOptions={ FundAccountReceiveAccountNameNoOptionsGroup }
-              inputValue={ filterReceiveAccountNameNoInputValue }
-              inputSetter={ setFilterReceiveAccountNameNoInputValue }
+              selectValue={filterReceiveAccountNameNoSelectValue}
+              selectSetter={setFilterReceiveAccountNameNoSelectValue}
+              selectOptions={FundAccountReceiveAccountNameNoOptionsGroup}
+              inputValue={filterReceiveAccountNameNoInputValue}
+              inputSetter={setFilterReceiveAccountNameNoInputValue}
            ></FilterSelectInput>
            <FilterButtonGroups
              title='조회 기준'
-              activeValue={ filterResultType }
-              btnGroups={ FundAccountResultTypeBtnGroup }
-              setter={ setFilterResultType }
+              activeValue={filterSearchDateType}
+              btnGroups={FundAccountResultSearchDateTypeBtnGroup}
+              setter={setFilterSearchDateType}
            ></FilterButtonGroups>
            <FilterCalendar
              title='조회기간'
-              startDate={ filterFromDate }
-              endDate={ filterToDate }
-              setStartDate={ setFilterFromDate }
-              setEndDate={ setFilterToDate }
+              startDate={filterFromDate}
+              endDate={filterToDate}
+              setStartDate={setFilterFromDate}
+              setEndDate={setFilterToDate}
            ></FilterCalendar>
            <FilterSelect
              title='은행'
-              selectValue={ filterReceiveBankCode }
-              selectSetter={ setFilterReceiveBankCode }
-              selectOptions={ FundAccountReceiveBankCodeOptionsGroup }
+              selectValue={filterBankCode}
+              selectSetter={setFilterBankCode}
+              selectOptions={FundAccountReceiveBankCodeOptionsGroup}
            ></FilterSelect>
            <FilterButtonGroups
              title='처리 결과'
-              activeValue={ filterStatus }
-              btnGroups={ FundAccountStatusBtnGroup }
-              setter={ setFilterStatus }
+              activeValue={filterResultStatus}
+              btnGroups={FundAccountStatusBtnGroup}
+              setter={setFilterResultStatus}
            ></FilterButtonGroups>
          </div>
          <div className="apply-row">
-            <button 
+            <button
              className="btn-50 btn-blue flex-1"
-              onClick={ () => onClickToSetFilter() }
+              onClick={() => onClickToSetFilter()}
            >적용</button>
          </div>
        </div>
--- a/src/entities/additional-service/ui/filter/fund-account-trnasaction-filter.tsx
+++ b/src/entities/additional-service/ui/filter/fund-account-trnasaction-filter.tsx
@@ -49,14 +49,8 @@ export const FundAccountTransactionFilter = ({
 }: FundAccountTransactionFilterProps) => {

  const [filterMid, setFilterMid] = useState<string>(mid);
-    const [
-    filterSearchCl,
-    setFilterSearchCl
-  ] = useState<FundAccountSearchCl>(searchCl);
-  const [
-    filterSearchValue, 
-    setFilterSearchValue
-  ] = useState<string>(searchValue);
+  const [filterSearchCl,setFilterSearchCl] = useState<FundAccountSearchCl>(searchCl);
+  const [filterSearchValue, setFilterSearchValue] = useState<string>(searchValue);
  const [filterFromDate, setFilterFromDate] = useState<string>(moment(fromDate).format('YYYY.MM.DD'));
  const [filterToDate, setFilterToDate] = useState<string>(moment(toDate).format('YYYY.MM.DD'));
  const [filterBankCode, setFilterBankCode] = useState<string>(bankCode);
--- a/src/entities/additional-service/ui/fund-account/result-list-wrap.tsx
+++ b/src/entities/additional-service/ui/fund-account/result-list-wrap.tsx
@@ -2,18 +2,18 @@ import moment from 'moment';
 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';
+import { JSX, useEffect, useState } from 'react';
 import { DEFAULT_PAGE_PARAM } from '@/entities/common/model/constant';
 import { ListDateGroup } from '../list-date-group';
 import { AdditionalServiceCategory } from '../../model/types';
-import { ExtensionFundAccountResultExcelParams, ExtensionFundAccountResultExcelResponse, ExtensionFundAccountResultListParams, ExtensionFundAccountResultListResponse, ExtensionFundAccountResultSummaryParams, ExtensionFundAccountResultSummaryResponse, FundAccountResultContent, FundAccountResultContentItem, FundAccountResultType, FundAccountStatus } from '../../model/fund-account/types';
+import { ExtensionFundAccountResultExcelParams, ExtensionFundAccountResultExcelResponse, ExtensionFundAccountResultListParams, ExtensionFundAccountResultListResponse, ExtensionFundAccountResultSummaryParams, ExtensionFundAccountResultSummaryResponse, FundAccountResultContent, FundAccountResultContentItem, FundAccountResultStatus, FundAccountSearchCl, FundAccountSearchDateType, FundAccountStatus } from '../../model/fund-account/types';
 import { useExtensionFundAccountResultSummaryMutation } from '../../api/fund-account/use-extension-fund-account-result-summary-mutation';
 import { useExtensionFundAccountResultExcelMutation } from '../../api/fund-account/use-extension-fund-account-result-excel-mutation';
 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 { SortTypeBox } from '@/entities/common/ui/sort-type-box';
-import { FundAccountStatusBtnGroup } from '../../model/fund-account/constant';
+import { FundAccountResultStatusBtnGroup, FundAccountStatusBtnGroup } from '../../model/fund-account/constant';
 import { FundAccountResultFilter } from '../filter/fund-account-result-filter';
 import { useStore } from '@/shared/model/store';

@@ -22,59 +22,67 @@ export const FundAccountResultListWrap = () => {
  const userMid = useStore.getState().UserStore.mid;

  const [sortType, setSortType] = useState<SortTypeKeys>(SortTypeKeys.LATEST);
-  const [listItems, setListItems] = useState<Record<string, Array<FundAccountResultContentItem>>>({});
+  const [listItems, setListItems] = useState<Array<FundAccountResultContentItem>>([]);
  const [filterOn, setFilterOn] = useState<boolean>(false);
  const [pageParam, setPageParam] = useState(DEFAULT_PAGE_PARAM);
+
  const [mid, setMid] = useState<string>(userMid);
-  const [receiveAccountName, setReceiveAccountName] = useState<string>('');
-  const [receiveAccountNo, setReceiveAccountNo] = useState<string>('');
-  const [resultType, setResultType] = useState<FundAccountResultType>(FundAccountResultType.RequestDate);
+  const [searchCl, setSearchCl] = useState<FundAccountSearchCl>(FundAccountSearchCl.ACCOUNT_NAME);
+  const [searchValue, setSearchValue] = useState<string>('');
+  const [searchDateType, setSearchDateType] = useState<FundAccountSearchDateType>(FundAccountSearchDateType.REQUEST_DATE)
  const [fromDate, setFromDate] = useState(moment().format('YYYYMMDD'));
  const [toDate, setToDate] = useState(moment().format('YYYYMMDD'));
-  const [status, setStatus] = useState<FundAccountStatus>(FundAccountStatus.REQUEST_FAIL);
-  const [receiveBankCode, setReceiveBankCode] = useState<string>('');
+  const [bankCode, setBankCode] = useState<string>('');
+  const [resultStatus, setResultStatus] = useState<FundAccountResultStatus>(FundAccountResultStatus.ALL);
+
+  const [email, setEmail] = useState<string>('');
+
+  const [totalRequestCount, setTotalRequestCount] = useState<number>(0);
+  const [totalRequestAmount, setTotalRequestAmount] = useState<number>(0);
+  const [totalSuccessCount, setTotalSuccessCount] = useState<number>(0);
+  const [totalSuccessAmount, setTotalSuccessAmount] = useState<number>(0);
+  const [totalFailCount, setTotalFailCount] = useState<number>(0);
+  const [totalFailAmount, setTotalFailAmount] = useState<number>(0);

-  const [totalCount, setTotalCount] = useState<number>(0);
-  const [totalAmount, setTotalAmount] = useState<number>(0);
-  const [successCount, setSuccessCount] = useState<number>(0);
-  const [successAmount, setSuccessAmount] = useState<number>(0);
-  const [failCount, setFailCount] = useState<number>(0);
-  const [failAmount, setFailAmount] = useState<number>(0);
-  const [pendingCount, setPendingCount] = useState<number>(0);
-  const [pendingAmount, setPendingAmount] = useState<number>(0);

  const { mutateAsync: extensionFundAccountResultList } = useExtensionFundAccountResultListMutation();
  const { mutateAsync: extensionFundAccountResultExcel } = useExtensionFundAccountResultExcelMutation();
  const { mutateAsync: extensionFundAccountResultSummary } = useExtensionFundAccountResultSummaryMutation();

  const callList = (option?: {
-      sortType?: SortTypeKeys, 
-      val?: string
-    }) => {
-      
-    pageParam.sortType = (option?.sortType)? option.sortType: sortType;
+    sortType?: SortTypeKeys,
+    resultStatus?: FundAccountResultStatus
+  }) => {
+
+    pageParam.sortType = (option?.sortType) ? option.sortType : sortType;
    setPageParam(pageParam);

-    let params: ExtensionFundAccountResultListParams = {
+    let listSummaryParams: ExtensionFundAccountResultListParams = {
      mid: mid,
-      fromDate: fromDate,
-      toDate: toDate,
-      status: status,
-      pagination: pageParam
+      searchCl: searchCl,
+      searchValue: searchValue,
+      searchDateType: searchDateType,
+      fromDate: '20240901',
+      toDate: '20250930',
+      bankCode: bankCode,
+      resultStatus: option?.resultStatus ?? resultStatus,
+      page: pageParam
    };

-    extensionFundAccountResultList(params).then((rs: ExtensionFundAccountResultListResponse) => {
+    extensionFundAccountResultList(listSummaryParams).then((rs: any) => {
      console.log(rs);
-      setListItems(assembleData(rs.content));
+      setListItems(rs.content);
    });
-
  };
+
+
  const callDownloadExcel = () => {
    let params: ExtensionFundAccountResultExcelParams = {
      mid: mid,
+      email: email,
+      searchDateType: searchDateType,
      fromDate: fromDate,
      toDate: toDate,
-      status: status,
    };
    extensionFundAccountResultExcel(params).then((rs: ExtensionFundAccountResultExcelResponse) => {

@@ -82,38 +90,17 @@ export const FundAccountResultListWrap = () => {
  };
  const callSummary = () => {
    let params: ExtensionFundAccountResultSummaryParams = {
-      mid: mid,
-      fromDate: fromDate,
-      toDate: toDate
+      mid: mid
    };
-    extensionFundAccountResultSummary(params).then((rs: ExtensionFundAccountResultSummaryResponse) => {
-      console.log(rs);
-      setTotalCount(rs.totalCount);
-      setTotalAmount(rs.totalAmount);
-      setSuccessCount(rs.successCount);
-      setSuccessAmount(rs.successAmount);
-      setFailCount(rs.failCount);
-      setFailAmount(rs.failAmount);
-      setPendingCount(rs.pendingCount);
-      setPendingAmount(rs.pendingAmount);
-    });
-  };

-  const assembleData = (content: Array<FundAccountResultContent>) => {
-    let data: any = {};
-    if(content && !!content[0] && content.length > 0){
-      let items: Array<FundAccountResultContentItem> = content[0].items;
-      for(let i=0;i<items.length;i++){
-        let groupDate = moment(items[i]?.requestDate).format('YYYYMMDD');
-        if(!!groupDate && !data.hasOwnProperty(groupDate)){
-          data[groupDate] = [];
-        }
-        if(!!groupDate && data.hasOwnProperty(groupDate)){
-          data[groupDate].push(items[i]);
-        }
-      }
-    }
-    return data;
+    extensionFundAccountResultSummary(params).then((rs: ExtensionFundAccountResultSummaryResponse) => {
+      setTotalRequestCount(rs.totalRequestCount);
+      setTotalRequestAmount(rs.totalRequestAmount);
+      setTotalSuccessCount(rs.totalSuccessCount);
+      setTotalSuccessAmount(rs.totalSuccessAmount);
+      setTotalFailCount(rs.totalFailCount);
+      setTotalFailAmount(rs.totalFailAmount);
+    });
  };

  const onClickToDownloadExcel = () => {
@@ -130,27 +117,51 @@ export const FundAccountResultListWrap = () => {
      sortType: sort
    });
  };
-  const onClickToStatus = (val: FundAccountStatus) => {
-    setStatus(val);
+  const onClickToStatus = (val: FundAccountResultStatus) => {
+    setResultStatus(val);
    callList({
-      val: val
+      resultStatus: val
    });
  };

  const getListDateGroup = () => {
-    let rs = [];
-    if(Object.keys(listItems).length > 0){
-      for(const [key, value] of Object.entries(listItems)){
-        rs.push(
-          <ListDateGroup
-            additionalServiceCategory={ AdditionalServiceCategory.FundAccountResult }
-            mid={ mid }
-            key={ key }
-            date={ key }
-            items={ value }
-          ></ListDateGroup>
-        );  
+    let rs: JSX.Element[] = [];
+    let date = '';
+    let list: FundAccountResultContentItem[] = [];
+    for (let i = 0; i < listItems.length; i++) {
+      // registDate format: "20211018140420" (YYYYMMDDHHmmss)
+      let requestDate = listItems[i]?.requestDate || '';
+      let itemDate = requestDate.substring(0, 8);
+      if (i === 0) {
+        date = itemDate;
      }
+      if (date !== itemDate) {
+        date = itemDate;
+        if (list.length > 0) {
+          rs.push(
+            <ListDateGroup
+              additionalServiceCategory={AdditionalServiceCategory.FundAccountResult}
+              mid={mid}
+              key={date + '-' + i}
+              date={date}
+              items={list as any}
+            ></ListDateGroup>
+          );
+        }
+        list = [];
+      }
+      list.push(listItems[i] as any);
+    }
+    if (list.length > 0) {
+      rs.push(
+        <ListDateGroup
+          additionalServiceCategory={AdditionalServiceCategory.FundAccountTransfer}
+          mid={mid}
+          key={date + '-last'}
+          date={date}
+          items={list as any}
+        ></ListDateGroup>
+      );
    }
    return rs;
  };
@@ -170,30 +181,30 @@ export const FundAccountResultListWrap = () => {
      <section className="summary-section pt-30">
        <div className="credit-controls">
          <div>
-            <input 
+            <input
              className="credit-period"
              type="text"
-              value={ moment(fromDate).format('YYYY.MM.DD') + '-' + moment(toDate).format('YYYY.MM.DD') } 
-              readOnly={ true }
+              value={moment(fromDate).format('YYYY.MM.DD') + '-' + moment(toDate).format('YYYY.MM.DD')}
+              readOnly={true}
            />
-            <button 
-              className="filter-btn" 
+            <button
+              className="filter-btn"
              aria-label="필터"
-              onClick={ () => onClickToOpenFilter() }
+              onClick={() => onClickToOpenFilter()}
            >
-              <img 
-                src={ IMAGE_ROOT + '/ico_setting.svg' }
+              <img
+                src={IMAGE_ROOT + '/ico_setting.svg'}
                alt="검색옵션"
              />
            </button>
          </div>
-          <button 
-            className="download-btn" 
+          <button
+            className="download-btn"
            aria-label="다운로드"
-            onClick={ () => onClickToDownloadExcel() }
+            onClick={() => onClickToDownloadExcel()}
          >
-            <img 
-              src={ IMAGE_ROOT + '/ico_download.svg' }
+            <img
+              src={IMAGE_ROOT + '/ico_download.svg'}
              alt="다운로드"
            />
          </button>
@@ -205,7 +216,7 @@ export const FundAccountResultListWrap = () => {
              <span className="value">
                <span>
                  <NumericFormat
-                    value={ pendingAmount }
+                    value={totalRequestAmount}
                    thousandSeparator
                    displayType="text"
                  ></NumericFormat>
@@ -213,7 +224,7 @@ export const FundAccountResultListWrap = () => {
                <span className="unit"> 원 (</span>
                <span>
                  <NumericFormat
-                    value={ pendingCount }
+                    value={totalRequestCount}
                    thousandSeparator
                    displayType="text"
                  ></NumericFormat>
@@ -226,7 +237,7 @@ export const FundAccountResultListWrap = () => {
              <span className="value">
                <span>
                  <NumericFormat
-                    value={ successAmount }
+                    value={totalSuccessAmount}
                    thousandSeparator
                    displayType="text"
                  ></NumericFormat>
@@ -234,7 +245,7 @@ export const FundAccountResultListWrap = () => {
                <span className="unit"> 원 (</span>
                <span>
                  <NumericFormat
-                    value={ successCount }
+                    value={totalSuccessCount}
                    thousandSeparator
                    displayType="text"
                  ></NumericFormat>
@@ -247,7 +258,7 @@ export const FundAccountResultListWrap = () => {
              <span className="value">
                <span>
                  <NumericFormat
-                    value={ failAmount }
+                    value={totalFailAmount}
                    thousandSeparator
                    displayType="text"
                  ></NumericFormat>
@@ -255,7 +266,7 @@ export const FundAccountResultListWrap = () => {
                <span className="unit"> 원 (</span>
                <span>
                  <NumericFormat
-                    value={ failCount }
+                    value={totalFailCount}
                    thousandSeparator
                    displayType="text"
                  ></NumericFormat>
@@ -269,52 +280,52 @@ export const FundAccountResultListWrap = () => {

      <section className="filter-section">
        <SortTypeBox
-          sortType={ sortType }
-          onClickToSort={ onClickToSort }
+          sortType={sortType}
+          onClickToSort={onClickToSort}
        ></SortTypeBox>
        <div className="excrow mr-0">
          <div className="full-menu-keywords no-padding">
            {
-              FundAccountStatusBtnGroup.map((value, index) => (
-                <span 
-                  key={ `key-service-code=${ index }` }
-                  className={ `keyword-tag ${(status === value.value)? 'active': ''}` }
-                  onClick={ () => onClickToStatus(value.value) }
-                >{ value.name }</span>
+              FundAccountResultStatusBtnGroup.map((value, index) => (
+                <span
+                  key={`key-service-code=${index}`}
+                  className={`keyword-tag ${(resultStatus === value.value) ? 'active' : ''}`}
+                  onClick={() => onClickToStatus(value.value)}
+                >{value.name}</span>
              ))
            }
-            </div>
+          </div>
        </div>
      </section>
-      
+
      <section className="transaction-list">
-        { getListDateGroup() }
+        {getListDateGroup()}
      </section>
      <div className="apply-row">
-        <button 
+        <button
          className="btn-50 btn-blue flex-1"
-          onClick={ onClickToNavigate }
+          onClick={onClickToNavigate}
        >이체 등록</button>
      </div>
      <FundAccountResultFilter
-        filterOn={ filterOn }
-        setFilterOn={ setFilterOn }
-        mid={ mid }
-        receiveAccountName={ receiveAccountName }
-        receiveAccountNo={ receiveAccountNo }
-        resultType={ resultType }
-        fromDate={ fromDate }
-        toDate={ toDate }
-        receiveBankCode= { receiveBankCode }
-        status={ status }
-        setMid={ setMid }
-        setReceiveAccountName={ setReceiveAccountName }
-        setReceiveAccountNo={ setReceiveAccountNo }
-        setResultType={ setResultType }
-        setFromDate={ setFromDate }
-        setToDate={ setToDate }
-        setReceiveBankCode={ setReceiveBankCode }
-        setStatus={ setStatus }
+        filterOn={filterOn}
+        setFilterOn={setFilterOn}
+        mid={mid}
+        searchCl={searchCl}
+        searchValue={searchValue}
+        searchDateType={searchDateType}
+        fromDate={fromDate}
+        toDate={toDate}
+        bankCode={bankCode}
+        resultStatus={resultStatus}
+        setMid={setMid}
+        setSearchCl={setSearchCl}
+        setSearchValue={setSearchValue}
+        setSearchDateType={setSearchDateType}
+        setFromDate={setFromDate}
+        setToDate={setToDate}
+        setBankCode={setBankCode}
+        setResultStatus={setResultStatus}
      ></FundAccountResultFilter>
    </>
  );
--- a/src/entities/additional-service/ui/fund-account/transfer-list-wrap.tsx
+++ b/src/entities/additional-service/ui/fund-account/transfer-list-wrap.tsx
@@ -43,6 +43,7 @@ export const FundAccountTransferListWrap = () => {
  const [status, setStatus] = useState<FundAccountStatus>(FundAccountStatus.ALL);
  const [bankCode, setBankCode] = useState<string>('');

+  const [email, setEmail] = useState<string>('');
  const [balance, setBalance] = useState<number>(0);

  const { mutateAsync: extensionFundAccountTransferList } = useExtensionFundAccountTransferListMutation();
@@ -78,12 +79,12 @@ export const FundAccountTransferListWrap = () => {
  const callDownloadExcel = () => {
    let params: ExtensionFundAccountTransferExcelParams = {
      mid: mid,
+      email: email,
      fromDate: fromDate,
      toDate: toDate,
-      status: status,
    };
    extensionFundAccountTransferExcel(params).then((rs: ExtensionFundAccountTransferExcelResponse) => {
-
+      
    });
  };

--- a/src/entities/additional-service/ui/list-date-group.tsx
+++ b/src/entities/additional-service/ui/list-date-group.tsx
@@ -5,9 +5,9 @@ import { ListItem } from '../ui/list-item';

 export const ListDateGroup = ({
  additionalServiceCategory,
+  mid,
  date,
  items,
-  mid,
  onResendClick
 }: ListDateGroupProps) => {
  moment.locale('ko');
@@ -37,6 +37,7 @@ export const ListDateGroup = ({
            transferStatus={ items[i]?.transferStatus}
            resultStatus={ items[i]?.resultStatus }
            resultMessage={ items[i]?.resultMessage }
+            applicationDate={ items[i]?.applicationDate }

            amount={ items[i]?.amount }
            sendDate={ items[i]?.sendDate }
@@ -51,13 +52,6 @@ export const ListDateGroup = ({
            disbursementStatus={ items[i]?.disbursementStatus }
            disbursementAmount={ items[i]?.disbursementAmount }

-            transferAmount={ items[i]?.transferAmount }
-            receiveBankName={ items[i]?.receiveBankName }
-            receiveAccountNo={ items[i]?.receiveAccountNo }
-            receiveAccountName={ items[i]?.receiveAccountName }
-            status={ items[i]?.status }
-            processDate={ items[i]?.processDate }
-
            orderStatus={ items[i]?.orderStatus }
            arsPaymentMethod={ items[i]?.arsPaymentMethod }

--- a/src/entities/additional-service/ui/list-item.tsx
+++ b/src/entities/additional-service/ui/list-item.tsx
@@ -3,27 +3,22 @@ import { PATHS } from '@/shared/constants/paths';
 import { useNavigate } from '@/shared/lib/hooks/use-navigate';
 import { ListItemProps, AdditionalServiceCategory } from '../model/types';
 import { getPaymentStatusText, getProcessStatusText, getSendMethodText } from '../lib/payment-status-utils';
-import { getFundAccountStatusName } from '../model/fund-account/constant';
+import { getFundAccountResultStatusName, getFundAccountStatusName } from '../model/fund-account/constant';
 import moment from 'moment';
+import { FundAccountResultStatus } from '../model/fund-account/types';

 export const ListItem = ({
  additionalServiceCategory,
  mid, tid, paymentDate, paymentStatus,

-  requestDate, bankName, accountNo, resultStatus,resultMessage,
-  amount, sendDate, sendStatus, sendMethod,
-  scheduledSendDate, processStatus,
-  registDate,
+  applicationDate, requestDate, bankName, accountNo, resultStatus, resultMessage,
+  amount, sendMethod, processStatus,registDate,

  accountName, transferStatus,

  submallId, settlementDate, companyName,
  disbursementStatus, disbursementAmount,

-  transferAmount, receiveBankName,
-  receiveAccountNo, receiveAccountName,
-  status, processDate,
-
  orderStatus, arsPaymentMethod,

  alimCl, sendType, sendCl,
@@ -127,9 +122,9 @@ export const ListItem = ({
        rs = 'gray';
      }
    } else if (additionalServiceCategory === AdditionalServiceCategory.FundAccountResult) {
-      if (status === "REQUEST_SUCCESS" || status === "REGIST_COMPLETE") {
+      if (resultStatus === "REQUEST" || resultStatus === "SUCCESS") {
        rs = 'blue';
-      } else if (status === "REQUEST_FAIL") {
+      } else if (resultStatus === "FAIL") {
        rs = 'gray';
      }
    }
@@ -261,7 +256,9 @@ export const ListItem = ({
      }
    }
    else if (additionalServiceCategory === AdditionalServiceCategory.FundAccountResult) {
-      timeStr = moment(requestDate).format('mm:ss');
+      if (applicationDate && applicationDate.length >= 12) {
+        timeStr = applicationDate.substring(8, 10) + ':' + applicationDate.substring(10, 12);
+      }
    }
    else if (additionalServiceCategory === AdditionalServiceCategory.Ars) {
      let time = paymentDate?.substring(8, 12);
@@ -283,7 +280,7 @@ export const ListItem = ({
      statusText = getFundAccountStatusName(resultStatus);
    }
    else if (additionalServiceCategory === AdditionalServiceCategory.FundAccountResult) {
-      statusText = getFundAccountStatusName(status);
+      statusText = getFundAccountResultStatusName(resultStatus);
    }
    else if (additionalServiceCategory === AdditionalServiceCategory.AccountHolderSearch) {
      statusText = resultStatus || '';
@@ -326,12 +323,11 @@ export const ListItem = ({
    else if (additionalServiceCategory === AdditionalServiceCategory.Payout) {
      str = companyName;
    }
-    else if (additionalServiceCategory === AdditionalServiceCategory.FundAccountTransfer) {
+    else if (additionalServiceCategory === AdditionalServiceCategory.FundAccountTransfer ||
+      additionalServiceCategory === AdditionalServiceCategory.FundAccountResult
+    ) {
      str = `${accountName}(${accountNo})`;
    }
-    else if (additionalServiceCategory === AdditionalServiceCategory.FundAccountResult) {
-      str = `${receiveAccountName}(${receiveAccountNo})`;
-    }
    else if (additionalServiceCategory === AdditionalServiceCategory.SMSPayment) {
      str = `${paymentDate}(${paymentStatus})[추후 수정 필요]`
    }
@@ -444,7 +440,9 @@ export const ListItem = ({
        <div className="transaction-details">
          <span>{getTime()}</span>
          <span className="separator">|</span>
-          <span>{status}</span>
+          <span>{getStatus()}</span>
+          <span className="separator">|</span>
+          <span>{mid}</span>
        </div>
      );
    }
@@ -548,7 +546,9 @@ export const ListItem = ({
        </div>
      );
    }
-    else if (additionalServiceCategory === AdditionalServiceCategory.FundAccountTransfer) {
+    else if (additionalServiceCategory === AdditionalServiceCategory.FundAccountTransfer ||
+      additionalServiceCategory === AdditionalServiceCategory.FundAccountResult
+    ) {
      rs.push(
        <div
          key="fund-account-transfer-amount"
@@ -563,21 +563,6 @@ export const ListItem = ({
        </div>
      );
    }
-    else if (additionalServiceCategory === AdditionalServiceCategory.FundAccountResult) {
-      rs.push(
-        <div
-          key="payout-item-amount"
-          className="transaction-amount"
-        >
-          <NumericFormat
-            value={transferAmount}
-            thousandSeparator
-            displayType="text"
-            suffix='원'
-          ></NumericFormat>
-        </div>
-      );
-    }
    else if (additionalServiceCategory === AdditionalServiceCategory.Ars) {
      rs.push(
        <div
@@ -604,9 +589,9 @@ export const ListItem = ({
    else if (additionalServiceCategory === AdditionalServiceCategory.SMSPayment && onResendClick && tid) {
      rs.push(
        <div
-        key="sms-payment-amount"
-        className={`status-label success`}
-        onClick={() => mid && tid && onResendClick(mid, tid)}
+          key="sms-payment-amount"
+          className={`status-label success`}
+          onClick={() => mid && tid && onResendClick(mid, tid)}
        >{'재발송'}</div>
      )
    }