Fix sync to follow new pattern of function grouping.
This commit is contained in:
parent
653e3473b3
commit
28e4e88794
54 changed files with 24 additions and 31 deletions
412
sync/template/admin.html
Normal file
412
sync/template/admin.html
Normal file
|
|
@ -0,0 +1,412 @@
|
|||
{{template "base.html" .}}
|
||||
|
||||
{{define "title"}}Dash{{end}}
|
||||
{{define "extraheader"}}
|
||||
<style>
|
||||
body {
|
||||
overflow-x: hidden;
|
||||
}
|
||||
.map-container {
|
||||
height: 250px;
|
||||
background-color: #e9ecef;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.calendar-container {
|
||||
background-color: #f8f9fa;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.calendar-day {
|
||||
width: 2.5rem;
|
||||
height: 2.5rem;
|
||||
line-height: 2.5rem;
|
||||
text-align: center;
|
||||
}
|
||||
.calendar-day.has-events {
|
||||
position: relative;
|
||||
}
|
||||
.calendar-day.has-events::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: 0.2rem;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
height: 0.25rem;
|
||||
border-radius: 0.125rem;
|
||||
background-color: #0d6efd;
|
||||
}
|
||||
.calendar-day.has-events.light::after {
|
||||
width: 0.25rem;
|
||||
background-color: #0d6efd;
|
||||
}
|
||||
.calendar-day.has-events.medium::after {
|
||||
width: 0.5rem;
|
||||
background-color: #fd7e14;
|
||||
}
|
||||
.calendar-day.has-events.heavy::after {
|
||||
width: 0.75rem;
|
||||
background-color: #dc3545;
|
||||
}
|
||||
.trap-increase {
|
||||
color: #dc3545;
|
||||
}
|
||||
.trap-decrease {
|
||||
color: #28a745;
|
||||
}
|
||||
.status-active {
|
||||
background-color: #d4edda;
|
||||
}
|
||||
.status-break {
|
||||
background-color: #fff3cd;
|
||||
}
|
||||
.status-transit {
|
||||
background-color: #cce5ff;
|
||||
}
|
||||
.tech-table tr td {
|
||||
vertical-align: middle;
|
||||
}
|
||||
</style>
|
||||
{{end}}
|
||||
{{define "content"}}
|
||||
<!-- Header -->
|
||||
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand d-flex align-items-center" href="#">
|
||||
<img src="https://via.placeholder.com/40" alt="{{.DistrictName}} Logo" class="me-2">
|
||||
<span>{{.DistrictName}} Mosquito Abatement District</span>
|
||||
</a>
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<!--
|
||||
<div class="collapse navbar-collapse" id="navbarNav">
|
||||
<ul class="navbar-nav ms-auto">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link active" href="#"><i class="bi bi-house-door"></i> Dashboard</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#"><i class="bi bi-people"></i> Residents</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#"><i class="bi bi-clipboard-data"></i> Reports</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#"><i class="bi bi-gear"></i> Settings</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>-->
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="container-fluid py-3">
|
||||
<div class="row mb-3">
|
||||
<div class="col-12">
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-body py-2">
|
||||
<form action="/phone-call/search-results" method="GET">
|
||||
<div class="input-group">
|
||||
<input type="text" class="form-control" placeholder="Search by ID (e.g., easy twin jazz cats), address, GPS, name or phone..." aria-label="Search">
|
||||
<button class="btn btn-primary" type="submit"><i class="bi bi-search"></i> Search</button>
|
||||
</div>
|
||||
<small class="form-text text-muted">Quick search for request ID, address, coordinates, contact name, or phone number</small>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<!-- Left Column -->
|
||||
<div class="col-md-8 mb-3">
|
||||
<div class="card shadow-sm h-100">
|
||||
<div class="card-header bg-success text-white d-flex justify-content-between align-items-center py-2">
|
||||
<h5 class="mb-0">Mosquito Activity & Relief</h5>
|
||||
<a href="/mock/admin/service-request" class="btn btn-light btn-sm"><i class="bi bi-plus-circle"></i> New Service Request</a>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="row mb-2">
|
||||
<div class="col-12">
|
||||
<label class="form-label mb-1">Location of Concern</label>
|
||||
<div class="map-container d-flex justify-content-center align-items-center">
|
||||
<div class="text-center text-muted">
|
||||
<i class="bi bi-map fs-1"></i>
|
||||
<p>Interactive map will be loaded here</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-6 mb-2">
|
||||
<h6 class="mb-1">Recent Trap Counts</h6>
|
||||
<div class="table-responsive">
|
||||
<table class="table table-sm table-bordered">
|
||||
<thead class="table-light">
|
||||
<tr>
|
||||
<th>Trap Location</th>
|
||||
<th>Current</th>
|
||||
<th>Week Δ</th>
|
||||
<th>Month Δ</th>
|
||||
<th>YoY</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Elmwood Park</td>
|
||||
<td>47</td>
|
||||
<td class="trap-decrease">-12%</td>
|
||||
<td class="trap-decrease">-23%</td>
|
||||
<td class="trap-increase">+5%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Riverside Dr</td>
|
||||
<td>32</td>
|
||||
<td class="trap-increase">+8%</td>
|
||||
<td class="trap-decrease">-5%</td>
|
||||
<td class="trap-decrease">-10%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Oakdale Creek</td>
|
||||
<td>53</td>
|
||||
<td class="trap-increase">+15%</td>
|
||||
<td class="trap-increase">+22%</td>
|
||||
<td class="trap-increase">+17%</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6">
|
||||
<h6 class="mb-1">Nearby Service Requests</h6>
|
||||
<div class="table-responsive">
|
||||
<table class="table table-sm table-bordered">
|
||||
<thead class="table-light">
|
||||
<tr>
|
||||
<th>Date</th>
|
||||
<th>Status</th>
|
||||
<th>Type</th>
|
||||
<th>Distance</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>10/15/23</td>
|
||||
<td><span class="badge bg-success">Completed</span></td>
|
||||
<td>Green Pool</td>
|
||||
<td>0.2 mi</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>10/18/23</td>
|
||||
<td><span class="badge bg-warning text-dark">Scheduled</span></td>
|
||||
<td>Mosquito Nuisance</td>
|
||||
<td>0.3 mi</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>10/19/23</td>
|
||||
<td><span class="badge bg-info text-dark">Accepted</span></td>
|
||||
<td>Previous Source</td>
|
||||
<td>0.5 mi</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Right Column - Calendar -->
|
||||
<div class="col-md-4 mb-3">
|
||||
<div class="card shadow-sm h-100">
|
||||
<div class="card-header bg-dark text-white py-2">
|
||||
<h5 class="mb-0">Calendar</h5>
|
||||
</div>
|
||||
<div class="card-body p-2">
|
||||
<div class="calendar-container p-2 mb-2">
|
||||
<div class="d-flex justify-content-between align-items-center mb-2">
|
||||
<button class="btn btn-sm btn-outline-secondary"><i class="bi bi-chevron-left"></i></button>
|
||||
<h6 class="mb-0">October 2023</h6>
|
||||
<button class="btn btn-sm btn-outline-secondary"><i class="bi bi-chevron-right"></i></button>
|
||||
</div>
|
||||
<table class="table table-sm mb-0">
|
||||
<thead>
|
||||
<tr class="text-center">
|
||||
<th>Su</th><th>Mo</th><th>Tu</th><th>We</th><th>Th</th><th>Fr</th><th>Sa</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr class="text-center">
|
||||
<td class="calendar-day text-muted">1</td>
|
||||
<td class="calendar-day text-muted has-events light">2</td>
|
||||
<td class="calendar-day text-muted has-events medium">3</td>
|
||||
<td class="calendar-day text-muted">4</td>
|
||||
<td class="calendar-day text-muted has-events light">5</td>
|
||||
<td class="calendar-day text-muted">6</td>
|
||||
<td class="calendar-day text-muted">7</td>
|
||||
</tr>
|
||||
<tr class="text-center">
|
||||
<td class="calendar-day text-muted">8</td>
|
||||
<td class="calendar-day text-muted has-events medium">9</td>
|
||||
<td class="calendar-day text-muted has-events light">10</td>
|
||||
<td class="calendar-day text-muted has-events heavy">11</td>
|
||||
<td class="calendar-day text-muted has-events medium">12</td>
|
||||
<td class="calendar-day text-muted has-events light">13</td>
|
||||
<td class="calendar-day text-muted">14</td>
|
||||
</tr>
|
||||
<tr class="text-center">
|
||||
<td class="calendar-day text-muted">15</td>
|
||||
<td class="calendar-day text-muted has-events medium">16</td>
|
||||
<td class="calendar-day text-muted has-events light">17</td>
|
||||
<td class="calendar-day text-muted has-events medium">18</td>
|
||||
<td class="calendar-day text-muted has-events heavy">19</td>
|
||||
<td class="calendar-day text-muted has-events medium">20</td>
|
||||
<td class="calendar-day text-muted">21</td>
|
||||
</tr>
|
||||
<tr class="text-center">
|
||||
<td class="calendar-day">22</td>
|
||||
<td class="calendar-day bg-primary text-white rounded has-events heavy">23</td>
|
||||
<td class="calendar-day has-events medium">24</td>
|
||||
<td class="calendar-day has-events light">25</td>
|
||||
<td class="calendar-day has-events medium">26</td>
|
||||
<td class="calendar-day has-events heavy">27</td>
|
||||
<td class="calendar-day">28</td>
|
||||
</tr>
|
||||
<tr class="text-center">
|
||||
<td class="calendar-day">29</td>
|
||||
<td class="calendar-day has-events medium">30</td>
|
||||
<td class="calendar-day has-events light">31</td>
|
||||
<td class="calendar-day text-muted">1</td>
|
||||
<td class="calendar-day text-muted has-events light">2</td>
|
||||
<td class="calendar-day text-muted">3</td>
|
||||
<td class="calendar-day text-muted">4</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="d-flex justify-content-center mt-1 small">
|
||||
<span class="me-3"><span class="d-inline-block bg-primary rounded-circle" style="width:8px;height:8px"></span> Light</span>
|
||||
<span class="me-3"><span class="d-inline-block bg-warning rounded-circle" style="width:8px;height:8px"></span> Medium</span>
|
||||
<span><span class="d-inline-block bg-danger rounded-circle" style="width:8px;height:8px"></span> Heavy</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h6 class="mb-1">Today's Schedule - October 23, 2023</h6>
|
||||
<div class="table-responsive">
|
||||
<table class="table table-sm table-hover mb-0">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Time</th>
|
||||
<th>Address</th>
|
||||
<th>Type</th>
|
||||
<th>Technician</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>8:00 AM</td>
|
||||
<td>123 Maple St</td>
|
||||
<td>Nuisance</td>
|
||||
<td>S. Johnson</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>9:30 AM</td>
|
||||
<td>456 Oak Ave</td>
|
||||
<td>Green Pool</td>
|
||||
<td>M. Williams</td>
|
||||
</tr>
|
||||
<tr class="table-active">
|
||||
<td>11:00 AM</td>
|
||||
<td>789 Pine Ln</td>
|
||||
<td>Prev Source</td>
|
||||
<td>L. Rodriguez</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Technician Roster - Table View -->
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-header bg-info text-white py-2">
|
||||
<h5 class="mb-0">Today's Technician Roster</h5>
|
||||
</div>
|
||||
<div class="card-body p-0">
|
||||
<div class="table-responsive">
|
||||
<table class="table table-hover table-sm tech-table mb-0">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Technician</th>
|
||||
<th>Scheduled</th>
|
||||
<th>Completed</th>
|
||||
<th>Phone</th>
|
||||
<th>Status</th>
|
||||
<th>Location</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="https://via.placeholder.com/32" class="rounded-circle me-2" alt="Photo">
|
||||
<span>Sarah Johnson</span>
|
||||
</div>
|
||||
</td>
|
||||
<td>8</td>
|
||||
<td>5</td>
|
||||
<td>(555) 234-5678</td>
|
||||
<td><span class="badge bg-success">Servicing</span></td>
|
||||
<td>123 Maple St, Zone 3</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="https://via.placeholder.com/32" class="rounded-circle me-2" alt="Photo">
|
||||
<span>Mark Williams</span>
|
||||
</div>
|
||||
</td>
|
||||
<td>7</td>
|
||||
<td>3</td>
|
||||
<td>(555) 345-6789</td>
|
||||
<td><span class="badge bg-warning text-dark">On Break</span></td>
|
||||
<td>Office - Lunchroom</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="https://via.placeholder.com/32" class="rounded-circle me-2" alt="Photo">
|
||||
<span>Lisa Rodriguez</span>
|
||||
</div>
|
||||
</td>
|
||||
<td>9</td>
|
||||
<td>6</td>
|
||||
<td>(555) 456-7890</td>
|
||||
<td><span class="badge bg-primary">In Transit</span></td>
|
||||
<td>En route to 789 Pine Ln</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="https://via.placeholder.com/32" class="rounded-circle me-2" alt="Photo">
|
||||
<span>Carlos Martinez</span>
|
||||
</div>
|
||||
</td>
|
||||
<td>6</td>
|
||||
<td>4</td>
|
||||
<td>(555) 567-8901</td>
|
||||
<td><span class="badge bg-success">Servicing</span></td>
|
||||
<td>202 Birch Dr, Zone 2</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{end}}
|
||||
Loading…
Add table
Add a link
Reference in a new issue