162 lines
8.2 KiB
HTML
162 lines
8.2 KiB
HTML
{% extends 'applicant/partials/candidate_facing_base.html'%}
|
|
{% load static i18n %}
|
|
|
|
|
|
{% block title %}{% trans "My Profile" %} - {{ block.super }}{% endblock %}
|
|
|
|
{% block customCSS %}
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="container-fluid py-5">
|
|
|
|
{# Profile Header #}
|
|
<div class="d-flex justify-content-between align-items-center mb-5 border-bottom pb-4">
|
|
<h1 style="color: var(--kaauh-teal-dark); font-weight: 700;">
|
|
<i class="fas fa-user-circle me-3 text-primary-theme"></i> {% trans "My Candidate Profile" %}
|
|
</h1>
|
|
<a href="#" class="btn btn-main-action btn-lg">
|
|
<i class="fas fa-edit me-2"></i> {% trans "Edit Profile" %}
|
|
</a>
|
|
</div>
|
|
|
|
{# Profile and Account Management Row #}
|
|
<div class="row g-5 mb-5">
|
|
|
|
{# Candidate Details Card #}
|
|
<div class="col-lg-5">
|
|
<div class="card kaauh-card h-100 p-4">
|
|
<div class="card-body p-0">
|
|
<div class="d-flex align-items-center mb-4 pb-4 border-bottom">
|
|
<img src="{% if candidate.profile_picture %}{{ candidate.profile_picture.url }}{% else %}{% static 'image/default_avatar.png' %}{% endif %}"
|
|
alt="{% trans 'Profile Picture' %}"
|
|
class="rounded-circle me-4 shadow-sm"
|
|
style="width: 100px; height: 100px; object-fit: cover; border: 4px solid var(--kaauh-teal-light);">
|
|
<div>
|
|
<h3 class="card-title mb-1" style="color: var(--kaauh-teal-dark); font-weight: 600;">{{ candidate.name|default:"N/A" }}</h3>
|
|
<p class="text-muted mb-0">{{ candidate.email }}</p>
|
|
</div>
|
|
</div>
|
|
|
|
<ul class="list-unstyled profile-data-list pt-2">
|
|
<li>
|
|
<i class="fas fa-phone-alt me-2 text-primary-theme"></i>
|
|
<strong>{% trans "Phone" %}</strong> {{ candidate.phone|default:"N/A" }}
|
|
</li>
|
|
<li>
|
|
<i class="fas fa-globe me-2 text-primary-theme"></i>
|
|
<strong>{% trans "Nationality" %}</strong> {{ candidate.get_nationality_display|default:"N/A" }}
|
|
</li>
|
|
<li>
|
|
<i class="fas fa-calendar-alt me-2 text-primary-theme"></i>
|
|
<strong>{% trans "Date of Birth" %}</strong> {{ candidate.date_of_birth|date:"M d, Y"|default:"N/A" }}
|
|
</li>
|
|
<li>
|
|
<i class="fas fa-file-alt me-2 text-primary-theme"></i>
|
|
<strong>{% trans "Resume" %}</strong>
|
|
{% if candidate.resume %}
|
|
<a href="#" target="_blank" class="text-primary-theme text-decoration-none fw-medium">
|
|
{% trans "View/Download" %} <i class="fas fa-external-link-alt small ms-1"></i>
|
|
</a>
|
|
{% else %}
|
|
<span class="text-muted">{% trans "Not uploaded" %}</span>
|
|
{% endif %}
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{# Account Management / Quick Actions Card #}
|
|
<div class="col-lg-7">
|
|
<div class="card kaauh-card h-100 p-4">
|
|
<div class="card-header bg-white border-0 p-0 mb-4 profile-header">
|
|
<h4 class="mb-0 py-2" style="color: var(--kaauh-teal-dark); font-weight: 600;"><i class="fas fa-cogs me-2"></i> {% trans "Account Settings" %}</h4>
|
|
</div>
|
|
<div class="card-body p-0">
|
|
<div class="row g-4">
|
|
<div class="col-md-6">
|
|
<a href="#" class="btn btn-outline-secondary w-100 py-3 d-flex align-items-center justify-content-center">
|
|
<i class="fas fa-key me-2"></i> {% trans "Change Password" %}
|
|
</a>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<a href="#" class="btn btn-outline-secondary w-100 py-3 d-flex align-items-center justify-content-center">
|
|
<i class="fas fa-id-card me-2"></i> {% trans "Update Contact Info" %}
|
|
</a>
|
|
</div>
|
|
<div class="col-12">
|
|
<blockquote class="blockquote small text-muted mt-3 p-3" style="border-left: 3px solid var(--kaauh-teal-light); background-color: var(--kaauh-bg-subtle); border-radius: 0.5rem;">
|
|
<p class="mb-0">{% trans "Your profile is essential for the application process. Keep your resume and contact information up-to-date for timely communication." %}</p>
|
|
</blockquote>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{# Application Tracking Section #}
|
|
<h2 class="h4 mb-4" style="color: var(--kaauh-teal-dark); border-bottom: 1px solid var(--kaauh-border); padding-bottom: 0.5rem;">
|
|
<i class="fas fa-list-alt me-2 text-primary-theme"></i> {% trans "My Applications History" %}
|
|
</h2>
|
|
|
|
{% if applications %}
|
|
<div class="table-responsive kaauh-card shadow-sm">
|
|
<table class="table table-hover align-middle mb-0 application-table">
|
|
<thead>
|
|
<tr>
|
|
<th scope="col" style="min-width: 250px;">{% trans "Job Title" %}</th>
|
|
<th scope="col">{% trans "Applied On" %}</th>
|
|
<th scope="col">{% trans "Current Stage" %}</th>
|
|
<th scope="col">{% trans "Status" %}</th>
|
|
<th scope="col" class="text-end" style="min-width: 120px;">{% trans "Action" %}</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for application in applications %}
|
|
<tr>
|
|
<td class="fw-medium">
|
|
<a href="{% url 'job_detail' application.job.slug %}" class="text-decoration-none text-primary-theme">
|
|
{{ application.job.title }}
|
|
</a>
|
|
</td>
|
|
<td>{{ application.applied_date|date:"d M Y" }}</td>
|
|
<td>
|
|
<span class="badge badge-stage">
|
|
{{ application.stage }}
|
|
</span>
|
|
</td>
|
|
<td>
|
|
{% if application.is_active %}
|
|
<span class="badge badge-success">{% trans "Active" %}</span>
|
|
{% else %}
|
|
<span class="badge badge-warning">{% trans "Closed" %}</span>
|
|
{% endif %}
|
|
</td>
|
|
<td class="text-end">
|
|
<a href="#" class="btn btn-outline-secondary btn-sm">
|
|
<i class="fas fa-eye"></i> {% trans "Details" %}
|
|
</a>
|
|
</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
{# Placeholder for Pagination #}
|
|
{% comment %} {% include "includes/paginator.html" with page_obj=applications_page %} {% endcomment %}
|
|
|
|
{% else %}
|
|
<div class="alert alert-info text-center kaauh-card p-5" style="border: 1px dashed var(--kaauh-border);">
|
|
<i class="fas fa-info-circle fa-2x mb-3 text-primary-theme"></i>
|
|
<h5 class="mb-3">{% trans "You have no active applications." %}</h5>
|
|
<a href="{% url 'job_list' %}" class="ms-3 btn btn-main-action mt-2">
|
|
{% trans "View Available Jobs" %} <i class="fas fa-arrow-right ms-2"></i>
|
|
</a>
|
|
</div>
|
|
{% endif %}
|
|
|
|
</div>
|
|
{% endblock %} |