kaauh_ats/templates/forms/form_list.html
2025-10-21 17:22:32 +03:00

143 lines
7.6 KiB
HTML

{% extends "base.html" %}
{% block title %}Forms - University ATS{% endblock %}
{% block content %}
<div class="container-fluid">
<div class="row">
<div class="col-12">
<div class="d-flex justify-content-between align-items-center mb-4">
<h1><i class="fas fa-wpforms"></i> Forms</h1>
<a href="{% url 'form_builder' %}" class="btn btn-primary">
<i class="fas fa-plus"></i> Create New Form
</a>
</div>
<!-- Search and Filter -->
<div class="card mb-4">
<div class="card-body">
<form method="get" class="row g-3">
<div class="col-md-8">
<div class="input-group">
<input type="text" class="form-control" name="search" placeholder="Search forms..." value="{{ request.GET.search }}">
<button class="btn btn-outline-secondary" type="submit">
<i class="fas fa-search"></i>
</button>
</div>
</div>
<div class="col-md-4">
<select class="form-select" name="sort">
<option value="-created_at">Latest First</option>
<option value="created_at">Oldest First</option>
<option value="title">Title (A-Z)</option>
<option value="-title">Title (Z-A)</option>
</select>
</div>
</form>
</div>
</div>
<!-- Forms List -->
{% if page_obj %}
<div class="row">
{% for form in page_obj %}
<div class="col-lg-4 col-md-6 mb-4">
<div class="card h-100">
<div class="card-body">
<div class="d-flex justify-content-between align-items-start mb-2">
<h5 class="card-title mb-1">{{ form.title }}</h5>
<span class="badge bg-success">Active</span>
</div>
<p class="card-text text-muted small">
{{ form.description|truncatewords:15 }}
</p>
<div class="mb-2">
<small class="text-muted">
<i class="fas fa-user"></i> {{ form.created_by.username }}
</small>
</div>
<div class="mb-2">
<small class="text-muted">
<i class="fas fa-calendar"></i> {{ form.created_at|date:"M d, Y" }}
</small>
</div>
<div class="mb-3">
<small class="text-muted">
<i class="fas fa-chart-bar"></i> {{ form.submissions.count }} submissions
</small>
</div>
</div>
<div class="card-footer bg-transparent">
<div class="btn-group w-100" role="group">
{% if form.created_by == user %}
<a href="{% url 'edit_form' form.slug %}" class="btn btn-sm btn-outline-warning">
<i class="fas fa-edit"></i> Edit
</a>
{% endif %}
<a href="{% url 'form_preview' form.slug %}" class="btn btn-sm btn-outline-primary" target="_blank">
<i class="fas fa-eye"></i> Preview
</a>
<a href="{% url 'form_embed' form.slug %}" class="btn btn-sm btn-outline-secondary" target="_blank">
<i class="fas fa-code"></i> Embed
</a>
<a href="{% url 'form_submissions' form.slug %}" class="btn btn-sm btn-outline-info">
<i class="fas fa-list"></i> Submissions
</a>
</div>
</div>
</div>
</div>
{% endfor %}
</div>
<!-- Pagination -->
{% if page_obj.has_other_pages %}
<nav aria-label="Forms pagination">
<ul class="pagination justify-content-center">
{% if page_obj.has_previous %}
<li class="page-item">
<a class="page-link" href="?page=1{% if request.GET.search %}&search={{ request.GET.search }}{% endif %}{% if request.GET.sort %}&sort={{ request.GET.sort }}{% endif %}">First</a>
</li>
<li class="page-item">
<a class="page-link" href="?page={{ page_obj.previous_page_number }}{% if request.GET.search %}&search={{ request.GET.search }}{% endif %}{% if request.GET.sort %}&sort={{ request.GET.sort }}{% endif %}">Previous</a>
</li>
{% endif %}
<li class="page-item active">
<span class="page-link">{{ page_obj.number }} of {{ page_obj.paginator.num_pages }}</span>
</li>
{% if page_obj.has_next %}
<li class="page-item">
<a class="page-link" href="?page={{ page_obj.next_page_number }}{% if request.GET.search %}&search={{ request.GET.search }}{% endif %}{% if request.GET.sort %}&sort={{ request.GET.sort }}{% endif %}">Next</a>
</li>
<li class="page-item">
<a class="page-link" href="?page={{ page_obj.paginator.num_pages }}{% if request.GET.search %}&search={{ request.GET.search }}{% endif %}{% if request.GET.sort %}&sort={{ request.GET.sort }}{% endif %}">Last</a>
</li>
{% endif %}
</ul>
</nav>
{% endif %}
{% else %}
<div class="text-center py-5">
<i class="fas fa-wpforms fa-3x text-muted mb-3"></i>
<h3>No forms found</h3>
<p class="text-muted">Create your first form to get started.</p>
<a href="{% url 'form_builder' %}" class="btn btn-primary">Create Form</a>
</div>
{% endif %}
</div>
</div>
</div>
{% endblock %}
{% block extra_js %}
<script>
// Add any interactive JavaScript here if needed
</script>
{% endblock %}