HH/templates/surveys/generate_enhanced_report.html

102 lines
5.1 KiB
HTML

{% extends "layouts/base.html" %}
{% load i18n %}
{% block title %}{% trans "Generate Enhanced Reports" %} - PX360{% endblock %}
{% block content %}
<div class="container-fluid px-4">
<div class="d-flex justify-content-between align-items-center mb-4">
<div>
<h1 class="h3 mb-0">{% trans "Generate Enhanced Reports" %}</h1>
<p class="text-muted mb-0">{% trans "Create detailed per-survey-type reports with question-level analysis" %}</p>
</div>
<div>
<a href="{% url 'surveys:enhanced_reports_list' %}" class="btn btn-outline-secondary">
<i class="bi bi-arrow-left me-2"></i>{% trans "Back to Reports" %}
</a>
</div>
</div>
<div class="row justify-content-center">
<div class="col-lg-8">
<div class="card border-0 shadow-sm">
<div class="card-header bg-white border-0">
<h5 class="mb-0">{% trans "Report Configuration" %}</h5>
</div>
<div class="card-body">
<form method="post">
{% csrf_token %}
<div class="mb-4">
<label for="template" class="form-label">{% trans "Survey Template (Optional)" %}</label>
<select name="template" id="template" class="form-select form-select-lg">
<option value="">{% trans "All Templates - Generate reports for all survey types" %}</option>
{% for template in templates %}
<option value="{{ template.id }}">{{ template.name }}</option>
{% endfor %}
</select>
<div class="form-text">
{% trans "Leave empty to generate separate reports for all survey templates." %}
</div>
</div>
<div class="row mb-4">
<div class="col-md-6">
<label for="start_date" class="form-label">{% trans "Start Date (Optional)" %}</label>
<input type="date" name="start_date" id="start_date" class="form-control">
<div class="form-text">
{% trans "Default: 1 year ago" %}
</div>
</div>
<div class="col-md-6">
<label for="end_date" class="form-label">{% trans "End Date (Optional)" %}</label>
<input type="date" name="end_date" id="end_date" class="form-control">
<div class="form-text">
{% trans "Default: Today" %}
</div>
</div>
</div>
<!-- What to expect -->
<div class="alert alert-light border mb-4">
<h6><i class="bi bi-check2-circle me-2"></i>{% trans "What will be generated:" %}</h6>
<ul class="mb-0">
<li>{% trans "A separate HTML report for each survey template" %}</li>
<li>{% trans "Detailed question-level analysis with charts" %}</li>
<li>{% trans "Score distributions and monthly trends per question" %}</li>
<li>{% trans "Performance insights and recommendations" %}</li>
<li>{% trans "Master index page linking all reports" %}</li>
<li>{% trans "Summary JSON file for programmatic access" %}</li>
</ul>
</div>
<div class="d-flex justify-content-between">
<a href="{% url 'surveys:enhanced_reports_list' %}" class="btn btn-outline-secondary">
{% trans "Cancel" %}
</a>
<button type="submit" class="btn btn-primary btn-lg" id="generateBtn">
<i class="bi bi-gear me-2"></i>{% trans "Generate Reports" %}
</button>
</div>
</form>
</div>
</div>
<!-- Processing note -->
<div class="alert alert-info mt-4">
<i class="bi bi-info-circle me-2"></i>
<strong>{% trans "Note:" %}</strong> {% trans "Report generation may take a few moments depending on the amount of survey data. Please wait for the process to complete." %}
</div>
</div>
</div>
</div>
<script>
document.querySelector('form').addEventListener('submit', function(e) {
const btn = document.getElementById('generateBtn');
btn.disabled = true;
btn.innerHTML = '<i class="bi bi-hourglass-split me-2"></i>{% trans "Generating..." %}';
});
</script>
{% endblock %}