224 lines
12 KiB
HTML
224 lines
12 KiB
HTML
{% extends "layouts/base.html" %}
|
|
{% load i18n %}
|
|
{% load static %}
|
|
|
|
{% block title %}{% trans "System Configuration" %} - PX360{% endblock %}
|
|
|
|
{% block content %}
|
|
<!-- Header -->
|
|
<header class="mb-8">
|
|
<div class="flex justify-between items-start">
|
|
<div>
|
|
<h1 class="text-2xl font-bold text-navy">
|
|
<i data-lucide="settings" class="w-6 h-6 inline-block mr-2"></i>
|
|
{% trans "System Configuration" %}
|
|
</h1>
|
|
<p class="text-sm text-slate mt-1">{% trans "Manage system-wide settings and configurations" %}</p>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<!-- Complaints Management Section -->
|
|
<section class="mb-8">
|
|
<h2 class="text-lg font-bold text-navy mb-4 flex items-center gap-2">
|
|
<i data-lucide="message-square-warning" class="w-5 h-5 text-orange-500"></i>
|
|
{% trans "Complaints Management" %}
|
|
</h2>
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-6">
|
|
<!-- Complaint SLA -->
|
|
<div class="bg-white rounded-2xl shadow-sm border border-slate-100 p-6 text-center card-hover">
|
|
<div class="w-16 h-16 mx-auto mb-4 bg-blue-100 rounded-2xl flex items-center justify-center">
|
|
<i data-lucide="file-clock" class="w-8 h-8 text-blue-600"></i>
|
|
</div>
|
|
<h3 class="font-bold text-navy text-lg mb-2">{% trans "Complaint SLA" %}</h3>
|
|
<p class="text-sm text-slate mb-4">{% trans "Manage complaint SLA settings" %}</p>
|
|
<a href="{% url 'complaints:sla_management' %}" class="inline-flex items-center gap-2 bg-navy text-white px-5 py-2.5 rounded-xl text-sm font-bold shadow-lg shadow-navy/20 hover:bg-blue transition">
|
|
<i data-lucide="settings-2" class="w-4 h-4"></i>
|
|
{% trans "Configure SLA" %}
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Escalation Rules -->
|
|
<div class="bg-white rounded-2xl shadow-sm border border-slate-100 p-6 text-center card-hover">
|
|
<div class="w-16 h-16 mx-auto mb-4 bg-orange-100 rounded-2xl flex items-center justify-center">
|
|
<i data-lucide="trending-up" class="w-8 h-8 text-orange-600"></i>
|
|
</div>
|
|
<h3 class="font-bold text-navy text-lg mb-2">{% trans "Escalation Rules" %}</h3>
|
|
<p class="text-sm text-slate mb-4">{% trans "Configure automatic escalation when deadlines are exceeded" %}</p>
|
|
<a href="{% url 'complaints:escalation_rule_list' %}" class="inline-flex items-center gap-2 bg-navy text-white px-5 py-2.5 rounded-xl text-sm font-bold shadow-lg shadow-navy/20 hover:bg-blue transition">
|
|
<i data-lucide="settings-2" class="w-4 h-4"></i>
|
|
{% trans "Manage Rules" %}
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Complaint Thresholds -->
|
|
<div class="bg-white rounded-2xl shadow-sm border border-slate-100 p-6 text-center card-hover">
|
|
<div class="w-16 h-16 mx-auto mb-4 bg-purple-100 rounded-2xl flex items-center justify-center">
|
|
<i data-lucide="bar-chart" class="w-8 h-8 text-purple-600"></i>
|
|
</div>
|
|
<h3 class="font-bold text-navy text-lg mb-2">{% trans "Complaint Thresholds" %}</h3>
|
|
<p class="text-sm text-slate mb-4">{% trans "Set alert thresholds for complaint volume monitoring" %}</p>
|
|
<a href="{% url 'complaints:complaint_threshold_list' %}" class="inline-flex items-center gap-2 bg-navy text-white px-5 py-2.5 rounded-xl text-sm font-bold shadow-lg shadow-navy/20 hover:bg-blue transition">
|
|
<i data-lucide="settings-2" class="w-4 h-4"></i>
|
|
{% trans "Manage Thresholds" %}
|
|
</a>
|
|
</div>
|
|
|
|
<!-- On-Call Schedules -->
|
|
<div class="bg-white rounded-2xl shadow-sm border border-slate-100 p-6 text-center card-hover">
|
|
<div class="w-16 h-16 mx-auto mb-4 bg-indigo-100 rounded-2xl flex items-center justify-center">
|
|
<i data-lucide="moon" class="w-8 h-8 text-indigo-600"></i>
|
|
</div>
|
|
<h3 class="font-bold text-navy text-lg mb-2">{% trans "On-Call Schedules" %}</h3>
|
|
<p class="text-sm text-slate mb-4">{{ oncall_schedules_count }} {% trans "active schedules" %}</p>
|
|
<a href="{% url 'complaints:oncall_dashboard' %}" class="inline-flex items-center gap-2 bg-navy text-white px-5 py-2.5 rounded-xl text-sm font-bold shadow-lg shadow-navy/20 hover:bg-blue transition">
|
|
<i data-lucide="users" class="w-4 h-4"></i>
|
|
{% trans "Manage On-Call" %}
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- PX Actions Section -->
|
|
<section class="mb-8">
|
|
<h2 class="text-lg font-bold text-navy mb-4 flex items-center gap-2">
|
|
<i data-lucide="zap" class="w-5 h-5 text-yellow-500"></i>
|
|
{% trans "PX Actions" %}
|
|
</h2>
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-6">
|
|
<!-- General SLA -->
|
|
<div class="bg-white rounded-2xl shadow-sm border border-slate-100 p-6 text-center card-hover">
|
|
<div class="w-16 h-16 mx-auto mb-4 bg-yellow-100 rounded-2xl flex items-center justify-center">
|
|
<i data-lucide="clock" class="w-8 h-8 text-yellow-600"></i>
|
|
</div>
|
|
<h3 class="font-bold text-navy text-lg mb-2">{% trans "General SLA" %}</h3>
|
|
<p class="text-sm text-slate mb-4">{{ sla_configs_count }} {% trans "active configs" %}</p>
|
|
<a href="{% url 'config:sla_config_list' %}" class="inline-flex items-center gap-2 bg-navy text-white px-5 py-2.5 rounded-xl text-sm font-bold shadow-lg shadow-navy/20 hover:bg-blue transition">
|
|
<i data-lucide="settings-2" class="w-4 h-4"></i>
|
|
{% trans "Manage SLA" %}
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Routing Rules -->
|
|
<div class="bg-white rounded-2xl shadow-sm border border-slate-100 p-6 text-center card-hover">
|
|
<div class="w-16 h-16 mx-auto mb-4 bg-blue-100 rounded-2xl flex items-center justify-center">
|
|
<i data-lucide="git-branch" class="w-8 h-8 text-blue-600"></i>
|
|
</div>
|
|
<h3 class="font-bold text-navy text-lg mb-2">{% trans "Routing Rules" %}</h3>
|
|
<p class="text-sm text-slate mb-4">{{ routing_rules_count }} {% trans "active rules" %}</p>
|
|
<a href="{% url 'config:routing_rules_list' %}" class="inline-flex items-center gap-2 bg-navy text-white px-5 py-2.5 rounded-xl text-sm font-bold shadow-lg shadow-navy/20 hover:bg-blue transition">
|
|
<i data-lucide="route" class="w-4 h-4"></i>
|
|
{% trans "Manage Routing" %}
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- User Management Section -->
|
|
<section class="mb-8">
|
|
<h2 class="text-lg font-bold text-navy mb-4 flex items-center gap-2">
|
|
<i data-lucide="users" class="w-5 h-5 text-green-500"></i>
|
|
{% trans "User Management" %}
|
|
</h2>
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-6">
|
|
<!-- User Management -->
|
|
<div class="bg-white rounded-2xl shadow-sm border border-slate-100 p-6 text-center card-hover">
|
|
<div class="w-16 h-16 mx-auto mb-4 bg-green-100 rounded-2xl flex items-center justify-center">
|
|
<i data-lucide="users" class="w-8 h-8 text-green-600"></i>
|
|
</div>
|
|
<h3 class="font-bold text-navy text-lg mb-2">{% trans "Users" %}</h3>
|
|
<p class="text-sm text-slate mb-4">{% trans "Manage system users and permissions" %}</p>
|
|
<a href="/admin/accounts/user/" class="inline-flex items-center gap-2 bg-navy text-white px-5 py-2.5 rounded-xl text-sm font-bold shadow-lg shadow-navy/20 hover:bg-blue transition">
|
|
<i data-lucide="user-cog" class="w-4 h-4"></i>
|
|
{% trans "Manage Users" %}
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Onboarding -->
|
|
<div class="bg-white rounded-2xl shadow-sm border border-slate-100 p-6 text-center card-hover">
|
|
<div class="w-16 h-16 mx-auto mb-4 bg-teal-100 rounded-2xl flex items-center justify-center">
|
|
<i data-lucide="user-plus" class="w-8 h-8 text-teal-600"></i>
|
|
</div>
|
|
<h3 class="font-bold text-navy text-lg mb-2">{% trans "Onboarding" %}</h3>
|
|
<p class="text-sm text-slate mb-4">{{ provisional_users_count }} {% trans "pending users" %}</p>
|
|
<a href="{% url 'accounts:onboarding-dashboard' %}" class="inline-flex items-center gap-2 bg-navy text-white px-5 py-2.5 rounded-xl text-sm font-bold shadow-lg shadow-navy/20 hover:bg-blue transition">
|
|
<i data-lucide="users" class="w-4 h-4"></i>
|
|
{% trans "Manage Onboarding" %}
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- System Settings Section -->
|
|
<section class="mb-8">
|
|
<h2 class="text-lg font-bold text-navy mb-4 flex items-center gap-2">
|
|
<i data-lucide="server" class="w-5 h-5 text-slate-500"></i>
|
|
{% trans "System Settings" %}
|
|
</h2>
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-6">
|
|
<!-- Hospitals -->
|
|
<div class="bg-white rounded-2xl shadow-sm border border-slate-100 p-6 text-center card-hover">
|
|
<div class="w-16 h-16 mx-auto mb-4 bg-emerald-100 rounded-2xl flex items-center justify-center">
|
|
<i data-lucide="building-2" class="w-8 h-8 text-emerald-600"></i>
|
|
</div>
|
|
<h3 class="font-bold text-navy text-lg mb-2">{% trans "Hospitals" %}</h3>
|
|
<p class="text-sm text-slate mb-4">{{ hospitals_count }} {% trans "active hospitals" %}</p>
|
|
<a href="/admin/organizations/hospital/" class="inline-flex items-center gap-2 bg-navy text-white px-5 py-2.5 rounded-xl text-sm font-bold shadow-lg shadow-navy/20 hover:bg-blue transition">
|
|
<i data-lucide="hospital" class="w-4 h-4"></i>
|
|
{% trans "Manage Hospitals" %}
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Hospital Notifications -->
|
|
<div class="bg-white rounded-2xl shadow-sm border border-slate-100 p-6 text-center card-hover">
|
|
<div class="w-16 h-16 mx-auto mb-4 bg-pink-100 rounded-2xl flex items-center justify-center">
|
|
<i data-lucide="bell-ring" class="w-8 h-8 text-pink-600"></i>
|
|
</div>
|
|
<h3 class="font-bold text-navy text-lg mb-2">{% trans "Notifications" %}</h3>
|
|
<p class="text-sm text-slate mb-4">{% trans "Configure hospital notification settings" %}</p>
|
|
<a href="{% url 'notifications:settings' %}" class="inline-flex items-center gap-2 bg-navy text-white px-5 py-2.5 rounded-xl text-sm font-bold shadow-lg shadow-navy/20 hover:bg-blue transition">
|
|
<i data-lucide="bell" class="w-4 h-4"></i>
|
|
{% trans "Configure" %}
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Send SMS -->
|
|
<div class="bg-white rounded-2xl shadow-sm border border-slate-100 p-6 text-center card-hover">
|
|
<div class="w-16 h-16 mx-auto mb-4 bg-green-100 rounded-2xl flex items-center justify-center">
|
|
<i data-lucide="message-square" class="w-8 h-8 text-green-600"></i>
|
|
</div>
|
|
<h3 class="font-bold text-navy text-lg mb-2">{% trans "Send SMS" %}</h3>
|
|
<p class="text-sm text-slate mb-4">{% trans "Send text messages directly to any phone number" %}</p>
|
|
<a href="{% url 'notifications:send_sms_direct' %}" class="inline-flex items-center gap-2 bg-navy text-white px-5 py-2.5 rounded-xl text-sm font-bold shadow-lg shadow-navy/20 hover:bg-blue transition">
|
|
<i data-lucide="send" class="w-4 h-4"></i>
|
|
{% trans "Send SMS" %}
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Call Records -->
|
|
<div class="bg-white rounded-2xl shadow-sm border border-slate-100 p-6 text-center card-hover">
|
|
<div class="w-16 h-16 mx-auto mb-4 bg-cyan-100 rounded-2xl flex items-center justify-center">
|
|
<i data-lucide="phone-call" class="w-8 h-8 text-cyan-600"></i>
|
|
</div>
|
|
<h3 class="font-bold text-navy text-lg mb-2">{% trans "Call Records" %}</h3>
|
|
<p class="text-sm text-slate mb-4">{{ call_records_count }} {% trans "records" %}</p>
|
|
<a href="{% url 'callcenter:call_records_list' %}" class="inline-flex items-center gap-2 bg-navy text-white px-5 py-2.5 rounded-xl text-sm font-bold shadow-lg shadow-navy/20 hover:bg-blue transition">
|
|
<i data-lucide="headphones" class="w-4 h-4"></i>
|
|
{% trans "View Records" %}
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
{% endblock %}
|
|
|
|
{% block extra_js %}
|
|
<script>
|
|
// Re-initialize Lucide icons after page load
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
if (typeof lucide !== 'undefined') {
|
|
lucide.createIcons();
|
|
}
|
|
});
|
|
</script>
|
|
{% endblock %}
|