<!-- templates/jobs/job_document_upload.html -->
{% extends 'base.html' %}

{% block title %}Upload Documents for {{ job.job_title }}{% endblock %}

{% block content %}
<div class="container mt-4">
    <h2 class="mb-4">Upload Documents for <strong>{{ job.job_title }}</strong></h2>

    <div class="card shadow-sm mb-4">
        <div class="card-body">
            <form method="POST" enctype="multipart/form-data">
                {% csrf_token %}
                {{ form.as_p }}
                <button type="submit" class="btn btn-success">
                    <i class="bi bi-upload"></i> Upload Document
                </button>
            </form>
        </div>
    </div>

    <div class="card shadow-sm">
        <div class="card-header">
            <h5 class="mb-0">Uploaded Documents</h5>
        </div>
        <div class="card-body table-responsive">
            <form method="get" class="row g-3 align-items-center mb-3">
                <div class="col-auto">
                    <select name="document_type" class="form-select" onchange="this.form.submit()">
                        <option value="">All Types</option>
                        {% for code, label in form.fields.document_type.choices %}
                            <option value="{{ code }}" {% if request.GET.document_type == code %}selected{% endif %}>
                                {{ label }}
                            </option>
                        {% endfor %}
                    </select>
                </div>
                <div class="col-md-6">
                    <div class="input-group">
                        <input type="text" class="form-control table-search" placeholder="Search..." data-table="docTable">
                    </div>
                </div>
            </form>
            <div class="table-responsive">
                <table class="table table-bordered"  id="docTable">
                    <thead class="table-light">
                        <tr>
                            <th>Document Type</th>
                            <th>File</th>
                            <th></th>
                            <th>Notes</th>
                            <th>Uploaded At</th>
                            <th>Actions</th>
                        </tr>
                    </thead>
                    <tbody>
                        {% for doc in documents %}
                        <tr>
                            <td>{{ doc.get_document_type_display }}</td>
                            <td>
                                {% if doc.document %}
                                {{ doc.document.name|cut:"job_documents/" }} <!-- Showing file name nicely -->
                                {% else %}
                                    -
                                {% endif %}
                            </td>
                            <td>
                                {% if doc.document.url %}
                                    {% with doc.document.url|lower as doc_url %}
                                        {% if doc_url|slice:"-4:" == ".pdf" %}
                                            <i class="bi bi-file-earmark-pdf-fill text-danger"></i> 
                                            <a href="{{ doc.document.url }}" target="_blank">View PDF</a>
                                        {% elif doc_url|slice:"-4:" == ".jpg" or doc_url|slice:"-5:" == ".jpeg" or doc_url|slice:"-4:" == ".png" %}
                                            <i class="bi bi-image-fill text-info"></i> 
                                            <a href="{{ doc.document.url }}" target="_blank">View Image</a>
                                        {% elif doc_url|slice:"-4:" == ".doc" or doc_url|slice:"-5:" == ".docx" or doc_url|slice:"-4:" == ".xls" or doc_url|slice:"-5:" == ".xlsx" %}
                                            <i class="bi bi-file-earmark-text-fill text-primary"></i> 
                                            <a href="{{ doc.document.url }}" target="_blank">View Document</a>
                                        {% else %}
                                            <i class="bi bi-file-earmark-fill"></i> 
                                            <a href="{{ doc.document.url }}" target="_blank">View File</a>
                                        {% endif %}
                                    {% endwith %}
                                {% else %}
                                    No file
                                {% endif %}
                            </td>
                            <td>{{ doc.notes }}</td>
                            <td>{{ doc.uploaded_at|date:"M d, Y H:i" }}</td>
                            <td>
                                <a href="{{ doc.document.url }}" class="btn btn-sm btn-success" download>
                                    <i class="bi bi-download"></i> Download
                                </a>
                            </td>
                        </tr>
                        {% empty %}
                        <tr>
                            <td colspan="4" class="text-center text-muted">No documents uploaded yet.</td>
                        </tr>
                        {% endfor %}
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>


{% endblock %}
