{% extends "admin/base.html" %}
{% block page_title %}已删除店员{% endblock %}
{% block content %}
<style>.staff-name-link{color:inherit;text-decoration:none}.staff-name-link:hover{color:var(--brand);text-decoration:underline}</style>
<div class="card-box">
  <div class="d-flex justify-content-between align-items-center mb-3 flex-wrap gap-2">
    <form method="get" class="d-flex gap-2">
      <input name="q" class="form-control form-control-sm" value="{{q}}" placeholder="姓名/手机号">
      <button class="btn btn-sm btn-outline-secondary">筛选</button>
    </form>
    <div class="d-flex gap-2">
      <button type="button" class="btn btn-outline-success btn-sm" onclick="batchRestore()"><i class="bi bi-arrow-counterclockwise"></i> 批量恢复</button>
      <form id="batchForm" method="post" action="{{url_for('admin.staff_restore_batch')}}" class="d-none">
        <input type="hidden" name="csrf_token" value="{{csrf_token()}}">
      </form>
      <a href="{{url_for('admin.staff_list')}}" class="btn btn-outline-secondary btn-sm">返回店员列表</a>
    </div>
  </div>
  <table class="table table-hover align-middle">
    <thead><tr>
      <th width="50">序号</th>
      <th style="width:32px"><input type="checkbox" onclick="toggleAll(this)"></th>
      <th>姓名</th><th>手机号</th><th>门店</th><th>连锁</th><th>积分</th><th>操作</th>
    </tr></thead>
    <tbody>
    {% for s in staff %}
      <tr>
        <td>{{loop.index}}</td>
        <td><input type="checkbox" name="ids" value="{{s.id}}"></td>

        <td><a href="{{url_for('admin.staff_detail', id=s.id)}}" class="staff-name-link">{{s.name}}</a></td>
        <td>{{s.phone}}</td>
        <td>{{s.store.name if s.store else '-'}}</td>
        <td>{{s.store.chain.name if (s.store and s.store.chain) else '-'}}</td>
        <td><b style="color:var(--brand)">{{s.points_balance}}</b></td>
        <td>
          <a href="{{url_for('admin.staff_detail', id=s.id)}}" class="btn btn-sm btn-outline-secondary">详情</a>
          <form method="post" action="{{url_for('admin.staff_restore', id=s.id)}}" class="d-inline"
                onsubmit="return confirm('确认恢复店员「{{s.name}}」？关联记录将同步恢复显示。')">
            <button class="btn btn-sm btn-outline-success">恢复</button>
          </form>
          <a href="{{url_for('admin.staff_purge', id=s.id)}}" class="btn btn-sm btn-outline-danger">彻底删除</a>
        </td>
      </tr>
    {% else %}
      <tr><td colspan="8" class="text-center text-muted py-4">没有已删除的店员</td></tr>
    {% endfor %}
    </tbody>
  </table>
</div>
<script>
function toggleAll(src){
  document.querySelectorAll('input[name=ids]').forEach(function(c){ c.checked = src.checked; });
}
function batchRestore(){
  var checked = document.querySelectorAll('input[name=ids]:checked');
  if(!checked.length){ alert('请先勾选要恢复的店员'); return; }
  if(!confirm('确认批量恢复选中的 ' + checked.length + ' 名店员？关联记录将同步恢复显示。')) return;
  var f = document.getElementById('batchForm');
  f.querySelectorAll('input[name=ids]').forEach(function(e){ e.remove(); });
  checked.forEach(function(c){
    var i = document.createElement('input');
    i.type = 'hidden'; i.name = 'ids'; i.value = c.value;
    f.appendChild(i);
  });
  f.submit();
}
</script>
{% endblock %}