100 lines
6.2 KiB
HTML
100 lines
6.2 KiB
HTML
{% load i18n %}
|
|
<section class="bg-white rounded-2xl p-4 shadow-sm border border-slate-100">
|
|
<div class="flex justify-between items-center mb-3">
|
|
<h3 class="text-sm font-bold text-navy uppercase tracking-wide">{% trans "Involved Staff" %}</h3>
|
|
{% if can_manage_actions and complaint.is_active_status %}
|
|
<button type="button" onclick="showAddStaffModal()"
|
|
class="px-2.5 py-1 text-xs bg-gradient-to-r from-navy to-blue text-white rounded-lg font-semibold hover:opacity-90 transition flex items-center gap-1">
|
|
<i data-lucide="plus" class="w-3.5 h-3.5"></i> {% trans "Add" %}
|
|
</button>
|
|
{% endif %}
|
|
</div>
|
|
|
|
{% if complaint.involved_staff.exists %}
|
|
<div class="overflow-x-auto">
|
|
<table class="w-full text-sm">
|
|
<thead>
|
|
<tr class="border-b border-slate-100">
|
|
<th class="text-left py-2 pr-2 text-[10px] font-bold text-slate/50 uppercase">{% trans "Staff Member" %}</th>
|
|
<th class="text-left py-2 px-2 text-[10px] font-bold text-slate/50 uppercase">{% trans "Role" %}</th>
|
|
<th class="text-left py-2 px-2 text-[10px] font-bold text-slate/50 uppercase">{% trans "Status" %}</th>
|
|
{% if can_manage_actions and complaint.is_active_status %}
|
|
<th class="text-right py-2 pl-2 text-[10px] font-bold text-slate/50 uppercase"></th>
|
|
{% endif %}
|
|
</tr>
|
|
</thead>
|
|
<tbody class="divide-y divide-slate-50">
|
|
{% for staff_inv in complaint.involved_staff.all %}
|
|
<tr class="hover:bg-slate-50/50 transition">
|
|
<td class="py-2.5 pr-2">
|
|
<div class="flex items-center gap-1.5">
|
|
<div class="w-7 h-7 bg-light rounded-full flex items-center justify-center shrink-0">
|
|
<i data-lucide="user" class="w-3.5 h-3.5 text-navy"></i>
|
|
</div>
|
|
<div class="min-w-0">
|
|
<p class="font-semibold text-navy text-xs truncate">{{ staff_inv.staff.get_localized_name }}</p>
|
|
{% if staff_inv.staff.department %}
|
|
<p class="text-[10px] text-slate truncate">{{ staff_inv.staff.department.get_localized_name }}</p>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
{% if staff_inv.notes %}
|
|
<p class="text-[10px] text-slate/70 mt-1 italic max-w-xs truncate">{{ staff_inv.notes|truncatechars:60 }}</p>
|
|
{% endif %}
|
|
</td>
|
|
<td class="py-2.5 px-2">
|
|
<span class="px-1.5 py-0.5 bg-light text-navy rounded text-[10px] font-semibold">{{ staff_inv.get_role_display }}</span>
|
|
</td>
|
|
<td class="py-2.5 px-2">
|
|
{% if staff_inv.explanation_received %}
|
|
<span class="inline-flex items-center gap-1 text-[10px] font-bold text-green-600"><i data-lucide="check-circle" class="w-3 h-3"></i> {% trans "Responded" %}</span>
|
|
{% elif staff_inv.explanation_requested %}
|
|
<span class="inline-flex items-center gap-1 text-[10px] font-bold text-amber-600"><i data-lucide="clock" class="w-3 h-3"></i> {% trans "Pending" %}</span>
|
|
{% else %}
|
|
<span class="text-[10px] text-slate/50 italic">—</span>
|
|
{% endif %}
|
|
</td>
|
|
{% if can_manage_actions and complaint.is_active_status %}
|
|
<td class="py-2.5 pl-2 text-right">
|
|
<div class="flex items-center justify-end gap-1">
|
|
{% if not staff_inv.explanation_received %}
|
|
<form method="post" action="{% url 'complaints:involved_staff_explanation' pk=staff_inv.pk %}" class="inline">
|
|
{% csrf_token %}
|
|
<button type="submit" class="p-1.5 text-slate hover:text-blue transition" title="{% trans 'Submit Response' %}">
|
|
<i data-lucide="message-square" class="w-4 h-4"></i>
|
|
</button>
|
|
</form>
|
|
{% endif %}
|
|
<a href="{% url 'complaints:involved_staff_edit' pk=staff_inv.pk %}"
|
|
class="p-1.5 text-slate hover:text-navy transition" title="{% trans 'Edit' %}">
|
|
<i data-lucide="edit-2" class="w-4 h-4"></i>
|
|
</a>
|
|
<form method="post" action="{% url 'complaints:involved_staff_remove' pk=staff_inv.pk %}"
|
|
class="inline" onsubmit="return confirm('{% trans "Are you sure you want to remove this staff member?" %}')">
|
|
{% csrf_token %}
|
|
<button type="submit" class="p-1.5 text-slate hover:text-red-500 transition" title="{% trans 'Remove' %}">
|
|
<i data-lucide="trash-2" class="w-4 h-4"></i>
|
|
</button>
|
|
</form>
|
|
</div>
|
|
</td>
|
|
{% endif %}
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
{% else %}
|
|
<div class="text-center py-8">
|
|
<i data-lucide="users" class="w-10 h-10 mx-auto text-slate-300 mb-2"></i>
|
|
<p class="text-slate text-sm mb-3">{% trans "No staff members involved yet" %}</p>
|
|
{% if can_manage_actions and complaint.is_active_status %}
|
|
<button type="button" onclick="showAddStaffModal()"
|
|
class="px-3 py-1.5 text-xs bg-gradient-to-r from-navy to-blue text-white rounded-lg font-semibold hover:opacity-90 transition inline-flex items-center gap-2">
|
|
<i data-lucide="plus" class="w-4 h-4"></i> {% trans "Add First Staff" %}
|
|
</button>
|
|
{% endif %}
|
|
</div>
|
|
{% endif %}
|
|
</section>
|