{{define "admin_shop"}}
  <link rel="stylesheet" href="/static/css/shop.css?v={{assetVer}}">
  {{if .Data.Error}}<div class="alert alert-err">{{.Data.Error}}</div>{{end}}

  <div style="display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px;">
    <div class="form-inline">
      <a href="/admin/shop" class="btn {{if eq .Data.Category ""}}btn-primary{{else}}btn-ghost{{end}} btn-sm">全部</a>
      {{range .Data.Categories}}
      <a href="/admin/shop?category={{.Name}}" class="btn {{if eq $.Data.Category .Name}}btn-primary{{else}}btn-ghost{{end}} btn-sm">{{.Name}}</a>
      {{end}}
    </div>
    <div style="display:flex;align-items:center;gap:10px;">
      <span style="color:var(--muted);font-size:13px;">共 {{len .Data.Products}} 件商品</span>
      <a href="/admin/shop/new" class="btn btn-primary">＋ 上架新商品</a>
    </div>
  </div>

  <div class="panel" style="padding:0;">
    {{if .Data.Products}}
    <table class="table">
      <thead>
        <tr>
          <th>商品</th>
          <th>分类</th>
          <th>价格</th>
          <th>库存</th>
          <th>状态</th>
          <th>已售</th>
          <th>操作</th>
        </tr>
      </thead>
      <tbody>
        {{range .Data.Products}}
        <tr>
          <td><a href="/admin/shop/{{.ID}}/edit">{{.Title}}</a><div class="cell-sub">{{.Slug}}</div></td>
          <td>{{if .Category}}{{.Category}}{{else}}—{{end}}</td>
          <td>
            {{if .Discounted}}
            <div class="shop-admin-price"><s>¥{{.Price}}</s><b>¥{{.FinalPrice}}</b></div>
            <div class="cell-sub">{{.SaveLabel}}</div>
            {{else}}<div class="shop-admin-price"><b>¥{{.FinalPrice}}</b></div>{{end}}
          </td>
          <td>
            {{if le .Stock 0}}<span class="shop-tag-badge shop-tag-out">缺货</span>
            {{else if le .Stock 5}}<span class="shop-tag-badge shop-tag-low">紧张 · 剩 {{.Stock}}</span>
            {{else}}<span class="shop-tag-badge shop-tag-ok">剩 {{.Stock}}</span>{{end}}
          </td>
          <td>{{if eq .Published 1}}<span class="badge badge-pub">已上架</span>{{else}}<span class="badge badge-hidden">已下架</span>{{end}}</td>
          <td>{{.Views}}</td>
          <td>
            <div class="row-actions">
              <a href="/shop/{{.Slug}}" class="btn btn-ghost btn-sm" target="_blank">查看</a>
              <a href="/admin/shop/{{.ID}}/edit" class="btn btn-ghost btn-sm">编辑</a>
              <form method="post" action="/admin/shop/{{.ID}}/toggle" style="display:inline;">
                <input type="hidden" name="csrf" value="{{$.CSRF}}">
                <button class="btn btn-ghost btn-sm" type="submit">{{if eq .Published 1}}下架{{else}}上架{{end}}</button>
              </form>
              <form method="post" action="/admin/shop/{{.ID}}/delete" style="display:inline;"
                    onsubmit="return confirm('确定删除这件商品吗？此操作不可恢复。');">
                <input type="hidden" name="csrf" value="{{$.CSRF}}">
                <button class="btn btn-danger btn-sm" type="submit">删除</button>
              </form>
            </div>
          </td>
        </tr>
        {{end}}
      </tbody>
    </table>
    {{else}}
    <div style="text-align:center;color:var(--muted);padding:40px 0;">还没有商品，点右上角「上架新商品」摆出第一件吧</div>
    {{end}}
  </div>
{{end}}