Add district setting page and display of district boundary
This commit is contained in:
parent
4c8da3b96a
commit
a1cc2dbaff
11 changed files with 648 additions and 168 deletions
136
html/template/sync/setting-district.html
Normal file
136
html/template/sync/setting-district.html
Normal file
|
|
@ -0,0 +1,136 @@
|
|||
{{ template "sync/layout/authenticated.html" . }}
|
||||
|
||||
{{ define "title" }}Settings - Integrations{{ end }}
|
||||
{{ define "extraheader" }}
|
||||
<script
|
||||
type="text/javascript"
|
||||
src="//unpkg.com/maplibre-gl@5.0.1/dist/maplibre-gl.js"
|
||||
></script>
|
||||
<script src="/static/js/map-district.js"></script>
|
||||
<style>
|
||||
.settings-card {
|
||||
box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
</style>
|
||||
{{ end }}
|
||||
{{ define "content" }}
|
||||
<div class="container py-4">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="d-flex justify-content-between align-items-center mb-4">
|
||||
<h1><i class="bi bi-geo-alt-fill text-primary me-2"></i> District Settings</h1>
|
||||
<button class="btn btn-primary"><i class="bi bi-save me-2"></i>Save Changes</button>
|
||||
</div>
|
||||
|
||||
<map-district
|
||||
district-id="{{.District.GID}}"
|
||||
centroid="{{.District.Centroid|json}}"
|
||||
xmin="{{.District.XMin}}"
|
||||
ymin="{{.District.YMin}}"
|
||||
xmax="{{.District.XMax}}"
|
||||
ymax="{{.District.YMax}}"
|
||||
tegola="{{.URL.Tegola}}"></map-district>
|
||||
|
||||
<div class="row">
|
||||
<!-- Basic Information -->
|
||||
<div class="col-md-6">
|
||||
<div class="card settings-card">
|
||||
<div class="card-header bg-light">
|
||||
<h5><i class="bi bi-building me-2"></i> Organization Information</h5>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="mb-3">
|
||||
<label for="agencyName" class="form-label"><i class="bi bi-briefcase me-1"></i> Agency Name</label>
|
||||
<input type="text" class="form-control" id="agencyName" value="Central District Water Authority">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="website" class="form-label"><i class="bi bi-globe me-1"></i> Website</label>
|
||||
<input type="url" class="form-control" id="website" value="https://cdwa.example.org">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="generalManager" class="form-label"><i class="bi bi-person-badge me-1"></i> General Manager Name</label>
|
||||
<input type="text" class="form-control" id="generalManager" value="Jane Smithson">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="contactPerson" class="form-label"><i class="bi bi-person me-1"></i> Contact Person</label>
|
||||
<input type="text" class="form-control" id="contactPerson" value="John Doe">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Contact Information -->
|
||||
<div class="col-md-6">
|
||||
<div class="card settings-card">
|
||||
<div class="card-header bg-light">
|
||||
<h5><i class="bi bi-telephone me-2"></i> Contact Information</h5>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="mb-3">
|
||||
<label for="address" class="form-label"><i class="bi bi-geo me-1"></i> Address</label>
|
||||
<input type="text" class="form-control" id="address" value="123 Main Street, Suite 400">
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-6 mb-3">
|
||||
<label for="city" class="form-label"><i class="bi bi-building me-1"></i> City</label>
|
||||
<input type="text" class="form-control" id="city" value="Centerville">
|
||||
</div>
|
||||
<div class="col-md-6 mb-3">
|
||||
<label for="postalCode" class="form-label"><i class="bi bi-mailbox me-1"></i> Postal Code</label>
|
||||
<input type="text" class="form-control" id="postalCode" value="12345">
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="phoneNumber" class="form-label"><i class="bi bi-telephone me-1"></i> Phone Number (Primary)</label>
|
||||
<input type="tel" class="form-control" id="phoneNumber" value="(555) 123-4567">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="secondaryPhone" class="form-label"><i class="bi bi-telephone-plus me-1"></i> Phone Number (Secondary)</label>
|
||||
<input type="tel" class="form-control" id="secondaryPhone" value="(555) 987-6543">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="faxNumber" class="form-label"><i class="bi bi-printer me-1"></i> Fax Number</label>
|
||||
<input type="tel" class="form-control" id="faxNumber" value="(555) 765-4321">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- District Coverage Information -->
|
||||
<div class="col-12">
|
||||
<div class="card settings-card">
|
||||
<div class="card-header bg-light">
|
||||
<h5><i class="bi bi-map me-2"></i> District Coverage</h5>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="row">
|
||||
<div class="col-md-6 mb-3">
|
||||
<label for="totalArea" class="form-label"><i class="bi bi-rulers me-1"></i> Total Area (square kilometers)</label>
|
||||
<input type="number" class="form-control" id="totalArea" value="1250">
|
||||
</div>
|
||||
<div class="col-md-6 mb-3">
|
||||
<label for="countiesServed" class="form-label"><i class="bi bi-pin-map me-1"></i> Counties Served</label>
|
||||
<select class="form-select" id="countiesServed" multiple size="3">
|
||||
<option selected>Franklin County</option>
|
||||
<option selected>Jefferson County</option>
|
||||
<option selected>Washington County</option>
|
||||
<option>Lincoln County</option>
|
||||
<option>Adams County</option>
|
||||
</select>
|
||||
<small class="form-text text-muted">Hold Ctrl (or Cmd) to select multiple counties</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="d-flex justify-content-end mt-3">
|
||||
<button class="btn btn-secondary me-2"><i class="bi bi-x-circle me-1"></i> Cancel</button>
|
||||
<button class="btn btn-primary"><i class="bi bi-save me-1"></i> Save Changes</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{ end }}
|
||||
|
|
@ -101,7 +101,7 @@
|
|||
Manage your district location and information.
|
||||
</p>
|
||||
<div class="d-flex justify-content-between align-items-center">
|
||||
<a href="equipment.html" class="btn btn-outline-danger">
|
||||
<a href="{{ .URL.SettingDistrict }}" class="btn btn-outline-danger">
|
||||
Manage District
|
||||
<i class="bi bi-arrow-right ms-1"></i>
|
||||
</a>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue