Add mocks for data entry
This commit is contained in:
parent
bd16f69e28
commit
62dbfb3ebc
7 changed files with 552 additions and 0 deletions
|
|
@ -70,6 +70,15 @@ func getPhoneCall(w http.ResponseWriter, r *http.Request) {
|
||||||
htmlPhoneCall(w)
|
htmlPhoneCall(w)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
func getDataEntry(w http.ResponseWriter, r *http.Request) {
|
||||||
|
htmlDataEntry(w)
|
||||||
|
}
|
||||||
|
func getDataEntryBad(w http.ResponseWriter, r *http.Request) {
|
||||||
|
htmlDataEntryBad(w)
|
||||||
|
}
|
||||||
|
func getDataEntryGood(w http.ResponseWriter, r *http.Request) {
|
||||||
|
htmlDataEntryGood(w)
|
||||||
|
}
|
||||||
func getQRCodeReport(w http.ResponseWriter, r *http.Request) {
|
func getQRCodeReport(w http.ResponseWriter, r *http.Request) {
|
||||||
code := chi.URLParam(r, "code")
|
code := chi.URLParam(r, "code")
|
||||||
if code == "" {
|
if code == "" {
|
||||||
|
|
|
||||||
1
go-geojson2h3
Submodule
1
go-geojson2h3
Submodule
|
|
@ -0,0 +1 @@
|
||||||
|
Subproject commit c2ff1a96abb4f4418b4741c1d868e20881cdc9bf
|
||||||
18
html.go
18
html.go
|
|
@ -41,6 +41,9 @@ var (
|
||||||
|
|
||||||
// Unauthenticated pages
|
// Unauthenticated pages
|
||||||
var (
|
var (
|
||||||
|
dataEntry = newBuiltTemplate("data-entry", "base")
|
||||||
|
dataEntryGood = newBuiltTemplate("data-entry-good", "base")
|
||||||
|
dataEntryBad = newBuiltTemplate("data-entry-bad", "base")
|
||||||
phoneCall = newBuiltTemplate("phone-call", "base")
|
phoneCall = newBuiltTemplate("phone-call", "base")
|
||||||
report = newBuiltTemplate("report", "base")
|
report = newBuiltTemplate("report", "base")
|
||||||
reportConfirmation = newBuiltTemplate("report-confirmation", "base")
|
reportConfirmation = newBuiltTemplate("report-confirmation", "base")
|
||||||
|
|
@ -276,6 +279,21 @@ func htmlCell(ctx context.Context, w http.ResponseWriter, user *models.User, c i
|
||||||
renderOrError(w, cell, &data)
|
renderOrError(w, cell, &data)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
func htmlDataEntry(w http.ResponseWriter) {
|
||||||
|
data := ContentPlaceholder{}
|
||||||
|
renderOrError(w, dataEntry, data)
|
||||||
|
}
|
||||||
|
|
||||||
|
func htmlDataEntryBad(w http.ResponseWriter) {
|
||||||
|
data := ContentPlaceholder{}
|
||||||
|
renderOrError(w, dataEntryBad, data)
|
||||||
|
}
|
||||||
|
|
||||||
|
func htmlDataEntryGood(w http.ResponseWriter) {
|
||||||
|
data := ContentPlaceholder{}
|
||||||
|
renderOrError(w, dataEntryGood, data)
|
||||||
|
}
|
||||||
|
|
||||||
func htmlDashboard(ctx context.Context, w http.ResponseWriter, user *models.User) {
|
func htmlDashboard(ctx context.Context, w http.ResponseWriter, user *models.User) {
|
||||||
org, err := user.Organization().One(ctx, db.PGInstance.BobDB)
|
org, err := user.Organization().One(ctx, db.PGInstance.BobDB)
|
||||||
if err != nil {
|
if err != nil {
|
||||||
|
|
|
||||||
4
main.go
4
main.go
|
|
@ -94,6 +94,10 @@ func main() {
|
||||||
r.Get("/arcgis/oauth/callback", getArcgisOauthCallback)
|
r.Get("/arcgis/oauth/callback", getArcgisOauthCallback)
|
||||||
r.Get("/favicon.ico", getFavicon)
|
r.Get("/favicon.ico", getFavicon)
|
||||||
|
|
||||||
|
r.Get("/mock/data-entry", getDataEntry)
|
||||||
|
r.Get("/mock/data-entry/bad", getDataEntryBad)
|
||||||
|
r.Get("/mock/data-entry/good", getDataEntryGood)
|
||||||
|
|
||||||
r.Get("/oauth/refresh", getOAuthRefresh)
|
r.Get("/oauth/refresh", getOAuthRefresh)
|
||||||
|
|
||||||
r.Get("/phone-call", getPhoneCall)
|
r.Get("/phone-call", getPhoneCall)
|
||||||
|
|
|
||||||
198
templates/data-entry-bad.html
Normal file
198
templates/data-entry-bad.html
Normal file
|
|
@ -0,0 +1,198 @@
|
||||||
|
{{template "base.html" .}}
|
||||||
|
|
||||||
|
{{define "title"}}Data Entry{{end}}
|
||||||
|
{{define "style"}}
|
||||||
|
.results-container {
|
||||||
|
max-width: 1000px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
.error-code {
|
||||||
|
font-family: monospace;
|
||||||
|
padding: 0.2rem 0.4rem;
|
||||||
|
background-color: rgba(220, 53, 69, 0.1);
|
||||||
|
border-radius: 0.2rem;
|
||||||
|
color: #dc3545;
|
||||||
|
}
|
||||||
|
.error-table {
|
||||||
|
font-size: 0.9rem;
|
||||||
|
}
|
||||||
|
.error-suggestions {
|
||||||
|
color: #495057;
|
||||||
|
}
|
||||||
|
.table-header-error {
|
||||||
|
width: 40%;
|
||||||
|
}
|
||||||
|
.table-header-suggestion {
|
||||||
|
width: 40%;
|
||||||
|
}
|
||||||
|
.table-header-line {
|
||||||
|
width: 20%;
|
||||||
|
}
|
||||||
|
{{end}}
|
||||||
|
{{define "content"}}
|
||||||
|
<div class="container mt-4 results-container mb-5">
|
||||||
|
<div class="d-flex justify-content-between align-items-center mb-4">
|
||||||
|
<h2>Upload Failed: pools-data-2023.csv</h2>
|
||||||
|
<span class="badge bg-danger rounded-pill">
|
||||||
|
<i class="bi bi-x-circle me-1"></i> Validation Errors
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="alert alert-danger" role="alert">
|
||||||
|
<div class="d-flex align-items-center">
|
||||||
|
<div class="me-3">
|
||||||
|
<i class="bi bi-exclamation-triangle-fill" style="font-size: 2rem;"></i>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h4 class="alert-heading">CSV Upload Failed</h4>
|
||||||
|
<p class="mb-0">Your file contains several errors that must be fixed before it can be processed. Details are provided below.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="card mb-4">
|
||||||
|
<div class="card-header bg-light d-flex justify-content-between align-items-center">
|
||||||
|
<h5 class="mb-0">Error Summary</h5>
|
||||||
|
<a href="#" class="btn btn-sm btn-outline-secondary">
|
||||||
|
<i class="bi bi-download me-1"></i> Download Error Log
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="card-body">
|
||||||
|
<p>We found <strong>12 errors</strong> in your CSV file. The most common issues are:</p>
|
||||||
|
<ul>
|
||||||
|
<li><strong>Missing required column:</strong> The "Latitude" column is not present in your file</li>
|
||||||
|
<li><strong>Invalid data format:</strong> 8 GPS coordinates contain non-numeric values</li>
|
||||||
|
<li><strong>Empty required fields:</strong> 3 records are missing Plat ID values</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<div class="alert alert-info" role="alert">
|
||||||
|
<i class="bi bi-info-circle me-2"></i>
|
||||||
|
<strong>Tip:</strong> Make sure your column names exactly match the required format. Column names are case-sensitive.
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="card mb-4">
|
||||||
|
<div class="card-header bg-light">
|
||||||
|
<h5 class="mb-0">Detailed Error Report</h5>
|
||||||
|
</div>
|
||||||
|
<div class="table-responsive">
|
||||||
|
<table class="table table-striped error-table mb-0">
|
||||||
|
<thead class="table-light">
|
||||||
|
<tr>
|
||||||
|
<th class="table-header-line">Line Number</th>
|
||||||
|
<th class="table-header-error">Error</th>
|
||||||
|
<th class="table-header-suggestion">Suggestion</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td class="fw-bold text-center">1</td>
|
||||||
|
<td>
|
||||||
|
<span class="error-code">MISSING_COLUMN</span><br>
|
||||||
|
Required column "Latitude" is missing from the header row
|
||||||
|
</td>
|
||||||
|
<td class="error-suggestions">
|
||||||
|
Add a "Latitude" column to your CSV file. Make sure the spelling and capitalization match exactly.
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td class="fw-bold text-center">5</td>
|
||||||
|
<td>
|
||||||
|
<span class="error-code">INVALID_DATA_FORMAT</span><br>
|
||||||
|
GPS coordinate "37.45N" is not a valid decimal number
|
||||||
|
</td>
|
||||||
|
<td class="error-suggestions">
|
||||||
|
Change "37.45N" to a decimal format (e.g., "37.45"). Remove any non-numeric characters except for the decimal point.
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td class="fw-bold text-center">8</td>
|
||||||
|
<td>
|
||||||
|
<span class="error-code">EMPTY_REQUIRED_FIELD</span><br>
|
||||||
|
Plat ID is empty or missing
|
||||||
|
</td>
|
||||||
|
<td class="error-suggestions">
|
||||||
|
Add a Plat ID value for this record. Each pool must have a unique identifier.
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td class="fw-bold text-center">12</td>
|
||||||
|
<td>
|
||||||
|
<span class="error-code">INVALID_DATA_FORMAT</span><br>
|
||||||
|
GPS coordinate "unknown" is not a valid decimal number
|
||||||
|
</td>
|
||||||
|
<td class="error-suggestions">
|
||||||
|
Replace "unknown" with the actual longitude value in decimal format (e.g., "-122.4194").
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td class="fw-bold text-center">17</td>
|
||||||
|
<td>
|
||||||
|
<span class="error-code">INVALID_DATA_FORMAT</span><br>
|
||||||
|
GPS coordinate "N/A" is not a valid decimal number
|
||||||
|
</td>
|
||||||
|
<td class="error-suggestions">
|
||||||
|
Replace "N/A" with the actual latitude value in decimal format (e.g., "37.7749").
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td class="fw-bold text-center">21</td>
|
||||||
|
<td>
|
||||||
|
<span class="error-code">EMPTY_REQUIRED_FIELD</span><br>
|
||||||
|
Plat ID is empty or missing
|
||||||
|
</td>
|
||||||
|
<td class="error-suggestions">
|
||||||
|
Add a Plat ID value for this record. Each pool must have a unique identifier.
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
<div class="card-footer bg-white">
|
||||||
|
<nav aria-label="Error pagination">
|
||||||
|
<ul class="pagination justify-content-center m-0">
|
||||||
|
<li class="page-item disabled">
|
||||||
|
<a class="page-link" href="#" tabindex="-1" aria-disabled="true">Previous</a>
|
||||||
|
</li>
|
||||||
|
<li class="page-item active"><a class="page-link" href="#">1</a></li>
|
||||||
|
<li class="page-item"><a class="page-link" href="#">2</a></li>
|
||||||
|
<li class="page-item">
|
||||||
|
<a class="page-link" href="#">Next</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="card mb-4">
|
||||||
|
<div class="card-header bg-light">
|
||||||
|
<h5 class="mb-0">Next Steps</h5>
|
||||||
|
</div>
|
||||||
|
<div class="card-body">
|
||||||
|
<ol>
|
||||||
|
<li>Download the error log for a complete list of issues (optional)</li>
|
||||||
|
<li>Fix the errors in your CSV file</li>
|
||||||
|
<li>Re-upload the corrected file using the button below</li>
|
||||||
|
</ol>
|
||||||
|
|
||||||
|
<div class="alert alert-warning" role="alert">
|
||||||
|
<i class="bi bi-lightbulb me-2"></i>
|
||||||
|
<strong>Recommendation:</strong> Review our <a href="#" class="alert-link">CSV formatting guide</a> to ensure your file meets all requirements.
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="mt-4 text-center">
|
||||||
|
<button class="btn btn-primary btn-lg" id="uploadNewBtn">
|
||||||
|
<i class="bi bi-arrow-repeat me-2"></i> Upload Corrected File
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="mt-4 text-center">
|
||||||
|
<a href="#" class="text-muted">
|
||||||
|
<i class="bi bi-question-circle me-1"></i> Need help? Contact support
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{{end}}
|
||||||
210
templates/data-entry-good.html
Normal file
210
templates/data-entry-good.html
Normal file
|
|
@ -0,0 +1,210 @@
|
||||||
|
{{template "base.html" .}}
|
||||||
|
|
||||||
|
{{define "title"}}Data Entry{{end}}
|
||||||
|
{{define "style"}}
|
||||||
|
.results-container {
|
||||||
|
max-width: 1200px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
.summary-card {
|
||||||
|
transition: transform 0.2s;
|
||||||
|
}
|
||||||
|
.summary-card:hover {
|
||||||
|
transform: translateY(-5px);
|
||||||
|
}
|
||||||
|
.warning-row {
|
||||||
|
background-color: rgba(255, 193, 7, 0.15) !important;
|
||||||
|
}
|
||||||
|
.status-badge {
|
||||||
|
font-size: 0.85rem;
|
||||||
|
}
|
||||||
|
{{end}}
|
||||||
|
{{define "content"}}
|
||||||
|
<div class="container mt-4 results-container">
|
||||||
|
<div class="d-flex justify-content-between align-items-center mb-4">
|
||||||
|
<h2>Upload Results: pools-data-2023.csv</h2>
|
||||||
|
<span class="badge bg-success rounded-pill">
|
||||||
|
<i class="bi bi-check-circle me-1"></i> File Parsed Successfully
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row mb-4">
|
||||||
|
<div class="col-md-4">
|
||||||
|
<div class="card summary-card h-100 border-primary">
|
||||||
|
<div class="card-body text-center">
|
||||||
|
<h1 class="display-4 text-primary">45</h1>
|
||||||
|
<h5>Existing Pools</h5>
|
||||||
|
<p class="text-muted">Matches found in previous records</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-4">
|
||||||
|
<div class="card summary-card h-100 border-success">
|
||||||
|
<div class="card-body text-center">
|
||||||
|
<h1 class="display-4 text-success">23</h1>
|
||||||
|
<h5>New Pools</h5>
|
||||||
|
<p class="text-muted">Not found in existing records</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-4">
|
||||||
|
<div class="card summary-card h-100 border-warning">
|
||||||
|
<div class="card-body text-center">
|
||||||
|
<h1 class="display-4 text-warning">4</h1>
|
||||||
|
<h5>Outside District</h5>
|
||||||
|
<p class="text-muted">Potential geocoding errors</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="card mb-4">
|
||||||
|
<div class="card-header bg-light d-flex justify-content-between align-items-center">
|
||||||
|
<h5 class="mb-0">Data Preview</h5>
|
||||||
|
<div class="form-check form-switch">
|
||||||
|
<input class="form-check-input" type="checkbox" id="showIssuesOnly">
|
||||||
|
<label class="form-check-label" for="showIssuesOnly">Show issues only</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card-body">
|
||||||
|
<div class="alert alert-warning" role="alert">
|
||||||
|
<i class="bi bi-exclamation-triangle me-2"></i>
|
||||||
|
<strong>Warning:</strong> 4 entries appear to be outside district boundaries. These are highlighted in yellow below.
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="table-responsive">
|
||||||
|
<table class="table table-hover table-striped">
|
||||||
|
<thead class="table-light">
|
||||||
|
<tr>
|
||||||
|
<th>Plat ID</th>
|
||||||
|
<th>Latitude</th>
|
||||||
|
<th>Longitude</th>
|
||||||
|
<th>Street Address</th>
|
||||||
|
<th>Status</th>
|
||||||
|
<th>In District</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td>P12345</td>
|
||||||
|
<td>37.7749</td>
|
||||||
|
<td>-122.4194</td>
|
||||||
|
<td>123 Main St, Anytown, CA</td>
|
||||||
|
<td><span class="badge bg-primary status-badge">Existing</span></td>
|
||||||
|
<td><i class="bi bi-check-circle-fill text-success"></i> Yes</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>P23456</td>
|
||||||
|
<td>37.3352</td>
|
||||||
|
<td>-121.8811</td>
|
||||||
|
<td>456 Oak Ave, Someville, CA</td>
|
||||||
|
<td><span class="badge bg-primary status-badge">Existing</span></td>
|
||||||
|
<td><i class="bi bi-check-circle-fill text-success"></i> Yes</td>
|
||||||
|
</tr>
|
||||||
|
<tr class="warning-row">
|
||||||
|
<td>P34567</td>
|
||||||
|
<td>38.5816</td>
|
||||||
|
<td>-121.4944</td>
|
||||||
|
<td>789 Pine Rd, Outtown, CA</td>
|
||||||
|
<td><span class="badge bg-success status-badge">New</span></td>
|
||||||
|
<td>
|
||||||
|
<i class="bi bi-exclamation-triangle-fill text-warning"></i>
|
||||||
|
<strong>No</strong> - Outside northern boundary
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>P45678</td>
|
||||||
|
<td>37.4419</td>
|
||||||
|
<td>-122.1430</td>
|
||||||
|
<td>101 Elm St, Cityville, CA</td>
|
||||||
|
<td><span class="badge bg-success status-badge">New</span></td>
|
||||||
|
<td><i class="bi bi-check-circle-fill text-success"></i> Yes</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>P56789</td>
|
||||||
|
<td>37.3541</td>
|
||||||
|
<td>-121.9552</td>
|
||||||
|
<td>202 Maple Dr, Townburg, CA</td>
|
||||||
|
<td><span class="badge bg-primary status-badge">Existing</span></td>
|
||||||
|
<td><i class="bi bi-check-circle-fill text-success"></i> Yes</td>
|
||||||
|
</tr>
|
||||||
|
<tr class="warning-row">
|
||||||
|
<td>P67890</td>
|
||||||
|
<td>35.3733</td>
|
||||||
|
<td>-119.0187</td>
|
||||||
|
<td>303 Cedar Ln, Farville, CA</td>
|
||||||
|
<td><span class="badge bg-success status-badge">New</span></td>
|
||||||
|
<td>
|
||||||
|
<i class="bi bi-exclamation-triangle-fill text-warning"></i>
|
||||||
|
<strong>No</strong> - Outside southern boundary
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>P78901</td>
|
||||||
|
<td>37.8044</td>
|
||||||
|
<td>-122.2712</td>
|
||||||
|
<td>404 Birch Ave, Metroburg, CA</td>
|
||||||
|
<td><span class="badge bg-primary status-badge">Existing</span></td>
|
||||||
|
<td><i class="bi bi-check-circle-fill text-success"></i> Yes</td>
|
||||||
|
</tr>
|
||||||
|
<tr class="warning-row">
|
||||||
|
<td>P89012</td>
|
||||||
|
<td>37.4032</td>
|
||||||
|
<td>-123.9612</td>
|
||||||
|
<td>505 Walnut St, Edgetown, CA</td>
|
||||||
|
<td><span class="badge bg-success status-badge">New</span></td>
|
||||||
|
<td>
|
||||||
|
<i class="bi bi-exclamation-triangle-fill text-warning"></i>
|
||||||
|
<strong>No</strong> - Outside western boundary
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<nav aria-label="Table navigation">
|
||||||
|
<ul class="pagination justify-content-center mt-3">
|
||||||
|
<li class="page-item disabled">
|
||||||
|
<a class="page-link" href="#" tabindex="-1" aria-disabled="true">Previous</a>
|
||||||
|
</li>
|
||||||
|
<li class="page-item active"><a class="page-link" href="#">1</a></li>
|
||||||
|
<li class="page-item"><a class="page-link" href="#">2</a></li>
|
||||||
|
<li class="page-item"><a class="page-link" href="#">3</a></li>
|
||||||
|
<li class="page-item">
|
||||||
|
<a class="page-link" href="#">Next</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="card mb-4">
|
||||||
|
<div class="card-header bg-light">
|
||||||
|
<h5 class="mb-0">Notes & Recommendations</h5>
|
||||||
|
</div>
|
||||||
|
<div class="card-body">
|
||||||
|
<div class="mb-3">
|
||||||
|
<p><strong>Issues detected:</strong></p>
|
||||||
|
<ul>
|
||||||
|
<li>4 pools appear to be outside district boundaries (possible geocoding errors)</li>
|
||||||
|
<li>All required fields are present and properly formatted</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="alert alert-info" role="alert">
|
||||||
|
<i class="bi bi-info-circle me-2"></i>
|
||||||
|
<strong>Note:</strong> You may proceed with this upload or edit your CSV file to fix the issues identified.
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="d-flex justify-content-between mt-4 mb-5">
|
||||||
|
<a href="#" class="btn btn-outline-secondary">
|
||||||
|
<i class="bi bi-arrow-left me-1"></i> Upload Edited File
|
||||||
|
</a>
|
||||||
|
<button class="btn btn-primary" id="confirmUploadBtn">
|
||||||
|
<i class="bi bi-check2 me-1"></i> Confirm and Submit Data
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{{end}}
|
||||||
112
templates/data-entry.html
Normal file
112
templates/data-entry.html
Normal file
|
|
@ -0,0 +1,112 @@
|
||||||
|
{{template "base.html" .}}
|
||||||
|
|
||||||
|
{{define "title"}}Data Entry{{end}}
|
||||||
|
{{define "style"}}
|
||||||
|
.upload-container {
|
||||||
|
max-width: 800px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
.schema-table {
|
||||||
|
font-size: 0.9rem;
|
||||||
|
}
|
||||||
|
.upload-area {
|
||||||
|
border: 2px dashed #dee2e6;
|
||||||
|
padding: 2rem;
|
||||||
|
text-align: center;
|
||||||
|
margin: 1.5rem 0;
|
||||||
|
border-radius: 5px;
|
||||||
|
background-color: #f8f9fa;
|
||||||
|
}
|
||||||
|
.required-field::after {
|
||||||
|
content: "*";
|
||||||
|
color: red;
|
||||||
|
margin-left: 3px;
|
||||||
|
}
|
||||||
|
{{end}}
|
||||||
|
{{define "content"}}
|
||||||
|
<div class="container mt-4 upload-container">
|
||||||
|
<h2 class="mb-4">Upload Pool Data</h2>
|
||||||
|
|
||||||
|
<div class="card mb-4">
|
||||||
|
<div class="card-header bg-light">
|
||||||
|
<h5 class="mb-0">CSV Upload Requirements</h5>
|
||||||
|
</div>
|
||||||
|
<div class="card-body">
|
||||||
|
<p>Your CSV file must contain the following columns in any order. Please ensure your data matches the required format.</p>
|
||||||
|
|
||||||
|
<table class="table table-bordered schema-table">
|
||||||
|
<thead class="table-light">
|
||||||
|
<tr>
|
||||||
|
<th>Field</th>
|
||||||
|
<th>Description</th>
|
||||||
|
<th>Format</th>
|
||||||
|
<th>Required</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td class="required-field">Latitude</td>
|
||||||
|
<td>GPS latitude coordinate</td>
|
||||||
|
<td>Decimal (e.g., 37.7749)</td>
|
||||||
|
<td>Yes</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td class="required-field">Longitude</td>
|
||||||
|
<td>GPS longitude coordinate</td>
|
||||||
|
<td>Decimal (e.g., -122.4194)</td>
|
||||||
|
<td>Yes</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td class="required-field">Plat ID</td>
|
||||||
|
<td>Unique identifier for the property</td>
|
||||||
|
<td>Alphanumeric (e.g., P12345)</td>
|
||||||
|
<td>Yes</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Street Address</td>
|
||||||
|
<td>Nearest street address to the pool</td>
|
||||||
|
<td>Text (e.g., 123 Main St)</td>
|
||||||
|
<td>No</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
|
||||||
|
<div class="alert alert-info small">
|
||||||
|
<i class="bi bi-info-circle"></i> Need a template? <a href="#" class="alert-link">Download sample CSV file</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="card">
|
||||||
|
<div class="card-header bg-light">
|
||||||
|
<h5 class="mb-0">Upload Data</h5>
|
||||||
|
</div>
|
||||||
|
<div class="card-body">
|
||||||
|
<div class="upload-area">
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" fill="currentColor" class="bi bi-cloud-arrow-up text-primary mb-3" viewBox="0 0 16 16">
|
||||||
|
<path fill-rule="evenodd" d="M7.646 5.146a.5.5 0 0 1 .708 0l2 2a.5.5 0 0 1-.708.708L8.5 6.707V10.5a.5.5 0 0 1-1 0V6.707L6.354 7.854a.5.5 0 1 1-.708-.708l2-2z"/>
|
||||||
|
<path d="M4.406 3.342A5.53 5.53 0 0 1 8 2c2.69 0 4.923 2 5.166 4.579C14.758 6.804 16 8.137 16 9.773 16 11.569 14.502 13 12.687 13H3.781C1.708 13 0 11.366 0 9.318c0-1.763 1.266-3.223 2.942-3.593.143-.863.698-1.723 1.464-2.383zm.653.757c-.757.653-1.153 1.44-1.153 2.056v.448l-.445.049C2.064 6.805 1 7.952 1 9.318 1 10.785 2.23 12 3.781 12h8.906C13.98 12 15 10.988 15 9.773c0-1.216-1.02-2.228-2.313-2.228h-.5v-.5C12.188 4.825 10.328 3 8 3a4.53 4.53 0 0 0-2.941 1.1z"/>
|
||||||
|
</svg>
|
||||||
|
<h5>Select your CSV file</h5>
|
||||||
|
<p class="text-muted">Drag and drop a file here or click to browse</p>
|
||||||
|
<input type="file" class="form-control" id="csvFile" accept=".csv">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="d-grid gap-2">
|
||||||
|
<a href="/mock/data-entry/good">
|
||||||
|
<button class="btn btn-primary" type="button" id="uploadButton">
|
||||||
|
Upload and Continue
|
||||||
|
</button>
|
||||||
|
</a>
|
||||||
|
<a href="/mock/data-entry/bad">
|
||||||
|
See what happens on a bad upload
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="text-muted text-center mt-4">
|
||||||
|
<small>Need assistance? Contact <a href="mailto:support@example.com">support@example.com</a></small>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{{end}}
|
||||||
Loading…
Add table
Add a link
Reference in a new issue