Add contact page in compliance flow
This commit is contained in:
parent
06345099eb
commit
095ab828b6
4 changed files with 187 additions and 4 deletions
168
html/template/rmo/district-compliance-contact.html
Normal file
168
html/template/rmo/district-compliance-contact.html
Normal file
|
|
@ -0,0 +1,168 @@
|
|||
{{ template "rmo/layout/base.html" . }}
|
||||
|
||||
{{ define "title" }}Contact Information{{ end }}
|
||||
{{ define "extraheader" }}
|
||||
<style>
|
||||
body {
|
||||
background-color: #f8f9fa;
|
||||
}
|
||||
|
||||
.progress-bar {
|
||||
background-color: #0d6efd;
|
||||
transition: width 0.3s ease;
|
||||
}
|
||||
|
||||
.benefit-box {
|
||||
background-color: #d1ecf1;
|
||||
border-left: 4px solid #0dcaf0;
|
||||
padding: 16px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.optional-badge {
|
||||
font-size: 0.85rem;
|
||||
color: #6c757d;
|
||||
font-weight: normal;
|
||||
}
|
||||
</style>
|
||||
{{ end }}
|
||||
{{ define "content" }}
|
||||
<div class="container-fluid px-3 py-3">
|
||||
<!-- Header -->
|
||||
<header class="text-center mb-4 pb-3 border-bottom">
|
||||
<div class="d-flex align-items-center justify-content-center mb-2">
|
||||
<img
|
||||
src="{{ .District.URLLogo }}"
|
||||
alt="{{ .District.Name }} logo"
|
||||
class="me-2"
|
||||
style="height: 40px; width: auto;"
|
||||
/>
|
||||
<h1 class="h5 mb-0">{{ .District.Name }}</h1>
|
||||
</div>
|
||||
<div class="text-muted small">
|
||||
<i class="bi bi-telephone"></i> {{ .District.OfficePhone }}
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<!-- Progress Bar -->
|
||||
<div class="mb-4">
|
||||
<div class="d-flex justify-content-between align-items-center mb-2">
|
||||
<span class="small text-muted">Step 6 of 10</span>
|
||||
</div>
|
||||
<div class="progress" style="height: 8px;">
|
||||
<div
|
||||
class="progress-bar"
|
||||
role="progressbar"
|
||||
style="width: 60%;"
|
||||
aria-valuenow="60"
|
||||
aria-valuemin="0"
|
||||
aria-valuemax="100"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Main Content -->
|
||||
<main>
|
||||
<h2 class="h4 mb-3">Contact information</h2>
|
||||
|
||||
<div class="benefit-box mb-4">
|
||||
<p class="mb-0">
|
||||
<i class="bi bi-info-circle"></i>
|
||||
<strong>Why share your contact information?</strong><br />
|
||||
<small>
|
||||
Providing your contact information helps the District review your
|
||||
response and coordinate with you if a visit is still needed. This
|
||||
can save time and prevent unnecessary follow-up actions.
|
||||
</small>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<form id="contact-form" method="POST" action="/compliance/contact">
|
||||
<!-- Name -->
|
||||
<div class="mb-3">
|
||||
<label for="contact-name" class="form-label fw-semibold">
|
||||
Name
|
||||
<span class="optional-badge">(Optional)</span>
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
class="form-control"
|
||||
id="contact-name"
|
||||
name="name"
|
||||
placeholder="Enter your name"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- Phone -->
|
||||
<div class="mb-3">
|
||||
<label for="contact-phone" class="form-label fw-semibold">
|
||||
Phone Number
|
||||
<span class="optional-badge">(Optional)</span>
|
||||
</label>
|
||||
<input
|
||||
type="tel"
|
||||
class="form-control"
|
||||
id="contact-phone"
|
||||
name="phone"
|
||||
placeholder="(555) 123-4567"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- Can we text? -->
|
||||
<div class="mb-3">
|
||||
<div class="form-check">
|
||||
<input
|
||||
class="form-check-input"
|
||||
type="checkbox"
|
||||
id="can-text"
|
||||
name="can_text"
|
||||
value="yes"
|
||||
/>
|
||||
<label class="form-check-label" for="can-text">
|
||||
You may send text messages to this number
|
||||
</label>
|
||||
</div>
|
||||
<small class="text-muted ms-4 d-block mt-1">
|
||||
Text messages allow for faster communication and updates
|
||||
</small>
|
||||
</div>
|
||||
|
||||
<!-- Email -->
|
||||
<div class="mb-4">
|
||||
<label for="contact-email" class="form-label fw-semibold">
|
||||
Email Address
|
||||
<span class="optional-badge">(Optional)</span>
|
||||
</label>
|
||||
<input
|
||||
type="email"
|
||||
class="form-control"
|
||||
id="contact-email"
|
||||
name="email"
|
||||
placeholder="your.email@example.com"
|
||||
/>
|
||||
<div class="form-text">
|
||||
We'll send you a confirmation and any updates about this request
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="alert alert-light border" role="alert">
|
||||
<small class="text-muted">
|
||||
<i class="bi bi-shield-check"></i>
|
||||
Your contact information will only be used for this compliance
|
||||
matter and will be kept confidential.
|
||||
</small>
|
||||
</div>
|
||||
|
||||
<!-- Navigation Buttons -->
|
||||
<div class="d-flex gap-2 mt-4">
|
||||
<a href="/compliance/access" class="btn btn-outline-secondary">
|
||||
Back
|
||||
</a>
|
||||
<button type="submit" class="btn btn-primary flex-grow-1">
|
||||
Continue
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</main>
|
||||
</div>
|
||||
{{ end }}
|
||||
|
|
@ -308,12 +308,10 @@
|
|||
|
||||
<!-- Navigation Buttons -->
|
||||
<div class="d-flex gap-2 mt-4">
|
||||
<a href="/compliance/photos" class="btn btn-outline-secondary">
|
||||
<a href="../compliance/evidence" class="btn btn-outline-secondary">
|
||||
Back
|
||||
</a>
|
||||
<button type="submit" class="btn btn-primary flex-grow-1">
|
||||
Continue
|
||||
</button>
|
||||
<a class="btn btn-primary flex-grow-1" href="contact"> Continue </a>
|
||||
</div>
|
||||
</form>
|
||||
</main>
|
||||
|
|
|
|||
|
|
@ -54,6 +54,22 @@ func getDistrictComplianceConcern(w http.ResponseWriter, r *http.Request) {
|
|||
)
|
||||
}
|
||||
|
||||
func getDistrictComplianceContact(w http.ResponseWriter, r *http.Request) {
|
||||
district, err := districtBySlug(r)
|
||||
if err != nil {
|
||||
respondError(w, "Failed to lookup organization", err, http.StatusBadRequest)
|
||||
return
|
||||
}
|
||||
html.RenderOrError(
|
||||
w,
|
||||
"rmo/district-compliance-contact.html",
|
||||
ContentNuisance{
|
||||
District: newContentDistrict(district),
|
||||
URL: makeContentURL(nil),
|
||||
},
|
||||
)
|
||||
}
|
||||
|
||||
func getDistrictComplianceEvidence(w http.ResponseWriter, r *http.Request) {
|
||||
district, err := districtBySlug(r)
|
||||
if err != nil {
|
||||
|
|
|
|||
|
|
@ -19,6 +19,7 @@ func Router(r *mux.Router) {
|
|||
r.HandleFunc("/district/{slug}/compliance", getDistrictCompliance).Methods("GET")
|
||||
r.HandleFunc("/district/{slug}/compliance/address", getDistrictComplianceAddress).Methods("GET")
|
||||
r.HandleFunc("/district/{slug}/compliance/concern", getDistrictComplianceConcern).Methods("GET")
|
||||
r.HandleFunc("/district/{slug}/compliance/contact", getDistrictComplianceContact).Methods("GET")
|
||||
r.HandleFunc("/district/{slug}/compliance/evidence", getDistrictComplianceEvidence).Methods("GET")
|
||||
r.HandleFunc("/district/{slug}/compliance/permission", getDistrictCompliancePermission).Methods("GET")
|
||||
r.HandleFunc("/district/{slug}/nuisance", getNuisanceDistrict).Methods("GET")
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue