{% extends "admin/base.html" %}
{% block page_title %}文件下载{% endblock %}
{% block content %}
<div class="card-box">
  <div class="d-flex justify-content-between align-items-center mb-2">
    <h6 class="mb-0"><i class="bi bi-folder2-open"></i> 文件下载</h6>
    <a href="{{url_for('admin.downloads_settings')}}" class="btn btn-sm btn-brand"><i class="bi bi-gear"></i> 可见范围设置</a>
  </div>
  <div class="text-muted small">各分类上传/管理文件；可见范围请在「可见范围设置」统一配置。店员首页「文件下载」图标仅对有权任意分类者可见。</div>
</div>
<ul class="nav nav-pills gap-2 mb-3">
  {% for item in cat_data %}
  <li class="nav-item"><a class="nav-link {% if loop.first %}active{% endif %}" data-bs-toggle="pill" href="#pane-{{item.cat.id}}">{{item.cat.name}}</a></li>
  {% endfor %}
</ul>
<div class="tab-content">
{% for item in cat_data %}
{% set cat = item.cat %}
<div class="tab-pane fade {% if loop.first %}show active{% endif %}" id="pane-{{cat.id}}">
<div class="card-box" style="scroll-margin-top:70px" id="cat-{{cat.id}}">
  <div class="d-flex justify-content-between align-items-center mb-2">
    <h6 class="mb-0">{{cat.name}}</h6>
    <span class="badge bg-brand">{% if cat.scope_mode=='all' %}全员可见{% elif cat.scope_mode=='chain' %}{{item.sel_chains|length}} 个连锁{% else %}指定 {{item.sel_staff|length}} 人{% endif %}</span>
  </div>
  <div class="form-section-title d-flex justify-content-between align-items-center">
    <span><i class="bi bi-files"></i> 文件列表（{{item.files|length}}）</span>
    <button type="button" id="filesToggle-{{cat.id}}" class="btn btn-sm btn-link p-0" onclick="toggleFiles({{cat.id}})">收起 ▲</button>
  </div>
  {% if cat.key == 'ka' %}
  <form method="get" action="{{url_for('admin.downloads')}}#cat-{{cat.id}}" class="mb-2">
    <select name="chain" class="form-select form-select-sm" style="width:auto;min-width:180px" onchange="this.form.submit()">
      <option value="">全部连锁</option>
      {% for c in chains %}<option value="{{c.id}}" {% if chain==c.id %}selected{% endif %}>{{c.name}}</option>{% endfor %}
    </select>
  </form>
  {% endif %}
  <div id="filesBody-{{cat.id}}">
  {% if item.files %}
  <table class="table table-sm table-hover align-middle">
    <thead><tr><th width="50">序号</th><th>文件名</th><th width="100">大小</th><th width="140">上传时间</th><th width="92">移动到</th><th width="70">操作</th></tr></thead>
    <tbody>
    {% for df in item.files %}
      <tr>
        <td>{{loop.index}}</td>
        <td>{% if df.pinned %}<span class="badge bg-brand" style="margin-right:4px">置顶</span>{% endif %}{{df.filename}}</td>
        <td class="text-muted small">{% if df.size < 1048576 %}{{ '%.1f'|format(df.size/1024) }} KB{% else %}{{ '%.1f'|format(df.size/1048576) }} MB{% endif %}</td>
        <td class="text-muted small">{{ df.created_at.strftime('%Y-%m-%d %H:%M') if df.created_at }}</td>
        <td>
          <div class="dropdown">
            <button type="button" class="btn btn-sm btn-outline-secondary dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">移动</button>
            <ul class="dropdown-menu">
              {% for c in cat_data if c.cat.id != cat.id or cat.key == 'ka' %}
              {% if c.cat.key == 'ka' %}
              <li><button type="button" class="dropdown-item" data-action="{{url_for('admin.downloads_move', fid=df.id)}}" onclick="openMoveKa(this)">{{c.cat.name}}…</button></li>
              {% else %}
              <li><form method="post" action="{{url_for('admin.downloads_move', fid=df.id)}}"><button type="submit" class="dropdown-item" name="target_cat" value="{{c.cat.id}}">{{c.cat.name}}</button></form></li>
              {% endif %}
              {% endfor %}
            </ul>
          </div>
        </td>
        <td class="text-nowrap">
          <form method="post" action="{{url_for('admin.downloads_pin', fid=df.id)}}" class="d-inline">
            <button class="btn btn-sm {% if df.pinned %}btn-outline-secondary{% else %}btn-outline-primary{% endif %}" title="{{'取消置顶' if df.pinned else '置顶'}}">{{'取消置顶' if df.pinned else '置顶'}}</button>
          </form>
          <button type="button" class="btn btn-sm btn-outline-secondary" title="重命名" data-action="{{url_for('admin.downloads_rename', fid=df.id)}}" data-name="{{df.filename|e}}" onclick="openRename(this)"><i class="bi bi-pencil"></i></button>
          <form method="post" action="{{url_for('admin.downloads_delete', fid=df.id)}}" class="d-inline" onsubmit="return confirm('删除该文件？')">
            <button class="btn btn-sm btn-outline-danger" title="删除"><i class="bi bi-trash"></i></button>
          </form>
        </td>
      </tr>
    {% endfor %}
    </tbody>
  </table>
  {% else %}
  <div class="text-muted small py-2">暂无文件</div>
  {% endif %}
  </div>
  <form method="post" action="{{url_for('admin.downloads_upload')}}" enctype="multipart/form-data" class="d-flex gap-2 align-items-center mt-2 flex-wrap">
    <input type="hidden" name="category_id" value="{{cat.id}}">
    {% if cat.key == 'ka' %}
    <select name="chain_id" class="form-select form-select-sm" style="max-width:220px" required>
      <option value="">请选择连锁 *</option>
      {% for c in chains %}<option value="{{c.id}}">{{c.name}}</option>{% endfor %}
    </select>
    {% endif %}
    <input class="form-control form-control-sm" style="max-width:360px" type="file" name="file" required>
    <button class="btn btn-sm btn-brand"><i class="bi bi-upload"></i> 上传到「{{cat.name}}」</button>
  </form>
