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

에스크로 거래취소

Browse Source
This commit is contained in:
focp212@naver.com
2025-10-28 17:32:35 +09:00
parent 52516f2427
commit 7fa26cce00
15 changed files with 684 additions and 341 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
src/entities/transaction/ui/section/all-transaction-cancel-section-password-group.tsx
View File

@@ -3,17 +3,20 @@ import { ChangeEvent, useState } from "react";
export interface AllTransactionCancelSectionPasswordGroupProps {
cancelPassword: string;
setCancelPassword: (cancelPassword: string) => void;
requestSuccess: boolean;
};
export const AllTransactionCancelSectionPasswordGroup = ({
cancelPassword,
setCancelPassword
setCancelPassword,
requestSuccess
}: AllTransactionCancelSectionPasswordGroupProps) => {
const [newCancelPassword, setNewCancelPassword] = useState<string>(cancelPassword);
const onChangeNewCancelPassword = (value: string) => {
setCancelPassword(value);
setNewCancelPassword(value);
};
return (
<>
@@ -28,9 +31,9 @@ export const AllTransactionCancelSectionPasswordGroup = ({
/>
</div>
</div>
{/*
<div className="error-msg">비밀번호 불일치</div>
*/}
{ !requestSuccess &&
<div className="error-msg">비밀번호 불일치</div>
}
</>
);
}

187
src/entities/transaction/ui/section/amount-info-section.tsx
View File

@@ -17,7 +17,6 @@ export const AmountInfoSection = ({
}: InfoSectionProps) => {
const { mutateAsync: downloadConfirmation } = useDownloadConfirmationMutation();
let newAmountInfo: Record<string, any> | undefined = amountInfo;
const subItems: Record<string, Record<string, string>> = {
mid: {name: 'MID', type: 'string'},
transactionRequestAmount: {name: '거래요청금액', type: 'number'},
@@ -279,7 +278,7 @@ export const AmountInfoSection = ({
<span className="label">·&nbsp;&nbsp;거래금액</span>
<span className="value">
<NumericFormat
value={ amountInfo?.supplyAmount }
value={ amountInfo?.transactionAmount }
thousandSeparator
displayType="text"
></NumericFormat>
@@ -292,7 +291,7 @@ export const AmountInfoSection = ({
<span className="label">·&nbsp;&nbsp;신용카드금액</span>
<span className="value">
<NumericFormat
value={ amountInfo?.supplyAmount }
value={ amountInfo?.cardAmount }
thousandSeparator
displayType="text"
></NumericFormat>
@@ -302,7 +301,7 @@ export const AmountInfoSection = ({
<span className="label">·&nbsp;&nbsp;포인트금액</span>
<span className="value">
<NumericFormat
value={ amountInfo?.supplyAmount }
value={ amountInfo?.pointAmount }
thousandSeparator
displayType="text"
></NumericFormat>
@@ -312,7 +311,7 @@ export const AmountInfoSection = ({
<span className="label">·&nbsp;&nbsp;쿠폰금액</span>
<span className="value">
<NumericFormat
value={ amountInfo?.supplyAmount }
value={ amountInfo?.couponAmount }
thousandSeparator
displayType="text"
></NumericFormat>
@@ -320,12 +319,12 @@ export const AmountInfoSection = ({
</li>
</>
}
{ (serviceCode === '02' || serviceCode === '03') &&
{ (serviceCode === '01' || serviceCode === '02') &&
<li className="amount-item">
<span className="label">·&nbsp;&nbsp;에스크로수수료</span>
<span className="value">
<NumericFormat
value={ amountInfo?.supplyAmount }
value={ amountInfo?.escrowFee }
thousandSeparator
displayType="text"
></NumericFormat>
@@ -334,86 +333,100 @@ export const AmountInfoSection = ({
}
{ (serviceCode === '01') &&
<>
<li className="amount-item">
<span className="label">·&nbsp;&nbsp;카카오머니</span>
<span className="value">
<NumericFormat
value={ amountInfo?.supplyAmount }
thousandSeparator
displayType="text"
></NumericFormat>
</span>
</li>
<li className="amount-item">
<span className="label">·&nbsp;&nbsp;카카오포인트</span>
<span className="value">
<NumericFormat
value={ amountInfo?.supplyAmount }
thousandSeparator
displayType="text"
></NumericFormat>
</span>
</li>
<li className="amount-item">
<span className="label">·&nbsp;&nbsp;카카오즉시할인</span>
<span className="value">
<NumericFormat
value={ amountInfo?.supplyAmount }
thousandSeparator
displayType="text"
></NumericFormat>
</span>
</li>
<li className="amount-item">
<span className="label">·&nbsp;&nbsp;네이버포인트</span>
<span className="value">
<NumericFormat
value={ amountInfo?.supplyAmount }
thousandSeparator
displayType="text"
></NumericFormat>
</span>
</li>
<li className="amount-item">
<span className="label">·&nbsp;&nbsp;토스머니</span>
<span className="value">
<NumericFormat
value={ amountInfo?.supplyAmount }
thousandSeparator
displayType="text"
></NumericFormat>
</span>
</li>
<li className="amount-item">
<span className="label">·&nbsp;&nbsp;토스할인</span>
<span className="value">
<NumericFormat
value={ amountInfo?.supplyAmount }
thousandSeparator
displayType="text"
></NumericFormat>
</span>
</li>
<li className="amount-item">
<span className="label">·&nbsp;&nbsp;페이코포인트</span>
<span className="value">
<NumericFormat
value={ amountInfo?.supplyAmount }
thousandSeparator
displayType="text"
></NumericFormat>
</span>
</li>
<li className="amount-item">
<span className="label">·&nbsp;&nbsp;페이코쿠폰</span>
<span className="value">
<NumericFormat
value={ amountInfo?.supplyAmount }
thousandSeparator
displayType="text"
></NumericFormat>
</span>
</li>
{ (amountInfo?.simplePaymentServiceCode === 'E016') &&
<>
<li className="amount-item">
<span className="label">·&nbsp;&nbsp;카카오머니</span>
<span className="value">
<NumericFormat
value={ amountInfo?.multiPointAmount }
thousandSeparator
displayType="text"
></NumericFormat>
</span>
</li>
<li className="amount-item">
<span className="label">·&nbsp;&nbsp;카카오포인트</span>
<span className="value">
<NumericFormat
value={ amountInfo?.multiCouponAmount }
thousandSeparator
displayType="text"
></NumericFormat>
</span>
</li>
<li className="amount-item">
<span className="label">·&nbsp;&nbsp;카카오즉시할인</span>
<span className="value">
<NumericFormat
value={ amountInfo?.supplyAmount }
thousandSeparator
displayType="text"
></NumericFormat>
</span>
</li>
</>
}
{ (amountInfo?.simplePaymentServiceCode === 'E020') &&
<li className="amount-item">
<span className="label">·&nbsp;&nbsp;네이버포인트</span>
<span className="value">
<NumericFormat
value={ amountInfo?.multiPointAmount }
thousandSeparator
displayType="text"
></NumericFormat>
</span>
</li>
}
{ (amountInfo?.simplePaymentServiceCode === 'E025') &&
<>
<li className="amount-item">
<span className="label">·&nbsp;&nbsp;토스머니</span>
<span className="value">
<NumericFormat
value={ amountInfo?.multiPointAmount }
thousandSeparator
displayType="text"
></NumericFormat>
</span>
</li>
<li className="amount-item">
<span className="label">·&nbsp;&nbsp;토스할인</span>
<span className="value">
<NumericFormat
value={ amountInfo?.supplyAmount }
thousandSeparator
displayType="text"
></NumericFormat>
</span>
</li>
</>
}
{ (amountInfo?.simplePaymentServiceCode === 'E015') &&
<>
<li className="amount-item">
<span className="label">·&nbsp;&nbsp;페이코포인트</span>
<span className="value">
<NumericFormat
value={ amountInfo?.multiPointAmount }
thousandSeparator
displayType="text"
></NumericFormat>
</span>
</li>
<li className="amount-item">
<span className="label">·&nbsp;&nbsp;페이코쿠폰</span>
<span className="value">
<NumericFormat
value={ amountInfo?.multiCouponAmount }
thousandSeparator
displayType="text"
></NumericFormat>
</span>
</li>
</>
}
</>
}
</>

8
src/entities/transaction/ui/section/escrow-info-section.tsx
View File

@@ -23,7 +23,7 @@ export const EscrowInfoSection = ({
className="section-title with-toggle"
onClick={ () => onClickToSetOpenInfo() }
>
정산 정보 <SectionTitleArrow isOpen={ isOpen }></SectionTitleArrow>
에스크로 정보 <SectionTitleArrow isOpen={ isOpen }></SectionTitleArrow>
</div>
<SlideDown className={'my-dropdown-slidedown'}>
{ !!isOpen &&
@@ -34,15 +34,15 @@ export const EscrowInfoSection = ({
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;배송등록</span>
<span className="v">{ moment(escrowInfo?.deliveryRegistrationDate).format('YYYY.MM.DD') }</span>
<span className="v">{ escrowInfo?.deliveryRegistrationDate? moment(escrowInfo?.deliveryRegistrationDate).format('YYYY.MM.DD'): '' }</span>
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;배송완료</span>
<span className="v">{ moment(escrowInfo?.deliveryCompleteDate).format('YYYY.MM.DD') }</span>
<span className="v">{ escrowInfo?.deliveryCompleteDate? moment(escrowInfo?.deliveryCompleteDate).format('YYYY.MM.DD'): '' }</span>
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;구매확인</span>
<span className="v">{ moment(escrowInfo?.purchaseConfirmDate).format('YYYY.MM.DD') }</span>
<span className="v">{ escrowInfo?.purchaseConfirmDate? moment(escrowInfo?.purchaseConfirmDate).format('YYYY.MM.DD'): '' }</span>
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;구매거절</span>

18
src/entities/transaction/ui/section/important-info-section.tsx
View File

@@ -156,45 +156,45 @@ export const ImportantInfoSection = ({
<>
<li className="kv-row">
<span className="k">주문번호</span>
<span className="v">{ }</span>
<span className="v">{ importantInfo?.orderNumber }</span>
</li>
<li className="kv-row">
<span className="k">TID</span>
<span className="v">{ }</span>
<span className="v">{ importantInfo?.tid }</span>
</li>
<li className="kv-row">
<span className="k">거래상태</span>
<span className="v">{ }</span>
<span className="v">{ importantInfo?.transactionStatus }</span>
</li>
<li className="kv-row">
<span className="k">거래수단</span>
<span className="v">{ }</span>
<span className="v">{ importantInfo?.paymentMethod }</span>
</li>
{ serviceCode === '01' &&
<li className="kv-row">
<span className="k">승인일</span>
<span className="v">{ }</span>
<span className="v">{ importantInfo?.approvalDate? moment(importantInfo?.approvalDate).format('YYYY-MM-DD'): '' }</span>
</li>
}
{ serviceCode === '02' &&
<li className="kv-row">
<span className="k">거래일</span>
<span className="v">{ }</span>
<span className="v">{ importantInfo?.approvalDate? moment(importantInfo?.approvalDate).format('YYYY-MM-DD'): '' }</span>
</li>
}
{ serviceCode === '03' &&
<li className="kv-row">
<span className="k">요청일</span>
<span className="v">{ }</span>
<span className="v">{ importantInfo?.approvalDate? moment(importantInfo?.approvalDate).format('YYYY-MM-DD'): '' }</span>
</li>
}
<li className="kv-row">
<span className="k">취소일</span>
<span className="v">{ }</span>
<span className="v">{ importantInfo?.cancelDate? moment(importantInfo?.cancelDate).format('YYYY-MM-DD'): '' }</span>
</li>
<li className="kv-row">
<span className="k">상품명</span>
<span className="v">{ }</span>
<span className="v">{ importantInfo?.productName }</span>
</li>
</>
}

80
src/entities/transaction/ui/section/payment-info-section.tsx
View File

@@ -155,56 +155,80 @@ export const PaymentInfoSection = ({
{ (serviceCode === '01') &&
<>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;승인매입</span>
<span className="v">{ }</span>
<span className="k">·&nbsp;&nbsp;승인매입일</span>
<span className="v">{ paymentInfo?.approvalPurchase? moment(paymentInfo?.approvalPurchase).format('YYYY-MM-DD'): '' }</span>
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;승인반송(횟수)</span>
<span className="v">{ }</span>
<span className="v">
<NumericFormat
value={ paymentInfo?.approvalRejectCount }
thousandSeparator
displayType="text"
></NumericFormat>
</span>
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;승인재매입(횟수)</span>
<span className="v">{ }</span>
<span className="v">
<NumericFormat
value={ paymentInfo?.approvalRepurchaseCount }
thousandSeparator
displayType="text"
></NumericFormat>
</span>
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;승인VAN</span>
<span className="v">{ }</span>
<span className="v">{ paymentInfo?.approvalVAN }</span>
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;취소매입</span>
<span className="v">{ }</span>
<span className="v">{ paymentInfo?.cancelPurchase? moment(paymentInfo?.cancelPurchase).format('YYYY-MM-DD'): '' }</span>
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;취소반송</span>
<span className="v">{ }</span>
<span className="k">·&nbsp;&nbsp;취소반송(횟수)</span>
<span className="v">
<NumericFormat
value={ paymentInfo?.cancelRejectCount }
thousandSeparator
displayType="text"
></NumericFormat>
</span>
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;취소재매입</span>
<span className="v">{ }</span>
<span className="k">·&nbsp;&nbsp;취소재매입(횟수)</span>
<span className="v">
<NumericFormat
value={ paymentInfo?.cancelRepurchaseCount }
thousandSeparator
displayType="text"
></NumericFormat>
</span>
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;매입VAN</span>
<span className="v">{ }</span>
<span className="v">{ paymentInfo?.purchaseVan }</span>
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;매입사(발급사)</span>
<span className="v">{ }</span>
<span className="v">{ paymentInfo?.purchaseCompany }</span>
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;카드번호</span>
<span className="v">{ }</span>
<span className="v">{ paymentInfo?.cardNo }</span>
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;승인번호</span>
<span className="v">{ }</span>
<span className="v">{ paymentInfo?.approvalNo }</span>
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;할부기간</span>
<span className="v">{ }</span>
<span className="v">{ (paymentInfo?.installmentMonth === '00')? '일시불': paymentInfo?.installmentMonth }</span>
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;인증</span>
<span className="v">{ }</span>
<span className="v">{ paymentInfo?.authentication }</span>
</li>
</>
}
@@ -212,7 +236,7 @@ export const PaymentInfoSection = ({
<>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;유형</span>
<span className="v">{ }</span>
<span className="v">{ paymentInfo?.joinType }</span>
</li>
</>
}
@@ -220,47 +244,43 @@ export const PaymentInfoSection = ({
<>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;은행명</span>
<span className="v">{ }</span>
<span className="v">{ paymentInfo?.bankName || paymentInfo?.depositBankName }</span>
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;계좌번호</span>
<span className="v">{ }</span>
<span className="v">{ paymentInfo?.accountNo || paymentInfo?.virtualAccountNo }</span>
</li>
</>
}
{ (serviceCode === '03') &&
<>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;입금금융기관명</span>
<span className="v">{ }</span>
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;입금자명</span>
<span className="v">{ }</span>
<span className="v">{ paymentInfo?.depositorName }</span>
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;입금기한</span>
<span className="v">{ }</span>
<span className="v">{ paymentInfo?.depositDeadline? moment(paymentInfo?.depositDeadline).format('YYYY-MM-DD'): '' }</span>
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;입금일</span>
<span className="v">{ }</span>
<span className="v">{ paymentInfo?.depositDate? moment(paymentInfo?.depositDate).format('YYYY-MM-DD'): '' }</span>
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;환불예정일</span>
<span className="v">{ }</span>
<span className="v">{ paymentInfo?.refundScheduleDate? moment(paymentInfo?.refundScheduleDate).format('YYYY-MM-DD'): '' }</span>
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;환불은행명</span>
<span className="v">{ }</span>
<span className="v">{ paymentInfo?.refundBankName }</span>
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;환불계좌번호</span>
<span className="v">{ }</span>
<span className="v">{ paymentInfo?.refundAccountNo }</span>
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;예금주</span>
<span className="v">{ }</span>
<span className="v">{ paymentInfo?.accountHolder }</span>
</li>
</>
}

14
src/entities/transaction/ui/section/transaction-info-section.tsx
View File

@@ -122,32 +122,32 @@ export const TransactionInfoSection = ({
<>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;구매자명</span>
<span className="v">{ }</span>
<span className="v">{ transactionInfo?.buyerName }</span>
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;이메일</span>
<span className="v">{ }</span>
<span className="v">{ transactionInfo?.buyerEmail }</span>
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;전화번호</span>
<span className="v">{ }</span>
<span className="v">{ transactionInfo?.buyerTel }</span>
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;취소사유</span>
<span className="v">{ }</span>
<span className="v">{ transactionInfo?.cancelReason }</span>
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;취소요청자</span>
<span className="v">{ }</span>
<span className="v">{ transactionInfo?.cancelRequestor }</span>
</li>
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;부분취소</span>
<span className="v">{ }</span>
<span className="v">{ transactionInfo?.partialCancel }</span>
</li>
{ (serviceCode === '02' || serviceCode === '03') &&
<li className="kv-row">
<span className="k">·&nbsp;&nbsp;현금영수증발행</span>
<span className="v">{ }</span>
<span className="v">{ transactionInfo?.cashReceiptIssue }</span>
</li>
}
</>