296 lines
8.2 KiB
HTML
296 lines
8.2 KiB
HTML
{{ template "sync/layout/authenticated.html" . }}
|
|
|
|
{{ define "title" }}Service Requests{{ end }}
|
|
{{ define "extraheader" }}
|
|
<style>
|
|
.map-container {
|
|
height: 400px;
|
|
background-color: #e9ecef;
|
|
border-radius: 5px;
|
|
position: relative;
|
|
}
|
|
.map-pin {
|
|
position: absolute;
|
|
font-size: 1.5rem;
|
|
}
|
|
.pin-nuisance {
|
|
color: #dc3545;
|
|
}
|
|
.pin-standing {
|
|
color: #0d6efd;
|
|
}
|
|
.pin-breeding {
|
|
color: #6f42c1;
|
|
}
|
|
.badge-nuisance {
|
|
background-color: #dc3545;
|
|
}
|
|
.badge-standing {
|
|
background-color: #0d6efd;
|
|
}
|
|
.badge-breeding {
|
|
background-color: #6f42c1;
|
|
}
|
|
</style>
|
|
{{ end }}
|
|
{{ define "content" }}
|
|
<div class="container-fluid mt-4">
|
|
<div class="row mb-4">
|
|
<div class="col">
|
|
<div class="d-flex justify-content-between align-items-center mb-3">
|
|
<h2><i class="bi bi-clipboard-check me-2"></i>Service Requests</h2>
|
|
<button class="btn btn-primary">
|
|
<i class="bi bi-plus-circle me-1"></i>New Request
|
|
</button>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<div class="d-flex justify-content-between align-items-center">
|
|
<h5 class="mb-0">District Map View</h5>
|
|
<div>
|
|
<button class="btn btn-sm btn-outline-secondary">
|
|
<i class="bi bi-arrows-fullscreen me-1"></i>Expand
|
|
</button>
|
|
<button class="btn btn-sm btn-outline-secondary ms-2">
|
|
<i class="bi bi-filter me-1"></i>Filter
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="card-body p-0">
|
|
<!-- Mock map container - in a real application this would be a map -->
|
|
<div class="map-container">
|
|
<!-- Map pins representing service requests -->
|
|
<i
|
|
class="bi bi-geo-alt-fill map-pin pin-nuisance"
|
|
style="top: 150px; left: 120px;"
|
|
></i>
|
|
<i
|
|
class="bi bi-geo-alt-fill map-pin pin-standing"
|
|
style="top: 100px; left: 250px;"
|
|
></i>
|
|
<i
|
|
class="bi bi-geo-alt-fill map-pin pin-standing"
|
|
style="top: 220px; left: 180px;"
|
|
></i>
|
|
<i
|
|
class="bi bi-geo-alt-fill map-pin pin-breeding"
|
|
style="top: 180px; left: 320px;"
|
|
></i>
|
|
<i
|
|
class="bi bi-geo-alt-fill map-pin pin-nuisance"
|
|
style="top: 250px; left: 400px;"
|
|
></i>
|
|
<div
|
|
class="position-absolute bottom-0 end-0 m-2 bg-white p-2 rounded shadow-sm"
|
|
>
|
|
<div class="d-flex align-items-center mb-1">
|
|
<i class="bi bi-geo-alt-fill pin-nuisance me-2"></i> Biting
|
|
Nuisance
|
|
</div>
|
|
<div class="d-flex align-items-center mb-1">
|
|
<i class="bi bi-geo-alt-fill pin-standing me-2"></i> Standing
|
|
Water
|
|
</div>
|
|
<div class="d-flex align-items-center">
|
|
<i class="bi bi-geo-alt-fill pin-breeding me-2"></i> Active
|
|
Breeding
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row mb-4">
|
|
<div class="col">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<div class="d-flex justify-content-between align-items-center">
|
|
<h5 class="mb-0">Active Service Requests</h5>
|
|
<div class="input-group w-25">
|
|
<input
|
|
type="text"
|
|
class="form-control form-control-sm"
|
|
placeholder="Search requests..."
|
|
/>
|
|
<button class="btn btn-outline-secondary btn-sm">
|
|
<i class="bi bi-search"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="table-responsive">
|
|
<table class="table table-hover">
|
|
<thead>
|
|
<tr>
|
|
<th scope="col">Created</th>
|
|
<th scope="col">Last Action</th>
|
|
<th scope="col">Next Step</th>
|
|
<th scope="col">Address</th>
|
|
<th scope="col">Photos</th>
|
|
<th scope="col">Type</th>
|
|
<th scope="col">Actions</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{{ range .C.ActiveRequests }}
|
|
<tr>
|
|
<td>{{ .Created|timeRelative }}</td>
|
|
<td>{{ .LastAction|timeRelative }}</td>
|
|
{{ if eq .NextStep "schedule-appointment" }}
|
|
<td>
|
|
<span class="badge bg-warning text-dark"
|
|
>Schedule Appointment</span
|
|
>
|
|
</td>
|
|
{{ else if eq .NextStep "answer-question" }}
|
|
<td>
|
|
<span class="badge bg-info text-dark"></span>Answer
|
|
Question
|
|
</td>
|
|
{{ else if eq .NextStep "add-to-route" }}
|
|
<td>
|
|
<span class="badge bg-success text-dark"></span>Add to
|
|
Route
|
|
</td>
|
|
{{ else if eq .NextStep "review" }}
|
|
<td>
|
|
<span class="badge bg-secondary text-dark"></span
|
|
>Review
|
|
</td>
|
|
{{ else if eq .NextStep "confirm-details" }}
|
|
<td>
|
|
<span class="badge bg-danger text-dark"></span>Confirm
|
|
Details
|
|
</td>
|
|
{{ else }}
|
|
<td>
|
|
<span class="badge bg-light text-dark"></span>Unknown
|
|
</td>
|
|
{{ end }}
|
|
<td>{{ .Address }}</td>
|
|
<td><i class="bi bi-image me-1"></i>{{ .PhotoCount }}</td>
|
|
{{ if eq .Type "biting-nuisance" }}
|
|
<td>
|
|
<span class="badge badge-nuisance text-white"
|
|
>Biting Nuisance</span
|
|
>
|
|
</td>
|
|
{{ else if eq .Type "standing-water" }}
|
|
<td>
|
|
<span class="badge badge-standing text-white"
|
|
>Standing Water</span
|
|
>
|
|
</td>
|
|
{{ else if eq .Type "active-breeding" }}
|
|
<td>
|
|
<span class="badge badge-standing text-white"
|
|
>Active Breeding</span
|
|
>
|
|
</td>
|
|
{{ else }}
|
|
<td>
|
|
<span class="badge badge-unknown text-white"
|
|
>Unknown</span
|
|
>
|
|
</td>
|
|
{{ end }}
|
|
|
|
|
|
<td>
|
|
<a
|
|
href="{{ .URLDetail }}"
|
|
class="btn btn-sm btn-outline-info"
|
|
><i class="bi bi-eye"></i
|
|
></a>
|
|
</td>
|
|
</tr>
|
|
{{ end }}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row mb-4">
|
|
<div class="col">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h5 class="mb-0">Recently Closed Requests (Past 2 Weeks)</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="table-responsive">
|
|
<table class="table table-hover">
|
|
<thead>
|
|
<tr>
|
|
<th scope="col">Employee</th>
|
|
<th scope="col">Type</th>
|
|
<th scope="col">Closed</th>
|
|
<th scope="col">Address</th>
|
|
<th scope="col">Time to Resolution</th>
|
|
<th scope="col">Actions</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{{ range .C.ClosedRequests }}
|
|
<tr>
|
|
<td>
|
|
<div class="d-flex align-items-center">
|
|
<i class="bi bi-person-circle me-2 fs-5"></i>
|
|
<span>{{ .Employee }}</span>
|
|
</div>
|
|
</td>
|
|
{{ if eq .Type "standing-water" }}
|
|
<td>
|
|
<span class="badge badge-standing text-white"
|
|
>Standing Water</span
|
|
>
|
|
</td>
|
|
{{ else if eq .Type "biting-nuisance" }}
|
|
<td>
|
|
<span class="badge badge-nuisance text-white"
|
|
>Biting Nuisance</span
|
|
>
|
|
</td>
|
|
{{ else if eq .Type "active-breeding" }}
|
|
<td>
|
|
<span class="badge badge-breeding text-white"
|
|
>Active Breeding</span
|
|
>
|
|
</td>
|
|
{{ else }}
|
|
<td>
|
|
<span class="badge badge-unknown text-white"
|
|
>Unknown</span
|
|
>
|
|
</td>
|
|
{{ end }}
|
|
|
|
|
|
<td>{{ .Closed|timeRelative }}</td>
|
|
<td>{{ .Address }}/td></td>
|
|
<td>{{ .TimeToResolution|duration }}</td>
|
|
<td>
|
|
<a
|
|
href="{{ .URLDetail }}"
|
|
class="btn btn-sm btn-outline-info"
|
|
><i class="bi bi-eye"></i
|
|
></a>
|
|
</td>
|
|
</tr>
|
|
{{ end }}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{{ end }}
|