710 lines
44 KiB
HTML
710 lines
44 KiB
HTML
{% load i18n %}
|
|
{% load hospital_filters %}
|
|
{% load static %}
|
|
|
|
<style>
|
|
.sidebar-icon-only {
|
|
width: 5rem;
|
|
transition: width 0.3s ease;
|
|
}
|
|
.sidebar-icon-only:hover {
|
|
width: 16rem;
|
|
}
|
|
.sidebar-icon-only .sidebar-text {
|
|
opacity: 0;
|
|
visibility: hidden;
|
|
width: 0;
|
|
overflow: hidden;
|
|
transition: opacity 0.2s ease;
|
|
white-space: nowrap;
|
|
}
|
|
.sidebar-icon-only:hover .sidebar-text {
|
|
opacity: 1;
|
|
visibility: visible;
|
|
width: auto;
|
|
}
|
|
.sidebar-icon-only .sidebar-logo-text {
|
|
opacity: 0;
|
|
width: 0;
|
|
overflow: hidden;
|
|
transition: opacity 0.2s ease;
|
|
}
|
|
.sidebar-icon-only:hover .sidebar-logo-text {
|
|
opacity: 1;
|
|
width: auto;
|
|
}
|
|
.sidebar-icon-only .submenu {
|
|
display: none;
|
|
}
|
|
.sidebar-icon-only:hover .submenu {
|
|
display: block;
|
|
}
|
|
.nav-item-active {
|
|
background-color: rgba(255,255,255,0.1);
|
|
border-left: 3px solid #fff;
|
|
}
|
|
.nav-item-sublink-active {
|
|
background-color: rgba(255,255,255,0.15);
|
|
}
|
|
.submenu {
|
|
max-height: 0;
|
|
overflow: hidden;
|
|
transition: max-height 0.3s ease;
|
|
}
|
|
.submenu.open {
|
|
max-height: 500px;
|
|
}
|
|
.submenu a {
|
|
padding-left: 3.5rem;
|
|
font-size: 0.75rem;
|
|
}
|
|
</style>
|
|
|
|
<aside id="sidebar" class="sidebar-icon-only bg-navy text-white flex flex-col shadow-2xl z-20 fixed left-0 top-0 h-screen overflow-y-auto overflow-x-hidden">
|
|
{% csrf_token %}
|
|
<script>window.sidebarCsrfToken = document.querySelector('[name=csrfmiddlewaretoken]')?.value;</script>
|
|
<!-- Brand -->
|
|
<div class="p-4 flex flex-col items-center border-b border-white/10">
|
|
<div class="sidebar-logo-text rounded-lg overflow-hidden mb-3" style="width: 200px; height: 100px;">
|
|
<img src="{% static 'img/logo.png' %}" alt="Al Hammadi Hospital" class="w-full h-full object-contain">
|
|
</div>
|
|
{% comment %} <div class="sidebar-logo-text overflow-hidden text-center">
|
|
<h1 class="text-lg font-black tracking-tighter whitespace-nowrap">PX360</h1>
|
|
<p class="text-[8px] font-bold text-blue-200 tracking-widest uppercase whitespace-nowrap">Analytics Platform</p>
|
|
</div> {% endcomment %}
|
|
</div>
|
|
|
|
<!-- Navigation -->
|
|
<nav class="flex-1 px-2 py-4 space-y-1">
|
|
<!-- Dashboard -->
|
|
<a href="{% url 'analytics:command_center' %}"
|
|
class="flex items-center gap-3 p-3 rounded-lg transition {% if request.resolver_match.url_name == 'command_center' %}nav-item-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="layout-dashboard" class="w-5 h-5 flex-shrink-0"></i>
|
|
<span class="sidebar-text text-sm font-semibold whitespace-nowrap">{% trans "Dashboard" %}</span>
|
|
</a>
|
|
|
|
<!-- Admin Evaluation (Admin only - NOT for Source Users) -->
|
|
{% if user.is_px_admin or user.is_hospital_admin %}
|
|
{% if not user.source_user_profile %}
|
|
<a href="{% url 'dashboard:admin_evaluation' %}"
|
|
class="flex items-center gap-3 p-3 rounded-lg transition {% if 'admin-evaluation' in request.path %}nav-item-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="shield-check" class="w-5 h-5 flex-shrink-0"></i>
|
|
<span class="sidebar-text text-sm font-semibold whitespace-nowrap">{% trans "Admin Evaluation" %}</span>
|
|
</a>
|
|
{% endif %}
|
|
{% endif %}
|
|
|
|
<!-- Source User Dashboard (Source Users only) -->
|
|
{% if user.source_user_profile %}
|
|
<a href="{% url 'px_sources:source_user_dashboard' %}"
|
|
class="flex items-center gap-3 p-3 rounded-lg transition {% if 'source_user_dashboard' in request.resolver_match.url_name %}nav-item-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="radio" class="w-5 h-5 flex-shrink-0"></i>
|
|
<span class="sidebar-text text-sm font-semibold whitespace-nowrap">{% trans "My Source Dashboard" %}</span>
|
|
</a>
|
|
{% endif %}
|
|
|
|
<!-- Complaints -->
|
|
<a href="{% url 'complaints:complaint_list' %}"
|
|
class="flex items-center gap-3 p-3 rounded-lg transition {% if 'complaints' in request.path %}nav-item-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="file-text" class="w-5 h-5 flex-shrink-0"></i>
|
|
<span class="sidebar-text text-sm font-semibold whitespace-nowrap">{% trans "Complaints" %}</span>
|
|
{% if complaint_count|default:0 > 0 %}
|
|
<span class="sidebar-text ml-auto bg-white/20 text-white text-xs px-1.5 py-0.5 rounded-full min-w-[1.25rem] text-center">{{ complaint_count }}</span>
|
|
{% endif %}
|
|
</a>
|
|
|
|
<!-- QI Projects - Hidden for Source Users -->
|
|
{% if not user.source_user_profile %}
|
|
<div class="qi-nav-container">
|
|
<button onclick="toggleQIMenu(event)"
|
|
class="w-full flex items-center gap-3 p-3 rounded-lg transition {% if 'projects' in request.path %}nav-item-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="target" class="w-5 h-5 flex-shrink-0"></i>
|
|
<span class="sidebar-text text-sm font-semibold whitespace-nowrap flex-1 text-left">{% trans "QI Projects" %}</span>
|
|
<i data-lucide="chevron-down" class="sidebar-text w-4 h-4 flex-shrink-0 transform transition-transform duration-200 {% if 'projects' in request.path %}rotate-180{% endif %}" id="qi-chevron"></i>
|
|
</button>
|
|
<div class="submenu {% if 'projects' in request.path %}open{% endif %} space-y-1 mt-1" id="qi-submenu">
|
|
<a href="{% url 'projects:project_list' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if request.resolver_match.url_name == 'project_list' %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="list" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "All Projects" %}</span>
|
|
</a>
|
|
{% if user.is_px_admin or user.is_hospital_admin or user.is_department_manager %}
|
|
<a href="{% url 'projects:project_create' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if 'create' in request.path and 'projects' in request.path %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="plus-circle" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Create Project" %}</span>
|
|
</a>
|
|
{% endif %}
|
|
{% if user.is_px_admin or user.is_hospital_admin %}
|
|
<a href="{% url 'projects:template_list' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if 'template' in request.path %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="copy" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Templates" %}</span>
|
|
</a>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<!-- Feedback -->
|
|
{% comment %} <a href="{% url 'feedback:feedback_list' %}"
|
|
class="flex items-center gap-3 p-3 rounded-lg transition {% if 'feedback' in request.path %}nav-item-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="message-square-heart" class="w-5 h-5 flex-shrink-0"></i>
|
|
<span class="sidebar-text text-sm font-semibold whitespace-nowrap">{% trans "Feedback" %}</span>
|
|
</a>
|
|
|
|
<!-- Appreciation -->
|
|
<a href="{% url 'appreciation:appreciation_list' %}"
|
|
class="flex items-center gap-3 p-3 rounded-lg transition {% if 'appreciation' in request.path %}nav-item-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="heart" class="w-5 h-5 flex-shrink-0"></i>
|
|
<span class="sidebar-text text-sm font-semibold whitespace-nowrap">{% trans "Appreciation" %}</span>
|
|
</a> {% endcomment %}
|
|
|
|
<!-- Surveys (with submenu) - Hidden for Source Users -->
|
|
{% if not user.source_user_profile %}
|
|
{% url 'surveys:instance_list' as survey_instances_url %}
|
|
{% url 'surveys:template_list' as survey_templates_url %}
|
|
{% url 'surveys:template_create' as survey_create_url %}
|
|
{% url 'surveys:manual_send' as survey_send_url %}
|
|
{% url 'surveys:analytics_reports' as survey_reports_url %}
|
|
{% url 'integrations:survey-mapping-settings' as survey_mapping_url %}
|
|
<div class="survey-nav-container">
|
|
<button onclick="toggleSurveyMenu(event)"
|
|
class="w-full flex items-center gap-3 p-3 rounded-lg transition {% if 'surveys' in request.path or 'survey-mapping' in request.path %}nav-item-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="clipboard-list" class="w-5 h-5 flex-shrink-0"></i>
|
|
<span class="sidebar-text text-sm font-semibold whitespace-nowrap flex-1 text-left">{% trans "Surveys" %}</span>
|
|
<i data-lucide="chevron-down" class="sidebar-text w-4 h-4 flex-shrink-0 transform transition-transform duration-200 {% if 'surveys' in request.path or 'survey-mapping' in request.path %}rotate-180{% endif %}" id="survey-chevron"></i>
|
|
</button>
|
|
<div class="submenu {% if 'surveys' in request.path or 'survey-mapping' in request.path %}open{% endif %} space-y-1 mt-1" id="survey-submenu">
|
|
<a href="{{ survey_instances_url }}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if 'surveys' in request.path and 'templates' not in request.path and 'send' not in request.path and 'reports' not in request.path %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="list" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Survey List" %}</span>
|
|
</a>
|
|
<a href="{{ survey_templates_url }}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if 'templates' in request.path and 'create' not in request.path %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="files" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Templates" %}</span>
|
|
</a>
|
|
<a href="{{ survey_create_url }}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if 'templates/create' in request.path %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="plus-circle" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Create Survey" %}</span>
|
|
</a>
|
|
<a href="{{ survey_send_url }}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if '/send' in request.path %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="send" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Manual Send" %}</span>
|
|
</a>
|
|
<a href="{% url 'surveys:his_patient_import' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if 'his-import' in request.path %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="upload" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "HIS Import" %}</span>
|
|
</a>
|
|
{% comment %} <a href="{% url 'surveys:bulk_job_list' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if 'bulk-jobs' in request.path %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="layers" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Bulk Jobs" %}</span>
|
|
</a> {% endcomment %}
|
|
{% comment %} <a href="{{ survey_reports_url }}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if '/reports' in request.path %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="bar-chart-2" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Reports" %}</span>
|
|
</a> {% endcomment %}
|
|
<a href="{{ survey_mapping_url }}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if 'survey-mapping' in request.path %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="link" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Mapping" %}</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<!-- Staff (with submenu) - Hidden for Source Users -->
|
|
{% if not user.source_user_profile %}
|
|
<div class="staff-nav-container">
|
|
<button onclick="toggleStaffMenu(event)"
|
|
class="w-full flex items-center gap-3 p-3 rounded-lg transition {% if 'staff' in request.path %}nav-item-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="users" class="w-5 h-5 flex-shrink-0"></i>
|
|
<span class="sidebar-text text-sm font-semibold whitespace-nowrap flex-1 text-left">{% trans "Staff" %}</span>
|
|
<i data-lucide="chevron-down" class="sidebar-text w-4 h-4 flex-shrink-0 transform transition-transform duration-200 {% if 'staff' in request.path %}rotate-180{% endif %}" id="staff-chevron"></i>
|
|
</button>
|
|
<div class="submenu {% if 'staff' in request.path %}open{% endif %} space-y-1 mt-1" id="staff-submenu">
|
|
<a href="{% url 'organizations:staff_list' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if request.resolver_match.url_name == 'staff_list' %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="list" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "All Staff" %}</span>
|
|
</a>
|
|
<a href="{% url 'organizations:staff_hierarchy_d3' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if 'hierarchy' in request.path %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="git-branch" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Hierarchy" %}</span>
|
|
</a>
|
|
{% comment %} <a href="{% url 'organizations:section_list' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if 'section' in request.path %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="layers" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Sections" %}</span>
|
|
</a> {% endcomment %}
|
|
{% comment %} <a href="{% url 'organizations:subsection_list' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if 'subsection' in request.path %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="layout-grid" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Subsections" %}</span>
|
|
</a> {% endcomment %}
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<!-- Patients -->
|
|
{% comment %} <a href="{% url 'organizations:patient_list' %}"
|
|
class="flex items-center gap-3 p-3 rounded-lg transition {% if 'patients' in request.path %}nav-item-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="heart-pulse" class="w-5 h-5 flex-shrink-0"></i>
|
|
<span class="sidebar-text text-sm font-semibold whitespace-nowrap">{% trans "Patients" %}</span>
|
|
</a> {% endcomment %}
|
|
|
|
<!-- Physicians (with submenu) - Hidden for Source Users -->
|
|
{% if not user.source_user_profile %}
|
|
<div class="physicians-nav-container">
|
|
<button onclick="togglePhysiciansMenu(event)"
|
|
class="w-full flex items-center gap-3 p-3 rounded-lg transition {% if 'physicians' in request.path %}nav-item-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="stethoscope" class="w-5 h-5 flex-shrink-0"></i>
|
|
<span class="sidebar-text text-sm font-semibold whitespace-nowrap flex-1 text-left">{% trans "Physicians" %}</span>
|
|
<i data-lucide="chevron-down" class="sidebar-text w-4 h-4 flex-shrink-0 transform transition-transform duration-200 {% if 'physicians' in request.path %}rotate-180{% endif %}" id="physicians-chevron"></i>
|
|
</button>
|
|
<div class="submenu {% if 'physicians' in request.path %}open{% endif %} space-y-1 mt-1" id="physicians-submenu">
|
|
<a href="{% url 'physicians:physician_ratings_dashboard' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if request.resolver_match.url_name == 'physician_ratings_dashboard' %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="layout-dashboard" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Dashboard" %}</span>
|
|
</a>
|
|
<a href="{% url 'physicians:physician_list' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if request.resolver_match.url_name == 'physician_list' %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="users" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "All Physicians" %}</span>
|
|
</a>
|
|
<a href="{% url 'physicians:leaderboard' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if 'leaderboard' in request.path %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="trophy" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Leaderboard" %}</span>
|
|
</a>
|
|
{% if user.is_px_admin or user.is_hospital_admin %}
|
|
<a href="{% url 'physicians:doctor_rating_import' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if 'import' in request.path %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="upload" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Import Ratings" %}</span>
|
|
</a>
|
|
<a href="{% url 'physicians:individual_ratings_list' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if 'individual' in request.path %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="star" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Individual Ratings" %}</span>
|
|
</a>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<!-- Analytics (with submenu) - Hidden for Source Users -->
|
|
{% if not user.source_user_profile %}
|
|
<div class="analytics-nav-container">
|
|
<button onclick="toggleAnalyticsMenu(event)"
|
|
class="w-full flex items-center gap-3 p-3 rounded-lg transition {% if 'analytics' in request.path and 'command_center' not in request.resolver_match.url_name %}nav-item-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="bar-chart-3" class="w-5 h-5 flex-shrink-0"></i>
|
|
<span class="sidebar-text text-sm font-semibold whitespace-nowrap flex-1 text-left">{% trans "Analytics" %}</span>
|
|
<i data-lucide="chevron-down" class="sidebar-text w-4 h-4 flex-shrink-0 transform transition-transform duration-200 {% if 'analytics' in request.path and 'command_center' not in request.resolver_match.url_name %}rotate-180{% endif %}" id="analytics-chevron"></i>
|
|
</button>
|
|
<div class="submenu {% if 'analytics' in request.path and 'command_center' not in request.resolver_match.url_name %}open{% endif %} space-y-1 mt-1" id="analytics-submenu">
|
|
<a href="{% url 'analytics:dashboard' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if 'analytics' in request.path and 'kpi' not in request.path %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="layout-dashboard" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Dashboard" %}</span>
|
|
</a>
|
|
<a href="{% url 'analytics:kpi_report_list' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if 'kpi-reports' in request.path %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="file-bar-chart" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "KPI Reports" %}</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<!-- PX Sources (with submenu) - Admin view only -->
|
|
{% if not user.source_user_profile %}
|
|
<div class="px-sources-nav-container">
|
|
<button onclick="togglePXSourcesMenu(event)"
|
|
class="w-full flex items-center gap-3 p-3 rounded-lg transition {% if 'px-sources' in request.path %}nav-item-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="radio" class="w-5 h-5 flex-shrink-0"></i>
|
|
<span class="sidebar-text text-sm font-semibold whitespace-nowrap flex-1 text-left">{% trans "PX Sources" %}</span>
|
|
<i data-lucide="chevron-down" class="sidebar-text w-4 h-4 flex-shrink-0 transform transition-transform duration-200 {% if 'px-sources' in request.path %}rotate-180{% endif %}" id="px-sources-chevron"></i>
|
|
</button>
|
|
<div class="submenu {% if 'px-sources' in request.path %}open{% endif %} space-y-1 mt-1" id="px-sources-submenu">
|
|
<a href="{% url 'px_sources:source_list' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if request.resolver_match.url_name == 'source_list' %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="list" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "All Sources" %}</span>
|
|
</a>
|
|
<a href="{% url 'px_sources:source_user_dashboard' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if 'dashboard' in request.path and 'px-sources' in request.path %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="layout-dashboard" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Dashboard" %}</span>
|
|
</a>
|
|
<a href="{% url 'px_sources:source_user_complaint_list' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if 'complaints' in request.path and 'px-sources' in request.path %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="file-text" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Source Complaints" %}</span>
|
|
</a>
|
|
<a href="{% url 'px_sources:source_user_inquiry_list' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if 'inquiries' in request.path and 'px-sources' in request.path %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="help-circle" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Source Inquiries" %}</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<!-- Reports (Admin only - NOT for Source Users) -->
|
|
{% if user.is_px_admin or user.is_hospital_admin %}
|
|
{% if not user.source_user_profile %}
|
|
<div class="reports-nav-container">
|
|
<button onclick="toggleReportsMenu(event)"
|
|
class="w-full flex items-center gap-3 p-3 rounded-lg transition {% if '/reports/' in request.path %}nav-item-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="file-bar-chart" class="w-5 h-5 flex-shrink-0"></i>
|
|
<span class="sidebar-text text-sm font-semibold whitespace-nowrap flex-1 text-left">{% trans "Reports" %}</span>
|
|
<i data-lucide="chevron-down" class="sidebar-text w-4 h-4 flex-shrink-0 transform transition-transform duration-200 {% if '/reports/' in request.path %}rotate-180{% endif %}" id="reports-chevron"></i>
|
|
</button>
|
|
<div class="submenu {% if '/reports/' in request.path %}open{% endif %} space-y-1 mt-1" id="reports-submenu">
|
|
<a href="{% url 'reports:builder' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if 'builder' in request.path %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="plus-circle" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Create Report" %}</span>
|
|
</a>
|
|
<a href="{% url 'reports:saved_reports' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if 'saved' in request.path %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="folder-open" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Saved Reports" %}</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
{% endif %}
|
|
|
|
<!-- Send SMS (Admin only - NOT for Source Users) -->
|
|
{% if user.is_px_admin or user.is_hospital_admin %}
|
|
{% if not user.source_user_profile %}
|
|
<a href="{% url 'notifications:send_sms_direct' %}"
|
|
class="flex items-center gap-3 p-3 rounded-lg transition {% if 'send-sms' in request.path %}nav-item-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="message-square" class="w-5 h-5 flex-shrink-0"></i>
|
|
<span class="sidebar-text text-sm font-semibold whitespace-nowrap">{% trans "Send SMS" %}</span>
|
|
</a>
|
|
{% endif %}
|
|
{% endif %}
|
|
|
|
<!-- Settings (Admin only - NOT for Source Users) -->
|
|
{% if user.is_px_admin or user.is_hospital_admin %}
|
|
{% if not user.source_user_profile %}
|
|
<a href="{% url 'config:dashboard' %}"
|
|
class="flex items-center gap-3 p-3 rounded-lg transition {% if 'config' in request.path %}nav-item-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="settings" class="w-5 h-5 flex-shrink-0"></i>
|
|
<span class="sidebar-text text-sm font-semibold whitespace-nowrap">{% trans "Settings" %}</span>
|
|
</a>
|
|
{% endif %}
|
|
{% endif %}
|
|
|
|
<!-- Acknowledgements (All Employees - NOT for Source Users) -->
|
|
{% if user.is_authenticated and not user.source_user_profile %}
|
|
<a href="{% url 'accounts:simple_acknowledgements:employee_list' %}"
|
|
class="flex items-center gap-3 p-3 rounded-lg transition {% if 'simple-acknowledgements' in request.path %}nav-item-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="clipboard-signature" class="w-5 h-5 flex-shrink-0"></i>
|
|
<span class="sidebar-text text-sm font-semibold whitespace-nowrap flex-1">{% trans "Acknowledgements" %}</span>
|
|
{% if pending_acknowledgements_count > 0 %}
|
|
<span class="sidebar-text bg-red-500 text-white text-xs font-bold px-2 py-0.5 rounded-full min-w-[1.5rem] text-center">
|
|
{{ pending_acknowledgements_count }}
|
|
</span>
|
|
{% endif %}
|
|
</a>
|
|
{% endif %}
|
|
|
|
<!-- References (All Users - NOT for Source Users) -->
|
|
{% if not user.source_user_profile %}
|
|
<div class="references-nav-container">
|
|
<button onclick="toggleReferencesMenu(event)"
|
|
class="w-full flex items-center gap-3 p-3 rounded-lg transition {% if 'references' in request.path %}nav-item-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="folder-open" class="w-5 h-5 flex-shrink-0"></i>
|
|
<span class="sidebar-text text-sm font-semibold whitespace-nowrap flex-1 text-left">{% trans "References" %}</span>
|
|
<i data-lucide="chevron-down" class="sidebar-text w-4 h-4 flex-shrink-0 transform transition-transform duration-200 {% if 'references' in request.path %}rotate-180{% endif %}" id="references-chevron"></i>
|
|
</button>
|
|
<div class="submenu {% if 'references' in request.path %}open{% endif %} space-y-1 mt-1" id="references-submenu">
|
|
<a href="{% url 'references:dashboard' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if request.resolver_match.url_name == 'dashboard' %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="layout-dashboard" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Dashboard" %}</span>
|
|
</a>
|
|
<a href="{% url 'references:search' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if request.resolver_match.url_name == 'search' %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="search" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Search Documents" %}</span>
|
|
</a>
|
|
<a href="{% url 'references:document_create' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if 'document_create' in request.path %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="upload" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Upload Document" %}</span>
|
|
</a>
|
|
<a href="{% url 'references:folder_create' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if 'folder_create' in request.path %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="folder-plus" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "New Folder" %}</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<!-- Standards (Admin only - NOT for Source Users) -->
|
|
{% if user.is_px_admin or user.is_hospital_admin %}
|
|
{% if not user.source_user_profile %}
|
|
<div class="standards-nav-container">
|
|
<button onclick="toggleStandardsMenu(event)"
|
|
class="w-full flex items-center gap-3 p-3 rounded-lg transition {% if 'standards' in request.path %}nav-item-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="clipboard-check" class="w-5 h-5 flex-shrink-0"></i>
|
|
<span class="sidebar-text text-sm font-semibold whitespace-nowrap flex-1 text-left">{% trans "Standards" %}</span>
|
|
<i data-lucide="chevron-down" class="sidebar-text w-4 h-4 flex-shrink-0 transform transition-transform duration-200 {% if 'standards' in request.path %}rotate-180{% endif %}" id="standards-chevron"></i>
|
|
</button>
|
|
<div class="submenu {% if 'standards' in request.path %}open{% endif %} space-y-1 mt-1" id="standards-submenu">
|
|
<a href="{% url 'standards:dashboard' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if request.resolver_match.url_name == 'dashboard' and 'standards' in request.path %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="layout-dashboard" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Dashboard" %}</span>
|
|
</a>
|
|
<a href="{% url 'standards:search' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if request.resolver_match.url_name == 'search' %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="search" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Search Standards" %}</span>
|
|
</a>
|
|
<a href="{% url 'standards:source_list' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if 'sources' in request.path and 'standards' in request.path %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="folder" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Sources" %}</span>
|
|
</a>
|
|
<a href="{% url 'standards:category_list' %}"
|
|
class="flex items-center gap-2 p-2 rounded-lg transition {% if 'categories' in request.path and 'standards' in request.path %}nav-item-sublink-active{% else %}opacity-70 hover:opacity-100 hover:bg-white/10{% endif %}">
|
|
<i data-lucide="tags" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text whitespace-nowrap">{% trans "Categories" %}</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
{% endif %}
|
|
</nav>
|
|
|
|
<!-- Hospital Switcher (PX Admin only) -->
|
|
{% if is_px_admin and hospitals_list %}
|
|
<div class="px-3 py-2 border-t border-white/10">
|
|
<div class="mb-2 px-2">
|
|
<p class="text-[10px] font-semibold text-white/50 uppercase tracking-wider">{% trans "Hospital" %}</p>
|
|
</div>
|
|
<div class="relative">
|
|
<select
|
|
id="hospitalSwitcher"
|
|
onchange="switchHospital(this.value)"
|
|
class="w-full bg-white/10 border border-white/20 rounded-lg py-2 px-3 pr-8 text-xs font-semibold text-white appearance-none cursor-pointer hover:bg-white/15 transition focus:outline-none focus:ring-2 focus:ring-blue/50"
|
|
>
|
|
{% for hospital in hospitals_list %}
|
|
<option
|
|
value="{{ hospital.id }}"
|
|
{% if current_hospital and current_hospital.id == hospital.id %}selected{% endif %}
|
|
>
|
|
{{ hospital.name }}
|
|
</option>
|
|
{% endfor %}
|
|
</select>
|
|
<div class="absolute right-2 top-1/2 -translate-y-1/2 pointer-events-none">
|
|
<i data-lucide="chevron-down" class="w-3.5 h-3.5 text-white/50"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<!-- User Profile & Logout -->
|
|
<div class="p-3 border-t border-white/10">
|
|
<div class="flex items-center gap-3 p-2 rounded-lg hover:bg-white/10 transition cursor-pointer" onclick="toggleUserMenu()">
|
|
<div class="w-8 h-8 rounded-full bg-blue border-2 border-white/20 flex items-center justify-center font-bold text-xs flex-shrink-0">
|
|
{{ user.first_name|first|default:"U" }}{{ user.last_name|first|default:"" }}
|
|
</div>
|
|
<div class="sidebar-text flex-1 overflow-hidden min-w-0">
|
|
<p class="text-xs font-bold truncate">{{ user.get_full_name|default:user.username }}</p>
|
|
<p class="text-[10px] text-white/50 truncate">{{ user.get_role_display|default:"User" }}</p>
|
|
</div>
|
|
<i data-lucide="log-out" class="w-4 h-4 text-white/40 hover:text-white cursor-pointer flex-shrink-0 sidebar-text" onclick="event.stopPropagation(); logout()"></i>
|
|
</div>
|
|
|
|
<!-- User Dropdown Menu (hidden by default) -->
|
|
<div id="userMenu" class="hidden mt-2 space-y-1">
|
|
<a href="{% url 'accounts:settings' %}" class="flex items-center gap-3 p-2 rounded-lg opacity-70 hover:opacity-100 hover:bg-white/10 transition">
|
|
<i data-lucide="user" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text text-xs font-semibold whitespace-nowrap">{% trans "Profile" %}</span>
|
|
</a>
|
|
<form method="post" action="{% url 'accounts:logout' %}" class="m-0">
|
|
{% csrf_token %}
|
|
<button type="submit" class="w-full flex items-center gap-3 p-2 rounded-lg opacity-70 hover:opacity-100 hover:bg-white/10 transition text-left">
|
|
<i data-lucide="log-out" class="w-4 h-4 flex-shrink-0"></i>
|
|
<span class="sidebar-text text-xs font-semibold whitespace-nowrap">{% trans "Logout" %}</span>
|
|
</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</aside>
|
|
|
|
<script>
|
|
function toggleUserMenu() {
|
|
const menu = document.getElementById('userMenu');
|
|
menu.classList.toggle('hidden');
|
|
}
|
|
|
|
function switchHospital(hospitalId) {
|
|
if (!hospitalId) return;
|
|
|
|
// Show loading state
|
|
const select = document.getElementById('hospitalSwitcher');
|
|
select.disabled = true;
|
|
|
|
// Get CSRF token from global variable (not from cookie due to httpOnly)
|
|
const csrfToken = window.sidebarCsrfToken || getCookie('csrftoken');
|
|
|
|
// Create form data
|
|
const formData = new FormData();
|
|
formData.append('hospital_id', hospitalId);
|
|
formData.append('csrfmiddlewaretoken', csrfToken);
|
|
|
|
// Make AJAX request
|
|
fetch('{% url "core:switch_hospital" %}', {
|
|
method: 'POST',
|
|
body: formData,
|
|
headers: {
|
|
'X-Requested-With': 'XMLHttpRequest'
|
|
}
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
if (data.success) {
|
|
// Reload page to apply new hospital context
|
|
window.location.reload();
|
|
} else {
|
|
alert('{% trans "Failed to switch hospital: " %}' + (data.error || '{% trans "Unknown error" %}'));
|
|
select.disabled = false;
|
|
}
|
|
})
|
|
.catch(error => {
|
|
console.error('Error switching hospital:', error);
|
|
alert('{% trans "An error occurred while switching hospitals" %}');
|
|
select.disabled = false;
|
|
});
|
|
}
|
|
|
|
function getCookie(name) {
|
|
let cookieValue = null;
|
|
if (document.cookie && document.cookie !== '') {
|
|
const cookies = document.cookie.split(';');
|
|
for (let i = 0; i < cookies.length; i++) {
|
|
const cookie = cookies[i].trim();
|
|
if (cookie.substring(0, name.length + 1) === (name + '=')) {
|
|
cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
|
|
break;
|
|
}
|
|
}
|
|
}
|
|
return cookieValue;
|
|
}
|
|
|
|
function toggleSurveyMenu(event) {
|
|
event.preventDefault();
|
|
const submenu = document.getElementById('survey-submenu');
|
|
const chevron = document.getElementById('survey-chevron');
|
|
submenu.classList.toggle('open');
|
|
chevron.classList.toggle('rotate-180');
|
|
}
|
|
|
|
function toggleAnalyticsMenu(event) {
|
|
event.preventDefault();
|
|
const submenu = document.getElementById('analytics-submenu');
|
|
const chevron = document.getElementById('analytics-chevron');
|
|
submenu.classList.toggle('open');
|
|
chevron.classList.toggle('rotate-180');
|
|
}
|
|
|
|
function togglePhysiciansMenu(event) {
|
|
event.preventDefault();
|
|
const submenu = document.getElementById('physicians-submenu');
|
|
const chevron = document.getElementById('physicians-chevron');
|
|
submenu.classList.toggle('open');
|
|
chevron.classList.toggle('rotate-180');
|
|
}
|
|
|
|
function toggleStaffMenu(event) {
|
|
event.preventDefault();
|
|
const submenu = document.getElementById('staff-submenu');
|
|
const chevron = document.getElementById('staff-chevron');
|
|
submenu.classList.toggle('open');
|
|
chevron.classList.toggle('rotate-180');
|
|
}
|
|
|
|
function togglePXSourcesMenu(event) {
|
|
event.preventDefault();
|
|
const submenu = document.getElementById('px-sources-submenu');
|
|
const chevron = document.getElementById('px-sources-chevron');
|
|
submenu.classList.toggle('open');
|
|
chevron.classList.toggle('rotate-180');
|
|
}
|
|
|
|
function toggleAcknowledgementsMenu(event) {
|
|
event.preventDefault();
|
|
const submenu = document.getElementById('acknowledgements-submenu');
|
|
const chevron = document.getElementById('acknowledgements-chevron');
|
|
submenu.classList.toggle('open');
|
|
chevron.classList.toggle('rotate-180');
|
|
}
|
|
|
|
function toggleReportsMenu(event) {
|
|
event.preventDefault();
|
|
const submenu = document.getElementById('reports-submenu');
|
|
const chevron = document.getElementById('reports-chevron');
|
|
submenu.classList.toggle('open');
|
|
chevron.classList.toggle('rotate-180');
|
|
}
|
|
|
|
function toggleQIMenu(event) {
|
|
event.preventDefault();
|
|
const submenu = document.getElementById('qi-submenu');
|
|
const chevron = document.getElementById('qi-chevron');
|
|
submenu.classList.toggle('open');
|
|
chevron.classList.toggle('rotate-180');
|
|
}
|
|
|
|
function toggleReferencesMenu(event) {
|
|
event.preventDefault();
|
|
const submenu = document.getElementById('references-submenu');
|
|
const chevron = document.getElementById('references-chevron');
|
|
submenu.classList.toggle('open');
|
|
chevron.classList.toggle('rotate-180');
|
|
}
|
|
|
|
function toggleStandardsMenu(event) {
|
|
event.preventDefault();
|
|
const submenu = document.getElementById('standards-submenu');
|
|
const chevron = document.getElementById('standards-chevron');
|
|
submenu.classList.toggle('open');
|
|
chevron.classList.toggle('rotate-180');
|
|
}
|
|
|
|
function logout() {
|
|
if (confirm('{% trans "Are you sure you want to logout?" %}')) {
|
|
document.querySelector('form[action="{% url 'accounts:logout' %}"]').submit();
|
|
}
|
|
}
|
|
|
|
// Close user menu when clicking outside
|
|
document.addEventListener('click', function(e) {
|
|
const userMenu = document.getElementById('userMenu');
|
|
const userProfile = e.target.closest('.cursor-pointer');
|
|
if (userMenu && !userMenu.contains(e.target) && !userProfile) {
|
|
userMenu.classList.add('hidden');
|
|
}
|
|
});
|
|
</script>
|