{% extends 'core/base.html' %}

{% block content %}
<!-- 页面标题 -->
<div class="d-flex justify-content-between align-items-center mb-4">
    <h2 class="mb-0">
        <i class="bi bi-globe me-2 text-info"></i>公开内容
    </h2>
    <div class="d-flex align-items-center gap-3">
        <div class="dropdown">
            <button class="btn btn-outline-secondary btn-sm dropdown-toggle" type="button" data-bs-toggle="dropdown">
                <i class="bi bi-cloud-arrow-up me-1"></i>API上传
            </button>
            <ul class="dropdown-menu dropdown-menu-end p-3" style="min-width: 350px;">
                <li>
                    <h6 class="dropdown-header">临时文件上传 API</h6>
                    <p class="small text-muted mb-2">端点: <code>POST /api/v1/temp-upload/</code></p>
                    <hr>
                    <p class="small mb-1"><strong>参数:</strong></p>
                    <ul class="small mb-2">
                        <li><code>title</code> - 文件标题</li>
                        <li><code>file</code> - 文件(最大500MB)</li>
                        <li><code>expire_type</code> - expire_1h / expire_1d / expire_7d</li>
                    </ul>
                    <p class="small mb-1"><strong>cURL示例:</strong></p>
                    <pre class="small bg-dark text-white p-2 rounded"><code>curl -X POST -F "file=@f.pdf" -F "title=文件" -F "expire_type=expire_1d" /api/v1/temp-upload/</code></pre>
                </li>
            </ul>
        </div>
        {% if user.is_authenticated %}
        <a href="{% url 'add_public_content' %}" class="btn btn-primary">
            <i class="bi bi-plus-lg me-1"></i>添加内容
        </a>
        {% endif %}
    </div>
</div>

{% if content_by_type %}
    {% for type_name, contents in content_by_type.items %}
    <div class="card mb-4">
        <div class="card-header bg-info text-dark d-flex justify-content-between align-items-center">
            <h5 class="card-title mb-0">
                <i class="bi bi-folder me-2"></i>{{ type_name }}
            </h5>
            <span class="badge bg-light text-info">{{ contents|length }} 项</span>
        </div>
        <div class="card-body">
            <div class="list-group">
                {% for content in contents %}
                <div class="list-group-item">
                    <div class="d-flex justify-content-between align-items-start">
                        <div class="flex-grow-1">
                            <h6 class="mb-2">
                                {% if content.url %}
                                <a href="{{ content.url }}" target="_blank" class="text-decoration-none">
                                    <i class="bi bi-link-45deg me-1"></i>{{ content.title }}
                                </a>
                                {% else %}
                                <i class="bi bi-file-earmark-text me-1"></i>{{ content.title }}
                                {% endif %}
                                {% if content.is_temp_file %}
                                <span class="badge bg-warning text-dark ms-2">临时文件</span>
                                {% endif %}
                            </h6>
                            {% if content.content %}
                            <p class="text-muted small mb-2">{{ content.content|truncatechars:200 }}</p>
                            {% endif %}
                            {% if content.file %}
                            <a href="{{ content.file.url }}" class="btn btn-sm btn-outline-primary me-2" target="_blank">
                                <i class="bi bi-download me-1"></i>下载文件
                            </a>
                            {% endif %}
                            {% if content.is_temp_file and content.expire_at %}
                            {% load humanize %}
                            <span class="badge bg-secondary">
                                <i class="bi bi-clock me-1"></i>{{ content.expire_at|naturaltime }}过期
                            </span>
                            {% endif %}
                        </div>
                        {% if user.is_authenticated %}
                        <div class="btn-group ms-3">
                            <a href="{% url 'edit_public_content' content.id %}" class="btn btn-sm btn-warning" title="编辑">
                                <i class="bi bi-pencil"></i>
                            </a>
                            <a href="{% url 'delete_public_content' content.id %}" class="btn btn-sm btn-danger" title="删除">
                                <i class="bi bi-trash"></i>
                            </a>
                        </div>
                        {% endif %}
                    </div>
                </div>
                {% endfor %}
            </div>
        </div>
    </div>
    {% endfor %}
{% else %}
<div class="text-center py-5">
    <i class="bi bi-inbox text-muted" style="font-size: 5rem;"></i>
    <h5 class="text-muted mt-3">暂无公开内容</h5>
    <p class="text-muted">请稍后再来查看</p>
    {% if user.is_authenticated %}
    <a href="{% url 'add_public_content' %}" class="btn btn-primary">
        <i class="bi bi-plus-lg me-1"></i>添加内容
    </a>
    {% endif %}
</div>
{% endif %}

<!-- 临时文件上传表单 - 对人类用户视觉隐藏，agent可访问 -->
<div style="width: 1px; height: 1px; overflow: hidden; position: absolute; left: -9999px;">
    <form method="post" enctype="multipart/form-data" action="{% url 'api_temp_upload' %}">
        {% csrf_token %}
        <input type="text" name="title" placeholder="文件标题">
        <select name="expire_type">
            <option value="expire_1h">1小时</option>
            <option value="expire_1d">1天</option>
            <option value="expire_7d">7天</option>
        </select>
        <input type="file" name="file">
        <button type="submit">上传</button>
    </form>
</div>

<!-- API文档 -->
<div class="card mt-4">
    <div class="card-header bg-dark text-white">
        <h5 class="card-title mb-0">
            <i class="bi bi-terminal me-2"></i>临时文件上传 API
        </h5>
    </div>
    <div class="card-body">
        <h6 class="text-muted">上传文件</h6>
        <p><strong>端点:</strong> <code>POST /api/v1/temp-upload/</code></p>

        <h6 class="text-muted mt-3">参数</h6>
        <table class="table table-sm table-bordered">
            <thead class="table-light">
                <tr>
                    <th>参数名</th>
                    <th>类型</th>
                    <th>必填</th>
                    <th>说明</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>title</td>
                    <td>string</td>
                    <td>是</td>
                    <td>文件标题</td>
                </tr>
                <tr>
                    <td>file</td>
                    <td>file</td>
                    <td>是</td>
                    <td>文件 (最大500MB)</td>
                </tr>
                <tr>
                    <td>expire_type</td>
                    <td>string</td>
                    <td>是</td>
                    <td>过期时间: expire_1h (1小时) / expire_1d (1天) / expire_7d (7天)</td>
                </tr>
            </tbody>
        </table>

        <h6 class="text-muted mt-3">响应示例</h6>
        <pre class="bg-dark text-white p-3 rounded"><code>{
  "success": true,
  "message": "上传成功",
  "id": 1,
  "file_url": "/media/public_files/xxx.pdf",
  "file_name": "document.pdf",
  "file_size": 1048576,
  "expire_at": "2026-05-25T18:30:00Z",
  "expire_type": "expire_1d"
}</code></pre>

        <h6 class="text-muted mt-3">cURL 示例</h6>
        <pre class="bg-dark text-white p-3 rounded"><code>curl -X POST -F "file=@document.pdf" -F "title=测试文件" -F "expire_type=expire_1d" http://localhost:8000/api/v1/temp-upload/</code></pre>
    </div>
</div>
{% endblock %}