103 lines
4.7 KiB
HTML
103 lines
4.7 KiB
HTML
{% extends "base.html" %}
|
|
{% load static i18n %}
|
|
|
|
{% block title %}{% trans "Delete Applicant" %} - {{ block.super }}{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="max-w-2xl mx-auto py-6 px-4">
|
|
|
|
<!-- Breadcrumb -->
|
|
<nav class="mb-6" aria-label="breadcrumb">
|
|
<ol class="flex items-center gap-2 text-sm flex-wrap">
|
|
<li><a href="{% url 'person_list' %}" class="text-gray-500 hover:underline transition flex items-center gap-1">
|
|
<i data-lucide="users" class="w-4 h-4"></i> {% trans "Applicants" %}
|
|
</a></li>
|
|
<li class="text-gray-400">/</li>
|
|
<li><a href="{% url 'person_detail' person.slug %}" class="text-gray-500 hover:underline transition">
|
|
{{ person.get_full_name }}
|
|
</a></li>
|
|
<li class="text-gray-400">/</li>
|
|
<li class="font-semibold text-red-600">{% trans "Confirm Delete" %}</li>
|
|
</ol>
|
|
</nav>
|
|
|
|
<!-- Delete Confirmation Card -->
|
|
<div class="bg-white rounded-xl shadow-sm border-2 border-red-200 overflow-hidden">
|
|
<div class="px-6 py-4 text-white" style="background-color: #dc3545;">
|
|
<h4 class="text-lg font-bold flex items-center gap-2">
|
|
<i data-lucide="alert-triangle" class="w-5 h-5"></i>
|
|
{% trans "Confirm Deletion" %}
|
|
</h4>
|
|
</div>
|
|
|
|
<div class="p-6">
|
|
<!-- Warning Alert -->
|
|
<div class="bg-red-50 border border-red-200 rounded-lg p-4 mb-6">
|
|
<div class="flex items-start gap-3">
|
|
<i data-lucide="alert-triangle" class="w-6 h-6 text-red-600 flex-shrink-0 mt-0.5"></i>
|
|
<div>
|
|
<h5 class="text-lg font-bold text-red-800 mb-2">
|
|
{% trans "Warning: This action cannot be undone!" %}
|
|
</h5>
|
|
<p class="text-red-700 mb-0">
|
|
{% trans "You are about to permanently delete this person and all associated data." %}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Person Profile -->
|
|
<div class="text-center mb-6 pb-6 border-b border-gray-200">
|
|
{% if person.profile_image %}
|
|
<img src="{{ person.profile_image.url }}" alt="{{ person.get_full_name }}"
|
|
class="w-24 h-24 rounded-full mx-auto mb-4 object-cover border-3 border-gray-200">
|
|
{% else %}
|
|
<div class="w-24 h-24 rounded-full mx-auto mb-4 bg-gray-100 flex items-center justify-center border-3 border-gray-200">
|
|
<i data-lucide="user" class="w-12 h-12 text-gray-400"></i>
|
|
</div>
|
|
{% endif %}
|
|
<h5 class="text-xl font-bold text-gray-900 mb-1">{{ person.get_full_name }}</h5>
|
|
{% if person.email %}
|
|
<p class="text-gray-600">{{ person.email }}</p>
|
|
{% endif %}
|
|
</div>
|
|
|
|
<!-- Action Buttons -->
|
|
<form method="post" id="delete-form">
|
|
{% csrf_token %}
|
|
<div class="flex flex-col sm:flex-row justify-between items-center gap-4">
|
|
<a href="{% url 'person_update' person.slug %}"
|
|
class="inline-flex items-center gap-2 px-8 py-3 rounded-lg font-medium border-2 border-gray-300 text-gray-700 hover:bg-gray-50 transition-all duration-200 w-full sm:w-auto justify-center">
|
|
<i data-lucide="arrow-left" class="w-4 h-4"></i>
|
|
{% trans "Cancel" %}
|
|
</a>
|
|
<button type="submit" id="delete-button"
|
|
class="inline-flex items-center gap-2 px-8 py-3 rounded-lg font-medium text-white bg-red-600 hover:bg-red-700 transition-all duration-200 w-full sm:w-auto justify-center">
|
|
<i data-lucide="trash-2" class="w-4 h-4"></i>
|
|
{% trans "Delete Applicant" %}
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
if (typeof lucide !== 'undefined') {
|
|
lucide.createIcons();
|
|
}
|
|
|
|
// Add confirmation before final submission
|
|
const deleteForm = document.getElementById('delete-form');
|
|
deleteForm.addEventListener('submit', function(e) {
|
|
const confirmation = confirm("{% trans 'Are you absolutely sure you want to delete this applicant? This action cannot be undone.' %}");
|
|
if (!confirmation) {
|
|
e.preventDefault();
|
|
return false;
|
|
}
|
|
});
|
|
});
|
|
</script>
|
|
{% endblock %} |