Merge branch 'main' of https://gitea.bpsoft.co.kr/nicepayments/nice-app-web

src/entities/additional-service/api/account-holder-auth/use-extension-account-holder-auth-deatil-mutation.ts

@@ -13,35 +13,14 @@ import {
 } from '@tanstack/react-query';
 import { ExtensionAccountHolderAuthDetailParams, ExtensionAccountHolderAuthDetailResponse } from '../../model/account-holder-auth/types';
 
-export const extensionAccountHolderAuthDetail = async (params: ExtensionAccountHolderAuthDetailParams): Promise<DetailResponse> => {
+export const extensionAccountHolderAuthDetail = async (params: ExtensionAccountHolderAuthDetailParams): Promise<ExtensionAccountHolderAuthDetailResponse> => {
-    const response = await resultify(
+  return resultify(
-        axios.post<ExtensionAccountHolderAuthDetailResponse>(API_URL_ADDITIONAL_SERVICE.extensionAccountHolderAuthDetail(), params),
+    axios.post<ExtensionAccountHolderAuthDetailResponse>(API_URL_ADDITIONAL_SERVICE.extensionAccountHolderAuthDetail(), params),
-    );
+  );
-
-    const detailResponse: DetailResponse = {
-        titleInfo: {
-            accountName: response.accountName,
-            accountNo: response.accountNo,
-            scheduledSendDate: response.requestDate //추후 발송예정일자로 수정
-        } as TitleInfo,
-        detailInfo: {
-            companyName: response.companyName,
-            mid: response.mid,
-            requestDate: response.requestDate,
-            bankName: response.bankName,
-            accountNo: response.accountNo,
-            accountName: response.accountName,
-            transferStatus: response.transferStatus,
-            failureReason: response.failReason,
-        } as DetailInfo
-
-    };
-
-    return detailResponse;
 };
 
-export const useExtensionAccountHolderAuthDetailMutation = (options?: UseMutationOptions<DetailResponse, CBDCAxiosError, ExtensionAccountHolderAuthDetailParams>) => {
+export const useExtensionAccountHolderAuthDetailMutation = (options?: UseMutationOptions<ExtensionAccountHolderAuthDetailResponse, CBDCAxiosError, ExtensionAccountHolderAuthDetailParams>) => {
-    const mutation = useMutation<DetailResponse, CBDCAxiosError, ExtensionAccountHolderAuthDetailParams>({
+    const mutation = useMutation<ExtensionAccountHolderAuthDetailResponse, CBDCAxiosError, ExtensionAccountHolderAuthDetailParams>({
         ...options,
         mutationFn: (params: ExtensionAccountHolderAuthDetailParams) => extensionAccountHolderAuthDetail(params),
     });

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

@@ -13,39 +13,19 @@ import {
 } from '@tanstack/react-query';
 import { ExtensionAccountHolderSearchDetailParams, ExtensionAccountHolderSearchDetailResponse } from '../../model/account-holder-search/types';
 
-export const extensionAccountHolderSearchDetail = async (params: ExtensionAccountHolderSearchDetailParams): Promise<DetailResponse> => {
+export const extensionAccountHolderSearchDetail = (params: ExtensionAccountHolderSearchDetailParams) => {
-    const response = await resultify(
+    return resultify(
-        axios.post<ExtensionAccountHolderSearchDetailResponse>(API_URL_ADDITIONAL_SERVICE.extensionAccountHolderSearchDetail(), params),
+        axios.post<ExtensionAccountHolderSearchDetailResponse>(API_URL_ADDITIONAL_SERVICE.extensionAccountHolderSearchList(), params),
     );
-
-    // ExtensionAccountHolderSearchDetailResponse를 DetailResponse로 변환
-    const detailResponse: DetailResponse = {
-        titleInfo: {
-            accountNo: response.accountNo,
-            bankName: response.bankName,
-            requestDate: response.requestDate
-        } as TitleInfo,
-        detailInfo: {
-            accountName: response.accountName,
-            requestDate: response.requestDate,
-            resultStatus: response.resultStatus,
-            failureReason: response.failReason,
-            bankName: response.bankName,
-            accountNo: response.accountNo,
-            requestWay: response.requestWay
-        } as DetailInfo
-
-    };
-
-    return detailResponse;
 };
 
-export const useExtensionAccountHolderSearchDetailMutation = (options?: UseMutationOptions<DetailResponse, CBDCAxiosError, ExtensionAccountHolderSearchDetailParams>) => {
+export const useExtensionAccountHolderSearchDetailtMutation = (options?: UseMutationOptions<ExtensionAccountHolderSearchDetailResponse, CBDCAxiosError, ExtensionAccountHolderSearchDetailParams>) => {
-    const mutation = useMutation<DetailResponse, CBDCAxiosError, ExtensionAccountHolderSearchDetailParams>({
+    const mutation = useMutation<ExtensionAccountHolderSearchDetailResponse, CBDCAxiosError, ExtensionAccountHolderSearchDetailParams>({
         ...options,
         mutationFn: (params: ExtensionAccountHolderSearchDetailParams) => extensionAccountHolderSearchDetail(params),
     });
+
     return {
         ...mutation,
     };
-}
+};

src/entities/additional-service/api/face-auth/use-extension-face-auth-download-excel-mutation.ts

@@ -0,0 +1,29 @@
+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 {
+  ExtensionFaceAuthExcelDownlaodPrams,
+  ExtensionFaceAuthExcelDownlaodResponse
+} from '../../model/face-auth/types';
+import {
+  useMutation,
+  UseMutationOptions
+} from '@tanstack/react-query';
+
+export const extensionFaceAuthDownloadExcel = (params: ExtensionFaceAuthExcelDownlaodPrams) => {
+  return resultify(
+    axios.post<ExtensionFaceAuthExcelDownlaodResponse>(API_URL_ADDITIONAL_SERVICE.extensionFaceAuthExcelDownload(), params),
+  );
+};
+
+export const useExtensionFaceAuthDownloadExcelMutation = (options?: UseMutationOptions<ExtensionFaceAuthExcelDownlaodResponse, CBDCAxiosError, ExtensionFaceAuthExcelDownlaodPrams>) => {
+  const mutation = useMutation<ExtensionFaceAuthExcelDownlaodResponse, CBDCAxiosError, ExtensionFaceAuthExcelDownlaodPrams>({
+    ...options,
+    mutationFn: (params: ExtensionFaceAuthExcelDownlaodPrams) => extensionFaceAuthDownloadExcel(params),
+  });
+
+  return {
+    ...mutation,
+  };
+};

src/entities/additional-service/api/face-auth/use-extension-face-auth-list-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 { 
+  useMutation,
+  UseMutationOptions
+} from '@tanstack/react-query';
+import { ExtensionFaceAuthListParams, ExtensionFaceAuthListResponse } from '../../model/face-auth/types';
+
+export const extensionFaceAuthList = (params: ExtensionFaceAuthListParams) => {
+    return resultify(
+        axios.post<ExtensionFaceAuthListResponse>(API_URL_ADDITIONAL_SERVICE.extensionFaceAuthList(), params),
+    );
+};
+
+export const useExtensionFaceAuthListtMutation = (options?: UseMutationOptions<ExtensionFaceAuthListResponse, CBDCAxiosError, ExtensionFaceAuthListParams>) => {
+    const mutation = useMutation<ExtensionFaceAuthListResponse, CBDCAxiosError, ExtensionFaceAuthListParams>({
+        ...options,
+        mutationFn: (params: ExtensionFaceAuthListParams) => extensionFaceAuthList(params),
+    });
+
+    return {
+        ...mutation,
+    };
+};

src/entities/additional-service/model/account-holder-auth/constant.ts

@@ -1,8 +1,32 @@
-import { AuthAndTransferStatus } from "./types";
+import { AccountHolderAuthStatus } from "./types";
 
 export const authStatusBtnGroup = [
-    { name: '전체', value: AuthAndTransferStatus.ALL },
+    { name: '전체', value: AccountHolderAuthStatus.ALL },
-    { name: '요청', value: AuthAndTransferStatus.REQUEST},
+    { name: '요청', value: AccountHolderAuthStatus.REQUEST},
-    { name: '성공', value: AuthAndTransferStatus.SUCCESS},
+    { name: '성공', value: AccountHolderAuthStatus.SUCCESS},
-    { name: '실패', value: AuthAndTransferStatus.FAIL}
+    { name: '실패', value: AccountHolderAuthStatus.FAIL}
 ]
+
+export const getAuthStatusText = (status?: string): string => {
+    if (!status) return '';
+
+    const AuthStatusMap: Record<string, string> = {
+        'REQUEST' : '요청',
+        'SUCCESS' : '성공',
+        'FAIL' : '실패'
+    }
+
+    return AuthStatusMap[status] || status;
+}
+
+export const getAuthResultText = (status?: string): string => {
+    if (!status) return '';
+
+    const AuthResultMap: Record<string, string> = {
+        'MATCHED' : '예금주명 일치',
+        'NOT_MATCHED' : '예금주명 불일치',
+        'FAILED' : '인증실패 (계좌 오류 등)'
+    }
+
+    return AuthResultMap[status] || status;
+}

src/entities/additional-service/model/account-holder-auth/types.ts

@@ -2,20 +2,26 @@ import { DefaulResponsePagination, DefaultRequestPagination } from "@/entities/c
 import { AdditionalServiceCategory, ExtensionRequestParams, FilterProps, ListItemProps } from "../types";
 
 // 계좌 점유 조회 관련 타입들
-export enum AuthAndTransferStatus {
+export enum AccountHolderAuthStatus {
   ALL = "",
   REQUEST = "REQUEST",
   SUCCESS = "SUCCESS",
   FAIL = "FAIL"
 }
 
+export enum AccountHolderAuthResult {
+  MATCHED = "MATCHED",
+  NOT_MATCHED = "NOT_MATCHED",
+  FAILED = "FAILED"
+}
+
 export interface AccountHolderAuthListItem {
   tid?: string;
   accountName?: string;
   accountNo?: string;
   requestDate?: string;
   bankName?: string;
-  transferStatus?: AuthAndTransferStatus;
+  authStatus?: AccountHolderAuthStatus;
 }
 export interface AccountHolderAuthListProps {
   additionalServiceCategory: AdditionalServiceCategory;
@@ -26,11 +32,11 @@ export interface AccountHolderAuthFilterProps extends FilterProps {
   mid: string;
   startDate: string;
   endDate: string;
-  authStatus: AuthAndTransferStatus;
+  authStatus: AccountHolderAuthStatus;
   setMid: (mid: string) => void;
   setStartDate: (startDate: string) => void;
   setEndDate: (endDate: string) => void;
-  setAuthStatus: (authStatus: AuthAndTransferStatus) => void;
+  setAuthStatus: (authStatus: AccountHolderAuthStatus) => void;
 }
 
 // 계좌 점유 인증 확장 서비스
@@ -53,14 +59,14 @@ export interface ExtensionAccountHolderAuthContentItem {
   accountNo?: string;
   requestDate?: string;
   bankName?: string;
-  authStatus?: AuthAndTransferStatus;
+  authStatus?: AccountHolderAuthStatus;
 }
 
 export interface ExtensionAccountHolderAuthDownloadExcelParams extends ExtensionRequestParams {
   mid: string;
   fromDate: string;
   toDate: string;
-  authStatus: AuthAndTransferStatus;
+  authStatus: AccountHolderAuthStatus;
 }
 
 export interface ExtensionAccountHolderAuthDownloadExcelResponse {
@@ -79,6 +85,8 @@ export interface ExtensionAccountHolderAuthDetailResponse {
   requestDate: string;
   companyName: string;
   bankName: string;
-  transferStatus: AuthAndTransferStatus;
+  authStatus: AccountHolderAuthStatus;
-  failReason: string;
+  authResult: AccountHolderAuthResult;
+  authAmount: number;
+  requestName: string;
 }

src/entities/additional-service/model/account-holder-search/constant.ts

@@ -1,5 +1,5 @@
 import { ProcessResult } from "../types";
-import { AccountHolderResultStatus } from "./types";
+import { AccountHolderResultStatus, AccountHolderSearchCl } from "./types";
 
 
 export const resultStatusBtnGroup = [
@@ -7,3 +7,19 @@ export const resultStatusBtnGroup = [
   { name: '성공', value: AccountHolderResultStatus.SUCCESS },
   { name: '실패', value: AccountHolderResultStatus.FAIL },
 ]
+
+export const SearchTypeOption = [
+  { name: '예금주', value: AccountHolderSearchCl.ACCOUNT_NAME },
+  { name: '계좌번호', value: AccountHolderSearchCl.ACCOUNT_NO },
+];
+
+
+export const getAccountHolderStatusText = (status?: string): string => {
+  if (!status) return '';
+
+  const resultStatusMap: Record<string, string> = {
+    'SUCCESS': '성공',
+    'FAIL': '실패'
+  };
+  return resultStatusMap[status] || status;
+}

src/entities/additional-service/model/face-auth/constant.ts

@@ -1,9 +1,36 @@
-import { ProcessResult } from "../types";
+import { FaceAuthResult, FaceAuthTransType } from "./types";
 
-
+export const AuthResultBtnGroup = [
-
+    { name: '전체', value: FaceAuthResult.ALL },
-export const ResultStatusBtnGroup = [
+    { name: '성공', value: FaceAuthResult.SUCCESS },
-    { name: '전체', value: ProcessResult.ALL },
+    { name: '실패', value: FaceAuthResult.FAIL },
-    { name: '성공', value: ProcessResult.SUCCESS },
-    { name: '실패', value: ProcessResult.FAIL },
 ];
+
+export const TransactionTypeBtnGroup = [
+    { name: '전체', value: FaceAuthTransType.ALL },
+    { name: '인증', value: FaceAuthTransType.AUTH },
+    { name: '등록', value: FaceAuthTransType.REGISTER },
+];
+
+
+export const getAuthResultStatusText = (status?: string): string => {
+    if (!status) return '';
+
+    const authResultMap: Record<string, string> = {
+        'SUCCESS': '성공',
+        'FAIL': '실패'
+    }
+
+    return authResultMap[status] || status;
+}
+
+export const getTransTypeText = (transType?: string): string => {
+    if (!transType) return '';
+
+    const transTypeMap: Record<string, string> = {
+        'REGISTER': '등록',
+        'AUTH': '인증'
+    }
+
+    return transTypeMap[transType] || transType;
+}

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

@@ -3,19 +3,32 @@
 // 안면인증 관련 타입들
 // ========================================
 
-import { FilterProps, ListItemProps, ProcessResult } from "../types";
+import { DefaulResponsePagination, DefaultRequestPagination } from "@/entities/common/model/types";
+import { ExtensionRequestParams, FilterProps, ListItemProps, ProcessResult } from "../types";
 
-export enum FaceAuthTransactionType {
+export enum FaceAuthTransType {
-  ALL = "ALL",
+  ALL = "",
-  AUTH = "AUTH",
+  REGISTER = "REGISTER",
-  REGISTER = "REGISTER"
+  AUTH = "AUTH"
+}
+
+export enum FaceAuthResult {
+  ALL = "",
+  SUCCESS = "SUCCESS",
+  FAIL = "FAIL"
 }
 
 export interface FaceAuthListItem {
-  tid?: string;
+  companyName?: string;
+  mid?: string;
+  groupId?: string;
   requestDate?: string;
-  resultStatus?: string;
+  requestTime?: string;
-  name?: string;
+  cpid?: string;
+  userMallId?: string;
+  transType?: FaceAuthTransType;
+  authResult?: string;
+  failReason?: string;
 }
 
 export interface FaceAuthListProps {
@@ -25,15 +38,39 @@ export interface FaceAuthListProps {
 
 export interface FaceAuthFilterProps extends FilterProps {
   mid: string;
-  memberId: string;
+  userMallId: string;
-  startDate: string;
+  fromDate: string;
-  endDate: string;
+  toDate: string;
-  transactionType: FaceAuthTransactionType;
+  transType: FaceAuthTransType;
-  processResult: ProcessResult;
+  authResult: FaceAuthResult;
   setMid: (mid: string) => void;
-  setMemberId: (memberId: string) => void;
+  setUserMallId: (userMallId: string) => void;
-  setStartDate: (startDate: string) => void;
+  setFromDate: (fromDate: string) => void;
-  setEndDate: (endDate: string) => void;
+  setToDate: (toDate: string) => void;
-  setTransactionType: (transactionType: FaceAuthTransactionType) => void;
+  setTransType: (transType: FaceAuthTransType) => void;
-  setProcessResult: (processResult: ProcessResult) => void;
+  setAuthResult: (authResult: FaceAuthResult) => void;
+}
+
+export interface ExtensionFaceAuthListParams extends ExtensionRequestParams {
+  fromDate: string;
+  toDate: string;
+  userMallId: string;
+  transType: FaceAuthTransType;
+  authResult: string;
+  page?: DefaultRequestPagination
+}
+
+export interface ExtensionFaceAuthListResponse extends DefaulResponsePagination {
+  content: Array<FaceAuthListItem>
+}
+
+export interface ExtensionFaceAuthExcelDownlaodPrams {
+  mid: string;
+  email: string;
+  fromDate: string;
+  toDate: string;
+}
+
+export interface ExtensionFaceAuthExcelDownlaodResponse {
+  status : boolean;
 }

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

@@ -8,7 +8,7 @@ import type { ExtensionSmsDetailResponse } from './sms-payment/types';
 import { FaceAuthListItem } from './face-auth/types';
 import { AccountHolderSearchListItem } from './account-holder-search/types';
 import { KeyInPaymentListItem } from './key-in/types';
-import { AccountHolderAuthListItem, AuthAndTransferStatus } from './account-holder-auth/types';
+import { AccountHolderAuthListItem, AccountHolderAuthStatus } from './account-holder-auth/types';
 import { LinkContentType, LinkPaymentHistoryListItem, LinkPaymentSendMethod, LinkPaymentWaitListItem } from './link-pay/types';
 
 // ========================================
@@ -56,6 +56,7 @@ export interface TitleInfo {
   corpName?: string,
   accountNo?: string,
   accountName?: string,
+  authDate?: string,
   bankName?: string,
   requestDate?: string,
   sendDate?: string,
@@ -66,10 +67,13 @@ export interface DetailInfo {
   accountName?: string; // 예금주
   requestDate?: string; // 조회 일시
   resultStatus?: string; // 결과
+  authDate?: string;
   bankName?: string; // 은행 명
   failureReason?: string; // 실패사유
   accountNo?: string; // 계좌번호
   requestWay?: string; //요청 구분
+  authStatus?: string;
+  authResult?: string;
 
   mid?: string;
   companyName?: string;
@@ -77,7 +81,7 @@ export interface DetailInfo {
   phoneNumber: string;
   goodsName: string;
   moid: string;
-  transferStatus: AuthAndTransferStatus;
+  transferStatus: AccountHolderAuthStatus;
 
 }
 

src/entities/additional-service/ui/account-holder-auth/account-holder-auth-list.tsx

@@ -4,59 +4,62 @@ import { AccountHolderAuthListProps, ExtensionAccountHolderAuthContentItem } fro
 import { JSX } from 'react';
 
 export const AccountHolderAuthList = ({
-    additionalServiceCategory,
+  additionalServiceCategory,
-    listItems,
+  listItems,
-    mid
+  mid
 }: AccountHolderAuthListProps) => {
 
   const getListDateGroup = () => {
-    let rs: JSX.Element[] = [];
+    let rs = [];
     let date = '';
-    let list: ExtensionAccountHolderAuthContentItem[] = [];
+    let list = [];
     for (let i = 0; i < listItems.length; i++) {
+      let items = listItems[i];
+      if (!!items) {
+        let requestDate = items?.requestDate;
+        requestDate = requestDate?.substring(0, 8);
+        if (!!requestDate) {
+          if (i === 0) {
+            date = requestDate;
+          }
+          if (date !== requestDate) {
 
-      // sendDate(발송일자) 기준
+            if (list.length > 0) {
-      let requestDate = listItems[i]?.requestDate || '';
+              rs.push(
-      let itemDate = requestDate.substring(0, 8);
+                <ListDateGroup
-      if (i === 0) {
+                  additionalServiceCategory={additionalServiceCategory}
-        date = itemDate;
+                  key={date + '-' + i}
-      }
+                  date={date}
-      if (date !== itemDate) {
+                  items={list}
-        if (list.length > 0) {
+                ></ListDateGroup>
-          rs.push(
+              );
-            <ListDateGroup
+            }
-              additionalServiceCategory={additionalServiceCategory}
+            date = requestDate;
-              key={date + '-' + i}
+            list = [];
-              date={date}
+          }
-              items={list as any}
+          list.push(items);
-              mid={mid}
-            ></ListDateGroup>
-          );
         }
-        date = itemDate;
-        list = [];
       }
-      list.push(listItems[i] as any);
     }
     if (list.length > 0) {
       rs.push(
         <ListDateGroup
           additionalServiceCategory={additionalServiceCategory}
+          mid={mid}
           key={date + '-last'}
           date={date}
-          items={list as any}
+          items={list}
-          mid={mid}
         ></ListDateGroup>
-      );
+      )
     }
     return rs;
   };
 
-    return (
+  return (
-        <>
+    <>
-            <div className="transaction-list">
+      <div className="transaction-list">
-                {getListDateGroup()}
+        {getListDateGroup()}
-            </div>
+      </div>
-        </>
+    </>
-    )
+  )
 }

src/entities/additional-service/ui/account-holder-auth/filter/account-holder-auth-filter.tsx

@@ -8,7 +8,7 @@ import { FilterButtonGroups } from '@/shared/ui/filter/button-groups';
 import { authStatusBtnGroup } from '@/entities/additional-service/model/account-holder-auth/constant';
 import { FilterMotionDuration, FilterMotionStyle, FilterMotionVariants } from '@/entities/common/model/constant';
 import { useStore } from '@/shared/model/store';
-import { AccountHolderAuthFilterProps, AuthAndTransferStatus } from '@/entities/additional-service/model/account-holder-auth/types';
+import { AccountHolderAuthFilterProps, AccountHolderAuthStatus } from '@/entities/additional-service/model/account-holder-auth/types';
 
 export const AccountHolderAuthFilter = ({
 	filterOn,
@@ -26,7 +26,7 @@ export const AccountHolderAuthFilter = ({
 	const [filterMid, setFilterMid] = useState<string>(mid);
 	const [filterStartDate, setFilterStartDate] = useState<string>(moment(startDate).format('YYYY.MM.DD'));
 	const [filterEndDate, setFilterEndDate] = useState<string>(moment(endDate).format('YYYY.MM.DD'));
-	const [filterAuthStatus, setFilterAuthStatus] = useState<AuthAndTransferStatus>(authStatus);
+	const [filterAuthStatus, setFilterAuthStatus] = useState<AccountHolderAuthStatus>(authStatus);
 
 	const midOptions = useStore.getState().UserStore.selectOptionsMids;
 

src/entities/additional-service/ui/account-holder-search/account-holder-search-list.tsx

@@ -12,33 +12,35 @@ export const AccountHolderSearchList = ({
     const { navigate } = useNavigate();
 
     const getListDateGroup = () => {
-        let rs: JSX.Element[] = [];
+        let rs = [];
         let date = '';
-        let list: AccountHolderSearchListItem[] = [];
+        let list = [];
         for (let i = 0; i < listItems.length; i++) {
-            // requestDate format: "20211018140420" (YYYYMMDDHHmmss)
+            let items = listItems[i];
-            let requestDate = listItems[i]?.requestDate || '';
+            if (!!items) {
-            let itemDate = requestDate.substring(0, 8);
+                let requestDate = items?.requestDate;
-            if (i === 0) {
+                requestDate = requestDate?.substring(0, 8);
-                date = itemDate;
+                if (!!requestDate) {
-            }
+                    if (i === 0) {
-            if (date !== itemDate) {
+                        date = requestDate;
-                // 날짜가 바뀌면 이전 리스트를 푸시 (날짜 업데이트 전에!)
+                    }
-                if (list.length > 0) {
+                    if (date !== requestDate) {
-                    rs.push(
+                        if (list.length > 0) {
-                        <ListDateGroup
+                            rs.push(
-                            additionalServiceCategory={AdditionalServiceCategory.AccountHolderSearch}
+                                <ListDateGroup
-                            mid={mid}
+                                    additionalServiceCategory={AdditionalServiceCategory.AccountHolderSearch}
-                            key={date + '-' + i}
+                                    key={date + '-' + i}
-                            date={date}
+                                    date={date}
-                            items={list as any}
+                                    items={list}
-                        ></ListDateGroup>
+                                ></ListDateGroup>
-                    );
+                            );
+                        }
+                        date = requestDate;
+                        list = [];
+                    }
+                    list.push(items);
                 }
-                date = itemDate;  // 그 다음에 날짜 업데이트
-                list = [];
             }
-            list.push(listItems[i] as any);
         }
         if (list.length > 0) {
             rs.push(
@@ -47,13 +49,14 @@ export const AccountHolderSearchList = ({
                     mid={mid}
                     key={date + '-last'}
                     date={date}
-                    items={list as any}
+                    items={list}
                 ></ListDateGroup>
             );
         }
         return rs;
     };
 
+
     const onClickToNavigate = () => {
         navigate(PATHS.additionalService.accountHolderSearch.request)
     };

src/entities/additional-service/ui/account-holder-search/filter/account-holder-search-filter.tsx

@@ -13,6 +13,7 @@ import { FilterButtonGroups } from '@/shared/ui/filter/button-groups';
 import { FilterMotionDuration, FilterMotionStyle, FilterMotionVariants } from '@/entities/common/model/constant';
 import { useStore } from '@/shared/model/store';
 import { AccountHolderSearchFilterProps, AccountHolderSearchCl, AccountHolderResultStatus } from '@/entities/additional-service/model/account-holder-search/types';
+import { resultStatusBtnGroup, SearchTypeOption } from '@/entities/additional-service/model/account-holder-search/constant';
 
 export const AccountHolderSearchFilter = ({
 	filterOn,
@@ -42,15 +43,15 @@ export const AccountHolderSearchFilter = ({
 	const [filterResultStatus, setFilterResultStatus] = useState<AccountHolderResultStatus>(resultStatus);
 
 	const midOptions = useStore.getState().UserStore.selectOptionsMids;
+	const bankList = useStore.getState().CommonStore.bankList;
+	const bankOptions = bankList
+		.filter((bank) => bank.code1 !== '****')
+		.map((bank) => ({ name: bank.desc1, value: bank.code1 }));
 
 	const onClickToClose = () => {
 		setFilterOn(false);
 	};
 
-	const setNewDate = (newDate: any) => {
-		console.log(newDate)
-	};
-
 	const onClickToSetFilter = () => {
 		setMid(filterMid);
 		setSearchType(filterSearchType);
@@ -62,39 +63,23 @@ export const AccountHolderSearchFilter = ({
 		onClickToClose();
 	};
 
-	let bankOptions = [
-		{ name: '우리은행', value: '우리은행' },
-		{ name: '토스뱅킹', value: '토스뱅킹' }
-	];
-
-	let searchTypeOption = [
-		{ name: '예금주', value: AccountHolderSearchCl.ACCOUNT_NAME },
-		{ name: '계좌번호', value: AccountHolderSearchCl.ACCOUNT_NO },
-	];
-
-	let processResultBtnGroup = [
-		{ name: '전체', value: ProcessResult.ALL },
-		{ name: '성공', value: ProcessResult.SUCCESS },
-		{ name: '실패', value: ProcessResult.FAIL },
-	];
-
 	return (
 		<>
 			<motion.div
 				className="full-menu-modal"
 				initial="hidden"
 				animate={(filterOn) ? 'visible' : 'hidden'}
-				variants={ FilterMotionVariants }
+				variants={FilterMotionVariants}
-				transition={ FilterMotionDuration }
+				transition={FilterMotionDuration}
-				style={ FilterMotionStyle }
+				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
-									id="closeFullMenu"
+								id="closeFullMenu"
-									className="full-menu-close"
+								className="full-menu-close"
 							>
 								<img
 									src={IMAGE_ROOT + '/ico_close.svg'}
@@ -108,18 +93,18 @@ export const AccountHolderSearchFilter = ({
 					<div className="option-list pt-16">
 						<FilterSelect
 							title='가맹점'
-							selectValue={mid}
+							selectValue={filterMid}
-							selectSetter={setMid}
+							selectSetter={setFilterMid}
 							selectOptions={midOptions}
 						></FilterSelect>
 
 						<FilterSelectInput
 							title='예금주/계좌번호'
-							selectValue={searchType}
+							selectValue={filterSearchType}
-							selectSetter={setSearchType}
+							selectSetter={setFilterSearchType}
-							selectOptions={searchTypeOption}
+							selectOptions={SearchTypeOption}
-							inputValue={searchKeyword}
+							inputValue={filterSearchKeyword}
-							inputSetter={setSearchKeyword}
+							inputSetter={setFilterSearchKeyword}
 						></FilterSelectInput>
 						<FilterCalendar
 							startDate={filterStartDate}
@@ -130,15 +115,15 @@ export const AccountHolderSearchFilter = ({
 
 						<FilterSelect
 							title='은행'
-							selectValue={bank}
+							selectValue={filterBank}
-							selectSetter={setBank}
+							selectSetter={setFilterBank}
 							selectOptions={bankOptions}
 						></FilterSelect>
 
 						<FilterButtonGroups
 							title='조회결과'
 							activeValue={filterResultStatus}
-							btnGroups={processResultBtnGroup}
+							btnGroups={resultStatusBtnGroup}
 							setter={setFilterResultStatus}
 						></FilterButtonGroups>
 					</div>

src/entities/additional-service/ui/face-auth/filter/face-auth-filter.tsx

@@ -1,7 +1,7 @@
 import moment from 'moment';
 import { IMAGE_ROOT } from '@/shared/constants/common';
 import { motion } from 'framer-motion';
-import { useState } from 'react';
+import { useEffect, useState } from 'react';
 import {ProcessResult} from '../../../model/types';
 import { FilterSelect } from '@/shared/ui/filter/select';
 import { FilterInput } from '@/shared/ui/filter/input';
@@ -9,60 +9,53 @@ import { FilterCalendar } from '@/shared/ui/filter/calendar';
 import { FilterButtonGroups } from '@/shared/ui/filter/button-groups';
 import { FilterMotionDuration, FilterMotionStyle, FilterMotionVariants } from '@/entities/common/model/constant';
 import { useStore } from '@/shared/model/store';
-import { FaceAuthFilterProps, FaceAuthTransactionType } from '@/entities/additional-service/model/face-auth/types';
+import { FaceAuthFilterProps, FaceAuthResult, FaceAuthTransType } from '@/entities/additional-service/model/face-auth/types';
+import { AuthResultBtnGroup, TransactionTypeBtnGroup } from '@/entities/additional-service/model/face-auth/constant';
 
 export const FaceAuthFilter = ({
 	filterOn,
 	setFilterOn,
 	mid,
-	memberId,
+	userMallId,
-	startDate,
+	fromDate,
-	endDate,
+	toDate,
-	transactionType,
+	transType,
-	processResult,
+	authResult,
 	setMid,
-	setMemberId,
+	setUserMallId,
-	setStartDate,
+	setFromDate,
-	setEndDate,
+	setToDate,
-	setTransactionType,
+	setTransType,
-	setProcessResult
+	setAuthResult
 }: FaceAuthFilterProps) => {
 
 	const [filterMid, setFilterMid] = useState<string>(mid);
-	const [filterMemberId, setFilterMemberId] = useState<string>(memberId);
+	const [filterMemberId, setFilterMemberId] = useState<string>(userMallId);
-	const [filterStartDate, setFilterStartDate] = useState<string>(moment(startDate).format('YYYY.MM.DD'));
+	const [filterFromDate, setFilterFromDate] = useState<string>(moment(fromDate).format('YYYYMMDD'));
-	const [filterEndDate, setFilterEndDate] = useState<string>(moment(endDate).format('YYYY.MM.DD'));
+	const [filterToDate, setFilterToDate] = useState<string>(moment(toDate).format('YYYYMMDD'));
-	const [filterTransactionType, setFilterTransactionType] = useState<FaceAuthTransactionType>(transactionType);
+	const [filterTransType, setFIlterTransType] = useState<FaceAuthTransType>(transType);
-	const [filterProcessResult, setFilterProcessResult] = useState<ProcessResult>(processResult);
+	const [filterAuthResult, setFilterAuthResult] = useState<FaceAuthResult>(authResult);
 
 	const midOptions = useStore.getState().UserStore.selectOptionsMids;
 
+	useEffect(() => {
+		setFilterAuthResult(authResult);
+	}, [authResult]);
+
 	const onClickToClose = () => {
 		setFilterOn(false);
 	};
 
 	const onClickToSetFilter = () => {
 		setMid(filterMid);
-		setMemberId(filterMemberId);
+		setUserMallId(filterMemberId);
-		setStartDate(filterStartDate);
+		setFromDate(filterFromDate);
-		setEndDate(filterEndDate);
+		setToDate(filterToDate);
-		setTransactionType(filterTransactionType);
+		setTransType(filterTransType);
-		setProcessResult(filterProcessResult);
+		setAuthResult(filterAuthResult);
 		onClickToClose();
 	};
 
-	const transactionTypeBtnGroup = [
-		{ name: '전체', value: FaceAuthTransactionType.ALL },
-		{ name: '인증', value: FaceAuthTransactionType.AUTH },
-		{ name: '등록', value: FaceAuthTransactionType.REGISTER },
-	];
-
-	const processResultBtnGroup = [
-		{ name: '전체', value: ProcessResult.ALL },
-		{ name: '성공', value: ProcessResult.SUCCESS },
-		{ name: '실패', value: ProcessResult.FAIL },
-	];
-
 	return (
 		<>
 			<motion.div
@@ -105,24 +98,24 @@ export const FaceAuthFilter = ({
 						></FilterInput>
 
 						<FilterCalendar
-							startDate={filterStartDate}
+							startDate={filterFromDate}
-							endDate={filterEndDate}
+							endDate={filterToDate}
-							setStartDate={setFilterStartDate}
+							setStartDate={setFilterFromDate}
-							setEndDate={setFilterEndDate}
+							setEndDate={setFilterToDate}
 						></FilterCalendar>
 
 						<FilterButtonGroups
 							title='거래유형'
-							activeValue={filterTransactionType}
+							activeValue={filterTransType}
-							btnGroups={transactionTypeBtnGroup}
+							btnGroups={TransactionTypeBtnGroup}
-							setter={setFilterTransactionType}
+							setter={setFIlterTransType}
 						></FilterButtonGroups>
 
 						<FilterButtonGroups
 							title='인증결과'
-							activeValue={filterProcessResult}
+							activeValue={filterAuthResult}
-							btnGroups={processResultBtnGroup}
+							btnGroups={AuthResultBtnGroup}
-							setter={setFilterProcessResult}
+							setter={setFilterAuthResult}
 						></FilterButtonGroups>
 					</div>
 					<div className="apply-row">

src/entities/additional-service/ui/link-payment/link-payment-history-list.tsx

@@ -22,17 +22,19 @@ export const LinkPaymentHistoryList = ({
             date = sendDate;
           }
           if (date !== sendDate) {
-            date = sendDate;
+
             if (list.length > 0) {
               rs.push(
                 <ListDateGroup
                   additionalServiceCategory={additionalServiceCategory}
+                  mid={mid}
                   key={date + '-' + i}
                   date={date}
                   items={list}
                 ></ListDateGroup>
               );
             }
+            date = sendDate;
             list = [];
           }
           list.push(items);

src/entities/additional-service/ui/link-payment/link-payment-wait-list.tsx

@@ -14,25 +14,26 @@ export const LinkPaymentWaitList = ({
     let list = [];
     for (let i = 0; i < listItems.length; i++) {
       let items = listItems[i];
-      if(!!items) {
+      if (!!items) {
         let scheduledSendDate = items?.scheduledSendDate;
         scheduledSendDate = scheduledSendDate?.substring(0, 8);
-        if(!!scheduledSendDate) {
+        if (!!scheduledSendDate) {
-          if(i === 0) {
+          if (i === 0) {
             date = scheduledSendDate;
           }
-          if(date !== scheduledSendDate) {
+          if (date !== scheduledSendDate) {
-            date = scheduledSendDate;
+            if (list.length > 0) {
-            if(list.length > 0) {
               rs.push(
                 <ListDateGroup
-                additionalServiceCategory={additionalServiceCategory}
+                  additionalServiceCategory={additionalServiceCategory}
-                key={ date + '-' + i}
+                  key={date + '-' + i}
-                date={ date }
+                  mid={mid}
-                items={ list }
+                  date={date}
+                  items={list}
                 ></ListDateGroup>
               );
             }
+            date = scheduledSendDate;
             list = [];
           }
           list.push(items);

src/entities/additional-service/ui/list-date-group.tsx

@@ -30,11 +30,11 @@ export const ListDateGroup = ({
             paymentDate= { items[i]?.paymentDate}
             paymentStatus={ items[i]?.paymentStatus}
             requestDate={ items[i]?.requestDate }
+            requestTime={ items[i]?.requestTime}
             registDate={ items[i]?.registDate }
             bankName={ items[i]?.bankName}
             accountName={ items[i]?.accountName}
             accountNo={ items[i]?.accountNo }
-            transferStatus={ items[i]?.transferStatus}
             resultStatus={ items[i]?.resultStatus }
             resultMessage={ items[i]?.resultMessage }
             applicationDate={ items[i]?.applicationDate }
@@ -61,7 +61,7 @@ export const ListDateGroup = ({
             requestId={ items[i]?.requestId}
             detailExposure={ items[i]?.detailExposure}
             receiverInfo={ items[i]?.receiverInfo}
-            
+            authStatus= { items[i]?.authStatus}
 
             alimCl={ items[i]?.alimCl }
             sendType={ items[i]?.sendType }
@@ -69,6 +69,12 @@ export const ListDateGroup = ({
             paymentMethod={ items[i]?.paymentMethod }
             receiverName={ items[i]?.receiverName }
             serviceCode={ items[i]?.serviceCode}
+            groupId={ items[i]?.groupId}
+            cpid={ items[i]?.cpid}
+            userMallId={ items[i]?.userMallId}
+            transType={ items[i]?.transType }
+            authResult={ items[i]?.authResult }
+            failReason={ items[i]?.failReason }
 
             smsCl= { items[i]?.smsCl }
             onResendClick={ onResendClick }

src/entities/additional-service/ui/list-item.tsx

@@ -11,6 +11,7 @@ import { getKeyInPaymentPaymentStatusName } from '../model/key-in/constant';
 import { getArsPaymentStatusName, getArsOrderStatusName } from '../model/ars/constant';
 import { ServiceCode } from '../model/alimtalk/types';
 import { getAlimtalkAlimClText, getAlimtalkSendClTypeText, getAlimtalkSendTypeText, getAlimtalkServiceCodeText } from '../model/alimtalk/constant';
+import { getAuthResultStatusText, getTransTypeText } from '../model/face-auth/constant';
 
 export const ListItem = ({
   additionalServiceCategory,
@@ -19,7 +20,7 @@ export const ListItem = ({
   applicationDate, requestDate, bankName, accountNo, resultStatus, resultMessage,
   amount, sendMethod, processStatus,registDate,
 
-  accountName, transferStatus,
+  accountName,
 
   submallId, settlementDate, companyName,
   disbursementStatus, disbursementAmount,
@@ -31,9 +32,10 @@ export const ListItem = ({
   requestId,subReqId,
   buyerName,receiverInfo,
   seq,serviceCode,sendDate,
+  authStatus,
 
-  smsCl,
+  smsCl,groupId,userMallId,transType,
-  name,
+  authResult,failReason,requestTime,
   onResendClick
 }: ListItemProps) => {
   const { navigate } = useNavigate();
@@ -72,9 +74,9 @@ export const ListItem = ({
 
     }
     else if (additionalServiceCategory === AdditionalServiceCategory.AccountHolderAuth) {
-      if (transferStatus === "REQUEST" || transferStatus === "SUCCESS") {
+      if (authStatus === "REQUEST" || authStatus === "SUCCESS") {
         rs = 'blue';
-      } else if (transferStatus === "FAIL") {
+      } else if (authStatus === "FAIL") {
         rs = 'gray';
       }
     }
@@ -87,10 +89,10 @@ export const ListItem = ({
       }
     }
     else if (additionalServiceCategory === AdditionalServiceCategory.FaceAuth) {
-      if (resultStatus === "SUCCESS") {
+      if (authResult === "SUCCESS") {
         rs = 'blue';
       }
-      else if (resultStatus === "FAIL") {
+      else if (authResult === "FAIL") {
         rs = 'gray';
       }
     }
@@ -237,6 +239,14 @@ export const ListItem = ({
         }
       });
     }
+    // else if (additionalServiceCategory === AdditionalServiceCategory.FaceAuth) {
+    //   navigate(PATHS.additionalService.faceAuth.detail, {
+    //     state: {
+    //       additionalServiceCategory: additionalServiceCategory,
+    //       mid: mid
+    //     }
+    //   })
+    // }
     else {
       alert('additionalServiceCategory가 존재하지 않습니다.');
     }
@@ -298,13 +308,12 @@ export const ListItem = ({
       statusText = resultStatus || '';
     }
     else if (additionalServiceCategory === AdditionalServiceCategory.AccountHolderAuth) {
-      statusText = transferStatus || '';
+      statusText = authStatus || '';
     }
     else if (additionalServiceCategory === AdditionalServiceCategory.FaceAuth) {
-      statusText = status || '';
+      statusText = getTransTypeText(transType)
     }
     else if (additionalServiceCategory === AdditionalServiceCategory.SMSPayment) {
-      console.log(smsCl)
       statusText = getSmsClName(smsCl);
     }
     else if (additionalServiceCategory === AdditionalServiceCategory.KeyInPayment) {
@@ -331,7 +340,7 @@ export const ListItem = ({
       str = `${accountNo}`;
     }
     else if (additionalServiceCategory === AdditionalServiceCategory.FaceAuth) {
-      str = `${name}(${tid})`;
+      str = `${userMallId}(${mid})`;
     }
     else if (additionalServiceCategory === AdditionalServiceCategory.LinkPaymentHistory ||
       additionalServiceCategory === AdditionalServiceCategory.LinkPaymentWait
@@ -390,11 +399,15 @@ export const ListItem = ({
     }
     else if (additionalServiceCategory === AdditionalServiceCategory.FaceAuth) {
       rs.push(
-        //TODO : 
         <div key="face-auth" className="transaction-details">
-          <span>{processStatus}</span>
+          <span>{getStatus()}</span>
           <span className="separator">|</span>
-          <span>{status}</span>
+          <span>
+            {authResult === 'FAIL'
+              ? `${getAuthResultStatusText(authResult)}: ${failReason}`
+              : getAuthResultStatusText(authResult)
+            }
+          </span>
         </div>
       );
     }
@@ -512,15 +525,15 @@ export const ListItem = ({
     }
     else if (additionalServiceCategory === AdditionalServiceCategory.FaceAuth) {
       rs.push(
-        <div className={`status-label ${resultStatus === 'SUCCESS' ? 'success' : 'fail'}`}>
+        <div className={`status-label ${authResult === 'SUCCESS' ? 'success' : 'fail'}`}>
-          {resultStatus === 'SUCCESS' ? '성공' : '실패'}
+          {authResult === 'SUCCESS' ? '성공' : '실패'}
         </div>
       );
     }
     else if (additionalServiceCategory === AdditionalServiceCategory.AccountHolderAuth) {
       rs.push(
-        <div className={`status-label ${(transferStatus === 'REQUEST' || transferStatus === 'SUCCESS') ? 'success' : 'fail'}`}>
+        <div className={`status-label ${(authStatus === 'REQUEST' || authStatus === 'SUCCESS') ? 'success' : 'fail'}`}>
-          {(transferStatus === 'REQUEST' || transferStatus === 'SUCCESS') ? '성공' : '실패'}
+          {(authStatus === 'REQUEST' || authStatus === 'SUCCESS') ? '성공' : '실패'}
         </div>
       );
     }

src/entities/common/model/types.ts

@@ -91,6 +91,7 @@ export enum SortTypeKeys {
 export interface SortTypeBoxProps {
   sortType: SortTypeKeys;
   onClickToSort: (sortType: SortTypeKeys) => void;
+  sortOptions?: Array<{key: SortTypeKeys, label: string}>;
 };
 
 export interface CodesSelectParams {

src/entities/common/ui/sort-type-box.tsx

@@ -1,21 +1,25 @@
 import { SortTypeKeys, SortTypeBoxProps } from '../model/types';
 export const SortTypeBox = ({
   sortType,
-  onClickToSort
+  onClickToSort,
+  sortOptions = [
+    { key: SortTypeKeys.LATEST, label: '최신순' },
+    { key: SortTypeKeys.HIGH_AMOUNT, label: '고액순' }
+  ]
 }: SortTypeBoxProps) => {
 
   return (
     <>
       <div className="sort-options">
-        <button 
+        {sortOptions.map((option, index) => (
-          className={ `sort-btn ${(sortType === SortTypeKeys.LATEST)? 'active': ''}` }
+          <span key={option.key}>
-          onClick={ () => onClickToSort(SortTypeKeys.LATEST) }
+            {index > 0 && <span className="sort-divider">|  </span>}
-        >최신순</button>
+            <button
-        <span className="sort-divider">|</span>
+              className={`sort-btn ${(sortType === option.key) ? 'active' : ''}`}
-        <button 
+              onClick={() => onClickToSort(option.key)}
-          className={ `sort-btn ${(sortType === SortTypeKeys.HIGH_AMOUNT)? 'active': ''}` }
+            >{option.label}</button>
-          onClick={ () => onClickToSort(SortTypeKeys.HIGH_AMOUNT) }
+          </span>
-        >고액순</button>
+        ))}
       </div>
     </>
   );

src/entities/home/ui/favorite-wrapper.tsx

@@ -70,7 +70,7 @@ export const FavoriteWrapper = ({
         <SwiperSlide key={ `favorite-slide-key-${i}` }>
           <div
             className="swiper-item"
-            onClick={ () => onClickToNavigate(favoriteItems[i]?.programPath) }
+            onClick={ () => !editMode && onClickToNavigate(favoriteItems[i]?.programPath) }
           >
             <div className="swiper-icon coin-icon">
               <img

src/entities/menu/ui/menu-category.tsx

@@ -13,6 +13,7 @@ export interface MenuCategoryProps {
   subMenu?: Array<MenuItem>;
   setMenuOn?: (menuOn: boolean) => void;
   editMode?: boolean;
+  changeMenuId?: string;
   setChangeMenuId: (menuIdChecked?: string) => void;
   buttonRefs: RefObject<Array<HTMLDivElement>>;
   itemIndex: number;
@@ -25,6 +26,7 @@ export const MenuCategory = ({
   subMenu,
   setMenuOn,
   editMode,
+  changeMenuId,
   setChangeMenuId,
   buttonRefs,
   itemIndex
@@ -68,6 +70,11 @@ export const MenuCategory = ({
       ];
     }
     else{
+      // 즐겨찾기가 1개 남았을 때는 해제하지 않음
+      if(userFavorite.length <= 1){
+        callFavoiteItems();
+        return;
+      }
       userFavorite = userFavorite.filter((value, _) => {
         return value.menuId !== menuId
       });
@@ -93,6 +100,10 @@ export const MenuCategory = ({
     callFavoiteItems();
   }, []);
 
+  useEffect(() => {
+    callFavoiteItems();
+  }, [changeMenuId]);
+
   useEffect(() => {
     if(menuIds.length > 0) {
       // callShortcutSave();
@@ -138,7 +149,6 @@ export const MenuCategory = ({
           rs.push(
             <li
               key={ `menu-item-key-${i}` }
-              onClick={ () => onClickToNavigate(subMenu[i]?.programPath) }
             >{ subMenu[i]?.menuName }</li>
           );
         }

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

@@ -19,7 +19,7 @@ import { AccountHolderAuthList } from '@/entities/additional-service/ui/account-
 import { useExtensionAccountHolderAuthDownloadExcelMutation } from '@/entities/additional-service/api/account-holder-auth/use-extension-account-holder-auth-download-excel-mutation';
 import { AccountHolderAuthFilter } from '@/entities/additional-service/ui/account-holder-auth/filter/account-holder-auth-filter';
 import { useStore } from '@/shared/model/store';
-import { AccountHolderAuthListItem, AuthAndTransferStatus, ExtensionAccountHolderAuthContentItem, ExtensionAccountHolderAuthDownloadExcelParams, ExtensionAccountHolderAuthDownloadExcelResponse } from '@/entities/additional-service/model/account-holder-auth/types';
+import { AccountHolderAuthListItem, AccountHolderAuthStatus, ExtensionAccountHolderAuthContentItem, ExtensionAccountHolderAuthDownloadExcelParams, ExtensionAccountHolderAuthDownloadExcelResponse } from '@/entities/additional-service/model/account-holder-auth/types';
 import { AdditionalServiceCategory } from '@/entities/additional-service/model/types';
 import { EmailBottomSheet } from '@/entities/common/ui/email-bottom-sheet';
 
@@ -35,7 +35,7 @@ export const AccountHolderAuthPage = () => {
   const [mid, setMid] = useState<string>(userMid);
   const [fromDate, setFromDate] = useState(moment().format('YYYYMMDD'));
   const [toDate, setToDate] = useState(moment().format('YYYYMMDD'));
-  const [authStatus, setAuthStatus] = useState<AuthAndTransferStatus>(AuthAndTransferStatus.ALL)
+  const [authStatus, setAuthStatus] = useState<AccountHolderAuthStatus>(AccountHolderAuthStatus.ALL)
   const [emailBottomSheetOn, setEmailBottomSheetOn] = useState<boolean>(false);
   useSetHeaderTitle('계좌점유인증');
   useSetHeaderType(HeaderType.LeftArrow);
@@ -49,7 +49,7 @@ export const AccountHolderAuthPage = () => {
 
   const callList = (option?: {
     sortType?: SortTypeKeys,
-    status?: AuthAndTransferStatus
+    status?: AccountHolderAuthStatus
   }) => {
     let listParams = {
       mid: mid,
@@ -81,7 +81,7 @@ export const AccountHolderAuthPage = () => {
     });
   };
 
-  const onClickToAuthStatus = (val: AuthAndTransferStatus) => {
+  const onClickToAuthStatus = (val: AccountHolderAuthStatus) => {
     setAuthStatus(val);
     callList({
       status: val

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

@@ -13,7 +13,10 @@ import { TitleInfoWrap } from '@/entities/additional-service/ui/info-wrap/title-
 import { useLocation } from 'react-router';
 import { DetailInfoWrap } from '@/entities/additional-service/ui/info-wrap/detail-info-wrap';
 import { useExtensionAccountHolderAuthDetailMutation } from '@/entities/additional-service/api/account-holder-auth/use-extension-account-holder-auth-deatil-mutation';
-import { ExtensionAccountHolderAuthDetailParams } from '@/entities/additional-service/model/account-holder-auth/types';
+import { ExtensionAccountHolderAuthDetailParams, ExtensionAccountHolderAuthDetailResponse } from '@/entities/additional-service/model/account-holder-auth/types';
+import moment from 'moment';
+import { getAuthStatusText } from '@/entities/additional-service/model/account-holder-auth/constant';
+import { getAuthResultStatusText } from '@/entities/additional-service/model/face-auth/constant';
 
 export const AccountHolderAuthDetailPage = () => {
     const { navigate } = useNavigate();
@@ -21,8 +24,7 @@ export const AccountHolderAuthDetailPage = () => {
 
     const { mid, tid } = location.state || {};
 
-    const [titleInfo, setTitleInfo] = useState<TitleInfo>();
+    const [detail, setDetail] = useState<ExtensionAccountHolderAuthDetailResponse>();
-    const [detailInfo, setDetailInfo] = useState<DetailInfo>();
 
     useSetHeaderTitle('계좌점유인증 상세');
     useSetHeaderType(HeaderType.LeftArrow);
@@ -38,32 +40,71 @@ export const AccountHolderAuthDetailPage = () => {
             mid: mid,
             tid: tid
         }
-        accountHolderAuthDetail(accountHolderAuthDetailParams).then((rs: DetailResponse) => {
+        accountHolderAuthDetail(accountHolderAuthDetailParams).then((rs: ExtensionAccountHolderAuthDetailResponse) => {
-            console.log("Detail Info: ", rs)
+            setDetail(rs);
-            setTitleInfo(rs.titleInfo);
-            setDetailInfo(rs.detailInfo);
         });
     };
     useEffect(() => {
         callDetail();
     }, []);
+
+    const getDate = (date?: string) => {
+        return (date) ? moment(date, 'YYYYMMDDHHmmss').format('YYYY.MM.DD HH:mm:ss') : '';
+    };
     return (
         <>
             <main>
                 <div className="tab-content">
                     <div className="tab-pane sub active">
                         <div className="pay-top">
-                            <TitleInfoWrap
+                            <div className="num-amount">
-                                additionalServiceCategory={AdditionalServiceCategory.AccountHolderAuth}
+                                <span className="amount">{detail?.accountName}</span>
-                                titleInfo={titleInfo}
+                                <span className="amount">{detail?.accountNo}</span>
-                            ></TitleInfoWrap>
+                            </div>
+                            <div className="num-day">{getDate(detail?.requestDate)}</div>
                         </div>
+                        <div className="detail-divider"></div>
                         <div className="pay-detail">
-                            <div className="detail-divider"></div>
+                            <div className="detail-title">상세 정보</div>
-                            <DetailInfoWrap
+                            <ul className="kv-list">
-                                additionalServiceCategory={AdditionalServiceCategory.AccountHolderAuth}
+                                <li className="kv-row">
-                                detailInfo={detailInfo}
+                                    <span className="k">가맹점상호</span>
-                            ></DetailInfoWrap>
+                                    <span className="v">{detail?.companyName}</span>
+                                </li>
+                                <li className="kv-row">
+                                    <span className="k">MID</span>
+                                    <span className="v">{detail?.mid}</span>
+                                </li>
+                                <li className="kv-row">
+                                    <span className="k">요청일시</span>
+                                    <span className="v">{getDate(detail?.requestDate)}</span>
+                                </li>
+                                <li className="kv-row">
+                                    <span className="k">은행</span>
+                                    <span className="v">{detail?.bankName}</span>
+                                </li>
+                                <li className="kv-row">
+                                    <span className="k">계좌번호</span>
+                                    <span className="v">{detail?.bankName}</span>
+                                </li>
+                                <li className="kv-row">
+                                    <span className="k">예금주</span>
+                                    <span className="v">{detail?.accountName}</span>
+                                </li>
+                                <li className="kv-row">
+                                    <span className="k">결과</span>
+                                    <span className="v">{getAuthStatusText(detail?.authStatus)}</span>
+                                </li>
+                                <li className="kv-row">
+                                    <span className="k">실패 사유</span>
+                                    {detail?.authResult !== "MATCHED" &&
+                                        <span className="v">{getAuthResultStatusText(detail?.authResult)}</span>
+                                    }
+                                    {detail?.authResult === "MATCHED" &&
+                                        <span className="v">-</span>
+                                    }
+                                </li>
+                            </ul>
                         </div>
                     </div>
                 </div>

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

@@ -9,12 +9,13 @@ import {
     useSetFooterMode,
     useSetOnBack
 } from '@/widgets/sub-layout/use-sub-layout';
-import { useExtensionAccountHolderSearchDetailMutation } from '@/entities/additional-service/api/account-holder-search/use-extension-account-holder-search-detail-mutation';
 import { AdditionalServiceCategory, DetailInfo, DetailResponse, TitleInfo } from '@/entities/additional-service/model/types';
 import { TitleInfoWrap } from '@/entities/additional-service/ui/info-wrap/title-info-wrap';
 import { useLocation } from 'react-router';
 import { DetailInfoWrap } from '@/entities/additional-service/ui/info-wrap/detail-info-wrap';
-import { ExtensionAccountHolderSearchDetailParams } from '@/entities/additional-service/model/account-holder-search/types';
+import { ExtensionAccountHolderSearchDetailParams, ExtensionAccountHolderSearchDetailResponse } from '@/entities/additional-service/model/account-holder-search/types';
+import { useExtensionAccountHolderSearchDetailtMutation } from '@/entities/additional-service/api/account-holder-search/use-extension-account-holder-search-detail-mutation';
+import { getAccountHolderStatusText } from '@/entities/additional-service/model/account-holder-search/constant';
 
 export const AccountHolderSearchDetailPage = () => {
     const { navigate } = useNavigate();
@@ -22,8 +23,7 @@ export const AccountHolderSearchDetailPage = () => {
 
     const { mid, tid } = location.state || {};
 
-    const [titleInfo, setTitleInfo] = useState<TitleInfo>();
+    const [detail, setDetail] = useState<ExtensionAccountHolderSearchDetailResponse>();
-    const [detailInfo, setDetailInfo] = useState<DetailInfo>();
 
     useSetHeaderTitle('계좌성명조회 상세');
     useSetHeaderType(HeaderType.LeftArrow);
@@ -32,19 +32,22 @@ export const AccountHolderSearchDetailPage = () => {
         navigate(PATHS.additionalService.accountHolderSearch.list);
     });
 
-    const { mutateAsync: accountHolderSearchDetail } = useExtensionAccountHolderSearchDetailMutation();
+    const { mutateAsync: accountHolderSearchDetail } = useExtensionAccountHolderSearchDetailtMutation();
 
     const callDetail = () => {
         let accountHolderSearchDetailParams: ExtensionAccountHolderSearchDetailParams = {
             mid: mid,
             tid: tid
         }
-        accountHolderSearchDetail(accountHolderSearchDetailParams).then((rs: DetailResponse) => {
+        accountHolderSearchDetail(accountHolderSearchDetailParams).then((rs: ExtensionAccountHolderSearchDetailResponse) => {
-            console.log("Detail Info: ", rs)
+            setDetail(rs);
-            setTitleInfo(rs.titleInfo);
-            setDetailInfo(rs.detailInfo);
         });
     };
+
+    const getDate = (date?: string) => {
+        return (date) ? moment(date, 'YYYYMMDDHHmmss').format('YYYY.MM.DD HH:mm:ss') : '';
+    };
+
     useEffect(() => {
         callDetail();
     }, []);
@@ -54,17 +57,45 @@ export const AccountHolderSearchDetailPage = () => {
                 <div className="tab-content">
                     <div className="tab-pane sub active">
                         <div className="pay-top">
-                            <TitleInfoWrap
+                            <div className="num-amount">
-                                additionalServiceCategory={AdditionalServiceCategory.AccountHolderSearch}
+                                <span className="amount">{detail?.accountNo}</span>
-                                titleInfo={titleInfo}
+                            </div>
-                            ></TitleInfoWrap>
+                            <span className="num-day">{detail?.bankName}</span>
+                            <div className="num-day">{getDate(detail?.requestDate)}</div>
                         </div>
+                        <div className="detail-divider"></div>
                         <div className="pay-detail">
-                            <div className="detail-divider"></div>
+                            <div className="detail-title">상세 정보</div>
-                            <DetailInfoWrap
+                            <ul className="kv-list">
-                                additionalServiceCategory={AdditionalServiceCategory.AccountHolderSearch}
+                                <li className="kv-row">
-                                detailInfo={detailInfo}
+                                    <span className="k">예금주</span>
-                            ></DetailInfoWrap>
+                                    <span className="v">{detail?.accountName}</span>
+                                </li>
+                                <li className="kv-row">
+                                    <span className="k">조회 일시</span>
+                                    <span className="v">{detail?.requestDate}</span>
+                                </li>
+                                <li className="kv-row">
+                                    <span className="k">결과</span>
+                                    <span className="v">{getAccountHolderStatusText(detail?.resultStatus)}</span>
+                                </li>
+                                <li className="kv-row">
+                                    <span className="k">실패사유</span>
+                                    <span className="v">{detail?.failReason}</span>
+                                </li>
+                                <li className="kv-row">
+                                    <span className="k">은행</span>
+                                    <span className="v">{detail?.bankName}</span>
+                                </li>
+                                <li className="kv-row">
+                                    <span className="k">계좌번호</span>
+                                    <span className="v">{detail?.accountNo}</span>
+                                </li>
+                                <li className="kv-row">
+                                    <span className="k">요청 구분</span>
+                                    <span className="v">{detail?.requestWay}</span>
+                                </li>
+                            </ul>
                         </div>
                     </div>
                 </div>

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

@@ -15,7 +15,8 @@ import { useStore } from '@/shared/model/store';
 export const AccountHolderSearchRequestPage = () => {
     const { navigate } = useNavigate();
 
-    const userMid = useStore.getState().UserStore.mid
+    const midOptions = useStore.getState().UserStore.selectOptionsMids
+    const bankList = useStore.getState().CommonStore.bankList
 
     useSetHeaderTitle('계좌성명조회_신청');
     useSetHeaderType(HeaderType.LeftArrow);
@@ -27,7 +28,7 @@ export const AccountHolderSearchRequestPage = () => {
     const { mutateAsync: accountHolderSearchRequest } = useExtensionAccountHolderSearchRequestMutation();
 
     const [formData, setFormData] = useState({
-        mid: userMid,
+        mid: '',
         bankCode: '',
         accountNo: ''
     })
@@ -39,22 +40,30 @@ export const AccountHolderSearchRequestPage = () => {
     const onClickToRequest = () => {
         const reuqestParams: ExtensionAccountHolderSearchRequestParams = {
             mid: formData.mid,
-            bankCode: formData.bankCode, // 추후 진짜 은행코드 삽입 필요
+            bankCode: formData.bankCode,
             accountNo: formData.accountNo
         }
 
         console.log("계좌성명 조회 조회신청 요청 파라미터 : ", reuqestParams);
 
         accountHolderSearchRequest(reuqestParams)
-        .then((response) => {
+            .then((response) => {
-            console.log("계좌성명 조회 조회 신청 성공 응답: ", response.status)
+                console.log("계좌성명 조회 조회 신청 성공 응답: ", response.status)
-            navigate(PATHS.additionalService.accountHolderSearch.list);
+                navigate(PATHS.additionalService.accountHolderSearch.list);
-        })
+            })
-        .catch((error) => {
+            .catch((error) => {
-            console.error("계좌성명 조회 조회 신청 실패: ", error)
+                console.error("계좌성명 조회 조회 신청 실패: ", error)
-        })
+            })
     };
 
+    const isFormValid = () => {
+        return (
+            formData.mid.trim() !== '' &&
+            formData.bankCode.trim() !== '' &&
+            formData.accountNo.trim() !== ''
+        )
+    }
+
     return (
         <>
             <main>
@@ -65,12 +74,15 @@ export const AccountHolderSearchRequestPage = () => {
                                 <div className="billing-row">
                                     <div className="billing-label">가맹점</div>
                                     <div className="billing-field">
-                                        <select
+                                        <select value={formData.mid} onChange={(e) => handleInputChange('mid', e.target.value)}>
-                                            className="wid-100"
+                                            {
-                                            value={formData.mid}
+                                                midOptions.map((value) => (
-                                            onChange={(e) => handleInputChange('mid', e.target.value)}
+                                                    <option
-                                        >
+                                                        key={value.value}
-                                            <option>nictest00m</option>
+                                                        value={value.value}
+                                                    >{value.name}</option>
+                                                ))
+                                            }
                                         </select>
                                     </div>
                                 </div>
@@ -78,13 +90,18 @@ export const AccountHolderSearchRequestPage = () => {
                                 <div className="billing-row">
                                     <div className="billing-label">은행</div>
                                     <div className="billing-field">
-                                        <select
+                                        <select value={formData.bankCode} onChange={(e) => handleInputChange('bankCode', e.target.value)}>
-                                            className="wid-100"
+                                            <option value="">선택하세요</option>
-                                            value={formData.bankCode}
+                                            {
-                                            onChange={(e) => handleInputChange('bankCode', e.target.value)}
+                                                bankList
-                                        >
+                                                    .filter((bank) => bank.code1 !== '****')
-                                            <option>우리은행</option>
+                                                    .map((bank) => (
-                                            <option>카카오뱅크</option>
+                                                        <option
+                                                            key={bank.code1}
+                                                            value={bank.code1}
+                                                        >{bank.desc1}</option>
+                                                    ))
+                                            }
                                         </select>
                                     </div>
                                 </div>
@@ -93,10 +110,10 @@ export const AccountHolderSearchRequestPage = () => {
                                     <div className="billing-label">계좌번호</div>
                                     <div className="billing-field">
                                         <input
-                                        type="number"
+                                            type="number"
-                                        placeholder=''
+                                            placeholder=''
-                                        value={formData.accountNo}
+                                            value={formData.accountNo}
-                                        onChange={(e) => handleInputChange('accountNo', e.target.value)}
+                                            onChange={(e) => handleInputChange('accountNo', e.target.value)}
                                         ></input>
                                     </div>
                                 </div>
@@ -105,6 +122,7 @@ export const AccountHolderSearchRequestPage = () => {
                         <div className="apply-row">
                             <button
                                 className="btn-50 btn-blue flex-1"
+                                disabled={!isFormValid()}
                                 onClick={() => onClickToRequest()}
                             >신청</button>
                         </div>

src/pages/additional-service/face-auth/face-auth-page.tsx

@@ -1,12 +1,11 @@
 import moment from 'moment';
-import { ProcessResult } from '@/entities/additional-service/model/types';
+import { AdditionalServiceCategory, ProcessResult } from '@/entities/additional-service/model/types';
-import { SortTypeKeys } from '@/entities/common/model/types';
+import { DefaultRequestPagination, HeaderType, SortTypeKeys } from '@/entities/common/model/types';
 import { SortTypeBox } from '@/entities/common/ui/sort-type-box';
 import { DEFAULT_PAGE_PARAM } from '@/entities/common/model/constant';
 import { useNavigate } from '@/shared/lib/hooks/use-navigate';
 import { IMAGE_ROOT } from '@/shared/constants/common';
-import { HeaderType } from '@/entities/common/model/types';
+import { JSX, useEffect, useState } from 'react';
-import { useEffect, useState } from 'react';
 import { useStore } from '@/shared/model/store';
 import { PATHS } from '@/shared/constants/paths';
 import {
@@ -16,26 +15,28 @@ import {
     useSetOnBack
 } from '@/widgets/sub-layout/use-sub-layout';
 
-import { FaceAuthList } from '@/entities/additional-service/ui/face-auth/face-auth-list';
 import { FaceAuthFilter } from '@/entities/additional-service/ui/face-auth/filter/face-auth-filter';
-import { FaceAuthListItem, FaceAuthTransactionType } from '@/entities/additional-service/model/face-auth/types';
+import { ExtensionFaceAuthExcelDownlaodPrams, ExtensionFaceAuthExcelDownlaodResponse, ExtensionFaceAuthListParams, ExtensionFaceAuthListResponse, FaceAuthListItem, FaceAuthResult, FaceAuthTransType } from '@/entities/additional-service/model/face-auth/types';
-import { ResultStatusBtnGroup } from '@/entities/additional-service/model/face-auth/constant';
+import { AuthResultBtnGroup } from '@/entities/additional-service/model/face-auth/constant';
 import { EmailBottomSheet } from '@/entities/common/ui/email-bottom-sheet';
+import { useExtensionFaceAuthListtMutation } from '@/entities/additional-service/api/face-auth/use-extension-face-auth-list-mutation';
+import { useExtensionFaceAuthDownloadExcelMutation } from '@/entities/additional-service/api/face-auth/use-extension-face-auth-download-excel-mutation';
+import { ListDateGroup } from '@/entities/additional-service/ui/list-date-group';
 
 export const FaceAuthPage = () => {
     const { navigate } = useNavigate();
     const userMid = useStore.getState().UserStore.mid;
 
     const [sortType, setSortType] = useState<SortTypeKeys>(SortTypeKeys.LATEST);
-    const [listItems, setListItems] = useState({});
+    const [listItems, setListItems] = useState<Array<FaceAuthListItem>>([]);
-    const [pageParam, setPageParam] = useState(DEFAULT_PAGE_PARAM);
     const [filterOn, setFilterOn] = useState<boolean>(false);
+    const [pageParam, setPageParam] = useState<DefaultRequestPagination>(DEFAULT_PAGE_PARAM);
     const [mid, setMid] = useState<string>(userMid);
-    const [memberId, setMemberId] = useState<string>('');
+    const [userMallId, setUserMallId] = useState<string>('');
-    const [startDate, setStartDate] = useState(moment().format('YYYY-MM-DD'));
+    const [fromDate, setFromDate] = useState<string>(moment().format('YYYYMMDD'));
-    const [endDate, setEndDate] = useState(moment().format('YYYY-MM-DD'));
+    const [toDate, setToDate] = useState<string>(moment().format('YYYYMMDD'));
-    const [transactionType, setTransactionType] = useState<FaceAuthTransactionType>(FaceAuthTransactionType.ALL);
+    const [transType, setTransType] = useState<FaceAuthTransType>(FaceAuthTransType.ALL);
-    const [processResult, setProcessResult] = useState<ProcessResult>(ProcessResult.ALL);
+    const [authResult, setAuthResult] = useState<FaceAuthResult>(FaceAuthResult.ALL);
     const [emailBottomSheetOn, setEmailBottomSheetOn] = useState<boolean>(false);
 
     useSetHeaderTitle('안면인증');
@@ -45,48 +46,31 @@ export const FaceAuthPage = () => {
         navigate(PATHS.home);
     });
 
-    //TODO : API 연동
+    const { mutateAsync: faceAuthHistoryList } = useExtensionFaceAuthListtMutation();
-    //const { mutateAsync: faceAuthHistoryList } = useExtensionFaceAuthHistoryListMutation();
+    const { mutateAsync: downloadExcel } = useExtensionFaceAuthDownloadExcelMutation();
-    //const { mutateAsync: downloadExcel } = useExtensionFaceAuthDownloadExcelMutation();
-
-    const assembleData = (content: Array<FaceAuthListItem>) => {
-        console.log('rs.content:', content);
-        let data: any = {};
-        if (content && content.length > 0) {
-            for (let i = 0; i < content?.length; i++) {
-                let requestDate = content[i]?.requestDate?.substring(0, 8);
-                let groupDate = moment(requestDate).format('YYYYMMDD');
-                if (!!groupDate && !data.hasOwnProperty(groupDate)) {
-                    data[groupDate] = [];
-                }
-                if (!!groupDate && data.hasOwnProperty(groupDate)) {
-                    data[groupDate].push(content[i]);
-                }
-            }
-        }
-        console.log('Data : ', data);
-        return data;
-    };
 
     const callList = (option?: {
         sortType?: SortTypeKeys,
-        val?: string
+        authResult?: FaceAuthResult
     }) => {
-        pageParam.sortType = (option?.sortType) ? option.sortType : sortType;
+        let params: ExtensionFaceAuthListParams = {
-        setPageParam(pageParam);
-        let listParams = {
             mid: mid,
-            memberId: memberId,
+            userMallId: userMallId,
-            fromDate: startDate,
+            fromDate: fromDate,
-            toDate: endDate,
+            toDate: toDate,
-            transactionType: transactionType,
+            transType: transType,
-            resultStatus: processResult,
+            authResult: option?.authResult ?? authResult,
             page: pageParam
         };
 
-        //faceAuthHistoryList(listParams).then((rs) => {
+        if (params.page) {
-        //    setListItems(assembleData(rs.content));
+            params.page.sortType = option?.sortType || sortType;
-        //});
+            setPageParam(params.page);
+        }
+
+        faceAuthHistoryList(params).then((rs: ExtensionFaceAuthListResponse) => {
+            setListItems(rs.content);
+        });
     };
 
     const onClickToOpenEmailBottomSheet = () => {
@@ -95,17 +79,15 @@ export const FaceAuthPage = () => {
 
     const onSendRequest = (selectedEmail?: string) => {
         if (selectedEmail) {
-            // downloadExcel({
+            const params: ExtensionFaceAuthExcelDownlaodPrams = {
-            //     mid: mid,
+                mid: mid,
-            //     //email: selectedEmail,
+                email: selectedEmail,
-            //     memberId: memberId,
+                fromDate: fromDate,
-            //     fromDate: startDate,
+                toDate: toDate
-            //     toDate: endDate,
+            };
-            //     transactionType: transactionType,
+            downloadExcel(params).then((rs: ExtensionFaceAuthExcelDownlaodResponse) => {
-            //     resultStatus: processResult
+                console.log('Excel Download Status:', rs.status);
-            // }).then((rs) => {
+            });
-            //     console.log('Excel Download Status: ' + rs.status);
-            // });
         }
         setEmailBottomSheetOn(false);
     };
@@ -119,16 +101,62 @@ export const FaceAuthPage = () => {
         callList({ sortType: sort });
     };
 
-    const onClickToTransactionStatus = (val: ProcessResult) => {
+    const onClickToAuthResult = (val: FaceAuthResult) => {
-        setProcessResult(val);
+        setAuthResult(val);
         callList({
-            val: val
+            authResult: val
         });
     };
 
+    const getListDateGroup = () => {
+        let rs= [];
+        let date = '';
+        let list= [];
+        for (let i = 0; i < listItems.length; i++) {
+            let item = listItems[i];
+            if (!!item) {
+                let requestDate = item?.requestDate;
+                requestDate = requestDate?.substring(0, 8);
+                if (!!requestDate) {
+                    if (i === 0) {
+                        date = requestDate;
+                    }
+                    if (date !== requestDate) {
+                        if (list.length > 0) {
+                            rs.push(
+                                <ListDateGroup
+                                    additionalServiceCategory={AdditionalServiceCategory.FaceAuth}
+                                    mid={mid}
+                                    key={date + '-' + i}
+                                    date={date}
+                                    items={list as any}
+                                ></ListDateGroup>
+                            );
+                        }
+                        date = requestDate;
+                        list = [];
+                    }
+                    list.push(item);
+                }
+            }
+        }
+        if (list.length > 0) {
+            rs.push(
+                <ListDateGroup
+                    additionalServiceCategory={AdditionalServiceCategory.FaceAuth}
+                    mid={mid}
+                    key={date + '-last'}
+                    date={date}
+                    items={list as any}
+                ></ListDateGroup>
+            );
+        }
+        return rs;
+    };
+
     useEffect(() => {
         callList();
-    }, [mid, memberId, startDate, endDate, transactionType, processResult]);
+    }, [mid, userMallId, fromDate, toDate, transType, authResult]);
 
     return (
         <>
@@ -141,7 +169,7 @@ export const FaceAuthPage = () => {
                                     <input
                                         className="credit-period"
                                         type="text"
-                                        value={moment(startDate).format('YYYY.MM.DD') + '-' + moment(endDate).format('YYYY.MM.DD')}
+                                        value={moment(fromDate).format('YYYY.MM.DD') + '-' + moment(toDate).format('YYYY.MM.DD')}
                                         readOnly={true}
                                     />
                                     <button
@@ -172,25 +200,28 @@ export const FaceAuthPage = () => {
                             <SortTypeBox
                                 sortType={sortType}
                                 onClickToSort={onClickToSort}
+                                sortOptions={[
+                                    { key: SortTypeKeys.LATEST, label: '최신순' },
+                                    { key: SortTypeKeys.OLDEST, label: '오래된순' }
+                                ]}
                             ></SortTypeBox>
                             <div className="excrow">
                                 <div className="full-menu-keywords no-padding">
                                     {
-                                        ResultStatusBtnGroup.map((value, index) => (
+                                        AuthResultBtnGroup.map((value, index) => (
                                             <span
                                                 key={`key-service-code=${index}`}
-                                                className={`keyword-tag ${(processResult === value.value) ? 'active' : ''}`}
+                                                className={`keyword-tag ${(authResult === value.value) ? 'active' : ''}`}
-                                                onClick={() => onClickToTransactionStatus(value.value)}
+                                                onClick={() => onClickToAuthResult(value.value)}
                                             >{value.name}</span>
                                         ))
                                     }
                                 </div>
                             </div>
                         </div>
-                        <FaceAuthList
+                        <section className="transaction-list">
-                            listItems={listItems}
+                            {getListDateGroup()}
-                            mid={mid}
+                        </section>
-                        ></FaceAuthList>
                     </div>
                 </div>
             </main>
@@ -198,17 +229,17 @@ export const FaceAuthPage = () => {
                 filterOn={filterOn}
                 setFilterOn={setFilterOn}
                 mid={mid}
-                memberId={memberId}
+                userMallId={userMallId}
-                startDate={startDate}
+                fromDate={fromDate}
-                endDate={endDate}
+                toDate={toDate}
-                transactionType={transactionType}
+                transType={transType}
-                processResult={processResult}
+                authResult={authResult}
                 setMid={setMid}
-                setMemberId={setMemberId}
+                setUserMallId={setUserMallId}
-                setStartDate={setStartDate}
+                setFromDate={setFromDate}
-                setEndDate={setEndDate}
+                setToDate={setToDate}
-                setTransactionType={setTransactionType}
+                setTransType={setTransType}
-                setProcessResult={setProcessResult}
+                setAuthResult={setAuthResult}
             />
             <EmailBottomSheet
                 bottomSheetOn={emailBottomSheetOn}

src/pages/additional-service/link-payment/link-payment-wait-detail-page.tsx

@@ -42,7 +42,6 @@ export const LinkPaymentWaitDetailPage = () => {
     }
 
     linkPayWaitDetail(detailParam).then((rs: DetailResponse) => {
-      console.log("Detail Info: ", rs)
       setTitleInfo(rs.titleInfo)
       setPaymentInfo(rs.paymentInfo)
     })

src/pages/additional-service/link-payment/separate-approval/link-payment-separate-approval-page.tsx

@@ -254,19 +254,23 @@ export const LinkPaymentSeparateApprovalPage = () => {
                                                     <span className="label">• 결제상태:</span>
                                                     <span className="value">{item.paymentStatusName}</span>
                                                 </li>
-                                                <li>
+                                                {item.type !== LinkPaymentSeparateType.MAIN && (
-                                                    <span className="label">• 유효기간:</span>
+                                                    <>
-                                                    <span className="value">
+                                                        <li>
-                                                        {item.paymentLimitDate
+                                                            <span className="label">• 유효기간:</span>
-                                                            ? moment(item.paymentLimitDate, 'YYYYMMDD').format('YYYY/MM/DD')
+                                                            <span className="value">
-                                                            : '-'
+                                                                {item.paymentLimitDate
-                                                        }
+                                                                    ? moment(item.paymentLimitDate, 'YYYYMMDD').format('YYYY/MM/DD')
-                                                    </span>
+                                                                    : '-'
-                                                </li>
+                                                                }
-                                                <li>
+                                                            </span>
-                                                    <span className="label">• 연장횟수:</span>
+                                                        </li>
-                                                    <span className="value">{item.paymentLimitCount}</span>
+                                                        <li>
-                                                </li>
+                                                            <span className="label">• 연장횟수:</span>
+                                                            <span className="value">{item.paymentLimitCount}</span>
+                                                        </li>
+                                                    </>
+                                                )}
                                             </ul>
                                         </div>
                                         <div className="card-footer">
@@ -275,6 +279,7 @@ export const LinkPaymentSeparateApprovalPage = () => {
                                                 <select
                                                     value={extendPeriods[itemId] || ''}
                                                     onChange={(e) => handleExtendPeriodChange(itemId, e.target.value)}
+                                                    disabled={item.type === LinkPaymentSeparateType.MAIN}
                                                 >
                                                     <option value="">미설정</option>
                                                     {[1, 2, 3, 4, 5, 6, 7].map(days => {

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

@@ -217,4 +217,17 @@ export const API_URL_ADDITIONAL_SERVICE = {
     // POST: 자금이체 > 입금확인증 다운로드
     return `${API_BASE_URL}/api/v1/${API_URL_KEY}/extension/fund-account/result/receipt`;
   },
+  extensionFaceAuthList: () => {
+    // POST: 안면인증 목록 조회
+    return `${API_BASE_URL}/api/v1/${API_URL_KEY}/extension/face-auth/list`;
+  },
+  extensionFaceAuthExcelDownload: () => {
+    // POST: 안면인증 엑셀 다운로드
+    return `${API_BASE_URL}/api/v1/${API_URL_KEY}/extension/face-auth/excel`;
+  },
+  extensionFaceAuthDetail: () => {
+    // POST: 안면인증 상세 조회
+    return `${API_BASE_URL}/api/v1/${API_URL_KEY}/extension/face-auth/detail`;
+  },
+
 };

src/shared/ui/menu/index.tsx

@@ -151,6 +151,7 @@ export const Menu = ({
             subMenu={ MenuItems[i]?.subMenu }
             setMenuOn={ setMenuOn }
             editMode={ editMode }
+            changeMenuId={ changeMenuId }
             setChangeMenuId= { setChangeMenuId }
             buttonRefs={ buttonRefs }
             itemIndex={ i }