Add configuration upload page
This commit is contained in:
parent
a64df8a687
commit
0718d88f7a
3 changed files with 130 additions and 1 deletions
|
|
@ -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",
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
122
ts/view/configuration/Upload.vue
Normal file
122
ts/view/configuration/Upload.vue
Normal 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>
|
||||
Loading…
Add table
Add a link
Reference in a new issue