Add page for configuring ArcGIS integration.

This commit is contained in:
Eli Ribble 2026-02-25 17:36:19 +00:00
parent 5e3a97272a
commit 7080222fbc
No known key found for this signature in database
5 changed files with 282 additions and 9 deletions

View file

@ -0,0 +1,237 @@
{{ template "sync/layout/authenticated.html" . }}
{{ define "title" }}Settings - Integrations{{ end }}
{{ define "extraheader" }}
{{ end }}
{{ define "content" }}
<div class="container py-5">
<div class="row justify-content-center">
<div class="col-lg-8">
<!-- Header -->
<div class="d-flex align-items-center mb-4">
<i class="bi bi-globe2 text-primary fs-1 me-3"></i>
<div>
<h1 class="mb-0">ArcGIS Integration</h1>
<p class="text-muted mb-0">Configure your Esri ArcGIS connection</p>
</div>
</div>
<!-- Main Card -->
<div class="card shadow-sm">
<div class="card-body p-4">
<form>
<!-- OAuth Authentication Section -->
<div class="mb-4">
<h5 class="card-title border-bottom pb-2 mb-3">
<i class="bi bi-key-fill text-success me-2"></i>OAuth
Authentication
</h5>
<div class="row g-3">
<div class="col-md-6">
<label class="form-label fw-semibold">ArcGIS ID</label>
<input
type="text"
class="form-control"
value="{{ .Organization.ArcgisID.GetOr "" }}"
readonly
/>
</div>
<div class="col-md-6">
<label class="form-label fw-semibold"
>Organization Name</label
>
<input
type="text"
class="form-control"
value="{{ .Organization.ArcgisName.GetOr "" }}"
readonly
/>
</div>
<div class="col-md-12">
<label class="form-label fw-semibold">Authorized By</label>
<input
type="text"
class="form-control"
value="{{ .C.ArcGISOAuth.Username }}"
readonly
/>
</div>
<div class="col-md-6">
<label class="form-label fw-semibold">Token Age</label>
<input
type="text"
class="form-control"
value="{{ .C.ArcGISOAuth.Created|timeRelative }}"
readonly
/>
</div>
<div class="col-md-6">
<label class="form-label fw-semibold"
>Token Expiration</label
>
<input
type="text"
class="form-control"
value="{{ .C.ArcGISOAuth.RefreshTokenExpires|timeRelative }}"
readonly
/>
</div>
</div>
<!-- Token Actions -->
<div class="mt-3 d-flex gap-2">
<button type="button" class="btn btn-outline-primary">
<i class="bi bi-arrow-clockwise me-1"></i>Refresh Token
</button>
<button
type="button"
class="btn btn-outline-danger"
data-bs-toggle="modal"
data-bs-target="#deleteModal"
>
<i class="bi bi-trash me-1"></i>Delete Token
</button>
</div>
</div>
<hr class="my-4" />
<!-- Feature Layers Section -->
<div class="mb-4">
<h5 class="card-title border-bottom pb-2 mb-3">
<i class="bi bi-layers-fill text-info me-2"></i>Feature Layer
Configuration
</h5>
<div class="row g-3">
<div class="col-md-12">
<label for="satelliteLayer" class="form-label fw-semibold">
Satellite Imagery Layer
<span class="text-danger">*</span>
</label>
<select class="form-select" id="satelliteLayer" required>
<option value="">-- Select a feature layer --</option>
<option value="layer1" selected>
World Imagery (Clarity)
</option>
<option value="layer2">
Sentinel-2 Satellite Imagery
</option>
<option value="layer3">NAIP Aerial Imagery</option>
<option value="layer4">Landsat 8 Multispectral</option>
<option value="layer5">
High Resolution Ortho Imagery
</option>
</select>
<div class="form-text">
Select the feature layer for satellite imagery data
</div>
</div>
<div class="col-md-12">
<label for="parcelLayer" class="form-label fw-semibold">
Parcel Data Layer
<span class="text-danger">*</span>
</label>
<select class="form-select" id="parcelLayer" required>
<option value="">-- Select a feature layer --</option>
<option value="parcel1" selected>
County Parcel Boundaries 2024
</option>
<option value="parcel2">Tax Assessor Parcels</option>
<option value="parcel3">
Property Ownership Records
</option>
<option value="parcel4">
Zoning and Land Use Parcels
</option>
<option value="parcel5">Cadastral Parcel Dataset</option>
</select>
<div class="form-text">
Select the feature layer for parcel boundary data
</div>
</div>
</div>
</div>
<!-- Save Button -->
<div class="d-grid gap-2 d-md-flex justify-content-md-end mt-4">
<button type="button" class="btn btn-secondary me-md-2">
Cancel
</button>
<button type="submit" class="btn btn-primary">
<i class="bi bi-save me-1"></i>Save Configuration
</button>
</div>
</form>
</div>
</div>
<!-- Info Alert -->
<div
class="alert alert-info mt-3 d-flex align-items-start"
role="alert"
>
<i class="bi bi-info-circle-fill me-2 flex-shrink-0"></i>
<div>
<strong>Note:</strong> Changes to feature layer selections will take
effect immediately after saving. Refreshing the OAuth token will
require re-authentication with your ArcGIS account.
</div>
</div>
</div>
</div>
</div>
<!-- Delete Confirmation Modal -->
<div
class="modal fade"
id="deleteModal"
tabindex="-1"
aria-labelledby="deleteModalLabel"
aria-hidden="true"
>
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header bg-danger text-white">
<h5 class="modal-title" id="deleteModalLabel">
<i class="bi bi-exclamation-triangle-fill me-2"></i>Confirm Delete
</h5>
<button
type="button"
class="btn-close btn-close-white"
data-bs-dismiss="modal"
aria-label="Close"
></button>
</div>
<div class="modal-body">
<p class="mb-2">
Are you sure you want to delete the OAuth token and disable the
ArcGIS integration?
</p>
<p class="text-muted mb-0">
<strong>This action cannot be undone.</strong> You will need to
re-authenticate to restore the integration.
</p>
</div>
<div class="modal-footer">
<button
type="button"
class="btn btn-secondary"
data-bs-dismiss="modal"
>
Cancel
</button>
<button type="button" class="btn btn-danger">
<i class="bi bi-trash me-1"></i>Delete Token
</button>
</div>
</div>
</div>
</div>
{{ end }}

