489 lines
20 KiB
HTML
489 lines
20 KiB
HTML
{% extends "layouts/base.html" %}
|
|
|
|
{% load i18n %}
|
|
|
|
{% block title %}{{ staff.get_full_name }} - {% trans "Staff Details" %}{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="page-header">
|
|
<div class="d-flex justify-content-between align-items-center">
|
|
<div>
|
|
<a href="{% url 'organizations:staff_list' %}" class="btn btn-outline-secondary mb-2">
|
|
<i class="fas fa-arrow-left"></i> {% trans "Back to List" %}
|
|
</a>
|
|
<h1 class="page-title">{{ staff.get_full_name }}</h1>
|
|
<p class="text-muted">{{ staff.job_title }} | {{ staff.get_staff_type_display }}</p>
|
|
</div>
|
|
<div>
|
|
{% if user.is_px_admin or user.is_hospital_admin %}
|
|
<a href="{% url 'organizations:staff_update' staff.id %}" class="btn btn-primary">
|
|
<i class="fas fa-edit"></i> {% trans "Edit" %}
|
|
</a>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-lg-8">
|
|
<!-- Bilingual Names -->
|
|
<div class="card mb-4">
|
|
<div class="card-header">
|
|
<h5 class="card-title mb-0">
|
|
<i class="fas fa-user"></i> {% trans "Personal Information" %}
|
|
</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="row">
|
|
<div class="col-md-6">
|
|
<div class="mb-3">
|
|
<label class="text-muted small">{% trans "First Name (English)" %}</label>
|
|
<div class="fw-bold">{{ staff.first_name }}</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="mb-3">
|
|
<label class="text-muted small">{% trans "Last Name (English)" %}</label>
|
|
<div class="fw-bold">{{ staff.last_name }}</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-6">
|
|
<div class="mb-3">
|
|
<label class="text-muted small">{% trans "First Name (Arabic)" %}</label>
|
|
<div class="fw-bold" dir="rtl">{{ staff.first_name_ar|default:"-" }}</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="mb-3">
|
|
<label class="text-muted small">{% trans "Last Name (Arabic)" %}</label>
|
|
<div class="fw-bold" dir="rtl">{{ staff.last_name_ar|default:"-" }}</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% if staff.license_number %}
|
|
<div class="mb-3">
|
|
<label class="text-muted small">{% trans "License Number" %}</label>
|
|
<div class="fw-bold">{{ staff.license_number }}</div>
|
|
</div>
|
|
{% endif %}
|
|
{% if staff.specialization %}
|
|
<div class="mb-3">
|
|
<label class="text-muted small">{% trans "Specialization" %}</label>
|
|
<div class="fw-bold">{{ staff.specialization }}</div>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Organization Information -->
|
|
<div class="card mb-4">
|
|
<div class="card-header">
|
|
<h5 class="card-title mb-0">
|
|
<i class="fas fa-building"></i> {% trans "Organization" %}
|
|
</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="mb-3">
|
|
<label class="text-muted small">{% trans "Hospital" %}</label>
|
|
<div class="fw-bold">{{ staff.hospital.name }}</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="text-muted small">{% trans "Department" %}</label>
|
|
<div class="fw-bold">{{ staff.department.name|default:"-" }}</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="text-muted small">{% trans "Employee ID" %}</label>
|
|
<div class="fw-bold">{{ staff.employee_id }}</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Contact Information -->
|
|
<div class="card mb-4">
|
|
<div class="card-header">
|
|
<h5 class="card-title mb-0">
|
|
<i class="fas fa-envelope"></i> {% trans "Contact Information" %}
|
|
</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="mb-3">
|
|
<label class="text-muted small">{% trans "Email" %}</label>
|
|
<div class="fw-bold">
|
|
{% if staff.email %}
|
|
<a href="mailto:{{ staff.email }}">{{ staff.email }}</a>
|
|
{% else %}
|
|
-
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="text-muted small">{% trans "Phone" %}</label>
|
|
<div class="fw-bold">
|
|
{% if staff.phone %}
|
|
<a href="tel:{{ staff.phone }}">{{ staff.phone }}</a>
|
|
{% else %}
|
|
-
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Demographics -->
|
|
<div class="card mb-4">
|
|
<div class="card-header">
|
|
<h5 class="card-title mb-0">
|
|
<i class="fas fa-info-circle"></i> {% trans "Demographics" %}
|
|
</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="mb-3">
|
|
<label class="text-muted small">{% trans "Gender" %}</label>
|
|
<div class="fw-bold">
|
|
{% if staff.gender %}
|
|
<span class="text-capitalize">{{ staff.gender }}</span>
|
|
{% else %}
|
|
-
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="text-muted small">{% trans "Country" %}</label>
|
|
<div class="fw-bold">{{ staff.country|default:"-" }}</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="text-muted small">{% trans "Location" %}</label>
|
|
<div class="fw-bold">{{ staff.location|default:"-" }}</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Hierarchy -->
|
|
<div class="card mb-4">
|
|
<div class="card-header">
|
|
<h5 class="card-title mb-0">
|
|
<i class="fas fa-sitemap"></i> {% trans "Hierarchy" %}
|
|
</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="mb-3">
|
|
<label class="text-muted small">{% trans "Reports To" %}</label>
|
|
<div class="fw-bold">
|
|
{% if staff.report_to %}
|
|
<a href="{% url 'organizations:staff_detail' staff.report_to.id %}" class="text-decoration-none">
|
|
{{ staff.report_to }}
|
|
</a>
|
|
{% else %}
|
|
-
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="text-muted small">{% trans "Direct Reports" %}</label>
|
|
<div>
|
|
{% if staff.direct_reports.exists %}
|
|
<ul class="list-unstyled mb-0">
|
|
{% for direct_report in staff.direct_reports.all %}
|
|
<li><a href="{% url 'organizations:staff_detail' direct_report.id %}" class="text-decoration-none">{{ direct_report }}</a></li>
|
|
{% endfor %}
|
|
</ul>
|
|
{% else %}
|
|
-
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Additional Details -->
|
|
<div class="card mb-4">
|
|
<div class="card-header">
|
|
<h5 class="card-title mb-0">
|
|
<i class="fas fa-list"></i> {% trans "Additional Details" %}
|
|
</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="mb-3">
|
|
<label class="text-muted small">{% trans "Section" %}</label>
|
|
<div class="fw-bold">{{ staff.section|default:"-" }}</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="text-muted small">{% trans "Subsection" %}</label>
|
|
<div class="fw-bold">{{ staff.subsection|default:"-" }}</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="text-muted small">{% trans "Department (Original)" %}</label>
|
|
<div class="fw-bold">{{ staff.department_name|default:"-" }}</div>
|
|
</div>
|
|
{% if staff.name %}
|
|
<div class="mb-3">
|
|
<label class="text-muted small">{% trans "Full Name (Original)" %}</label>
|
|
<div class="fw-bold">{{ staff.name }}</div>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-4">
|
|
<!-- User Account -->
|
|
<div class="card mb-4">
|
|
<div class="card-header">
|
|
<h5 class="card-title mb-0">
|
|
<i class="fas fa-user-circle"></i> {% trans "User Account" %}
|
|
</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
{% if staff.user %}
|
|
<div class="alert alert-success mb-3">
|
|
<i class="fas fa-check-circle"></i> {% trans "User account exists" %}
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="text-muted small">{% trans "Username" %}</label>
|
|
<div class="fw-bold">{{ staff.user.username }}</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="text-muted small">{% trans "Email" %}</label>
|
|
<div class="fw-bold">{{ staff.user.email }}</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="text-muted small">{% trans "Active" %}</label>
|
|
<div>
|
|
{% if staff.user.is_active %}
|
|
<span class="badge bg-success">{% trans "Yes" %}</span>
|
|
{% else %}
|
|
<span class="badge bg-danger">{% trans "No" %}</span>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="text-muted small">{% trans "Created" %}</label>
|
|
<div>{{ staff.user.date_joined|date:"Y-m-d H:i" }}</div>
|
|
</div>
|
|
{% if user.is_px_admin or user.is_hospital_admin %}
|
|
<div class="d-grid gap-2">
|
|
<button type="button" class="btn btn-outline-warning" onclick="sendInvitation()">
|
|
<i class="fas fa-envelope"></i> {% trans "Resend Invitation Email" %}
|
|
</button>
|
|
<button type="button" class="btn btn-outline-danger" onclick="unlinkUserAccount()">
|
|
<i class="fas fa-user-minus"></i> {% trans "Unlink User Account" %}
|
|
</button>
|
|
</div>
|
|
{% endif %}
|
|
{% else %}
|
|
<div class="alert alert-warning mb-3">
|
|
<i class="fas fa-exclamation-circle"></i> {% trans "No user account" %}
|
|
</div>
|
|
<p class="text-muted small mb-3">
|
|
{% trans "This staff member does not have a user account and cannot log in to the system." %}
|
|
</p>
|
|
{% if user.is_px_admin or user.is_hospital_admin %}
|
|
{% if staff.email %}
|
|
<button type="button" class="btn btn-success w-100" onclick="createUserAccount()">
|
|
<i class="fas fa-user-plus"></i> {% trans "Create User Account" %}
|
|
</button>
|
|
{% else %}
|
|
<div class="alert alert-info">
|
|
<i class="fas fa-info-circle"></i> {% trans "Add an email address to create a user account." %}
|
|
</div>
|
|
{% endif %}
|
|
{% endif %}
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Status -->
|
|
<div class="card mb-4">
|
|
<div class="card-header">
|
|
<h5 class="card-title mb-0">
|
|
<i class="fas fa-info-circle"></i> {% trans "Status" %}
|
|
</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="mb-3">
|
|
<label class="text-muted small">{% trans "Staff Status" %}</label>
|
|
<div>
|
|
{% if staff.status == 'active' %}
|
|
<span class="badge bg-success fs-6">{% trans "Active" %}</span>
|
|
{% else %}
|
|
<span class="badge bg-secondary fs-6">{% trans "Inactive" %}</span>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="text-muted small">{% trans "Created" %}</label>
|
|
<div>{{ staff.created_at|date:"Y-m-d H:i" }}</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="text-muted small">{% trans "Last Updated" %}</label>
|
|
<div>{{ staff.updated_at|date:"Y-m-d H:i" }}</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Create User Modal -->
|
|
<div class="modal" id="createUserModal" tabindex="-1">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">{% trans "Create User Account" %}</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<p>{% trans "Are you sure you want to create a user account for" %} <strong>{{ staff.get_full_name }}</strong>?</p>
|
|
<p class="text-muted small">{% trans "A username will be generated automatically and credentials will be emailed to" %} <strong>{{ staff.email }}</strong>.</p>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">{% trans "Cancel" %}</button>
|
|
<button type="button" class="btn btn-primary" onclick="confirmCreateUser()">{% trans "Create Account" %}</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Send Invitation Modal -->
|
|
<div class="modal" id="sendInvitationModal" tabindex="-1">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">{% trans "Send Invitation Email" %}</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<p>{% trans "Are you sure you want to send a new invitation email to" %} <strong>{{ staff.get_full_name }}</strong>?</p>
|
|
<p class="text-muted small">{% trans "A new password will be generated and sent to" %} <strong>{{ staff.email }}</strong>.</p>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">{% trans "Cancel" %}</button>
|
|
<button type="button" class="btn btn-primary" onclick="confirmSendInvitation()">{% trans "Send Email" %}</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Unlink User Modal -->
|
|
<div class="modal" id="unlinkUserModal" tabindex="-1">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">{% trans "Unlink User Account" %}</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<p>{% trans "Are you sure you want to unlink the user account from" %} <strong>{{ staff.get_full_name }}</strong>?</p>
|
|
<p class="text-warning small">{% trans "This will remove login access for this staff member. The user account will still exist but will no longer be linked to this staff profile." %}</p>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">{% trans "Cancel" %}</button>
|
|
<button type="button" class="btn btn-danger" onclick="confirmUnlinkUser()">{% trans "Unlink Account" %}</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{% endblock %}
|
|
|
|
{% block extra_js %}
|
|
<script>
|
|
function createUserAccount() {
|
|
new bootstrap.Modal(document.getElementById('createUserModal')).show();
|
|
}
|
|
|
|
function confirmCreateUser() {
|
|
const btn = event.target;
|
|
btn.disabled = true;
|
|
btn.innerHTML = '<i class="fas fa-spinner fa-spin"></i> Creating...';
|
|
|
|
fetch(`/api/organizations/staff/{{ staff.id }}/create_user_account/`, {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
'X-CSRFToken': document.querySelector('[name=csrfmiddlewaretoken]').value
|
|
},
|
|
body: JSON.stringify({})
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
bootstrap.Modal.getInstance(document.getElementById('createUserModal')).hide();
|
|
if (data.message) {
|
|
alert(data.message);
|
|
}
|
|
location.reload();
|
|
})
|
|
.catch(error => {
|
|
alert('Error: ' + error.message);
|
|
btn.disabled = false;
|
|
btn.innerHTML = 'Create Account';
|
|
});
|
|
}
|
|
|
|
function sendInvitation() {
|
|
new bootstrap.Modal(document.getElementById('sendInvitationModal')).show();
|
|
}
|
|
|
|
function confirmSendInvitation() {
|
|
const btn = event.target;
|
|
btn.disabled = true;
|
|
btn.innerHTML = '<i class="fas fa-spinner fa-spin"></i> Sending...';
|
|
|
|
fetch(`/api/organizations/staff/{{ staff.id }}/send_invitation/`, {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
'X-CSRFToken': document.querySelector('[name=csrfmiddlewaretoken]').value
|
|
},
|
|
body: JSON.stringify({})
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
bootstrap.Modal.getInstance(document.getElementById('sendInvitationModal')).hide();
|
|
if (data.message) {
|
|
alert(data.message);
|
|
}
|
|
location.reload();
|
|
})
|
|
.catch(error => {
|
|
alert('Error: ' + error.message);
|
|
btn.disabled = false;
|
|
btn.innerHTML = 'Send Email';
|
|
});
|
|
}
|
|
|
|
function unlinkUserAccount() {
|
|
new bootstrap.Modal(document.getElementById('unlinkUserModal')).show();
|
|
}
|
|
|
|
function confirmUnlinkUser() {
|
|
const btn = event.target;
|
|
btn.disabled = true;
|
|
btn.innerHTML = '<i class="fas fa-spinner fa-spin"></i> Unlinking...';
|
|
|
|
fetch(`/api/organizations/staff/{{ staff.id }}/unlink_user/`, {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
'X-CSRFToken': document.querySelector('[name=csrfmiddlewaretoken]').value
|
|
},
|
|
body: JSON.stringify({})
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
bootstrap.Modal.getInstance(document.getElementById('unlinkUserModal')).hide();
|
|
if (data.message) {
|
|
alert(data.message);
|
|
}
|
|
location.reload();
|
|
})
|
|
.catch(error => {
|
|
alert('Error: ' + error.message);
|
|
btn.disabled = false;
|
|
btn.innerHTML = 'Unlink Account';
|
|
});
|
|
}
|
|
</script>
|
|
{% endblock %}
|