124 lines
8.0 KiB
HTML
124 lines
8.0 KiB
HTML
{% extends 'layouts/base.html' %}
|
||
{% load i18n static %}
|
||
|
||
{% block title %}{% trans "Generate Presentation" %} — PX360{% endblock %}
|
||
|
||
{% block content %}
|
||
<div class="max-w-3xl mx-auto">
|
||
<nav class="flex items-center gap-2 text-sm text-gray-400 mb-6">
|
||
<a href="{% url 'presentations:list' %}" class="hover:text-navy transition">{% trans "Presentations" %}</a>
|
||
<i data-lucide="chevron-right" class="w-4 h-4"></i>
|
||
<span class="text-gray-700">{% trans "Generate" %}</span>
|
||
</nav>
|
||
|
||
<div class="bg-white rounded-2xl border-2 border-gray-200 p-8">
|
||
<div class="flex items-center gap-3 mb-2">
|
||
<div class="w-10 h-10 rounded-xl bg-gradient-to-br from-navy to-teal flex items-center justify-center">
|
||
<i data-lucide="sparkles" class="w-5 h-5 text-white"></i>
|
||
</div>
|
||
<h1 class="text-xl font-bold text-gray-800">{% trans "AI-Powered Presentation" %}</h1>
|
||
</div>
|
||
<p class="text-sm text-gray-500 mb-6 ml-[52px]">
|
||
{% trans "Select a hospital and period to automatically generate a complaints report presentation with AI-enhanced insights." %}
|
||
</p>
|
||
|
||
<form method="post">
|
||
{% csrf_token %}
|
||
|
||
<div class="space-y-5">
|
||
<div>
|
||
<label class="block text-sm font-semibold text-gray-700 mb-1.5">{% trans "Report Type" %} *</label>
|
||
<select name="report_type" id="id_report_type"
|
||
class="w-full border-2 border-gray-200 rounded-xl px-4 py-3 text-sm focus:border-navy focus:ring-2 focus:ring-navy/20 outline-none transition">
|
||
<option value="complaints" {% if selected_report_type == "complaints" %}selected{% endif %}>{% trans "Complaints Report" %}</option>
|
||
<option value="doctor_ratings" {% if selected_report_type == "doctor_ratings" %}selected{% endif %}>{% trans "Doctor Ratings Report" %}</option>
|
||
</select>
|
||
</div>
|
||
|
||
<div>
|
||
<label class="block text-sm font-semibold text-gray-700 mb-1.5">{% trans "Hospital" %} *</label>
|
||
<select name="hospital" required
|
||
class="w-full border-2 border-gray-200 rounded-xl px-4 py-3 text-sm focus:border-navy focus:ring-2 focus:ring-navy/20 outline-none transition">
|
||
<option value="">— {% trans "Select a hospital" %} —</option>
|
||
{% for h in hospitals %}
|
||
<option value="{{ h.pk }}" {% if selected_hospital == h.pk|stringformat:"s" %}selected{% endif %}>{{ h.name }}</option>
|
||
{% endfor %}
|
||
</select>
|
||
</div>
|
||
|
||
<div class="grid grid-cols-2 gap-5">
|
||
<div>
|
||
<label class="block text-sm font-semibold text-gray-700 mb-1.5">{% trans "Year" %} *</label>
|
||
<select name="year" required
|
||
class="w-full border-2 border-gray-200 rounded-xl px-4 py-3 text-sm focus:border-navy focus:ring-2 focus:ring-navy/20 outline-none transition">
|
||
{% for y in years %}
|
||
<option value="{{ y }}" {% if y == selected_year %}selected{% endif %}>{{ y }}</option>
|
||
{% endfor %}
|
||
</select>
|
||
</div>
|
||
|
||
<div>
|
||
<label class="block text-sm font-semibold text-gray-700 mb-1.5">{% trans "Quarter" %}</label>
|
||
<select name="quarter"
|
||
class="w-full border-2 border-gray-200 rounded-xl px-4 py-3 text-sm focus:border-navy focus:ring-2 focus:ring-navy/20 outline-none transition">
|
||
<option value="">— {% trans "Full Year" %} —</option>
|
||
<option value="1" {% if selected_quarter == "1" %}selected{% endif %}>{% trans "Q1 (Jan–Mar)" %}</option>
|
||
<option value="2" {% if selected_quarter == "2" %}selected{% endif %}>{% trans "Q2 (Apr–Jun)" %}</option>
|
||
<option value="3" {% if selected_quarter == "3" %}selected{% endif %}>{% trans "Q3 (Jul–Sep)" %}</option>
|
||
<option value="4" {% if selected_quarter == "4" %}selected{% endif %}>{% trans "Q4 (Oct–Dec)" %}</option>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="bg-gray-50 rounded-xl p-4 border border-gray-100">
|
||
<div class="flex items-start gap-3">
|
||
<i data-lucide="info" class="w-5 h-5 text-teal mt-0.5 shrink-0"></i>
|
||
<div class="text-sm text-gray-600 space-y-1" id="report-info-complaints">
|
||
<p>{% trans "The presentation will include:" %}</p>
|
||
<ul class="list-disc list-inside space-y-0.5 text-gray-500">
|
||
<li>{% trans "Cover page with hospital branding" %}</li>
|
||
<li>{% trans "KPI dashboard with key metrics" %}</li>
|
||
<li>{% trans "Complaint source & location breakdowns" %}</li>
|
||
<li>{% trans "Department & escalation analysis" %}</li>
|
||
<li>{% trans "Response time analytics" %}</li>
|
||
<li>{% trans "AI-generated insights & recommendations" %}</li>
|
||
</ul>
|
||
</div>
|
||
<div class="text-sm text-gray-600 space-y-1 hidden" id="report-info-ratings">
|
||
<p>{% trans "The presentation will include:" %}</p>
|
||
<ul class="list-disc list-inside space-y-0.5 text-gray-500">
|
||
<li>{% trans "Cover page with hospital branding" %}</li>
|
||
<li>{% trans "KPI dashboard — avg rating, positive/negative %" %}</li>
|
||
<li>{% trans "Rating distribution chart (1–5 stars)" %}</li>
|
||
<li>{% trans "Monthly rating trend" %}</li>
|
||
<li>{% trans "Per-department physician rating tables (color-coded)" %}</li>
|
||
<li>{% trans "Top 10 performers + AI-generated insights" %}</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="flex items-center justify-end gap-3 mt-8 pt-6 border-t border-gray-100">
|
||
<a href="{% url 'presentations:template_list' %}" class="px-5 py-2.5 text-sm font-medium text-teal hover:text-teal-700 transition flex items-center gap-1">
|
||
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10"/></svg>
|
||
{% trans "Use Template Builder" %}
|
||
</a>
|
||
<a href="{% url 'presentations:list' %}" class="px-5 py-2.5 text-sm font-medium text-gray-600 hover:text-gray-800 transition">{% trans "Cancel" %}</a>
|
||
<button type="submit" class="bg-gradient-to-r from-navy to-teal text-white px-6 py-2.5 rounded-xl hover:opacity-90 transition font-medium text-sm flex items-center gap-2">
|
||
<i data-lucide="sparkles" class="w-4 h-4"></i>
|
||
{% trans "Generate Presentation" %}
|
||
</button>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
<script>
|
||
document.getElementById('id_report_type').addEventListener('change', function() {
|
||
var isRatings = this.value === 'doctor_ratings';
|
||
document.getElementById('report-info-complaints').classList.toggle('hidden', isRatings);
|
||
document.getElementById('report-info-ratings').classList.toggle('hidden', !isRatings);
|
||
});
|
||
</script>
|
||
{% endblock %}
|