View file

@ -48,17 +48,17 @@
</div>
</div>
<!-- FieldSeeker GIS Integration -->
<div class="card mb-4 integration-card fieldseeker">
<!-- Esri ArcGIS Integration -->
<div class="card mb-4 integration-card arcgis">
<div
class="card-header d-flex justify-content-between align-items-center"
>
<div>
<h2 class="h5 mb-0">Frontier Precision's FieldSeeker GIS</h2>
<h2 class="h5 mb-0">Esri's ArcGIS</h2>
</div>
<img
src="https://via.placeholder.com/100x40?text=FieldSeeker"
alt="FieldSeeker Logo"
src="https://via.placeholder.com/100x40?text=ArcGIS"
alt="ArcGIS Logo"
height="40"
/>
</div>
@ -103,12 +103,35 @@
<a class="btn btn-primary" href="{{ .URL.OAuthRefreshArcGIS }}">
<i class="bi bi-arrow-repeat me-2"></i>Refresh OAuth Token
</a>
<button class="btn btn-outline-danger">
<i class="bi bi-trash me-2"></i>Delete Token
</button>
<a class="btn btn-outline-danger" href="{{ .URL.Setting.ArcGIS }}">
<i class="bi bi-gear me-2"></i>Configure
</a>
</div>
</div>
</div>
<!-- FieldSeeker GIS Integration -->
<div class="card mb-4 integration-card fieldseeker">
<div
class="card-header d-flex justify-content-between align-items-center"
>
<div>
<h2 class="h5 mb-0">Frontier Precision's FieldSeeker GIS</h2>
</div>
<img
src="https://via.placeholder.com/100x40?text=FieldSeeker"
alt="FieldSeeker Logo"
height="40"
/>
</div>
<div class="card-body">
<div class="table-responsive mb-3">
<table class="table table-borderless">
<tbody></tbody>
</table>
</div>
<div class="d-flex gap-2"></div>
</div>
</div>
<!-- VectorSurv Integration -->
<div class="card mb-4 integration-card vectorsurv">