거래내역 상세 페이지 관련

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 = ({
         >
           정산 정보 <SectionTitleArrow isOpen={ isOpen }></SectionTitleArrow>
         </div>
-        <SlideDown className={'my-dropdown-slidedown'}>
-        { !!isOpen &&
-          <ul className="kv-list">
-          { subLi() }
-          </ul>
+        { (transactionCategory === TransactionCategory.AllTransaction) &&
+          <SlideDown className={'my-dropdown-slidedown'}>
+          { !!isOpen &&
+            <ul className="kv-list">
+            { subLi() }
+            </ul>
+          }
+          </SlideDown>
+        }
+        { (transactionCategory === TransactionCategory.Escrow) && 
+          <SlideDown className={'my-dropdown-slidedown'}>
+          { !!isOpen &&
+            <ul className="kv-list">
+              <li className="kv-row">
+                <span className="k">·&nbsp;&nbsp;승인정산일</span>
+                <span className="v">{ moment(settlementInfo?.approvalSettlementDate).format('YYYY.MM.DD') }</span>
+              </li>
+              <li className="kv-row">
+                <span className="k">·&nbsp;&nbsp;승인정산금액</span>
+                <span className="v">
+                  <NumericFormat
+                    value={ settlementInfo?.approvalSettlementAmount } 
+                    thousandSeparator
+                    displayType="text"
+                    suffix='원'
+                  ></NumericFormat>
+                </span>
+              </li>
+              <li className="kv-row">
+                <span className="k">·&nbsp;&nbsp;취소정산일</span>
+                <span className="v">{ moment(settlementInfo?.cancelSettlementDate).format('YYYY.MM.DD') }</span>
+              </li>
+              <li className="kv-row">
+                <span className="k">·&nbsp;&nbsp;취소정산금액</span>
+                <span className="v">
+                  <NumericFormat
+                    value={ settlementInfo?.cancelSettlementAmount } 
+                    thousandSeparator
+                    displayType="text"
+                    suffix='원'
+                  ></NumericFormat>
+                </span>
+              </li>
+            </ul>
+          }
+          </SlideDown>
         }
-        </SlideDown>
       </div>
     </>
   )