348 lines
16 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Survey Analytics Reports Index - PX360</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.0/font/bootstrap-icons.css">
<style>
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
background-color: #f8fafc;
}
.hero {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
padding: 4rem 0;
}
.stat-card {
background: white;
border-radius: 16px;
padding: 1.5rem;
box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1);
}
</style>
</head>
<body>
<div class="hero">
<div class="container">
<h1 class="display-4 fw-bold mb-3">📊 Survey Analytics Reports</h1>
<p class="lead mb-0">
Generated: 2026-02-08T09:35:00<br>
Period: 2025-02-08 to 2026-02-08
</p>
</div>
</div>
<div class="container py-5">
<!-- Summary Stats -->
<div class="row g-4 mb-5">
<div class="col-md-3">
<div class="stat-card text-center">
<div class="display-4 fw-bold text-primary">12</div>
<div class="text-muted">Survey Templates</div>
</div>
</div>
<div class="col-md-3">
<div class="stat-card text-center">
<div class="display-4 fw-bold text-success">3,949</div>
<div class="text-muted">Surveys Sent</div>
</div>
</div>
<div class="col-md-3">
<div class="stat-card text-center">
<div class="display-4 fw-bold text-info">3,325</div>
<div class="text-muted">Completed</div>
</div>
</div>
<div class="col-md-3">
<div class="stat-card text-center">
<div class="display-4 fw-bold text-warning">84.2%</div>
<div class="text-muted">Completion Rate</div>
</div>
</div>
</div>
<!-- Individual Reports -->
<h2 class="h3 mb-4">Available Reports</h2>
<div class="row">
<div class="col-md-6 col-lg-4 mb-4">
<div class="card h-100 border-0 shadow-sm">
<div class="card-body">
<div class="d-flex align-items-center mb-3">
<div class="bg-primary bg-opacity-10 rounded-circle p-3 me-3">
<i class="bi bi-file-earmark-bar-graph text-primary fs-4"></i>
</div>
<div>
<h5 class="card-title mb-0">Appointment Satisfaction Survey</h5>
<small class="text-muted">36.4 KB</small>
</div>
</div>
<a href="appointment_satisfaction_survey.html" class="btn btn-primary w-100">
<i class="bi bi-eye me-2"></i>View Report
</a>
</div>
</div>
</div>
<div class="col-md-6 col-lg-4 mb-4">
<div class="card h-100 border-0 shadow-sm">
<div class="card-body">
<div class="d-flex align-items-center mb-3">
<div class="bg-primary bg-opacity-10 rounded-circle p-3 me-3">
<i class="bi bi-file-earmark-bar-graph text-primary fs-4"></i>
</div>
<div>
<h5 class="card-title mb-0">Day Case Patient Survey</h5>
<small class="text-muted">34.6 KB</small>
</div>
</div>
<a href="day_case_patient_survey.html" class="btn btn-primary w-100">
<i class="bi bi-eye me-2"></i>View Report
</a>
</div>
</div>
</div>
<div class="col-md-6 col-lg-4 mb-4">
<div class="card h-100 border-0 shadow-sm">
<div class="card-body">
<div class="d-flex align-items-center mb-3">
<div class="bg-primary bg-opacity-10 rounded-circle p-3 me-3">
<i class="bi bi-file-earmark-bar-graph text-primary fs-4"></i>
</div>
<div>
<h5 class="card-title mb-0">Day Case Patient Survey</h5>
<small class="text-muted">43.8 KB</small>
</div>
</div>
<a href="day_case_patient_survey.html" class="btn btn-primary w-100">
<i class="bi bi-eye me-2"></i>View Report
</a>
</div>
</div>
</div>
<div class="col-md-6 col-lg-4 mb-4">
<div class="card h-100 border-0 shadow-sm">
<div class="card-body">
<div class="d-flex align-items-center mb-3">
<div class="bg-primary bg-opacity-10 rounded-circle p-3 me-3">
<i class="bi bi-file-earmark-bar-graph text-primary fs-4"></i>
</div>
<div>
<h5 class="card-title mb-0">EMS Emergency Services Survey</h5>
<small class="text-muted">34.7 KB</small>
</div>
</div>
<a href="ems_emergency_services_survey.html" class="btn btn-primary w-100">
<i class="bi bi-eye me-2"></i>View Report
</a>
</div>
</div>
</div>
<div class="col-md-6 col-lg-4 mb-4">
<div class="card h-100 border-0 shadow-sm">
<div class="card-body">
<div class="d-flex align-items-center mb-3">
<div class="bg-primary bg-opacity-10 rounded-circle p-3 me-3">
<i class="bi bi-file-earmark-bar-graph text-primary fs-4"></i>
</div>
<div>
<h5 class="card-title mb-0">EMS Emergency Services Survey</h5>
<small class="text-muted">43.8 KB</small>
</div>
</div>
<a href="ems_emergency_services_survey.html" class="btn btn-primary w-100">
<i class="bi bi-eye me-2"></i>View Report
</a>
</div>
</div>
</div>
<div class="col-md-6 col-lg-4 mb-4">
<div class="card h-100 border-0 shadow-sm">
<div class="card-body">
<div class="d-flex align-items-center mb-3">
<div class="bg-primary bg-opacity-10 rounded-circle p-3 me-3">
<i class="bi bi-file-earmark-bar-graph text-primary fs-4"></i>
</div>
<div>
<h5 class="card-title mb-0">Inpatient Post-Discharge Survey</h5>
<small class="text-muted">33.8 KB</small>
</div>
</div>
<a href="inpatient_post_discharge_survey.html" class="btn btn-primary w-100">
<i class="bi bi-eye me-2"></i>View Report
</a>
</div>
</div>
</div>
<div class="col-md-6 col-lg-4 mb-4">
<div class="card h-100 border-0 shadow-sm">
<div class="card-body">
<div class="d-flex align-items-center mb-3">
<div class="bg-primary bg-opacity-10 rounded-circle p-3 me-3">
<i class="bi bi-file-earmark-bar-graph text-primary fs-4"></i>
</div>
<div>
<h5 class="card-title mb-0">Inpatient Post-Discharge Survey</h5>
<small class="text-muted">47.3 KB</small>
</div>
</div>
<a href="inpatient_post_discharge_survey.html" class="btn btn-primary w-100">
<i class="bi bi-eye me-2"></i>View Report
</a>
</div>
</div>
</div>
<div class="col-md-6 col-lg-4 mb-4">
<div class="card h-100 border-0 shadow-sm">
<div class="card-body">
<div class="d-flex align-items-center mb-3">
<div class="bg-primary bg-opacity-10 rounded-circle p-3 me-3">
<i class="bi bi-file-earmark-bar-graph text-primary fs-4"></i>
</div>
<div>
<h5 class="card-title mb-0">Inpatient Satisfaction Survey</h5>
<small class="text-muted">39.9 KB</small>
</div>
</div>
<a href="inpatient_satisfaction_survey.html" class="btn btn-primary w-100">
<i class="bi bi-eye me-2"></i>View Report
</a>
</div>
</div>
</div>
<div class="col-md-6 col-lg-4 mb-4">
<div class="card h-100 border-0 shadow-sm">
<div class="card-body">
<div class="d-flex align-items-center mb-3">
<div class="bg-primary bg-opacity-10 rounded-circle p-3 me-3">
<i class="bi bi-file-earmark-bar-graph text-primary fs-4"></i>
</div>
<div>
<h5 class="card-title mb-0">OPD Patient Experience Survey</h5>
<small class="text-muted">41.7 KB</small>
</div>
</div>
<a href="opd_patient_experience_survey.html" class="btn btn-primary w-100">
<i class="bi bi-eye me-2"></i>View Report
</a>
</div>
</div>
</div>
<div class="col-md-6 col-lg-4 mb-4">
<div class="card h-100 border-0 shadow-sm">
<div class="card-body">
<div class="d-flex align-items-center mb-3">
<div class="bg-primary bg-opacity-10 rounded-circle p-3 me-3">
<i class="bi bi-file-earmark-bar-graph text-primary fs-4"></i>
</div>
<div>
<h5 class="card-title mb-0">OPD Patient Experience Survey</h5>
<small class="text-muted">43.7 KB</small>
</div>
</div>
<a href="opd_patient_experience_survey.html" class="btn btn-primary w-100">
<i class="bi bi-eye me-2"></i>View Report
</a>
</div>
</div>
</div>
<div class="col-md-6 col-lg-4 mb-4">
<div class="card h-100 border-0 shadow-sm">
<div class="card-body">
<div class="d-flex align-items-center mb-3">
<div class="bg-primary bg-opacity-10 rounded-circle p-3 me-3">
<i class="bi bi-file-earmark-bar-graph text-primary fs-4"></i>
</div>
<div>
<h5 class="card-title mb-0">Outpatient Satisfaction Survey</h5>
<small class="text-muted">33.6 KB</small>
</div>
</div>
<a href="outpatient_satisfaction_survey.html" class="btn btn-primary w-100">
<i class="bi bi-eye me-2"></i>View Report
</a>
</div>
</div>
</div>
<div class="col-md-6 col-lg-4 mb-4">
<div class="card h-100 border-0 shadow-sm">
<div class="card-body">
<div class="d-flex align-items-center mb-3">
<div class="bg-primary bg-opacity-10 rounded-circle p-3 me-3">
<i class="bi bi-file-earmark-bar-graph text-primary fs-4"></i>
</div>
<div>
<h5 class="card-title mb-0">Patient Experience Demo Survey</h5>
<small class="text-muted">35.8 KB</small>
</div>
</div>
<a href="patient_experience_demo_survey.html" class="btn btn-primary w-100">
<i class="bi bi-eye me-2"></i>View Report
</a>
</div>
</div>
</div>
</div>
<!-- Summary Info -->
<div class="card border-0 shadow-sm mt-5">
<div class="card-body">
<h5 class="card-title">Report Summary</h5>
<div class="row">
<div class="col-md-6">
<table class="table table-borderless">
<tr>
<th>Overall Average Score:</th>
<td class="fw-bold">4.68/5.0</td>
</tr>
<tr>
<th>Negative Survey Rate:</th>
<td class="text-danger">4.9%</td>
</tr>
<tr>
<th>Best Performing:</th>
<td>OPD Patient Experience Survey (4.75)</td>
</tr>
</table>
</div>
<div class="col-md-6">
<table class="table table-borderless">
<tr>
<th>Total Reports:</th>
<td>12</td>
</tr>
<tr>
<th>Report Directory:</th>
<td><code>reports/</code></td>
</tr>
<tr>
<th>Worst Performing:</th>
<td>Outpatient Satisfaction Survey (0.0)</td>
</tr>
</table>
</div>
</div>
</div>
</div>
<footer class="text-center text-muted py-5">
<p>PX360 Survey Analytics System</p>
</footer>
</div>
</body>
</html>