Add quick report page
This commit is contained in:
parent
d19c3fe265
commit
7b48f6eddf
5 changed files with 312 additions and 19 deletions
14
endpoint.go
14
endpoint.go
|
|
@ -219,6 +219,20 @@ func getServiceRequestPool(w http.ResponseWriter, r *http.Request) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
func getServiceRequestQuick(w http.ResponseWriter, r *http.Request) {
|
||||||
|
err := htmlServiceRequestQuick(w)
|
||||||
|
if err != nil {
|
||||||
|
respondError(w, "Failed to generate service request quick page", err, http.StatusInternalServerError)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
func getServiceRequestQuickConfirmation(w http.ResponseWriter, r *http.Request) {
|
||||||
|
err := htmlServiceRequestQuickConfirmation(w)
|
||||||
|
if err != nil {
|
||||||
|
respondError(w, "Failed to generate service request quick confirmation page", err, http.StatusInternalServerError)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
func getServiceRequestUpdates(w http.ResponseWriter, r *http.Request) {
|
func getServiceRequestUpdates(w http.ResponseWriter, r *http.Request) {
|
||||||
err := htmlServiceRequestUpdates(w)
|
err := htmlServiceRequestUpdates(w)
|
||||||
if err != nil {
|
if err != nil {
|
||||||
|
|
|
||||||
50
html.go
50
html.go
|
|
@ -13,28 +13,30 @@ import (
|
||||||
|
|
||||||
"github.com/Gleipnir-Technology/nidus-sync/models"
|
"github.com/Gleipnir-Technology/nidus-sync/models"
|
||||||
"github.com/aarondl/opt/null"
|
"github.com/aarondl/opt/null"
|
||||||
"github.com/riverqueue/river/rivershared/util/slogutil"
|
//"github.com/riverqueue/river/rivershared/util/slogutil"
|
||||||
"github.com/stephenafamo/bob/dialect/psql/sm"
|
"github.com/stephenafamo/bob/dialect/psql/sm"
|
||||||
)
|
)
|
||||||
|
|
||||||
var (
|
var (
|
||||||
dashboard = newBuiltTemplate("dashboard", "authenticated")
|
dashboard = newBuiltTemplate("dashboard", "authenticated")
|
||||||
oauthPrompt = newBuiltTemplate("oauth-prompt", "authenticated")
|
oauthPrompt = newBuiltTemplate("oauth-prompt", "authenticated")
|
||||||
report = newBuiltTemplate("report", "base")
|
report = newBuiltTemplate("report", "base")
|
||||||
reportConfirmation = newBuiltTemplate("report-confirmation", "base")
|
reportConfirmation = newBuiltTemplate("report-confirmation", "base")
|
||||||
reportContribute = newBuiltTemplate("report-contribute", "base")
|
reportContribute = newBuiltTemplate("report-contribute", "base")
|
||||||
reportDetail = newBuiltTemplate("report-detail", "base")
|
reportDetail = newBuiltTemplate("report-detail", "base")
|
||||||
reportEvidence = newBuiltTemplate("report-evidence", "base")
|
reportEvidence = newBuiltTemplate("report-evidence", "base")
|
||||||
reportSchedule = newBuiltTemplate("report-schedule", "base")
|
reportSchedule = newBuiltTemplate("report-schedule", "base")
|
||||||
reportUpdate = newBuiltTemplate("report-update", "base")
|
reportUpdate = newBuiltTemplate("report-update", "base")
|
||||||
serviceRequest = newBuiltTemplate("service-request", "base")
|
serviceRequest = newBuiltTemplate("service-request", "base")
|
||||||
serviceRequestDetail = newBuiltTemplate("service-request-detail", "base")
|
serviceRequestDetail = newBuiltTemplate("service-request-detail", "base")
|
||||||
serviceRequestLocation = newBuiltTemplate("service-request-location", "base")
|
serviceRequestLocation = newBuiltTemplate("service-request-location", "base")
|
||||||
serviceRequestMosquito = newBuiltTemplate("service-request-mosquito", "base")
|
serviceRequestMosquito = newBuiltTemplate("service-request-mosquito", "base")
|
||||||
serviceRequestPool = newBuiltTemplate("service-request-pool", "base")
|
serviceRequestPool = newBuiltTemplate("service-request-pool", "base")
|
||||||
serviceRequestUpdates = newBuiltTemplate("service-request-updates", "base")
|
serviceRequestQuick = newBuiltTemplate("service-request-quick", "base")
|
||||||
signin = newBuiltTemplate("signin", "base")
|
serviceRequestQuickConfirmation = newBuiltTemplate("service-request-quick-confirmation", "base")
|
||||||
signup = newBuiltTemplate("signup", "base")
|
serviceRequestUpdates = newBuiltTemplate("service-request-updates", "base")
|
||||||
|
signin = newBuiltTemplate("signin", "base")
|
||||||
|
signup = newBuiltTemplate("signup", "base")
|
||||||
)
|
)
|
||||||
var components = [...]string{"header"}
|
var components = [...]string{"header"}
|
||||||
|
|
||||||
|
|
@ -256,6 +258,16 @@ func htmlServiceRequestPool(w io.Writer) error {
|
||||||
return serviceRequestPool.ExecuteTemplate(w, data)
|
return serviceRequestPool.ExecuteTemplate(w, data)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
func htmlServiceRequestQuick(w io.Writer) error {
|
||||||
|
data := ContentPlaceholder{}
|
||||||
|
return serviceRequestQuick.ExecuteTemplate(w, data)
|
||||||
|
}
|
||||||
|
|
||||||
|
func htmlServiceRequestQuickConfirmation(w io.Writer) error {
|
||||||
|
data := ContentPlaceholder{}
|
||||||
|
return serviceRequestQuickConfirmation.ExecuteTemplate(w, data)
|
||||||
|
}
|
||||||
|
|
||||||
func htmlServiceRequestUpdates(w io.Writer) error {
|
func htmlServiceRequestUpdates(w io.Writer) error {
|
||||||
data := ContentPlaceholder{}
|
data := ContentPlaceholder{}
|
||||||
return serviceRequestUpdates.ExecuteTemplate(w, data)
|
return serviceRequestUpdates.ExecuteTemplate(w, data)
|
||||||
|
|
@ -316,7 +328,7 @@ func parseFromDisk(files []string) (*template.Template, error) {
|
||||||
for _, f := range components {
|
for _, f := range components {
|
||||||
paths = append(paths, "templates/components/"+f+".html")
|
paths = append(paths, "templates/components/"+f+".html")
|
||||||
}
|
}
|
||||||
slog.Info("Rendering templates from disk", slog.Any("paths", slogutil.SliceString(paths)))
|
//slog.Info("Rendering templates from disk", slog.Any("paths", slogutil.SliceString(paths)))
|
||||||
templ, err := template.New(name).Funcs(funcMap).ParseFiles(paths...)
|
templ, err := template.New(name).Funcs(funcMap).ParseFiles(paths...)
|
||||||
if err != nil {
|
if err != nil {
|
||||||
return nil, fmt.Errorf("Failed to parse %s: %v", paths, err)
|
return nil, fmt.Errorf("Failed to parse %s: %v", paths, err)
|
||||||
|
|
|
||||||
2
main.go
2
main.go
|
|
@ -76,6 +76,8 @@ func main() {
|
||||||
r.Get("/service-request-location", getServiceRequestLocation)
|
r.Get("/service-request-location", getServiceRequestLocation)
|
||||||
r.Get("/service-request-mosquito", getServiceRequestMosquito)
|
r.Get("/service-request-mosquito", getServiceRequestMosquito)
|
||||||
r.Get("/service-request-pool", getServiceRequestPool)
|
r.Get("/service-request-pool", getServiceRequestPool)
|
||||||
|
r.Get("/service-request-quick", getServiceRequestQuick)
|
||||||
|
r.Get("/service-request-quick-confirmation", getServiceRequestQuickConfirmation)
|
||||||
r.Get("/service-request-updates", getServiceRequestUpdates)
|
r.Get("/service-request-updates", getServiceRequestUpdates)
|
||||||
r.Post("/signin", postSignin)
|
r.Post("/signin", postSignin)
|
||||||
r.Get("/signup", getSignup)
|
r.Get("/signup", getSignup)
|
||||||
|
|
|
||||||
113
templates/service-request-quick-confirmation.html
Normal file
113
templates/service-request-quick-confirmation.html
Normal file
|
|
@ -0,0 +1,113 @@
|
||||||
|
{{template "base.html" .}}
|
||||||
|
|
||||||
|
{{define "title"}}Dash{{end}}
|
||||||
|
{{define "style"}}
|
||||||
|
.district-logo {
|
||||||
|
max-height: 60px;
|
||||||
|
width: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.success-icon {
|
||||||
|
width: 100px;
|
||||||
|
height: 100px;
|
||||||
|
background-color: #28a745;
|
||||||
|
border-radius: 50%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
margin: 0 auto 2rem;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.confirmation-card {
|
||||||
|
max-width: 600px;
|
||||||
|
margin: 0 auto;
|
||||||
|
border-radius: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-button {
|
||||||
|
padding: 12px 30px;
|
||||||
|
border-radius: 30px;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 767px) {
|
||||||
|
.header-title {
|
||||||
|
font-size: 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.success-icon {
|
||||||
|
width: 80px;
|
||||||
|
height: 80px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
{{end}}
|
||||||
|
{{define "content"}}
|
||||||
|
<!-- Header -->
|
||||||
|
<header class="bg-light py-2 mb-4">
|
||||||
|
<div class="container">
|
||||||
|
<div class="row align-items-center">
|
||||||
|
<div class="col-9">
|
||||||
|
<h1 class="district-name header-title mb-0">[District Name]</h1>
|
||||||
|
</div>
|
||||||
|
<div class="col-3 text-end">
|
||||||
|
<img src="placeholder-logo.png" alt="District Logo" class="district-logo">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<!-- Main Content -->
|
||||||
|
<main class="container mb-5 py-4">
|
||||||
|
<div class="row justify-content-center">
|
||||||
|
<div class="col-lg-10">
|
||||||
|
<div class="card shadow confirmation-card">
|
||||||
|
<div class="card-body p-4 p-md-5 text-center">
|
||||||
|
<!-- Success Icon -->
|
||||||
|
<div class="success-icon">
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="50" height="50" fill="currentColor" class="bi bi-check-lg" viewBox="0 0 16 16">
|
||||||
|
<path d="M12.736 3.97a.733.733 0 0 1 1.047 0c.286.289.29.756.01 1.05L7.88 12.01a.733.733 0 0 1-1.065.02L3.217 8.384a.757.757 0 0 1 0-1.06.733.733 0 0 1 1.047 0l3.052 3.093 5.4-6.425a.247.247 0 0 1 .02-.022Z"/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<h2 class="mb-4">Report Received!</h2>
|
||||||
|
|
||||||
|
<p class="lead mb-4">Thank you for contributing to the health and well-being of our community.</p>
|
||||||
|
|
||||||
|
<div class="mb-4 p-3 bg-light rounded-3">
|
||||||
|
<p class="mb-0">Your mosquito report has been submitted successfully and will be reviewed by our team. Your effort helps us identify problem areas and better manage mosquito populations throughout our district.</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p class="text-muted mb-4">Report ID: <span class="fw-bold">#MM<script>document.write(Math.floor(Math.random() * 10000) + 10000)</script></span></p>
|
||||||
|
|
||||||
|
<a href="/" class="btn btn-primary home-button">
|
||||||
|
Return Home
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Additional Info Card -->
|
||||||
|
<div class="card mt-4 border-0 bg-light">
|
||||||
|
<div class="card-body">
|
||||||
|
<h5>What happens next?</h5>
|
||||||
|
<p class="mb-0">Our team reviews all reports daily. Depending on the nature of your report, we may deploy field technicians to assess the area or add it to our scheduled mosquito control activities. For urgent matters, we prioritize responses based on public health risk factors.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<!-- Footer -->
|
||||||
|
<footer class="bg-dark text-white py-3 mt-auto">
|
||||||
|
<div class="container">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-6">
|
||||||
|
<p class="mb-0 small">© 2023 [District Name] Mosquito Management District</p>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-6 text-md-end">
|
||||||
|
<p class="mb-0 small">Contact: (555) 123-4567</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
{{end}}
|
||||||
152
templates/service-request-quick.html
Normal file
152
templates/service-request-quick.html
Normal file
|
|
@ -0,0 +1,152 @@
|
||||||
|
{{template "base.html" .}}
|
||||||
|
|
||||||
|
{{define "title"}}Dash{{end}}
|
||||||
|
{{define "style"}}
|
||||||
|
.district-logo {
|
||||||
|
max-height: 60px;
|
||||||
|
width: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.photo-upload-area {
|
||||||
|
border: 2px dashed #ccc;
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 20px;
|
||||||
|
text-align: center;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
background-color: #f9f9f9;
|
||||||
|
}
|
||||||
|
|
||||||
|
.photo-preview {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 10px;
|
||||||
|
margin-top: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.photo-preview img {
|
||||||
|
width: 80px;
|
||||||
|
height: 80px;
|
||||||
|
object-fit: cover;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.submit-btn {
|
||||||
|
padding: 15px 0;
|
||||||
|
font-size: 1.25rem;
|
||||||
|
border-radius: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.location-info {
|
||||||
|
background-color: #e9f5ff;
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 12px;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
font-size: 0.9rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 767px) {
|
||||||
|
.header-title {
|
||||||
|
font-size: 1.5rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
{{end}}
|
||||||
|
{{define "content"}}
|
||||||
|
<!-- Header -->
|
||||||
|
<header class="bg-light py-2 mb-4">
|
||||||
|
<div class="container">
|
||||||
|
<div class="row align-items-center">
|
||||||
|
<div class="col-9">
|
||||||
|
<h1 class="district-name header-title mb-0">[District Name]</h1>
|
||||||
|
</div>
|
||||||
|
<div class="col-3 text-end">
|
||||||
|
<img src="placeholder-logo.png" alt="District Logo" class="district-logo">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<!-- Main Content -->
|
||||||
|
<main class="container mb-5">
|
||||||
|
<div class="row justify-content-center">
|
||||||
|
<div class="col-lg-8">
|
||||||
|
<div class="card shadow-sm">
|
||||||
|
<div class="card-body p-4">
|
||||||
|
<h2 class="card-title text-center mb-4">Quick Mosquito Report</h2>
|
||||||
|
|
||||||
|
<!-- Form -->
|
||||||
|
<form action="/service-request-quick-confirmation" method="get">
|
||||||
|
<!-- Location Automatic Collection Note -->
|
||||||
|
<div class="location-info d-flex align-items-center mb-4">
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" class="bi bi-geo-alt me-2" viewBox="0 0 16 16">
|
||||||
|
<path d="M12.166 8.94c-.524 1.062-1.234 2.12-1.96 3.07A31.493 31.493 0 0 1 8 14.58a31.481 31.481 0 0 1-2.206-2.57c-.726-.95-1.436-2.008-1.96-3.07C3.304 7.867 3 6.862 3 6a5 5 0 0 1 10 0c0 .862-.305 1.867-.834 2.94zM8 16s6-5.686 6-10A6 6 0 0 0 2 6c0 4.314 6 10 6 10z"/>
|
||||||
|
<path d="M8 8a2 2 0 1 1 0-4 2 2 0 0 1 0 4zm0 1a3 3 0 1 0 0-6 3 3 0 0 0 0 6z"/>
|
||||||
|
</svg>
|
||||||
|
<span>Your location and current time will be automatically collected with your report.</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Photo Upload -->
|
||||||
|
<div class="mb-4">
|
||||||
|
<label for="photos" class="form-label fw-bold">Photos (Optional)</label>
|
||||||
|
<div class="photo-upload-area">
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="currentColor" class="bi bi-camera mb-2" viewBox="0 0 16 16">
|
||||||
|
<path d="M15 12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1h1.172a3 3 0 0 0 2.12-.879l.83-.828A1 1 0 0 1 6.827 3h2.344a1 1 0 0 1 .707.293l.828.828A3 3 0 0 0 12.828 5H14a1 1 0 0 1 1 1v6zM2 4a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2h-1.172a2 2 0 0 1-1.414-.586l-.828-.828A2 2 0 0 0 9.172 2H6.828a2 2 0 0 0-1.414.586l-.828.828A2 2 0 0 1 3.172 4H2z"/>
|
||||||
|
<path d="M8 11a2.5 2.5 0 1 1 0-5 2.5 2.5 0 0 1 0 5zm0 1a3.5 3.5 0 1 0 0-7 3.5 3.5 0 0 0 0 7zM3 6.5a.5.5 0 1 1-1 0 .5.5 0 0 1 1 0z"/>
|
||||||
|
</svg>
|
||||||
|
<div>
|
||||||
|
<input type="file" id="photos" class="d-none" accept="image/*" multiple>
|
||||||
|
<button type="button" class="btn btn-outline-primary mb-2" onclick="document.getElementById('photos').click()">Add Photos</button>
|
||||||
|
</div>
|
||||||
|
<small class="d-block text-muted">Take pictures of the mosquito problem area</small>
|
||||||
|
|
||||||
|
<!-- Photo Preview Area (would be populated by JavaScript) -->
|
||||||
|
<div class="photo-preview mt-3">
|
||||||
|
<!-- Example preview images (these would be dynamically added) -->
|
||||||
|
<img src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80' viewBox='0 0 80 80' fill='%23dddddd'%3E%3Crect width='80' height='80' fill='%23eeeeee'/%3E%3Ctext x='50%25' y='50%25' dominant-baseline='middle' text-anchor='middle' font-family='sans-serif' font-size='12' fill='%23999999'%3EPreview%3C/text%3E%3C/svg%3E" alt="Preview">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Comments -->
|
||||||
|
<div class="mb-4">
|
||||||
|
<label for="comments" class="form-label fw-bold">Comments</label>
|
||||||
|
<textarea class="form-control" id="comments" rows="4" placeholder="Describe the mosquito issue (e.g., standing water, high mosquito activity, time of day they're most active)"></textarea>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Submit Button -->
|
||||||
|
<button type="submit" class="btn btn-success w-100 submit-btn mt-4">
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" class="bi bi-send-fill me-2" viewBox="0 0 16 16">
|
||||||
|
<path d="M15.964.686a.5.5 0 0 0-.65-.65L.767 5.855H.766l-.452.18a.5.5 0 0 0-.082.887l.41.26.001.002 4.995 3.178 3.178 4.995.002.002.26.41a.5.5 0 0 0 .886-.083l6-15Zm-1.833 1.89L6.637 10.07l-.215-.338a.5.5 0 0 0-.154-.154l-.338-.215 7.494-7.494 1.178-.471-.47 1.178Z"/>
|
||||||
|
</svg>
|
||||||
|
Submit Report
|
||||||
|
</button>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Back Link -->
|
||||||
|
<div class="text-center mt-3">
|
||||||
|
<a href="javascript:history.back()" class="text-decoration-none">
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrow-left me-1" viewBox="0 0 16 16">
|
||||||
|
<path fill-rule="evenodd" d="M15 8a.5.5 0 0 0-.5-.5H2.707l3.147-3.146a.5.5 0 1 0-.708-.708l-4 4a.5.5 0 0 0 0 .708l4 4a.5.5 0 0 0 .708-.708L2.707 8.5H14.5A.5.5 0 0 0 15 8z"/>
|
||||||
|
</svg>
|
||||||
|
Back to home
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<!-- Footer -->
|
||||||
|
<footer class="bg-dark text-white py-3 mt-auto">
|
||||||
|
<div class="container">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-6">
|
||||||
|
<p class="mb-0 small">© 2023 [District Name] Mosquito Management District</p>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-6 text-md-end">
|
||||||
|
<p class="mb-0 small">Contact: (555) 123-4567</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
{{end}}
|
||||||
Loading…
Add table
Add a link
Reference in a new issue