186 lines
10 KiB
PHP
186 lines
10 KiB
PHP
@extends('web.layouts.subpage')
|
|
|
|
@php
|
|
// 탭 활성화용
|
|
$mypageActive = $mypageActive ?? 'usage';
|
|
@endphp
|
|
|
|
@section('title', $pageTitle ?? '구매내역')
|
|
|
|
@section('subcontent')
|
|
<div class="mypage-usage">
|
|
|
|
@if(($mode ?? 'empty') === 'empty')
|
|
<div class="notice-box">
|
|
<p>결제 완료 후 이 페이지에서 핀 확인/발급/매입을 진행할 수 있습니다.</p>
|
|
<p class="muted">결제 완료 페이지에서 자동으로 이동되며, attempt_id가 없으면 상세 정보를 표시할 수 없습니다.</p>
|
|
</div>
|
|
@else
|
|
|
|
{{-- 상태 스텝 --}}
|
|
<div class="usage-steps">
|
|
@foreach(($steps ?? []) as $st)
|
|
@php
|
|
$active = false;
|
|
$done = false;
|
|
|
|
// 표시 규칙(간단): 현재 stepKey 기준으로 active 표시
|
|
$active = (($stepKey ?? '') === $st['key']);
|
|
|
|
// 완료표시(선택): deposit_wait 이전/이후 같은 세밀한 건 다음 단계에서 고도화 가능
|
|
// 여기서는 "active 이전"을 done으로 찍지 않고, 필요하면 확장
|
|
@endphp
|
|
<div class="step {{ $active ? 'is-active' : '' }}">
|
|
<div class="dot"></div>
|
|
<div class="label">{{ $st['label'] }}</div>
|
|
</div>
|
|
@endforeach
|
|
</div>
|
|
|
|
{{-- 결제/주문 요약 --}}
|
|
<div class="usage-card">
|
|
<h3 class="card-title">주문/결제 정보</h3>
|
|
|
|
<div class="grid">
|
|
<div><span class="k">주문번호</span> <span class="v">{{ $order['oid'] ?? '-' }}</span></div>
|
|
<div><span class="k">결제수단</span> <span class="v">{{ $order['pay_method'] ?? '-' }}</span></div>
|
|
<div><span class="k">결제상태</span> <span class="v">{{ $order['stat_pay'] ?? '-' }}</span></div>
|
|
<div><span class="k">PG TID</span> <span class="v">{{ $order['pg_tid'] ?? ($attempt['pg_tid'] ?? '-') }}</span></div>
|
|
<div><span class="k">결제일시</span> <span class="v">{{ $order['created_at'] ?? '-' }}</span></div>
|
|
</div>
|
|
|
|
<div class="amounts">
|
|
<div><span class="k">상품금액</span> <span class="v">{{ number_format($order['amounts']['subtotal'] ?? 0) }}원</span></div>
|
|
<div><span class="k">고객수수료</span> <span class="v">{{ number_format($order['amounts']['fee'] ?? 0) }}원</span></div>
|
|
<div class="sum"><span class="k">결제금액</span> <span class="v">{{ number_format($order['amounts']['pay_money'] ?? 0) }}원</span></div>
|
|
</div>
|
|
|
|
@if(!empty($vactInfo))
|
|
<div class="vact-box">
|
|
<h4>가상계좌 안내</h4>
|
|
<div class="grid">
|
|
<div><span class="k">은행</span> <span class="v">{{ $vactInfo['bank'] ?? '-' }}</span></div>
|
|
<div><span class="k">계좌번호</span> <span class="v">{{ $vactInfo['account'] ?? '-' }}</span></div>
|
|
<div><span class="k">예금주</span> <span class="v">{{ $vactInfo['holder'] ?? '-' }}</span></div>
|
|
<div><span class="k">입금금액</span> <span class="v">{{ is_numeric($vactInfo['amount'] ?? null) ? number_format((int)$vactInfo['amount']).'원' : ($vactInfo['amount'] ?? '-') }}</span></div>
|
|
<div><span class="k">만료</span> <span class="v">{{ $vactInfo['expire_at'] ?? '-' }}</span></div>
|
|
</div>
|
|
</div>
|
|
@endif
|
|
</div>
|
|
|
|
{{-- 아이템 --}}
|
|
<div class="usage-card">
|
|
<h3 class="card-title">구매 상품</h3>
|
|
<div class="items">
|
|
@foreach(($items ?? []) as $it)
|
|
<div class="item-row">
|
|
<div class="name">{{ $it['name'] }}</div>
|
|
<div class="meta">
|
|
<span class="pill">수량 {{ $it['qty'] }}</span>
|
|
<span class="pill">{{ number_format($it['unit'] ?? 0) }}원</span>
|
|
<span class="pill pill--strong">합계 {{ number_format($it['total'] ?? 0) }}원</span>
|
|
</div>
|
|
</div>
|
|
@endforeach
|
|
</div>
|
|
</div>
|
|
|
|
{{-- 핀 발급 상태/액션 (결제완료에서만 활성) --}}
|
|
<div class="usage-card">
|
|
<h3 class="card-title">핀 발급/전달</h3>
|
|
|
|
<div class="pin-status">
|
|
<div><span class="k">필요 핀 수량</span> <span class="v">{{ (int)($requiredQty ?? 0) }}개</span></div>
|
|
<div><span class="k">할당된 핀</span> <span class="v">{{ (int)($assignedPinsCount ?? 0) }}개</span></div>
|
|
@if(!empty($pinsSummary))
|
|
<div class="summary">
|
|
@foreach($pinsSummary as $st => $cnt)
|
|
<span class="pill">{{ $st }}: {{ $cnt }}</span>
|
|
@endforeach
|
|
</div>
|
|
@endif
|
|
</div>
|
|
|
|
@php
|
|
$isPaid = (($order['stat_pay'] ?? '') === 'p') || (($attempt['status'] ?? '') === 'paid');
|
|
$isVactWait = (($order['stat_pay'] ?? '') === 'w') || (($attempt['status'] ?? '') === 'issued');
|
|
$isFailed = in_array(($order['stat_pay'] ?? ''), ['c','f'], true) || in_array(($attempt['status'] ?? ''), ['cancelled','failed'], true);
|
|
@endphp
|
|
|
|
@if($isVactWait)
|
|
<div class="notice-box">
|
|
<p>가상계좌 입금 확인 후 핀 발급을 진행할 수 있습니다.</p>
|
|
</div>
|
|
@elseif($isFailed)
|
|
<div class="notice-box">
|
|
<p>결제가 취소/실패 상태입니다. 결제 정보를 확인해 주세요.</p>
|
|
</div>
|
|
@elseif($isPaid)
|
|
<div class="action-grid">
|
|
<button type="button" class="act-btn" onclick="uiUsage.todo('SMS 발송은 다음 단계에서 연결할게요.')">핀번호 SMS 발송</button>
|
|
<button type="button" class="act-btn act-btn--primary" onclick="uiUsage.todo('웹 핀 노출/재고할당 로직을 다음 단계에서 연결할게요.')">핀번호 바로 확인</button>
|
|
<button type="button" class="act-btn" onclick="uiUsage.todo('매입 테이블 설계 후 바로 붙일게요.')">핀번호 되팔기(매입)</button>
|
|
</div>
|
|
<p class="muted small">※ 사고 방지를 위해 핀 노출/발송/매입은 모두 서버 검증 후 처리됩니다.</p>
|
|
@else
|
|
<div class="notice-box">
|
|
<p>결제 진행 중이거나 확인 중입니다. 잠시 후 다시 확인해 주세요.</p>
|
|
</div>
|
|
@endif
|
|
</div>
|
|
|
|
{{-- 디버그(접기) --}}
|
|
<details class="usage-debug">
|
|
<summary>결제 상세(디버그)</summary>
|
|
<pre>{{ json_encode(['attempt'=>$attempt,'order'=>$order], JSON_PRETTY_PRINT|JSON_UNESCAPED_UNICODE|JSON_UNESCAPED_SLASHES) }}</pre>
|
|
</details>
|
|
|
|
@endif
|
|
</div>
|
|
|
|
<style>
|
|
.mypage-usage { display:flex; flex-direction:column; gap:14px; }
|
|
.usage-card { border:1px solid rgba(0,0,0,.08); border-radius:14px; padding:16px; background:#fff; }
|
|
.card-title { font-size:16px; margin:0 0 10px 0; }
|
|
.grid { display:grid; grid-template-columns:1fr 1fr; gap:8px 14px; }
|
|
.k { color:rgba(0,0,0,.55); margin-right:8px; }
|
|
.v { font-weight:600; }
|
|
.amounts { margin-top:12px; display:grid; grid-template-columns:1fr 1fr; gap:8px 14px; }
|
|
.amounts .sum { grid-column: span 2; padding-top:8px; border-top:1px dashed rgba(0,0,0,.12); }
|
|
.items { display:flex; flex-direction:column; gap:10px; }
|
|
.item-row { padding:12px; border:1px solid rgba(0,0,0,.08); border-radius:12px; }
|
|
.item-row .name { font-weight:700; margin-bottom:6px; }
|
|
.pill { display:inline-flex; padding:4px 8px; border-radius:999px; font-size:12px; border:1px solid rgba(0,0,0,.12); margin-right:6px; }
|
|
.pill--strong { font-weight:700; }
|
|
.muted { color:rgba(0,0,0,.55); }
|
|
.small { font-size:12px; }
|
|
.notice-box { padding:12px; border-radius:12px; background:rgba(0,0,0,.04); }
|
|
.vact-box { margin-top:14px; padding:12px; border-radius:12px; background:rgba(0,0,0,.03); border:1px solid rgba(0,0,0,.08); }
|
|
.pin-status { display:flex; gap:14px; flex-wrap:wrap; align-items:center; margin-bottom:12px; }
|
|
.pin-status .summary { width:100%; margin-top:6px; }
|
|
.action-grid { display:grid; grid-template-columns:1fr; gap:8px; }
|
|
@media (min-width: 720px){ .action-grid { grid-template-columns:1fr 1fr 1fr; } }
|
|
.act-btn { padding:12px 10px; border-radius:12px; border:1px solid rgba(0,0,0,.14); background:#fff; cursor:pointer; }
|
|
.act-btn--primary { font-weight:800; }
|
|
.usage-steps { display:grid; grid-template-columns: repeat(6, 1fr); gap:8px; }
|
|
.usage-steps .step { padding:10px 8px; border-radius:12px; border:1px solid rgba(0,0,0,.08); text-align:center; font-size:12px; background:#fff; }
|
|
.usage-steps .step.is-active { border-color:rgba(0,0,0,.25); box-shadow:0 1px 0 rgba(0,0,0,.06); font-weight:800; }
|
|
.usage-steps .dot { width:8px; height:8px; border-radius:50%; margin:0 auto 6px auto; background:rgba(0,0,0,.25); }
|
|
.usage-debug { border:1px dashed rgba(0,0,0,.18); border-radius:12px; padding:10px 12px; background:#fff; }
|
|
.usage-debug pre { margin:10px 0 0 0; max-height:240px; overflow:auto; font-size:12px; }
|
|
</style>
|
|
|
|
<script>
|
|
window.uiUsage = {
|
|
todo(msg){
|
|
if (typeof showMsg === 'function') {
|
|
showMsg(msg, { type:'alert', title:'안내' });
|
|
} else {
|
|
alert(msg);
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
@endsection
|