93 lines
4.2 KiB
HTML
93 lines
4.2 KiB
HTML
{% load i18n %}
|
|
|
|
<div class="overflow-x-auto">
|
|
<table class="w-full text-sm text-left">
|
|
<thead>
|
|
<tr class="bg-temple-red/10 border-b-2 border-temple-red">
|
|
<th class="px-4 py-3 font-bold text-gray-900" style="width: 35%;">
|
|
<div class="flex items-center gap-2">
|
|
<i data-lucide="user" class="w-4 h-4 text-temple-red"></i>
|
|
{% trans "Topic" %}
|
|
</div>
|
|
</th>
|
|
<th class="px-4 py-3 font-bold text-gray-900" style="width: 15%;">
|
|
<div class="flex items-center gap-2">
|
|
<i data-lucide="calendar" class="w-4 h-4 text-temple-red"></i>
|
|
{% trans "Date" %}
|
|
</div>
|
|
</th>
|
|
<th class="px-4 py-3 font-bold text-gray-900" style="width: 10%;">
|
|
<div class="flex items-center gap-2">
|
|
<i data-lucide="hourglass" class="w-4 h-4 text-temple-red"></i>
|
|
{% trans "Duration" %}
|
|
</div>
|
|
</th>
|
|
<th class="px-4 py-3 font-bold text-gray-900" style="width: 10%;">
|
|
<div class="flex items-center gap-2">
|
|
<i data-lucide="map-pin" class="w-4 h-4 text-temple-red"></i>
|
|
{% trans "Location" %}
|
|
</div>
|
|
</th>
|
|
<th class="px-4 py-3 font-bold text-gray-900" style="width: 10%;">
|
|
<div class="flex items-center gap-2">
|
|
<i data-lucide="info" class="w-4 h-4 text-temple-red"></i>
|
|
{% trans "Status" %}
|
|
</div>
|
|
</th>
|
|
<th class="px-4 py-3 font-bold text-gray-900" style="width: 10%;">
|
|
{% trans "Actions" %}
|
|
</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for interview in interviews %}
|
|
<tr class="border-b border-gray-100 hover:bg-gray-50 transition-colors">
|
|
<td class="px-4 py-3 text-gray-900 font-medium">
|
|
{{ interview.interview.topic }}
|
|
</td>
|
|
<td class="px-4 py-3 text-gray-700">
|
|
{{ interview.interview_date }} {{ interview.interview_time }}
|
|
</td>
|
|
<td class="px-4 py-3 text-gray-700">
|
|
{{ interview.interview.duration }}
|
|
</td>
|
|
<td class="px-4 py-3">
|
|
<span class="inline-flex items-center gap-1.5 px-3 py-1.5 rounded-full text-xs font-semibold bg-temple-red/10 text-temple-red">
|
|
{{ interview.interview.location_type }}
|
|
</span>
|
|
</td>
|
|
<td class="px-4 py-3">
|
|
<span class="inline-flex items-center gap-1.5 px-3 py-1.5 rounded-full text-xs font-semibold bg-temple-dark/10 text-temple-dark">
|
|
{{ interview.get_status_display }}
|
|
</span>
|
|
</td>
|
|
<td class="px-4 py-3">
|
|
<a class="inline-flex items-center gap-1.5 px-4 py-2 rounded-lg text-sm font-medium border-2 border-temple-red text-temple-red hover:bg-temple-red hover:text-white transition-all duration-200"
|
|
href="{% url 'interview_detail' interview.slug %}"
|
|
target="_blank">
|
|
<i data-lucide="eye" class="w-4 h-4"></i>
|
|
{% trans "View" %}
|
|
</a>
|
|
</td>
|
|
</tr>
|
|
{% empty %}
|
|
<tr>
|
|
<td colspan="6" class="px-4 py-8 text-center">
|
|
<div class="flex flex-col items-center gap-3 text-gray-500">
|
|
<i data-lucide="info" class="w-12 h-12"></i>
|
|
<p>{% trans "No interviews scheduled yet." %}</p>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
if (typeof lucide !== 'undefined') {
|
|
lucide.createIcons();
|
|
}
|
|
});
|
|
</script> |