{% extends "admin/base.html" %}
{% block page_title %}商城商品{% endblock %}
{% block content %}
<div class="card-box">
  <div class="d-flex justify-content-between mb-3">
    <form method="get"><div class="input-group input-group-sm" style="max-width:280px">
      <input name="q" class="form-control" value="{{q}}" placeholder="搜索商品">
      <button class="btn btn-outline-secondary">搜索</button></div></form>
    <a href="{{url_for('admin.product_edit')}}" class="btn btn-brand btn-sm"><i class="bi bi-plus-lg"></i> 新增商品</a>
  </div>
  <table class="table table-hover align-middle">
    <thead><tr><th width="50">序号</th><th>商品</th><th>分类</th><th>所需积分</th><th>库存</th><th>状态</th><th>操作</th></tr></thead>
    <tbody>
    {% for p in products %}
      <tr>

        <td>{{loop.index}}</td>
        <td>{% if p.image_url %}<img src="{{p.image_url}}" style="width:32px;height:32px;object-fit:cover;border-radius:6px" class="me-2">{% endif %}{{p.name}}</td>
        <td>{{p.category or '-'}}</td>
        <td><b class="num-brand">{{p.points_cost}}</b></td>
        <td>{{p.stock}}</td>
        <td>{% if p.status=='on'%}<span class="badge bg-success">上架</span>{% else %}<span class="badge bg-secondary">下架</span>{% endif %}</td>
        <td>
          <a href="{{url_for('admin.product_edit', id=p.id)}}" class="btn btn-sm btn-outline-secondary">编辑</a>
          <form method="post" action="{{url_for('admin.product_toggle_status', id=p.id)}}" class="d-inline"><button class="btn btn-sm {% if p.status=='on'%}btn-outline-warning{% else %}btn-outline-success{% endif %}">{% if p.status=='on'%}下架{% else %}上架{% endif %}</button></form>
          <form method="post" action="{{url_for('admin.product_delete', id=p.id)}}" class="d-inline" onsubmit="return confirm('删除商品？{% if p.status=='on'%}已上架商品删除后店员将无法再看到。{% endif %}')"><button class="btn btn-sm btn-outline-danger">删除</button></form>
        </td>
      </tr>
    {% else %}
      <tr><td colspan="7" class="text-center text-muted py-4">暂无商品，点击右上角新增</td></tr>
    {% endfor %}
    </tbody>
  </table>
</div>
{% endblock %}