</div>
</div>
{% endfor %}
</div>
<script>
function toggleFiles(catId){var b=document.getElementById('filesBody-'+catId),t=document.getElementById('filesToggle-'+catId);if(!b)return;var h=b.style.display==='none';b.style.display=h?'':'none';if(t)t.textContent=h?'收起 ▲':'展开 ▼';}
function openRename(btn){document.getElementById('renameForm').action=btn.dataset.action;document.getElementById('renameInput').value=btn.dataset.name;new bootstrap.Modal(document.getElementById('renameModal')).show();}
function openMoveKa(btn){document.getElementById('moveKaForm').action=btn.dataset.action;new bootstrap.Modal(document.getElementById('moveKaModal')).show();}
window.addEventListener('DOMContentLoaded',function(){var h=location.hash;if(h&&h.indexOf('#cat-')===0){var t=document.querySelector('a.nav-link[href="#pane-'+h.slice(5)+'"]');if(t)new bootstrap.Tab(t).show();}});
</script>
<div class="modal fade" id="renameModal" tabindex="-1" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <form method="post" id="renameForm" action="">
        <div class="modal-header"><h6 class="modal-title"><i class="bi bi-pencil"></i> 重命名文件</h6><button type="button" class="btn-close" data-bs-dismiss="modal"></button></div>
        <div class="modal-body"><label class="form-label small">文件名（仅修改列表显示名，不改变实际文件）</label>
          <input name="filename" id="renameInput" class="form-control form-control-sm" required></div>
        <div class="modal-footer"><button class="btn btn-brand btn-sm">保存</button></div>
      </form>
    </div>
  </div>
</div>
<div class="modal fade" id="moveKaModal" tabindex="-1" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <form method="post" id="moveKaForm" action="">
        <div class="modal-header"><h6 class="modal-title"><i class="bi bi-folder-symlink"></i> 移动到 KA连锁</h6><button type="button" class="btn-close" data-bs-dismiss="modal"></button></div>
        <div class="modal-body">
          <input type="hidden" name="target_cat" value="{{ka_cat_id}}">
          <div class="alert alert-info small mb-3">KA连锁文件必须归属一个连锁，请选择目标连锁（在 KA连锁 内移动文件也走这里换连锁）。</div>
          <label class="form-label small">目标连锁 *</label>
          <select name="chain_id" class="form-select form-select-sm" required>
            <option value="">请选择连锁</option>
            {% for c in chains %}<option value="{{c.id}}">{{c.name}}</option>{% endfor %}
          </select>
        </div>
        <div class="modal-footer"><button class="btn btn-brand btn-sm">移动到该连锁</button></div>
      </form>
    </div>
  </div>
</div>
{% endblock %}