nidus-sync/rmo/template/submit-complete.html

137 lines
6 KiB
HTML
Raw Normal View History

{{template "base.html" .}}
{{define "title"}}Report 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-8">
<!-- Success Card -->
<div class="card shadow-sm border-success mb-4">
<div class="card-header bg-success text-white">
<h3 class="my-2">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" class="bi bi-check-circle-fill me-2" 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>
Report Successfully Submitted
</h3>
</div>
<div class="card-body p-4">
<div class="text-center mb-4">
<div class="alert alert-info py-3">
<strong>Your Report ID:</strong>
<span class="fs-4 fw-bold">{{.ReportID|publicReportID}}</span>
</div>
</div>
<hr class="my-4">
<div>
<h4 class="mb-3">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" class="bi bi-bell me-2" viewBox="0 0 16 16">
<path d="M8 16a2 2 0 0 0 2-2H6a2 2 0 0 0 2 2zM8 1.918l-.797.161A4.002 4.002 0 0 0 4 6c0 .628-.134 2.197-.459 3.742-.16.767-.376 1.566-.663 2.258h10.244c-.287-.692-.502-1.49-.663-2.258C12.134 8.197 12 6.628 12 6a4.002 4.002 0 0 0-3.203-3.92L8 1.917zM14.22 12c.223.447.481.801.78 1H1c.299-.199.557-.553.78-1C2.68 10.2 3 6.88 3 6c0-2.42 1.72-4.44 4.005-4.901a1 1 0 1 1 1.99 0A5.002 5.002 0 0 1 13 6c0 .88.32 4.2 1.22 6z"/>
</svg>
Get Updates
</h4>
<p>Provide your contact information to receive updates about your report.</p>
<form id="notificationForm" action="/register-notifications" method="post" class="needs-validation">
<input type="hidden" name="report_id" value="{{.ReportID}}">
<div class="mb-3">
<label for="email" class="form-label">Email Address</label>
<div class="input-group">
<span class="input-group-text">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-envelope" viewBox="0 0 16 16">
<path d="M0 4a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V4Zm2-1a1 1 0 0 0-1 1v.217l7 4.2 7-4.2V4a1 1 0 0 0-1-1H2Zm13 2.383-4.708 2.825L15 11.105V5.383Zm-.034 6.876-5.64-3.471L8 9.583l-1.326-.795-5.64 3.47A1 1 0 0 0 2 13h12a1 1 0 0 0 .966-.741ZM1 11.105l4.708-2.897L1 5.383v5.722Z"/>
</svg>
</span>
<input type="email" class="form-control" id="email" name="email" placeholder="your@email.com">
</div>
</div>
<div class="mb-3">
<label for="phone" class="form-label">Phone Number (for SMS updates)</label>
<div class="input-group">
<span class="input-group-text">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-phone" viewBox="0 0 16 16">
<path d="M11 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h6zM5 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H5z"/>
<path d="M8 14a1 1 0 1 0 0-2 1 1 0 0 0 0 2z"/>
</svg>
</span>
<input type="tel" class="form-control" id="phone" name="phone" placeholder="(123) 456-7890">
</div>
</div>
<div class="form-check mb-3 form-check">
<input class="form-check-input" type="checkbox" name="consent" required>
<label class="form-check-label" for="consent">
I consent to receiving updates about this report
</label>
<div class="invalid-feedback">
You must consent to receive notifications.
</div>
</div>
<div class="form-check mb-3 form-check">
<input class="form-check-input" type="checkbox" name="subscribe"/>
<label class="form-check-label" for="subscribe">
{{ if eq .District nil }}
I'd like to subscribe to periodic updates from my mosquito control district.
{{ else }}
I'd like to subscribe to periodic updates from {{ .District.Name }}
{{ end }}
</label>
</div>
<button type="submit" class="btn btn-primary">Register for Updates</button>
</form>
</div>
<hr class="my-4">
<!-- Status Check Section -->
<div class="mb-4">
<h4 class="mb-3">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" class="bi bi-search me-2" 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 Your Report Status
</h4>
<p>You can check the status of your report at any time using your Report ID.</p>
<a href="/status/{{.ReportID}}" class="btn btn-outline-primary">
Check Status
</a>
</div>
<div class="row">
<div class="mb-4 text-center">
{{ if not (eq .District nil) }}
<p>Your report will be handled by</p>
<p><b>{{ .District.Name }}</b></p>
<a href="{{ .District.URLWebsite }}"><img class="logo" src="{{ .District.URLLogo }}" /></a>
{{ end }}
</div>
</div>
</div>
</div>
<!-- Navigation Links -->
<div class="text-center">
<a href="{{ .URL.Nuisance }}" class="btn btn-outline-success">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-plus-circle me-1" 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 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z"/>
</svg>
Submit Another Report
</a>
</div>
</div>
</div>
</div>
{{end}}