Eli Ribble
4c23eba5d7
That way I can separate out HTML for the public-facing report system and Nidus sync.
243 lines
9.2 KiB
HTML
243 lines
9.2 KiB
HTML
{{template "base.html" .}}
|
|
|
|
{{define "title"}}Login{{end}}
|
|
{{define "extraheader"}}
|
|
<style>
|
|
body {
|
|
background-color: #f8f9fa;
|
|
}
|
|
.page-container {
|
|
max-width: 800px;
|
|
margin: 0 auto;
|
|
padding: 20px;
|
|
}
|
|
.content-card {
|
|
background-color: white;
|
|
border-radius: 15px;
|
|
box-shadow: 0 2px 10px rgba(0,0,0,0.1);
|
|
padding: 25px;
|
|
margin-bottom: 20px;
|
|
}
|
|
.logo-area {
|
|
text-align: center;
|
|
margin-bottom: 20px;
|
|
}
|
|
.logo-placeholder {
|
|
height: 50px;
|
|
max-width: 200px;
|
|
margin: 0 auto;
|
|
}
|
|
.photo-gallery {
|
|
display: flex;
|
|
gap: 10px;
|
|
margin-bottom: 20px;
|
|
overflow-x: auto;
|
|
padding-bottom: 10px;
|
|
}
|
|
.photo-item {
|
|
min-width: 200px;
|
|
height: 150px;
|
|
border-radius: 8px;
|
|
overflow: hidden;
|
|
border: 2px solid #dee2e6;
|
|
}
|
|
.photo-item img {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: cover;
|
|
}
|
|
.data-section {
|
|
margin-bottom: 25px;
|
|
}
|
|
.section-title {
|
|
font-size: 1.1rem;
|
|
font-weight: 600;
|
|
margin-bottom: 10px;
|
|
color: #0d6efd;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
.section-title i {
|
|
margin-right: 8px;
|
|
}
|
|
.table-container {
|
|
overflow-x: auto;
|
|
margin-bottom: 15px;
|
|
}
|
|
.alert-info {
|
|
background-color: #e8f4f8;
|
|
border-color: #b8daff;
|
|
}
|
|
.progress-container {
|
|
margin: 30px 0 20px;
|
|
}
|
|
.progress {
|
|
height: 8px;
|
|
}
|
|
.trap-high {
|
|
color: #dc3545;
|
|
font-weight: bold;
|
|
}
|
|
.trap-medium {
|
|
color: #fd7e14;
|
|
font-weight: bold;
|
|
}
|
|
.trap-low {
|
|
color: #198754;
|
|
}
|
|
</style>
|
|
{{end}}
|
|
{{define "content"}}
|
|
<div class="page-container">
|
|
<!-- Logo -->
|
|
<div class="logo-area">
|
|
<img src="https://placehold.co/200x50/e9ecef/adb5bd?text=County+Vector+Control" alt="County Vector Control" class="logo-placeholder">
|
|
</div>
|
|
|
|
<!-- Progress Bar -->
|
|
<div class="progress-container">
|
|
<div class="d-flex justify-content-between mb-1">
|
|
<span class="text-muted small">Evidence</span>
|
|
<span class="text-muted small">2 of 4</span>
|
|
</div>
|
|
<div class="progress">
|
|
<div class="progress-bar" role="progressbar" style="width: 50%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Main Content -->
|
|
<div class="content-card">
|
|
<h1 class="h4 mb-4">Evidence of Potential Breeding Site</h1>
|
|
|
|
<!-- Aerial Photos -->
|
|
<div class="data-section">
|
|
<div class="section-title">
|
|
<i class="bi bi-camera-fill"></i> Aerial Surveillance Photos
|
|
</div>
|
|
<p class="small text-muted mb-2">These photos were taken during routine aerial surveillance of the area.</p>
|
|
|
|
<div class="photo-gallery">
|
|
<div class="photo-item">
|
|
<img src="https://placehold.co/200x150/76b5c5/ffffff?text=Aerial+Photo+1" alt="Aerial photo of property">
|
|
</div>
|
|
<div class="photo-item">
|
|
<img src="https://placehold.co/200x150/3e8e7e/ffffff?text=Aerial+Photo+2" alt="Aerial photo of property">
|
|
</div>
|
|
<div class="photo-item">
|
|
<img src="https://placehold.co/200x150/7accc8/ffffff?text=Aerial+Photo+3" alt="Aerial photo of property">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Historical Inspections -->
|
|
<div class="data-section">
|
|
<div class="section-title">
|
|
<i class="bi bi-clipboard-check-fill"></i> Historical Inspection Data
|
|
</div>
|
|
<div class="table-container">
|
|
<table class="table table-striped table-sm">
|
|
<thead>
|
|
<tr>
|
|
<th>Date</th>
|
|
<th>Inspector</th>
|
|
<th>Findings</th>
|
|
<th>Action</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>Mar 15, 2023</td>
|
|
<td>J. Martinez</td>
|
|
<td>Pool water stagnant, green</td>
|
|
<td>Treatment applied, owner notified</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Nov 02, 2022</td>
|
|
<td>L. Johnson</td>
|
|
<td>Pool water clear, maintained</td>
|
|
<td>No action needed</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Aug 18, 2022</td>
|
|
<td>S. Williams</td>
|
|
<td>Minor algae formation</td>
|
|
<td>Owner provided maintenance resources</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Mosquito Trap Data -->
|
|
<div class="data-section">
|
|
<div class="section-title">
|
|
<i class="bi bi-bug-fill"></i> Mosquito Trap Count Data
|
|
</div>
|
|
<div class="table-container">
|
|
<table class="table table-striped table-sm">
|
|
<thead>
|
|
<tr>
|
|
<th>Date Collected</th>
|
|
<th>Count</th>
|
|
<th>Distance</th>
|
|
<th>Level</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>Jun 12, 2023</td>
|
|
<td>42</td>
|
|
<td>0.3 miles</td>
|
|
<td class="trap-high">High</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Jun 05, 2023</td>
|
|
<td>36</td>
|
|
<td>0.3 miles</td>
|
|
<td class="trap-high">High</td>
|
|
</tr>
|
|
<tr>
|
|
<td>May 29, 2023</td>
|
|
<td>28</td>
|
|
<td>0.3 miles</td>
|
|
<td class="trap-medium">Medium</td>
|
|
</tr>
|
|
<tr>
|
|
<td>May 22, 2023</td>
|
|
<td>15</td>
|
|
<td>0.3 miles</td>
|
|
<td class="trap-low">Low</td>
|
|
</tr>
|
|
<tr>
|
|
<td>May 15, 2023</td>
|
|
<td>12</td>
|
|
<td>0.3 miles</td>
|
|
<td class="trap-low">Low</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Public Health Information -->
|
|
<div class="alert alert-info">
|
|
<h5><i class="bi bi-info-circle me-2"></i>Why This Matters</h5>
|
|
<p>The data above shows mosquito activity in your area. Recent trap counts indicate elevated mosquito populations, which increases the risk of mosquito-borne diseases like West Nile virus.</p>
|
|
<p>Unmaintained swimming pools can produce thousands of mosquitoes each week. By addressing potential breeding sites, you're helping protect your family and neighbors from these health risks.</p>
|
|
<p class="mb-0"><strong>We need your help</strong> to ensure we maintain public health by keeping mosquito counts low in your neighborhood. Your cooperation makes a significant difference in community safety.</p>
|
|
</div>
|
|
|
|
<!-- Action Button -->
|
|
<div class="d-grid gap-2 mt-4">
|
|
<a href="{{ .URLs.ReportContribute }}" class="btn btn-primary btn-lg">
|
|
<i class="bi bi-arrow-right-circle me-2"></i> Next Step: Upload Current Photos
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Help Text -->
|
|
<div class="text-center text-muted small">
|
|
<p>If you need assistance, please contact Vector Control at (555) 123-4567</p>
|
|
</div>
|
|
</div>
|
|
{{end}}
|