Gleipnir/nidus-sync
2
0
Fork 0
Code Issues 1 Pull requests Projects Releases Packages Wiki Activity Actions

Make it possible to submit nuisance reports

Browse source
This commit is contained in:
Eli Ribble 2026-01-08 17:48:43 +00:00
parent a162781f89
commit fc10e3e95d
No known key found for this signature in database
14 changed files with 3446 additions and 24 deletions
Download patch file Download diff file Expand all files Collapse all files

115
public-report/template/nuisance-submit-complete.html Normal file
View file

@ -0,0 +1,115 @@
{{template "base.html" .}}
{{define "title"}}Nuisance Submission Complete{{end}}
{{define "extraheader"}}
<style>
</style>
<script>
</script>
{{end}}
{{define "content"}}
<div class="container py-5">
<div class="row justify-content-center">
<div class="col-lg-7">
<!-- Confirmation Card -->
<div class="card shadow-sm border-info mb-4">
<div class="card-header bg-info text-white">
<h3 class="my-2">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" class="bi bi-bell-fill me-2" viewBox="0 0 16 16">
<path d="M8 16a2 2 0 0 0 2-2H6a2 2 0 0 0 2 2zm.995-14.901a1 1 0 1 0-1.99 0A5.002 5.002 0 0 0 3 6c0 1.098-.5 6-2 7h14c-1.5-1-2-5.902-2-7 0-2.42-1.72-4.44-4.005-4.901z"/>
</svg>
Nuisance Report Complete
</h3>
</div>
<div class="card-body p-4 text-center">
<div class="mb-4">
<div class="display-1 text-info mb-3">
<svg xmlns="http://www.w3.org/2000/svg" width="80" height="80" fill="currentColor" class="bi bi-check-circle-fill" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z"/>
</svg>
</div>
<h4 class="mb-3">Thank You!</h4>
<p class="lead">Your report has been successfully submitted.</p>
<div class="alert alert-secondary py-3 mt-3">
<strong>Report ID:</strong>
<span class="fs-5">{{.ReportID}}</span>
</div>
</div>
<hr class="my-4">
<!-- What to Expect Section -->
<div class="text-start mb-4">
<h5>
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" fill="currentColor" class="bi bi-info-circle me-2" viewBox="0 0 16 16">
<path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z"/>
<path d="m8.93 6.588-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.808 1.319.545 0 1.178-.252 1.465-.598l.088-.416c-.2.176-.492.246-.686.246-.275 0-.375-.193-.304-.533L8.93 6.588zM9 4.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0z"/>
</svg>
What to Expect
</h5>
<ul class="list-group list-group-flush">
<li class="list-group-item bg-transparent">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-envelope-check me-2 text-success" viewBox="0 0 16 16">
<path d="M2 2a2 2 0 0 0-2 2v8.01A2 2 0 0 0 2 14h5.5a.5.5 0 0 0 0-1H2a1 1 0 0 1-.966-.741l5.64-3.471L8 9.583l7-4.2V8.5a.5.5 0 0 0 1 0V4a2 2 0 0 0-2-2H2Zm3.708 6.208L1 11.105V5.383l4.708 2.825ZM1 4.217V4a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v.217l-7 4.2-7-4.2Z"/>
<path d="M16 12.5a3.5 3.5 0 1 1-7 0 3.5 3.5 0 0 1 7 0Zm-1.993-1.679a.5.5 0 0 0-.686.172l-1.17 1.95-.547-.547a.5.5 0 0 0-.708.708l.774.773a.75.75 0 0 0 1.174-.144l1.335-2.226a.5.5 0 0 0-.172-.686Z"/>
</svg>
A confirmation message has been sent to your contact information.
</li>
<li class="list-group-item bg-transparent">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-clipboard-check me-2 text-success" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M10.854 7.146a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708 0l-1.5-1.5a.5.5 0 1 1 .708-.708L7.5 9.793l2.646-2.647a.5.5 0 0 1 .708 0z"/>
<path d="M4 1.5H3a2 2 0 0 0-2 2V14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V3.5a2 2 0 0 0-2-2h-1v1h1a1 1 0 0 1 1 1V14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V3.5a1 1 0 0 1 1-1h1v-1z"/>
<path d="M9.5 1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-3a.5.5 0 0 1-.5-.5v-1a.5.5 0 0 1 .5-.5h3zm-3-1A1.5 1.5 0 0 0 5 1.5v1A1.5 1.5 0 0 0 6.5 4h3A1.5 1.5 0 0 0 11 2.5v-1A1.5 1.5 0 0 0 9.5 0h-3z"/>
</svg>
You will receive updates when:
<ul class="mt-2">
<li>Your report is assigned to a specialist</li>
<li>A site visit is scheduled</li>
<li>Treatment or remediation is completed</li>
<li>The case is resolved</li>
</ul>
</li>
<li class="list-group-item bg-transparent">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-search me-2 text-success" viewBox="0 0 16 16">
<path d="M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z"/>
</svg>
You can check your report status anytime using your Report ID.
</li>
</ul>
</div>
<!-- Navigation Buttons -->
<div class="mt-4">
<a href="/check-report-status" class="btn btn-outline-primary me-2">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-search me-1" viewBox="0 0 16 16">
<path d="M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z"/>
</svg>
Check Report Status
</a>
<a href="/" class="btn btn-outline-secondary">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-house me-1" viewBox="0 0 16 16">
<path d="M8.707 1.5a1 1 0 0 0-1.414 0L.646 8.146a.5.5 0 0 0 .708.708L2 8.207V13.5A1.5 1.5 0 0 0 3.5 15h9a1.5 1.5 0 0 0 1.5-1.5V8.207l.646.647a.5.5 0 0 0 .708-.708L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.707 1.5ZM13 7.207V13.5a.5.5 0 0 1-.5.5h-9a.5.5 0 0 1-.5-.5V7.207l5-5 5 5Z"/>
</svg>
Return to Home
</a>
</div>
</div>
</div>
<!-- Optional: Additional Information Section -->
<div class="card shadow-sm">
<div class="card-body">
<h5 class="card-title">
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" fill="currentColor" class="bi bi-question-circle me-2" viewBox="0 0 16 16">
<path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z"/>
<path d="M5.255 5.786a.237.237 0 0 0 .241.247h.825c.138 0 .248-.113.266-.25.09-.656.54-1.134 1.342-1.134.686 0 1.314.343 1.314 1.168 0 .635-.374.927-.965 1.371-.673.489-1.206 1.06-1.168 1.987l.003.217a.25.25 0 0 0 .25.246h.811a.25.25 0 0 0 .25-.25v-.105c0-.718.273-.927 1.01-1.486.609-.463 1.244-.977 1.244-2.056 0-1.511-1.276-2.241-2.673-2.241-1.267 0-2.655.59-2.75 2.286zm1.557 5.763c0 .533.425.927 1.01.927.609 0 1.028-.394 1.028-.927 0-.552-.42-.94-1.029-.94-.584 0-1.009.388-1.009.94z"/>
</svg>
Need Help?
</h5>
<p>If you need to update your contact information or have questions about your report, please contact our Mosquito Control Unit at <strong>(123) 456-7890</strong> or <a href="mailto:mosquito@example.gov">mosquito@example.gov</a> and reference your Report ID.</p>
</div>
</div>
</div>
</div>
</div>
{{end}}

