Standard Order Detail
docs/hcs-asset/standard-order-detail.md
id: 'standard-order-detail' status: not-started
Standard Order Detail
Reference
- 기준 소스:
apps/makitt-standard-commerce/src/components/assets/standard-order-detail/standard-order-detail.tsx - 구조: 주문헤더 → 상품목록 → 배송지 → 결제수단 → 가격요약 → 할인내역 → 재결제버튼
React Component
- Path:
apps/makitt-standard-commerce/src/components/assets/standard-order-detail/ - Status: implemented
- 데이터 흐름:
shopApi.getOrderDetail(orderId)shopApi.prepareOrderPayment()(재결제)shopApi.reconcileOrderPayment()(결제 콜백)
- 반응형: single column, max-width 제한
HCS Asset
- Path:
apps/builder/data/hcs-asset/standard-order-detail.json - Status: not-started
- UI Kit / Group:
standard-commerce/order - 구현 범위:
- 주문 상태 + 날짜 + 주문번호
- 상품 목록 (repeat: lineItems, 이미지/이름/옵션/수량/가격/배송)
- 배송지 정보 (recipientName, address, phone)
- 결제 수단 (paymentProcessor + paymentMethod)
- pricing breakdown (서버 formatted 값)
- 적용된 쿠폰/프로모션/적립금 내역
- 배송메모/출입방법
- availableActions 기반 액션 버튼
- 재결제 버튼 (결제 미완료 시)
Prerequisites
makitt-server (shop-api)
| API | Method | Endpoint | Status |
|---|---|---|---|
| Order Detail | GET | /orders/{orderId} | available |
| Prepare Order Payment | POST | /orders/{orderId}/payments/prepare | available |
| Reconcile Order Payment | POST | /orders/{orderId}/payments/{paymentId}/reconcile | available |
| Cancel Order Payment | POST | /orders/{orderId}/payments/{paymentId}/cancel | available |
makitt-server (admin-api)
| API | Method | Endpoint | Status |
|---|---|---|---|
| N/A | - | - | N/A |
makitt-server (도메인/모델링)
| 항목 | 내용 | Status |
|---|---|---|
| Order Entity | PK: ORDER#{orderId}, SK: METADATA | available |
| OrderLineItem | 주문 상품 (임베디드) | available |
| PricingSummary | breakdown 포함 (formatted 값) | available |
| AppliedCoupon/Promotion | 적용된 할인 내역 | available |
makitt-web (셀러 어드민 UI)
| 기능 | 설명 | Status |
|---|---|---|
| N/A | 고객 storefront용 주문 상세 | N/A |
makitt-shop (HCS 렌더링)
| 항목 | 설명 | Status |
|---|---|---|
order.detail resource | 주문 상세 데이터 조회 | available |
order.retryPayment action | 미결제 주문 재결제 | available |
payment-widget renderer | 재결제 시 PG SDK (mode=order) | available |
| 결제 콜백 핸들링 | URL params → reconcile (플랫폼 레벨) | available |
HCS Conversion Notes
order.detailresource에서as: "order"로 바인딩,url.params.orderId를 id param으로 전달- 가격은 모두 서버 formatted 값:
{{order.pricing.formattedTotal}}등 - 상품 목록은
repeat: { source: "order.lineItems", as: "item" }패턴 - 결제 상태 조건부 표시:
visible: "order.paymentStatus.name != 'SUCCEEDED'" - availableActions는 서버에서 제공하는 배열 — 각 액션을 repeat으로 버튼 생성하거나 개별 visible 조건으로 처리
- 결제 콜백은 HCS 에셋이 아닌 플랫폼(shop 라우터)에서 처리 — 에셋은 reconcile 이후 상태만 표시