138 lines
7.0 KiB
HTML
138 lines
7.0 KiB
HTML
{% extends "layouts/base.html" %}
|
|
{% load i18n static %}
|
|
|
|
{% block title %}{% trans "Appreciation Badges" %} - {% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="container-fluid py-4">
|
|
<!-- Breadcrumb -->
|
|
<nav aria-label="breadcrumb" class="mb-4">
|
|
<ol class="breadcrumb">
|
|
<li class="breadcrumb-item"><a href="{% url 'appreciation:appreciation_list' %}">{% trans "Appreciation" %}</a></li>
|
|
<li class="breadcrumb-item active" aria-current="page">{% trans "Badges" %}</li>
|
|
</ol>
|
|
</nav>
|
|
|
|
<!-- Page Header -->
|
|
<div class="d-flex justify-content-between align-items-center mb-4">
|
|
<h2>
|
|
<i class="fas fa-award text-warning me-2"></i>
|
|
{% trans "Appreciation Badges" %}
|
|
</h2>
|
|
<a href="{% url 'appreciation:badge_create' %}" class="btn btn-primary">
|
|
<i class="fas fa-plus me-2"></i>
|
|
{% trans "Add Badge" %}
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Badges List -->
|
|
<div class="card shadow-sm">
|
|
<div class="card-body">
|
|
{% if badges %}
|
|
<div class="row">
|
|
{% for badge in badges %}
|
|
<div class="col-md-6 col-lg-4 mb-4">
|
|
<div class="card h-100 border-2 border-warning">
|
|
<div class="card-body">
|
|
<div class="text-center mb-3">
|
|
<i class="{{ badge.icon }} fa-4x text-warning"></i>
|
|
</div>
|
|
<h5 class="card-title text-center">{{ badge.name_en }}</h5>
|
|
<p class="card-text small text-muted text-center">
|
|
{{ badge.description_en|truncatewords:10 }}
|
|
</p>
|
|
<hr>
|
|
<ul class="list-unstyled small mb-3">
|
|
<li class="mb-2">
|
|
<strong>{% trans "Type:" %}</strong>
|
|
{{ badge.get_criteria_type_display }}
|
|
</li>
|
|
<li class="mb-2">
|
|
<strong>{% trans "Value:" %}</strong>
|
|
{{ badge.criteria_value }}
|
|
</li>
|
|
<li class="mb-2">
|
|
<strong>{% trans "Earned:" %}</strong>
|
|
{{ badge.earned_count }} {% trans "times" %}
|
|
</li>
|
|
<li>
|
|
<strong>{% trans "Status:" %}</strong>
|
|
{% if badge.is_active %}
|
|
<span class="badge bg-success">{% trans "Active" %}</span>
|
|
{% else %}
|
|
<span class="badge bg-secondary">{% trans "Inactive" %}</span>
|
|
{% endif %}
|
|
</li>
|
|
</ul>
|
|
<div class="d-grid gap-2">
|
|
<a href="{% url 'appreciation:badge_edit' badge.id %}" class="btn btn-sm btn-outline-primary">
|
|
<i class="fas fa-edit me-2"></i>{% trans "Edit" %}
|
|
</a>
|
|
<a href="{% url 'appreciation:badge_delete' badge.id %}" class="btn btn-sm btn-outline-danger">
|
|
<i class="fas fa-trash me-2"></i>{% trans "Delete" %}
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
|
|
<!-- Pagination -->
|
|
{% if page_obj.has_other_pages %}
|
|
<nav aria-label="Page navigation" class="mt-4">
|
|
<ul class="pagination justify-content-center">
|
|
{% if page_obj.has_previous %}
|
|
<li class="page-item">
|
|
<a class="page-link" href="?page={{ page_obj.previous_page_number }}">
|
|
{% trans "Previous" %}
|
|
</a>
|
|
</li>
|
|
{% else %}
|
|
<li class="page-item disabled">
|
|
<span class="page-link">{% trans "Previous" %}</span>
|
|
</li>
|
|
{% endif %}
|
|
|
|
{% for num in page_obj.paginator.page_range %}
|
|
{% if page_obj.number == num %}
|
|
<li class="page-item active">
|
|
<span class="page-link">{{ num }}</span>
|
|
</li>
|
|
{% elif num > page_obj.number|add:'-3' and num < page_obj.number|add:'3' %}
|
|
<li class="page-item">
|
|
<a class="page-link" href="?page={{ num }}">{{ num }}</a>
|
|
</li>
|
|
{% endif %}
|
|
{% endfor %}
|
|
|
|
{% if page_obj.has_next %}
|
|
<li class="page-item">
|
|
<a class="page-link" href="?page={{ page_obj.next_page_number }}">
|
|
{% trans "Next" %}
|
|
</a>
|
|
</li>
|
|
{% else %}
|
|
<li class="page-item disabled">
|
|
<span class="page-link">{% trans "Next" %}</span>
|
|
</li>
|
|
{% endif %}
|
|
</ul>
|
|
</nav>
|
|
{% endif %}
|
|
{% else %}
|
|
<div class="text-center py-5">
|
|
<i class="fas fa-award fa-4x text-muted mb-3"></i>
|
|
<h4 class="text-muted">{% trans "No badges found" %}</h4>
|
|
<p class="text-muted mb-3">{% trans "Create badges to motivate and recognize achievements" %}</p>
|
|
<a href="{% url 'appreciation:badge_create' %}" class="btn btn-primary">
|
|
<i class="fas fa-plus me-2"></i>
|
|
{% trans "Add Badge" %}
|
|
</a>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|