47
public-report/template/nuisance.html
View file

@ -163,7 +163,7 @@ document.addEventListener('DOMContentLoaded', function() {
</div>
<!-- Report Form -->
<form id="mosquitoNuisanceForm">
<form id="mosquitoNuisanceForm" action="/nuisance-submit" method="POST">
<!-- Mosquito Activity Section -->
<div class="form-section">
<div class="section-heading">
@ -179,7 +179,7 @@ document.addEventListener('DOMContentLoaded', function() {
<label class="form-label">When do you typically notice mosquitoes? (Select all that apply)</label>
<div class="row">
<div class="col-6 col-md-3">
<input type="checkbox" class="btn-check" id="earlyMorning" autocomplete="off">
<input type="checkbox" class="btn-check" id="earlyMorning" name="tod-early" autocomplete="off">
<label class="btn btn-outline-primary time-of-day-btn" for="earlyMorning">
<span class="time-of-day-icon"><i class="bi bi-sunrise"></i></span>
<span class="time-label">Early Morning</span>
@ -187,7 +187,7 @@ document.addEventListener('DOMContentLoaded', function() {
</label>
</div>
<div class="col-6 col-md-3">
<input type="checkbox" class="btn-check" id="daytime" autocomplete="off">
<input type="checkbox" class="btn-check" id="daytime" name="tod-day" autocomplete="off">
<label class="btn btn-outline-primary time-of-day-btn" for="daytime">
<span class="time-of-day-icon"><i class="bi bi-sun"></i></span>
<span class="time-label">Daytime</span>
@ -195,7 +195,7 @@ document.addEventListener('DOMContentLoaded', function() {
</label>
</div>
<div class="col-6 col-md-3">
<input type="checkbox" class="btn-check" id="evening" autocomplete="off">
<input type="checkbox" class="btn-check" id="evening" name="tod-evening" autocomplete="off">
<label class="btn btn-outline-primary time-of-day-btn" for="evening">
<span class="time-of-day-icon"><i class="bi bi-sunset"></i></span>
<span class="time-label">Evening</span>
@ -203,7 +203,7 @@ document.addEventListener('DOMContentLoaded', function() {
</label>
</div>
<div class="col-6 col-md-3">
<input type="checkbox" class="btn-check" id="night" autocomplete="off">
<input type="checkbox" class="btn-check" id="night" name="tod-night" autocomplete="off">
<label class="btn btn-outline-primary time-of-day-btn" for="night">
<span class="time-of-day-icon"><i class="bi bi-moon-stars"></i></span>
<span class="time-label">Night</span>
@ -218,7 +218,7 @@ document.addEventListener('DOMContentLoaded', function() {
<div class="row mb-4">
<div class="col-md-6">
<label for="duration" class="form-label">How long have you been experiencing this mosquito problem?</label>
<select class="form-select" id="duration">
<select class="form-select" name="duration">
<option value="just-noticed">Just noticed recently</option>
<option value="few-days">A few days</option>
<option value="1-2-weeks">1-2 weeks</option>
@ -231,7 +231,7 @@ document.addEventListener('DOMContentLoaded', function() {
<!-- Severity -->
<div class="col-md-6">
<label for="severityRange" class="form-label">How would you rate the severity of the mosquito problem?</label>
<input type="range" class="form-range" min="1" max="5" id="severityRange" oninput="document.getElementById('severityValue').innerText = this.value">
<input type="range" class="form-range" id="severityRange" min="1" max="5" name="severity" oninput="document.getElementById('severityValue').innerText = this.value">
<div class="severity-scale">
<div class="severity-item">
<div>Minor</div>
@ -255,8 +255,8 @@ document.addEventListener('DOMContentLoaded', function() {
<!-- Location -->
<div class="row">
<div class="col-md-12">
<label for="activityLocation" class="form-label">Where on your property do you notice the most mosquito activity?</label>
<select class="form-select" id="activityLocation">
<label for="location" class="form-label">Where on your property do you notice the most mosquito activity?</label>
<select class="form-select" name="location">
<option value="">Please select</option>
<option value="front-yard">Front yard</option>
<option value="backyard">Back yard</option>
@ -298,7 +298,7 @@ document.addEventListener('DOMContentLoaded', function() {
<h5 class="card-title">Stagnant Water</h5>
<p class="card-text">Green pools, ponds, fountains, or birdbaths that aren't maintained</p>
<div class="form-check">
<input class="form-check-input" type="checkbox" id="sourceStagnantWater">
<input class="form-check-input" type="checkbox" name="source-stagnant" id="sourceStagnantWater">
<label class="form-check-label" for="sourceStagnantWater">
I've noticed this
</label>
@ -317,7 +317,7 @@ document.addEventListener('DOMContentLoaded', function() {
<h5 class="card-title">Containers</h5>
<p class="card-text">Buckets, planters, toys, tires, or any items that collect rainwater</p>
<div class="form-check">
<input class="form-check-input" type="checkbox" id="sourceContainers">
<input class="form-check-input" type="checkbox" name="source-container" id="sourceContainers">
<label class="form-check-label" for="sourceContainers">
I've noticed this
</label>
@ -336,7 +336,7 @@ document.addEventListener('DOMContentLoaded', function() {
<h5 class="card-title">Roof & Gutters</h5>
<p class="card-text">Clogged gutters, flat roofs, or AC units that collect water</p>
<div class="form-check">
<input class="form-check-input" type="checkbox" id="sourceGutters">
<input class="form-check-input" type="checkbox" name="source-roof" id="sourceGutters">
<label class="form-check-label" for="sourceGutters">
I've noticed this
</label>
@ -354,7 +354,7 @@ document.addEventListener('DOMContentLoaded', function() {
<div class="row">
<div class="col-md-12">
<label for="otherSources" class="form-label">Have you noticed any other potential mosquito breeding sources?</label>
<textarea class="form-control" id="otherSources" rows="2" placeholder="Describe any other potential breeding sites you've noticed..."></textarea>
<textarea class="form-control" id="otherSources" name="source-description" rows="2" placeholder="Describe any other potential breeding sites you've noticed..."></textarea>
</div>
</div>
</div>
@ -373,7 +373,7 @@ document.addEventListener('DOMContentLoaded', function() {
<h5><i class="bi bi-house-door me-2"></i>Property Inspection</h5>
<p>Request a technician to inspect your property for mosquito sources. We'll contact you to schedule a convenient time.</p>
<div class="form-check">
<input class="form-check-input" type="radio" name="inspectionType" id="inspectionTypeProperty" value="property">
<input class="form-check-input" type="radio" name="inspection-type" id="inspectionTypeProperty" value="property">
<label class="form-check-label" for="inspectionTypeProperty">
<strong>Schedule a property inspection</strong>
</label>
@ -386,7 +386,7 @@ document.addEventListener('DOMContentLoaded', function() {
<h5><i class="bi bi-map me-2"></i>Neighborhood Inspection</h5>
<p>Request a general inspection of your neighborhood. We'll survey the area for potential mosquito breeding sources.</p>
<div class="form-check">
<input class="form-check-input" type="radio" name="inspectionType" id="inspectionTypeNeighborhood" value="neighborhood">
<input class="form-check-input" type="radio" name="inspection-type" id="inspectionTypeNeighborhood" value="neighborhood">
<label class="form-check-label" for="inspectionTypeNeighborhood">
<strong>Request neighborhood inspection</strong>
</label>
@ -405,7 +405,7 @@ document.addEventListener('DOMContentLoaded', function() {
<div class="row mb-3">
<div class="col-md-6">
<label for="preferredDateRange" class="form-label">Preferred Date Range</label>
<select class="form-select" id="preferredDateRange">
<select class="form-select" id="preferredDateRange" name="preferred-date-range">
<option value="">Select preferred dates</option>
<option value="next-week">Next week</option>
<option value="in-two-weeks">In two weeks</option>
@ -415,7 +415,7 @@ document.addEventListener('DOMContentLoaded', function() {
<div class="col-md-6">
<label for="preferredTime" class="form-label">Preferred Time of Day</label>
<select class="form-select" id="preferredTime">
<select class="form-select" id="preferredTime" name="preferred-time">
<option value="">Select preferred time</option>
<option value="morning">Morning (8am-12pm)</option>
<option value="afternoon">Afternoon (12pm-4pm)</option>
@ -425,7 +425,7 @@ document.addEventListener('DOMContentLoaded', function() {
</div>
<div class="form-check">
<input class="form-check-input" type="checkbox" id="requestCall">
<input class="form-check-input" type="checkbox" id="requestCall" name="request-call">
<label class="form-check-label" for="requestCall">
Please call me to schedule a specific appointment time
</label>
@ -445,28 +445,27 @@ document.addEventListener('DOMContentLoaded', function() {
<div class="row mb-4">
<div class="col-md-12">
<label for="address" class="form-label">Your Address</label>
<input type="text" class="form-control" id="address" placeholder="Enter your street address">
<input type="text" class="form-control" name="address" placeholder="Enter your street address">
</div>
</div>
<div class="row">
<div class="col-md-6 mb-3">
<label for="name" class="form-label">Your Name</label>
<input type="text" class="form-control" id="name">
<input type="text" class="form-control" name="name">
</div>
<div class="col-md-6 mb-3">
<label for="phone" class="form-label">Phone Number</label>
<input type="tel" class="form-control" id="phone">
<input type="tel" class="form-control" id="phone" name="phone">
</div>
<div class="col-md-12 mb-3">
<label for="email" class="form-label">Email Address</label>
<input type="email" class="form-control" id="email">
<input type="email" class="form-control" id="email" name="email">
<div class="form-text">We'll use this to send you a confirmation and follow-up information.</div>
</div>
</div>
</div>
<!-- Additional Information Section -->
<div class="form-section">
<div class="section-heading">
<i class="bi bi-card-text"></i>
@ -477,7 +476,7 @@ document.addEventListener('DOMContentLoaded', function() {
<div class="row">
<div class="col-md-12">
<label for="additionalInfo" class="form-label">Is there anything else you'd like us to know?</label>
<textarea class="form-control" id="additionalInfo" rows="4" placeholder="Additional details about the mosquito issue..."></textarea>
<textarea class="form-control" id="additionalInfo" name="additional-info" rows="4" placeholder="Additional details about the mosquito issue..."></textarea>
</div>
</div>
</div>