agdar/core/templates/core/employee_detail.html
Marwan Alwali a788c086ae update
2025-11-02 18:05:50 +03:00

257 lines
12 KiB
HTML

{% extends "base.html" %}
{% load i18n static patient_tags %}
{% block title %}{{ employee.get_full_name }} - {% trans "Employee Details" %}{% endblock %}
{% block content %}
<div class="container-fluid">
<!-- Page Header -->
<div class="d-flex justify-content-between align-items-center mb-4">
<h1 class="h3 mb-0">
<i class="fa fa-user-tie me-2"></i>{{ employee.get_full_name }}
</h1>
<div class="btn-group">
<a href="{% url 'core:employee-update' employee.pk %}" class="btn btn-warning">
<i class="fa fa-edit me-1"></i>{% trans "Edit" %}
</a>
<a href="{% url 'core:employee-list' %}" class="btn btn-secondary">
<i class="fa fa-arrow-left me-1"></i>{% trans "Back to List" %}
</a>
</div>
</div>
<div class="row">
<!-- Left Column -->
<div class="col-md-4">
<!-- Employee Card -->
<div class="card mb-4 text-center">
<div class="card-body">
<div class="avatar-circle-large bg-primary text-white mx-auto mb-3">
{{ employee.user.first_name.0 }}{{ employee.user.last_name.0 }}
</div>
<h4 class="mb-1">{{ employee.get_full_name }}</h4>
<p class="text-muted mb-2">{{ employee.employee_id }}</p>
<span class="badge bg-{% if employee.role == 'ADMIN' %}danger{% elif employee.role == 'CLINICIAN' %}primary{% elif employee.role == 'THERAPIST' %}success{% elif employee.role == 'RECEPTION' %}info{% elif employee.role == 'BILLING' %}warning{% else %}secondary{% endif %} mb-3">
{{ employee.get_role_display }}
</span>
<div class="mt-3">
{% if employee.is_active %}
<span class="badge bg-success">
<i class="fa fa-check-circle me-1"></i>{% trans "Active" %}
</span>
{% else %}
<span class="badge bg-secondary">
<i class="fa fa-times-circle me-1"></i>{% trans "Inactive" %}
</span>
{% endif %}
</div>
</div>
</div>
<!-- Contact Information -->
<div class="card mb-4">
<div class="card-header">
<h5 class="card-title mb-0">{% trans "Contact Information" %}</h5>
</div>
<div class="card-body">
<dl class="row mb-0">
{% if employee.phone %}
<dt class="col-sm-4">{% trans "Phone" %}:</dt>
<dd class="col-sm-8">
<a href="tel:{{ employee.phone }}">{{ employee.phone }}</a>
</dd>
{% endif %}
{% if employee.email %}
<dt class="col-sm-4">{% trans "Email" %}:</dt>
<dd class="col-sm-8">
<a href="mailto:{{ employee.email }}">{{ employee.email }}</a>
</dd>
{% endif %}
{% if employee.address %}
<dt class="col-sm-4">{% trans "Address" %}:</dt>
<dd class="col-sm-8">{{ employee.address }}</dd>
{% endif %}
</dl>
</div>
</div>
<!-- Employment Details -->
<div class="card mb-4">
<div class="card-header">
<h5 class="card-title mb-0">{% trans "Employment Details" %}</h5>
</div>
<div class="card-body">
<dl class="row mb-0">
<dt class="col-sm-5">{% trans "Department" %}:</dt>
<dd class="col-sm-7">{{ employee.department.name }}</dd>
<dt class="col-sm-5">{% trans "Hire Date" %}:</dt>
<dd class="col-sm-7">{{ employee.hire_date|date:"Y-m-d" }}</dd>
{% if employee.specialization %}
<dt class="col-sm-5">{% trans "Specialization" %}:</dt>
<dd class="col-sm-7">{{ employee.specialization }}</dd>
{% endif %}
{% if employee.license_number %}
<dt class="col-sm-5">{% trans "License #" %}:</dt>
<dd class="col-sm-7">{{ employee.license_number }}</dd>
{% endif %}
</dl>
</div>
</div>
</div>
<!-- Right Column -->
<div class="col-md-8">
<!-- Schedule -->
<div class="card mb-4">
<div class="card-header d-flex justify-content-between align-items-center">
<h5 class="card-title mb-0">
<i class="fa fa-calendar-week me-2"></i>{% trans "Work Schedule" %}
</h5>
<a href="{% url 'hr:schedule-create' %}?employee={{ employee.pk }}" class="btn btn-sm btn-primary">
<i class="fa fa-plus me-1"></i>{% trans "Add Schedule" %}
</a>
</div>
<div class="card-body">
{% if employee.schedule_set.all %}
<div class="table-responsive">
<table class="table table-sm">
<thead>
<tr>
<th>{% trans "Day" %}</th>
<th>{% trans "Start Time" %}</th>
<th>{% trans "End Time" %}</th>
<th>{% trans "Hours" %}</th>
<th>{% trans "Status" %}</th>
</tr>
</thead>
<tbody>
{% for schedule in employee.schedule_set.all %}
<tr>
<td>{{ schedule.get_day_of_week_display }}</td>
<td>{{ schedule.start_time|time:"H:i" }}</td>
<td>{{ schedule.end_time|time:"H:i" }}</td>
<td>{{ schedule.hours_per_day }}h</td>
<td>
<span class="badge bg-{% if schedule.is_active %}success{% else %}secondary{% endif %}">
{% if schedule.is_active %}{% trans "Active" %}{% else %}{% trans "Inactive" %}{% endif %}
</span>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% else %}
<p class="text-muted text-center py-3 mb-0">{% trans "No schedule defined." %}</p>
{% endif %}
</div>
</div>
<!-- Recent Appointments -->
<div class="card mb-4">
<div class="card-header">
<h5 class="card-title mb-0">
<i class="fa fa-calendar-check me-2"></i>{% trans "Recent Appointments" %}
</h5>
</div>
<div class="card-body">
{% if employee.appointment_set.all %}
<div class="list-group list-group-flush">
{% for apt in employee.appointment_set.all|slice:":10" %}
<a href="{% url 'appointments:appointment-detail' apt.pk %}" class="list-group-item list-group-item-action">
<div class="d-flex justify-content-between align-items-start">
<div>
<h6 class="mb-1">{% patient_name apt.patient %}</h6>
<p class="mb-1 text-muted">
<small>
<i class="fa fa-calendar me-1"></i>{{ apt.start_time|date:"Y-m-d H:i" }}
<i class="fa fa-briefcase-medical ms-2 me-1"></i>{{ apt.service.name }}
</small>
</p>
</div>
<span class="badge bg-{% if apt.status == 'SCHEDULED' %}primary{% elif apt.status == 'CONFIRMED' %}success{% elif apt.status == 'CHECKED_IN' %}warning{% elif apt.status == 'COMPLETED' %}secondary{% else %}danger{% endif %}">
{{ apt.get_status_display }}
</span>
</div>
</a>
{% endfor %}
</div>
{% else %}
<p class="text-muted text-center py-3 mb-0">{% trans "No appointments found." %}</p>
{% endif %}
</div>
</div>
<!-- Recent Encounters -->
<div class="card mb-4">
<div class="card-header">
<h5 class="card-title mb-0">
<i class="fa fa-stethoscope me-2"></i>{% trans "Recent Encounters" %}
</h5>
</div>
<div class="card-body">
{% if employee.encounter_set.all %}
<div class="list-group list-group-flush">
{% for encounter in employee.encounter_set.all|slice:":10" %}
<a href="{% url 'clinic:encounter-detail' encounter.pk %}" class="list-group-item list-group-item-action">
<div class="d-flex justify-content-between align-items-start">
<div>
<h6 class="mb-1">{% patient_name encounter.patient %}</h6>
<p class="mb-1 text-muted">
<small>
<i class="fa fa-calendar me-1"></i>{{ encounter.encounter_date|date:"Y-m-d" }}
<i class="fa fa-briefcase-medical ms-2 me-1"></i>{{ encounter.service.name }}
</small>
</p>
</div>
<span class="badge bg-{% if encounter.status == 'COMPLETED' %}success{% elif encounter.status == 'IN_PROGRESS' %}warning{% else %}secondary{% endif %}">
{{ encounter.get_status_display }}
</span>
</div>
</a>
{% endfor %}
</div>
{% else %}
<p class="text-muted text-center py-3 mb-0">{% trans "No encounters found." %}</p>
{% endif %}
</div>
</div>
<!-- Notes -->
{% if employee.notes %}
<div class="card mb-4">
<div class="card-header">
<h5 class="card-title mb-0">{% trans "Notes" %}</h5>
</div>
<div class="card-body">
<p class="mb-0">{{ employee.notes }}</p>
</div>
</div>
{% endif %}
</div>
</div>
</div>
{% endblock %}
{% block css %}
<style>
.avatar-circle-large {
width: 120px;
height: 120px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 3rem;
font-weight: bold;
}
</style>
{% endblock %}