{{define "admin_shop_orders"}}
  <link rel="stylesheet" href="/static/css/shop.css?v={{assetVer}}">

  <div class="toolbar-row">
    <p class="shop-hint">支付为<strong>模拟支付</strong>（不产生真实扣款）：确认收款后在订单上「标记支付成功」；核销支持「列表核销」与「输入核销码核销」两种方式。</p>
    <a href="/admin/shop" class="btn btn-ghost btn-sm">← 返回商品管理</a>
  </div>

  {{if .Data.Ok}}<div class="shop-alert shop-alert-ok">{{.Data.Ok}}</div>{{end}}
  {{if .Data.Err}}<div class="shop-alert shop-alert-err">{{.Data.Err}}</div>{{end}}

  <!-- 输入核销码核销：客人报出 8 位核销码即可核销对应已支付订单 -->
  <div class="panel">
    <h2>输入核销码核销</h2>
    <form method="post" action="/admin/shop/orders/redeem-code" style="display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;">
      <input type="hidden" name="csrf" value="{{.CSRF}}">
      <label class="shop-field" style="flex:1;min-width:220px;">
        <span class="shop-label">核销码<em>必填</em></span>
        <input type="text" name="verify_code" placeholder="如 8M2Q9K7X" required style="text-transform:uppercase;">
      </label>
      <button class="btn btn-primary" type="submit">核销</button>
      <span class="shop-hint">核销码在下单时生成，客人订单详情页可见；只核销已支付订单。</span>
    </form>
  </div>

  <!-- 状态过滤 -->
  <div class="shop-tabs" style="margin-bottom:14px;">
    <a href="/admin/shop/orders" class="{{if eq .Data.Status ""}}on{{end}}">全部 <em>{{index .Data.Counts ""}}</em></a>
    <a href="/admin/shop/orders?status=pending" class="{{if eq .Data.Status "pending"}}on{{end}}">待支付 <em>{{index .Data.Counts "pending"}}</em></a>
    <a href="/admin/shop/orders?status=paid" class="{{if eq .Data.Status "paid"}}on{{end}}">已支付 <em>{{index .Data.Counts "paid"}}</em></a>
    <a href="/admin/shop/orders?status=redeemed" class="{{if eq .Data.Status "redeemed"}}on{{end}}">已核销 <em>{{index .Data.Counts "redeemed"}}</em></a>
    <a href="/admin/shop/orders?status=canceled" class="{{if eq .Data.Status "canceled"}}on{{end}}">已取消 <em>{{index .Data.Counts "canceled"}}</em></a>
  </div>

  <!-- 订单列表 -->
  <div class="panel" style="padding:0;">
    {{if .Data.Orders}}
    <table class="table">
      <thead>
        <tr>
          <th>订单号</th>
          <th>商品</th>
          <th>金额</th>
          <th>买家</th>
          <th>状态</th>
          <th>核销码</th>
          <th>下单时间</th>
          <th class="th-ops">操作</th>
        </tr>
      </thead>
      <tbody>
        {{range .Data.Orders}}
        <tr>
          <td><span class="shop-code">{{.OrderNo}}</span></td>
          <td>
            {{.ProductTitle}}
            <div class="cell-sub">¥{{.ProductPrice}} × {{.Quantity}}{{if .CouponCode}} · 优惠 {{.DiscountLabel}}{{end}}</div>
          </td>
          <td><b>¥{{.Amount}}</b></td>
          <td>
            {{.Buyer}}
            {{if .Contact}}<div class="cell-sub">{{.Contact}}</div>{{end}}
          </td>
          <td><span class="badge {{.StatusBadge}}">{{.StatusLabel}}</span></td>
          <td>
            {{if .VerifyCode}}<span class="shop-code">{{.VerifyCode}}</span>
            {{else}}—{{end}}
            {{if .VerifyTime}}<div class="cell-sub">{{.VerifyTimeLabel}} · {{.VerifiedBy}}</div>{{end}}
          </td>
          <td>{{date .CreatedAt}}</td>
          <td class="th-ops">
            <div class="row-actions">
              {{if eq .Status "pending"}}
              <form method="post" action="/admin/shop/orders/pay" style="display:inline-flex;gap:6px;align-items:center;">
                <input type="hidden" name="csrf" value="{{$.CSRF}}">
                <input type="hidden" name="order_no" value="{{.OrderNo}}">
                <select name="channel" class="shop-field" style="width:auto;min-width:0;padding:4px 8px;" title="支付渠道（当前为模拟支付，接入真实渠道后可切换）">
                  {{range $.Data.Providers}}
                  <option value="{{.Key}}">{{.Name}}</option>
                  {{end}}
                </select>
                <button class="btn btn-primary btn-sm" type="submit">标记支付成功</button>
              </form>
              <form method="post" action="/admin/shop/orders/cancel" style="display:inline;"
                    onsubmit="return confirm('确定取消订单 {{.OrderNo}} 吗？仅待支付订单可取消。');">
                <input type="hidden" name="csrf" value="{{$.CSRF}}">
                <input type="hidden" name="order_no" value="{{.OrderNo}}">
                <button class="btn btn-ghost btn-sm" type="submit">取消</button>
              </form>
              {{else if eq .Status "paid"}}
              <form method="post" action="/admin/shop/orders/redeem" style="display:inline;"
                    onsubmit="return confirm('核销订单 {{.OrderNo}} 吗？核销后即完成交付闭环，不可撤销。');">
                <input type="hidden" name="csrf" value="{{$.CSRF}}">
                <input type="hidden" name="order_no" value="{{.OrderNo}}">
                <button class="btn btn-primary btn-sm" type="submit">核销</button>
              </form>
              {{else}}
              <span class="cell-sub">—</span>
              {{end}}
            </div>
          </td>
        </tr>
        {{end}}
      </tbody>
    </table>

    {{if gt .Data.Total .Data.PerPage}}
    <div class="pagination">
      {{$page := .Data.Page}}{{$total := .Data.Total}}{{$pages := .Data.TotalPages}}{{$status := .Data.Status}}
      {{if gt $page 1}}<a href="/admin/shop/orders?page={{sub $page 1}}{{if $status}}&status={{$status}}{{end}}">← 上一页</a>{{else}}<span class="disabled">← 上一页</span>{{end}}
      <span>第 {{$page}} / {{$pages}} 页 · 共 {{$total}} 单</span>
      {{if lt $page $pages}}<a href="/admin/shop/orders?page={{add $page 1}}{{if $status}}&status={{$status}}{{end}}">下一页 →</a>{{else}}<span class="disabled">下一页 →</span>{{end}}
    </div>
    {{end}}
    {{else}}
    <div style="text-align:center;color:var(--muted);padding:40px 0;">
      {{if .Data.Status}}这个状态下还没有订单{{else}}还没有订单，客人在前台商品页下单后会出现在这里{{end}}
    </div>
    {{end}}
  </div>
{{end}}