Add print badges, pagination, route splitting, JWT auth fixes, and list page alignment

- Fix equipment badge barcode not rendering (loading race condition)
- Fix printer QR code not rendering on initial load (same race condition)
- Add model image to equipment badge via imageurl from Model table
- Fix white-on-white machine number text on badge, tighten barcode spacing
- Add PaginationBar component used across all list pages
- Split monolithic router into per-plugin route modules
- Fix 25 GET API endpoints returning 401 (jwt_required -> optional=True)
- Align list page columns across Equipment, PCs, and Network pages
- Add print views: EquipmentBadge, PrinterQRSingle, PrinterQRBatch, USBLabelBatch
- Add PC Relationships report, migration docs, and CLAUDE.md project guide
- Various plugin model, API, and frontend refinements

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
cproudlock
2026-02-04 07:32:44 -05:00
parent fe7a00b260
commit 83caaa7b7c
89 changed files with 3951 additions and 1138 deletions

View File

@@ -2,7 +2,10 @@
<div>
<div class="page-header">
<h2>Printers</h2>
<router-link to="/printers/new" class="btn btn-primary">Add Printer</router-link>
<div class="header-actions">
<router-link to="/print/printer-qr" class="btn btn-secondary" target="_blank">Batch Print QR</router-link>
<router-link to="/printers/new" class="btn btn-primary">Add Printer</router-link>
</div>
</div>
<!-- Filters -->
@@ -36,11 +39,11 @@
<tr v-for="printer in printers" :key="printer.printer?.printerid || printer.assetid">
<td>{{ printer.assetnumber }}</td>
<td>{{ printer.name || '-' }}</td>
<td>{{ printer.businessunit_name || '-' }}</td>
<td>{{ printer.printer?.model_name || '-' }}</td>
<td>{{ printer.businessunitname || '-' }}</td>
<td>{{ printer.printer?.modelname || '-' }}</td>
<td>
<span class="badge" :class="getStatusClass(printer.status_name)">
{{ printer.status_name || 'Active' }}
<span class="badge" :class="getStatusClass(printer.statusname)">
{{ printer.statusname || 'Active' }}
</span>
</td>
<td class="actions">
@@ -62,16 +65,13 @@
</div>
<!-- Pagination -->
<div class="pagination" v-if="totalPages > 1">
<button
v-for="p in totalPages"
:key="p"
:class="{ active: p === page }"
@click="goToPage(p)"
>
{{ p }}
</button>
</div>
<PaginationBar
:page="page"
:totalPages="totalPages"
:perPage="perPage"
@update:page="goToPage"
@update:perPage="changePerPage"
/>
</template>
</div>
</div>
@@ -80,12 +80,14 @@
<script setup>
import { ref, onMounted } from 'vue'
import { printersApi } from '../../api'
import PaginationBar from '../../components/PaginationBar.vue'
const printers = ref([])
const loading = ref(true)
const search = ref('')
const page = ref(1)
const totalPages = ref(1)
const perPage = ref(20)
let searchTimeout = null
@@ -98,13 +100,13 @@ async function loadPrinters() {
try {
const params = {
page: page.value,
perpage: 20
perpage: perPage.value
}
if (search.value) params.search = search.value
const response = await printersApi.list(params)
printers.value = response.data.data || []
totalPages.value = response.data.meta?.pagination?.total_pages || 1
totalPages.value = response.data.meta?.pagination?.totalpages || response.data.meta?.pagination?.total_pages || 1
} catch (error) {
console.error('Error loading printers:', error)
} finally {
@@ -125,6 +127,12 @@ function goToPage(p) {
loadPrinters()
}
function changePerPage(newPerPage) {
perPage.value = newPerPage
page.value = 1
loadPrinters()
}
function getStatusClass(status) {
if (!status) return 'badge-info'
const s = status.toLowerCase()