{% extends "cms/base.html" %}
{% block title %}资料库管理 - ARIFU CMS{% endblock %}
{% set active='resources' %}
{% block content %}
<h2 style="margin-bottom:20px;">📚 资料库管理</h2>

<div style="display:grid;grid-template-columns:1fr 2fr;gap:20px;">
  <!-- 分类管理 -->
  <div class="card">
    <h2>📂 分类</h2>
    <div id="categoryList">
      {% for c in categories %}
      <div class="block-card" style="cursor:default;">
        <span style="font-size:18px;">{{ c.icon }}</span>
        <span style="flex:1;font-weight:600;">{{ c.name }}</span>
        <span style="font-size:11px;color:var(--muted);">{{ c.resource_count }}个</span>
        <button class="btn btn-sm btn-danger" onclick="delCategory({{ c.id }})">✕</button>
      </div>
      {% endfor %}
    </div>
    <div style="display:flex;gap:8px;margin-top:12px;">
      <input type="text" id="newCatName" class="form-control" placeholder="新分类名称" style="flex:1;">
      <button class="btn btn-sm btn-primary" onclick="addCategory()">添加</button>
    </div>
  </div>

  <!-- 资料列表 -->
  <div class="card">
    <h2>📄 资料文件
      <span class="badge">{{ resources|length }}</span>
      <button class="btn btn-sm btn-primary" style="float:right;" onclick="document.getElementById('resUpload').click()">➕ 上传资料</button>
      <input type="file" id="resUpload" multiple accept=".pdf,.doc,.docx,.xls,.xlsx,.pptx,.zip,.rar" style="display:none;"
        onchange="uploadResource(this.files)">
    </h2>

    <!-- 上传进度 -->
    <div id="resUploadProgress" style="display:none;margin-bottom:12px;">
      <div style="background:#e2e8f0;border-radius:6px;height:6px;"><div id="resBar" style="background:#0066CC;height:100%;width:0%;transition:.3s;border-radius:6px;"></div></div>
    </div>

    <table>
      <tr><th>标题</th><th>分类</th><th>格式</th><th>大小</th><th>下载</th><th>公开</th><th>操作</th></tr>
      {% for r in resources %}
      <tr>
        <td><strong>{{ r.title }}</strong><br><small style="color:var(--muted);">{{ r.original_name }}</small></td>
        <td>{{ r.category_icon or '📁' }} {{ r.category_name or '未分类' }}</td>
        <td><span style="font-size:11px;background:#e8f0fe;color:#1a56db;padding:2px 6px;border-radius:4px;">{{ r.doc_type|upper }}</span></td>
        <td style="font-size:12px;color:var(--muted);">{{ (r.file_size/1024)|round|int }}KB</td>
        <td><strong style="color:var(--green);">{{ r.download_count }}</strong></td>
        <td>
          <label style="cursor:pointer;"><input type="checkbox" {{ 'checked' if r.is_public else '' }}
            onchange="togglePublic({{ r.id }},this.checked)"> 公开</label>
        </td>
        <td>
          <div class="btn-group">
            <button class="btn btn-sm btn-primary" onclick="editResource({{ r.id }})">✏</button>
            <button class="btn btn-sm btn-danger" onclick="delResource({{ r.id }},'{{ r.title }}')">🗑</button>
          </div>
        </td>
      </tr>
      {% endfor %}
    </table>
  </div>
</div>
{% endblock %}

{% block scripts %}
<script>
async function addCategory() {
  const name = document.getElementById('newCatName').value.trim();
  if (!name) return;
  await fetch('/admin/api/resources/category/', {
    method:'POST', headers:{'Content-Type':'application/json'},
    body: JSON.stringify({name})
  });
  location.reload();
}
async function delCategory(id) {
  if (!confirm('删除此分类？')) return;
  await fetch(`/admin/api/resources/category/${id}/`, {method:'DELETE'});
  location.reload();
}
async function togglePublic(id, val) {
  await fetch(`/admin/api/resources/${id}/`, {
    method:'PUT', headers:{'Content-Type':'application/json'},
    body: JSON.stringify({is_public: val?1:0})
  });
}
async function delResource(id, title) {
  if (!confirm(`删除「${title}」？`)) return;
  await fetch(`/admin/api/resources/${id}/`, {method:'DELETE'});
  location.reload();
}
async function uploadResource(files) {
  const prog = document.getElementById('resUploadProgress');
  const bar  = document.getElementById('resBar');
  prog.style.display = 'block';
  for (const file of files) {
    const fd = new FormData();
    fd.append('file', file);
    await fetch('/admin/api/resources/upload/', {method:'POST', body:fd})
      .then(r => r.json())
      .then(d => {
        if (d.ok) showToast('上传成功: ' + file.name);
        else showToast(d.error || '失败', 'error');
      });
    bar.style.width = '100%';
  }
  setTimeout(() => location.reload(), 800);
}
</script>
{% endblock %}