92 lines
4.3 KiB
HTML
92 lines
4.3 KiB
HTML
{% extends 'layouts/base.html' %}
|
|
{% load i18n static %}
|
|
|
|
{% block title %}{% trans "Report Templates" %} — PX360{% endblock %}
|
|
|
|
{% block extra_css %}
|
|
<style>
|
|
.template-card {
|
|
transition: all 0.3s ease;
|
|
cursor: pointer;
|
|
border: 1px solid #e2e8f0;
|
|
border-radius: 12px;
|
|
padding: 24px;
|
|
background: white;
|
|
}
|
|
.template-card:hover {
|
|
transform: translateY(-4px);
|
|
box-shadow: 0 12px 32px rgba(0, 86, 150, 0.12);
|
|
border-color: #005696;
|
|
}
|
|
.template-card__icon {
|
|
width: 56px;
|
|
height: 56px;
|
|
border-radius: 12px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-size: 24px;
|
|
margin-bottom: 16px;
|
|
}
|
|
.template-card__icon--blue { background: rgba(0,86,150,0.1); color: #005696; }
|
|
.template-card__icon--green { background: rgba(20,184,166,0.1); color: #14B8A6; }
|
|
.ds-badge {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
padding: 4px 12px;
|
|
border-radius: 20px;
|
|
font-size: 12px;
|
|
font-weight: 600;
|
|
}
|
|
.ds-badge--complaints { background: rgba(0,86,150,0.1); color: #005696; }
|
|
.ds-badge--physicians { background: rgba(20,184,166,0.1); color: #14B8A6; }
|
|
</style>
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="container mx-auto px-6 py-8">
|
|
<div class="flex items-center justify-between mb-8">
|
|
<div>
|
|
<h1 class="text-3xl font-bold text-gray-800">{% trans "Report Templates" %}</h1>
|
|
<p class="text-gray-500 mt-1">{% trans "Define reusable report structures from reference PDFs" %}</p>
|
|
</div>
|
|
<a href="{% url 'presentations:template_create' %}" class="inline-flex items-center gap-2 px-6 py-3 bg-blue-900 text-white rounded-lg hover:bg-blue-800 font-semibold">
|
|
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"/></svg>
|
|
{% trans "New Template" %}
|
|
</a>
|
|
</div>
|
|
|
|
{% if templates %}
|
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
|
{% for t in templates %}
|
|
<a href="{% url 'presentations:template_detail' t.pk %}" class="template-card block">
|
|
<div class="template-card__icon template-card__icon--{% if t.data_source == 'physicians' %}green{% else %}blue{% endif %}">
|
|
{% if t.data_source == 'physicians' %}
|
|
<svg class="w-7 h-7" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4.318 6.318a4.5 4.5 0 000 6.364L12 20.364l7.682-7.682a4.5 4.5 0 00-6.364-6.364L12 7.636l-1.318-1.318a4.5 4.5 0 00-6.364 0z"/></svg>
|
|
{% else %}
|
|
<svg class="w-7 h-7" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 17v-2m3 2v-4m3 4v-6m2 10H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/></svg>
|
|
{% endif %}
|
|
</div>
|
|
<h3 class="text-lg font-bold text-gray-800 mb-1">{{ t.name }}</h3>
|
|
<p class="text-sm text-gray-500 mb-3">{{ t.description|default:""|truncatewords:15 }}</p>
|
|
<div class="flex items-center gap-3">
|
|
<span class="ds-badge ds-badge--{{ t.data_source }}">{{ t.get_data_source_display|default:t.data_source }}</span>
|
|
<span class="text-xs text-gray-400">{{ t.slide_count }} slides</span>
|
|
{% if not t.active %}<span class="text-xs text-red-500 font-semibold">Inactive</span>{% endif %}
|
|
</div>
|
|
</a>
|
|
{% endfor %}
|
|
</div>
|
|
{% else %}
|
|
<div class="text-center py-20">
|
|
<div class="text-gray-300 text-6xl mb-4">📄</div>
|
|
<h3 class="text-xl font-semibold text-gray-600 mb-2">{% trans "No templates yet" %}</h3>
|
|
<p class="text-gray-400 mb-6">{% trans "Create your first report template by uploading a reference PDF." %}</p>
|
|
<a href="{% url 'presentations:template_create' %}" class="inline-flex items-center gap-2 px-6 py-3 bg-blue-900 text-white rounded-lg hover:bg-blue-800 font-semibold">
|
|
{% trans "Create Template" %}
|
|
</a>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
{% endblock %}
|