{% extends "tasks/base.html" %}
{% block title %}Company Documents — Staff Panel{% endblock %}
{% block topbar_title %}Company Documents{% endblock %}
{% block content %}
<form method="get" class="s-filters">
    <input type="search" name="q" class="s-search" placeholder="Search title, description, uploader..." value="{{ query }}">
    <button type="submit" class="s-btn s-btn-outline s-btn-sm">Search</button>
</form>
{% if perms.task_management.upload_company_documents or request.user.is_superuser %}
<div class="s-card s-card-pad" style="margin-bottom:12px;">
    <div class="s-card-header"><div class="s-card-title">Upload Internal Document</div></div>
    <form method="post" enctype="multipart/form-data">
        {% csrf_token %}
        <div style="display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;">
            <div class="staff-form-group">
                <label class="staff-form-label">Title *</label>{{ form.title }}
                {% if form.title.errors %}<div style="font-size:11px;color:var(--s-red);">{{ form.title.errors.0 }}</div>{% endif %}
            </div>
            <div class="staff-form-group">
                <label class="staff-form-label">File *</label>{{ form.file }}
                {% if form.file.errors %}<div style="font-size:11px;color:var(--s-red);">{{ form.file.errors.0 }}</div>{% endif %}
            </div>
        </div>
        <div class="staff-form-group">
            <label class="staff-form-label">Description</label>{{ form.description }}
        </div>
        <div style="display:flex;justify-content:flex-end;">
            <button type="submit" class="s-btn s-btn-primary">Upload Document</button>
        </div>
    </form>
</div>
{% endif %}
<div class="s-card s-card-pad">
    <div class="s-card-header">
        <div class="s-card-title">Stored Documents ({{ documents|length }})</div>
    </div>
    {% for doc in documents %}
    <div style="padding:12px 0;border-bottom:1px solid var(--s-border);">
        <div style="display:flex;align-items:flex-start;justify-content:space-between;gap:10px;flex-wrap:wrap;">
            <div style="flex:1;min-width:220px;">
                <div style="font-size:13px;font-weight:700;color:var(--s-navy);">{{ doc.title }}</div>
                <div style="font-size:11px;color:var(--s-text3);margin-top:2px;">
                    Uploaded by {{ doc.uploaded_by.get_full_name|default:doc.uploaded_by.username|default:"Unknown" }} · {{ doc.created_at|date:"d M Y, H:i" }}
                </div>
                {% if doc.description %}<div style="font-size:12px;color:var(--s-text2);margin-top:4px;line-height:1.4;">{{ doc.description }}</div>{% endif %}
                <div style="font-size:11px;color:var(--s-text3);margin-top:3px;">📎 {{ doc.filename }}</div>
            </div>
            <div style="display:flex;gap:6px;align-items:center;flex-wrap:wrap;flex-shrink:0;">
                <a href="{% url 'task_management:company_document_download' doc.id %}" class="s-btn s-btn-outline s-btn-sm">Download</a>
                {% if doc.uploaded_by_id == request.user.id or request.user.is_superuser %}
                <button type="button" class="s-btn s-btn-outline s-btn-sm" style="color:var(--s-red);"
                        onclick="openDeleteModal('{% url 'task_management:company_document_delete' doc.id %}', '{{ doc.title|escapejs }}')">Archive</button>
                {% endif %}
            </div>
        </div>
    </div>
    {% empty %}
    <div class="s-empty"><p>No company documents uploaded yet.</p></div>
    {% endfor %}
</div>
{% if docs_page and docs_page.paginator.num_pages > 1 %}
<div style="display:flex;justify-content:space-between;align-items:center;margin-top:10px;font-size:12px;">
    <div>Page {{ docs_page.number }} of {{ docs_page.paginator.num_pages }}</div>
    <div style="display:flex;gap:8px;">
        {% if docs_page.has_previous %}<a class="s-btn s-btn-outline s-btn-sm" href="?q={{ query|urlencode }}&docs_page={{ docs_page.previous_page_number }}">← Previous</a>{% endif %}
        {% if docs_page.has_next %}<a class="s-btn s-btn-outline s-btn-sm" href="?q={{ query|urlencode }}&docs_page={{ docs_page.next_page_number }}">Next →</a>{% endif %}
    </div>
</div>
{% endif %}
{% endblock %}