{% extends "admin/base.html" %}
{% block page_title %}彻底删除店员{% endblock %}
{% block content %}
<div class="card-box" style="border:2px solid #ef4444;background:#fff5f5">
  <div class="d-flex align-items-center gap-2 mb-2">
    <i class="bi bi-exclamation-triangle-fill" style="color:#ef4444;font-size:22px"></i>
    <h6 class="mb-0" style="color:#ef4444">永久删除 · 不可恢复</h6>
  </div>
  <div class="small">
    将永久彻底删除店员 <b>{{s.name}}（{{s.phone}}）</b>，并<b>整体清除其所有关联数据</b>（共 {{total}} 条，见下表）。
    <br>此操作<b>不可恢复</b>；<b>操作日志会保留</b>（仅去除指向该店员的外键，作为中台审计痕迹）。
  </div>
  <div class="mt-2 small text-muted">
    门店：{{s.store.name if s.store else '-'}} ｜ 连锁：{{s.store.chain.name if (s.store and s.store.chain) else '-'}} ｜ 当前积分余额：<b style="color:var(--brand)">{{s.points_balance}}</b>
  </div>
</div>

<div class="card-box">
  <h6 class="mb-2">关联数据清单（删除后全部清除）</h6>
  <table class="table table-sm align-middle mb-0">
    <thead><tr><th>数据类别</th><th width="120" class="text-end">条数</th></tr></thead>
    <tbody>
    {% for c in counts %}
      <tr><td>{{c.label}}</td>
        <td class="text-end {% if c.n %}fw-bold{% endif %}" style="color:{% if c.n %}var(--brand){% else %}#9ca3af{% endif %}">{{c.n}}</td></tr>
    {% endfor %}
    </tbody>
    <tfoot><tr class="table-light"><td><b>合计</b></td><td class="text-end"><b>{{total}}</b></td></tr></tfoot>
  </table>
</div>

<div class="card-box">
  <form method="post" action="{{url_for('admin.staff_purge_exec', id=s.id)}}">
    <input type="hidden" name="csrf_token" value="{{csrf_token()}}">
    <div class="form-check mb-2">
      <input class="form-check-input" type="checkbox" id="confirmBox" value="1" name="confirm"
             onchange="document.getElementById('purgeBtn').disabled = !this.checked">
      <label class="form-check-label" for="confirmBox">我已知晓上述 <b>{{total}}</b> 条关联数据将被永久删除，且<b>不可恢复</b></label>
    </div>
    <button id="purgeBtn" class="btn btn-danger" disabled><i class="bi bi-trash"></i> 确认彻底删除</button>
    <a href="{{url_for('admin.staff_trash')}}" class="btn btn-outline-secondary ms-2">返回</a>
  </form>
</div>
{% endblock %}