From 40da87c5ad4fb83872a57aecd2674fa97de72737 Mon Sep 17 00:00:00 2001 From: "focp212@naver.com" Date: Thu, 23 Oct 2025 17:56:05 +0900 Subject: [PATCH] =?UTF-8?q?=EA=B1=B0=EB=9E=98=EB=82=B4=EC=97=AD=20?= =?UTF-8?q?=EC=83=81=EC=84=B8=20=ED=8E=98=EC=9D=B4=EC=A7=80=20=EA=B4=80?= =?UTF-8?q?=EB=A0=A8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/entities/transaction/model/types.ts | 39 ++++--- .../ui/section/amount-info-section.tsx | 31 ++++-- .../ui/section/escrow-info-section.tsx | 21 ++-- .../ui/section/important-info-section.tsx | 27 +++-- .../ui/section/merchant-info-section.tsx | 48 ++++++++ .../ui/section/payment-info-section.tsx | 103 ++++++++++++++++-- .../ui/section/settlement-info-section.tsx | 54 +++++++-- .../ui/section/transaction-info-section.tsx | 29 ++++- src/pages/transaction/escrow/detail-page.tsx | 30 +++-- 9 files changed, 306 insertions(+), 76 deletions(-) create mode 100644 src/entities/transaction/ui/section/merchant-info-section.tsx diff --git a/src/entities/transaction/model/types.ts b/src/entities/transaction/model/types.ts index a953515..faf8381 100644 --- a/src/entities/transaction/model/types.ts +++ b/src/entities/transaction/model/types.ts @@ -4,7 +4,6 @@ import { SortTypeKeys, SuccessResult } from '@/entities/common/model/types'; -import { MerchantInfo } from '@/entities/payment/model/types'; export enum CancelTabKeys { All = 'All', @@ -26,6 +25,7 @@ export enum InfoSectionKeys { Issue = 'Issue', Detail = 'Detail', Escrow = 'Escrow', + Merchant = 'Merchant' }; export enum ProcessStep { One = 'One', @@ -397,12 +397,14 @@ export interface TransactionInfo { transactionAmount?: number; }; export interface SettlementInfo { - approvalSettleDate?: string; - approvalSettleAmount?: number; - cancelSettleDate?: string; - cancelSettleAmount?: number; + approvalSettlementDate?: string; + approvalSettlementAmount?: number; + cancelSettlementDate?: string; + cancelSettlementAmount?: number; + /* scheduledSettlementDate?: string; completedSettlementDate?: string; + */ }; export interface PartCancelInfo { originalTid?: string; @@ -444,16 +446,16 @@ export interface DetailInfo { canDownloadReceipt?: boolean; }; export interface EscrowInfo { - deliveryStatus: string; - deliveryRegistrationDate: string; - deliveryCompleteDate: string; - purchaseConfirmDate: string; - purchaseRejectReason: string; - rejectReason: string; - escrowCertNumber: string; - deliveryCompany: string; - trackingNumber: number; - deliveryAddress: string; + deliveryStatus?: string; + deliveryRegistrationDate?: string; + deliveryCompleteDate?: string; + purchaseConfirmDate?: string; + purchaseRejectReason?: string; + rejectReason?: string; + escrowCertNumber?: string; + deliveryCompany?: string; + trackingNumber?: number; + deliveryAddress?: string; }; export interface BillingInfo { @@ -467,6 +469,12 @@ export interface BillingInfo { installmentMonth: string; productName: string; buyerName: string; +}; + +export interface MerchantInfo { + shopName?: string; + gid?: string; + aid?: string; } export interface DetailResponse { @@ -480,6 +488,7 @@ export interface DetailResponse { detailInfo?: DetailInfo; escrowInfo?: EscrowInfo; billingInfo?: BillingInfo; + merchantInfo?: MerchantInfo; }; export interface BillingDetailResponse extends BillingInfo { diff --git a/src/entities/transaction/ui/section/amount-info-section.tsx b/src/entities/transaction/ui/section/amount-info-section.tsx index ff09ec5..3d6865a 100644 --- a/src/entities/transaction/ui/section/amount-info-section.tsx +++ b/src/entities/transaction/ui/section/amount-info-section.tsx @@ -2,7 +2,7 @@ import moment from 'moment'; import { NumericFormat } from 'react-number-format'; import { SectionTitleArrow } from '@/entities/common/ui/section-title-arrow'; import { useDownloadConfirmationMutation } from '../../api/use-download-confirmation-mutation'; -import { InfoSectionKeys, InfoSectionProps } from '../../model/types'; +import { InfoSectionKeys, InfoSectionProps, TransactionCategory } from '../../model/types'; import { SlideDown } from 'react-slidedown'; import 'react-slidedown/lib/slidedown.css'; @@ -218,7 +218,15 @@ export const AmountInfoSection = ({ { !!isOpen &&
} @@ -226,13 +234,18 @@ export const AmountInfoSection = ({
{ amountInfo?.mid }
-
- -
+ { + ((transactionCategory === TransactionCategory.CashReceipt) || + (transactionCategory === TransactionCategory.Escrow) || + (transactionCategory === TransactionCategory.Billing)) && +
+ +
+ } ); diff --git a/src/entities/transaction/ui/section/escrow-info-section.tsx b/src/entities/transaction/ui/section/escrow-info-section.tsx index a82445f..2151d87 100644 --- a/src/entities/transaction/ui/section/escrow-info-section.tsx +++ b/src/entities/transaction/ui/section/escrow-info-section.tsx @@ -5,7 +5,6 @@ import { SlideDown } from 'react-slidedown'; import 'react-slidedown/lib/slidedown.css'; export const EscrowInfoSection = ({ - transactionCategory, escrowInfo, isOpen, onClickToOpenInfo @@ -30,43 +29,43 @@ export const EscrowInfoSection = ({ { !!isOpen && diff --git a/src/entities/transaction/ui/section/important-info-section.tsx b/src/entities/transaction/ui/section/important-info-section.tsx index c7009a4..e98d04c 100644 --- a/src/entities/transaction/ui/section/important-info-section.tsx +++ b/src/entities/transaction/ui/section/important-info-section.tsx @@ -152,41 +152,46 @@ export const ImportantInfoSection = ({ subLi() } { - /* (transactionCategory === TransactionCategory.Escrow) && <>
  • 주문번호 - { importantInfo?.orderNumber } + { }
  • TID - { importantInfo?.tid } + { }
  • 거래상태 - { importantInfo?.transactionStatus } + { }
  • - 결제수단 - { importantInfo?.paymentMethod } + 거래수단 + { }
  • 승인일 - { moment(importantInfo?.approvalDate).format('YYYY.MM.DD') } + { } +
    • +
  • + 거래일 + { } +
    • +
  • + 요청일 + { }
  • 취소일 - { moment(importantInfo?.cancelDate).format('YYYY.MM.DD') } + { }
  • 상품명 - { importantInfo?.goodsName } + { }
    • - */ } - diff --git a/src/entities/transaction/ui/section/merchant-info-section.tsx b/src/entities/transaction/ui/section/merchant-info-section.tsx new file mode 100644 index 0000000..07276d4 --- /dev/null +++ b/src/entities/transaction/ui/section/merchant-info-section.tsx @@ -0,0 +1,48 @@ +import { SectionTitleArrow } from '@/entities/common/ui/section-title-arrow'; +import { InfoSectionKeys, InfoSectionProps } from '../../model/types'; +import { SlideDown } from 'react-slidedown'; +import 'react-slidedown/lib/slidedown.css'; + +export const MerchantInfoSection = ({ + merchantInfo, + isOpen, + onClickToOpenInfo +}: InfoSectionProps) => { + + const onClickToSetOpenInfo = () => { + if(!!onClickToOpenInfo){ + onClickToOpenInfo(InfoSectionKeys.Merchant); + } + }; + + return ( + <> +
    +
    onClickToSetOpenInfo() } + > + 상점 정보 +
    + + { !!isOpen && +
      +
    • + ·  상호 + { merchantInfo?.shopName } +
      • +
    • + ·  GID + { merchantInfo?.gid } +
      • +
    • + ·  AID + { merchantInfo?.aid } +
      • +
    + } +     +
    + + ); +}; \ No newline at end of file diff --git a/src/entities/transaction/ui/section/payment-info-section.tsx b/src/entities/transaction/ui/section/payment-info-section.tsx index ccc360b..5170323 100644 --- a/src/entities/transaction/ui/section/payment-info-section.tsx +++ b/src/entities/transaction/ui/section/payment-info-section.tsx @@ -153,19 +153,100 @@ export const PaymentInfoSection = ({ { (transactionCategory === TransactionCategory.Escrow) && <>
  • - 승인 금액 - - - + ·  승인매입 + { }
  • - 승인 번호 - { paymentInfo?.approvalNumber } + ·  승인반송(횟수) + { } +
    • +
  • + ·  승인재매입(횟수) + { } +
    • +
  • + ·  승인VAN + { } +
    • +
  • + ·  취소매입 + { } +
    • +
  • + ·  취소반송 + { } +
    • +
  • + ·  취소재매입 + { } +
    • +
  • + ·  매입VAN + { } +
    • +
  • + ·  매입사(발급사) + { } +
    • +
  • + ·  카드번호 + { } +
    • +
  • + ·  승인번호 + { } +
    • +
  • + ·  할부기간 + { } +
    • +
  • + ·  인증 + { } +
    • +
  • + ·  유형 + { } +
    • +
  • + ·  은행명 + { } +
    • +
  • + ·  계좌번호 + { } +
    • +
  • + ·  입금금융기관명 + { } +
    • +
  • + ·  입금자명 + { } +
    • +
  • + ·  입금기한 + { } +
    • +
  • + ·  입금일 + { } +
    • +
  • + ·  환불예정일 + { } +
    • +
  • + ·  환불은행명 + { } +
    • +
  • + ·  환불계좌번호 + { } +
    • +
  • + ·  예금주 + { }
    • } diff --git a/src/entities/transaction/ui/section/settlement-info-section.tsx b/src/entities/transaction/ui/section/settlement-info-section.tsx index fad7692..9a3ba37 100644 --- a/src/entities/transaction/ui/section/settlement-info-section.tsx +++ b/src/entities/transaction/ui/section/settlement-info-section.tsx @@ -1,7 +1,7 @@ import moment from 'moment'; import { NumericFormat } from 'react-number-format'; import { SectionTitleArrow } from '@/entities/common/ui/section-title-arrow'; -import { InfoSectionKeys, InfoSectionProps } from '../../model/types'; +import { InfoSectionKeys, InfoSectionProps, TransactionCategory } from '../../model/types'; import { SlideDown } from 'react-slidedown'; import 'react-slidedown/lib/slidedown.css'; @@ -106,13 +106,53 @@ export const SettlementInfoSection = ({ > 정산 정보 - - { !!isOpen && - + { (transactionCategory === TransactionCategory.AllTransaction) && + + { !!isOpen && +
      + { subLi() } +
    + } +     + } + { (transactionCategory === TransactionCategory.Escrow) && + + { !!isOpen && +
      +
    • + ·  승인정산일 + { moment(settlementInfo?.approvalSettlementDate).format('YYYY.MM.DD') } +
      • +
    • + ·  승인정산금액 + + + +
      • +
    • + ·  취소정산일 + { moment(settlementInfo?.cancelSettlementDate).format('YYYY.MM.DD') } +
      • +
    • + ·  취소정산금액 + + + +
      • +
    + } +     } -     ) diff --git a/src/entities/transaction/ui/section/transaction-info-section.tsx b/src/entities/transaction/ui/section/transaction-info-section.tsx index c8a2b33..74e4082 100644 --- a/src/entities/transaction/ui/section/transaction-info-section.tsx +++ b/src/entities/transaction/ui/section/transaction-info-section.tsx @@ -121,12 +121,33 @@ export const TransactionInfoSection = ({ { (transactionCategory === TransactionCategory.Escrow) && <>
  • - 가맹점명 - NICE PAY + ·  구매자명 + { }
  • - 사업자번호 - 123-45-67890 + ·  이메일 + { } +
    • +
  • + ·  전화번호 + { } +
    • +
  • + ·  취소사유 + { } +
    • +
  • + ·  취소요청자 + { } +
    • +
  • + ·  부분취소 + { } +
    • + { /* 계좌이체 혹은 가상계좌 */ } +
  • + ·  현금영수증발행 + { }
    • } diff --git a/src/pages/transaction/escrow/detail-page.tsx b/src/pages/transaction/escrow/detail-page.tsx index eef9edc..482e9c6 100644 --- a/src/pages/transaction/escrow/detail-page.tsx +++ b/src/pages/transaction/escrow/detail-page.tsx @@ -18,7 +18,8 @@ import { PaymentInfo, TransactionInfo, SettlementInfo, - InfoSectionKeys + InfoSectionKeys, + MerchantInfo } from '@/entities/transaction/model/types'; import { useSetOnBack, @@ -28,6 +29,7 @@ import { } from '@/widgets/sub-layout/use-sub-layout'; import { EscrowMailResendBottomSheet } from '@/entities/transaction/ui/escrow-mail-resend-bottom-sheet'; import { useEscrowMailResendMutation } from '@/entities/transaction/api/use-escrow-mail-resend-mutation'; +import { MerchantInfoSection } from '@/entities/transaction/ui/section/merchant-info-section'; export const EscrowDetailPage = () => { const { navigate } = useNavigate(); @@ -39,12 +41,16 @@ export const EscrowDetailPage = () => { const [paymentInfo, setPaymentInfo] = useState(); const [transactionInfo, setTransactionInfo] = useState(); const [settlementInfo, setSettlementInfo] = useState(); + const [merchantInfo, setMerchantInfo] = useState(); + const [showAmountInfo, setShowAmountInfo] = useState(false); const [showImportantInfo, setShowImportantInfo] = useState(false); const [showEscroInfo, setShowEscroInfo] = useState(false); const [showPaymentInfo, setShowPaymentInfo] = useState(false); const [showTransactionInfo, setShowTransactionInfo] = useState(false); const [showSettlementInfo, setShowSettlementInfo] = useState(false); + const [showMerchantInfo, setShowMerchantInfo] = useState(false); + const [bottomSheetOn, setBottomSheetOn] = useState(false); const [orderNumber, setOrderNumber] = useState(); @@ -65,11 +71,12 @@ export const EscrowDetailPage = () => { issueNumber: location?.state.issueNumber, }; escrowDetail(escroDetailParams).then((rs: DetailResponse) => { - setImportantInfo(rs.importantInfo); - setEscrowInfo(rs.escrowInfo); - setPaymentInfo(rs.paymentInfo); - setTransactionInfo(rs.transactionInfo); - setSettlementInfo(rs.settlementInfo); + setImportantInfo(rs.importantInfo || {}); + setEscrowInfo(rs.escrowInfo || {}); + setPaymentInfo(rs.paymentInfo || {}); + setTransactionInfo(rs.transactionInfo || {}); + setSettlementInfo(rs.settlementInfo || {}); + setMerchantInfo(rs.merchantInfo || {}); setOrderNumber(rs.importantInfo?.orderNumber); setTid(rs.importantInfo?.tid); @@ -112,6 +119,9 @@ export const EscrowDetailPage = () => { else if(infoSectionKey === InfoSectionKeys.Settlement){ setShowSettlementInfo(!showSettlementInfo); } + else if(infoSectionKey === InfoSectionKeys.Merchant){ + setShowMerchantInfo(!showMerchantInfo); + } }; return ( @@ -127,8 +137,7 @@ export const EscrowDetailPage = () => { >
    onClickToOpenInfo(infoSectionKey) } > @@ -153,6 +162,11 @@ export const EscrowDetailPage = () => { isOpen={ showSettlementInfo } onClickToOpenInfo={ (infoSectionKey) => onClickToOpenInfo(infoSectionKey) } > + onClickToOpenInfo(infoSectionKey) } + >