Add configuration upload page

This commit is contained in:
Eli Ribble 2026-03-24 13:45:37 -07:00
parent a64df8a687
commit 0718d88f7a
No known key found for this signature in database
3 changed files with 130 additions and 1 deletions

View file

@ -9,6 +9,7 @@ import ConfigurationOrganization from "./view/configuration/Organization.vue";
import ConfigurationPesticide from "./view/configuration/Pesticide.vue";
import ConfigurationPesticideAdd from "./view/configuration/PesticideAdd.vue";
import ConfigurationRoot from "./view/configuration/Root.vue";
import ConfigurationUpload from "./view/configuration/Upload.vue";
import ConfigurationUser from "./view/configuration/User.vue";
import ConfigurationUserAdd from "./view/configuration/UserAdd.vue";
import Intelligence from "./view/Intelligence.vue";
@ -70,6 +71,12 @@ const routes: RouteRecordRaw[] = [
component: ConfigurationPesticideAdd,
meta: { requiresAuth: true, showSidebar: true },
},
{
path: "/configuration/upload",
name: "Upload Configuration",
component: ConfigurationUpload,
meta: { requiresAuth: true, showSidebar: true },
},
{
path: "/configuration/user",
name: "User Configuration",

View file

@ -119,7 +119,7 @@
<div class="d-flex justify-content-between align-items-center">
<a
class="btn btn-outline-warning"
href="{{ .URL.Configuration.Upload }}"
href="/configuration/upload"
>
Manage Uploads
<i class="bi bi-arrow-right ms-1"></i>

View file

@ -0,0 +1,122 @@
<template>
<div class="container mb-5">
<div class="row">
<!-- Green Pool Management -->
<div class="col-md-4">
<div class="card h-100 upload-card border-success">
<div class="card-body text-center">
<i class="bi bi-water card-icon"></i>
<h5 class="card-title">Green Pool Management</h5>
<p class="card-text">
Upload spreadsheets with addresses and contact information of
unmaintained pools that may breed mosquitoes.
</p>
<a class="btn btn-primary" href="/configuration/upload/pool">
<i class="bi bi-upload me-2"></i>Upload Green Pool Data</a
>
</div>
<div class="card-footer bg-white text-muted">
<small><i class="bi bi-clock"></i> Last import: 02/15/2023</small>
</div>
</div>
</div>
<!-- Employee Information -->
<div class="col-md-4">
<div class="card h-100 upload-card border-primary">
<div class="card-body text-center">
<i class="bi bi-people-fill card-icon" style="color: #0d6efd"></i>
<h5 class="card-title">Employee Information</h5>
<p class="card-text">
Import employee data including names, contact information, and
responsibilities for system user creation.
</p>
<!--
<p class="text-muted small">Supported formats: .xlsx, .csv</p>
<div class="mb-3">
<label for="employeeFile" class="form-label"
>Select file to import</label
>
<input class="form-control" type="file" id="employeeFile" />
</div>
<button type="button" class="btn btn-primary disabled" disabled>
<i class="bi bi-upload me-2"></i>Upload Employee Data
</button>
-->
</div>
<div class="card-footer bg-white text-muted">
<small><i class="bi bi-clock"></i> Last import: 03/01/2023</small>
</div>
</div>
</div>
<!-- Field Notebooks -->
<div class="col-md-4">
<div class="card h-100 upload-card border-warning">
<div class="card-body text-center">
<i class="bi bi-journal-text card-icon" style="color: #fd7e14"></i>
<h5 class="card-title">Field Notebooks</h5>
<p class="card-text">
Upload scanned technician field notebooks to digitize information
about breeding sources they've identified.
</p>
<!--
<p class="text-muted small">Supported formats: .pdf, .jpg, .png</p>
<div class="mb-3">
<label for="notebookFile" class="form-label"
>Select file to import</label
>
<input class="form-control" type="file" id="notebookFile" />
</div>
<button type="button" class="btn btn-warning text-white">
<i class="bi bi-upload me-2"></i>Upload Notebook Data
</button>
-->
</div>
<div class="card-footer bg-white text-muted">
<small><i class="bi bi-clock"></i> Last import: 03/15/2023</small>
</div>
</div>
</div>
</div>
<!-- Import History Section -->
<div class="row mt-5">
<div class="col-12">
<h3><i class="bi bi-clock-history"></i> Recent Import History</h3>
<table class="table table-striped table-hover">
<thead class="table-dark">
<tr>
<th scope="col">Date/Time</th>
<th scope="col">Import Type</th>
<th scope="col">Filename</th>
<th scope="col">Status</th>
<th scope="col">Records</th>
<th scope="col">Actions</th>
</tr>
</thead>
<tbody>
<tr v-for="upload in uploads">
<td><TimeRelative :time="upload.created"/></td>
<td>{{upload.type}}</td>
<td>{{upload.filename}}</td>
<td>
<span class="badge" :class="upload.status"
>{{upload.status}}</span
>
</td>
<td>{{upload.record_count}} entries</td>
<td>
<a
class="btn btn-sm btn-outline-primary"
:href="`/configuration/upload/${upload.id}`"
>View</a
>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</template>