Add custom fields + warranty plugin, rework settings into two-pane shell

Feature work from the 2026-07 session:

Settings IA
- Replace the flat 27-card settings hub with a persistent two-pane shell
  (SettingsLayout.vue): grouped, searchable left rail + content pane.
- Nest all settings/* routes under the shell via router post-processing;
  shared nav catalog in settingsNav.js. Group by asset class (PCs, Printers,
  Equipment, Network) so per-type settings stop scattering.

Custom fields (core)
- customfields + customfieldvalues tables (migration 7d14), CRUD API at
  /api/customfields, per-asset value get/save.
- Settings management page + reusable CustomFieldsSection (detail) and
  CustomFieldsInputs (form) wired into all four asset types.

Warranty (new plugin)
- plugins/warranty: warranties + warrantyassets (migration 7d15), derived
  coverage status, provider abstraction (manual now; Dell/Lenovo/HP stubs).
- API CRUD + per-asset panel + report buckets; WarrantyPanel on all four
  detail pages; Warranties management page; Warranty report + Reports card.
- Seed warranty.* permissions.

Printer drivers
- printerdrivers table (migration 7d13) linked to printer models; drivers now
  surface on the matching printer's detail page.

Other
- PCDetail rebalanced (Network + Status + Warranty + custom fields on the right).
- Rename PCs list "Features" column to "Remote Access"; fix badge hover underline.
- Drop equipment islocationonly field.
- Centralize asset-type label/route maps into utils/assetTypes.js.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

frontend/src/views/pcs/PCsList.vue

@@ -28,7 +28,7 @@
                 <th>Hostname</th>
                 <th>Serial Number</th>
                 <th>Type</th>
-                <th>Features</th>
+                <th>Remote Access</th>
                 <th>Status</th>
                 <th>Location</th>
                 <th>Actions</th>
@@ -41,12 +41,14 @@
                 <td class="mono">{{ item.serialnumber || '-' }}</td>
                 <td>{{ item.computer?.computertypename || '-' }}</td>
                 <td class="features">
-                  <span v-if="item.computer?.isvnc" class="feature-tag active">VNC</span>
-                  <span v-if="item.computer?.iswinrm" class="feature-tag active">WinRM</span>
-                  <span v-if="!item.computer?.isvnc && !item.computer?.iswinrm">-</span>
+                  <template v-for="a in (item.accessmethods || [])" :key="a.id">
+                    <a v-if="a.link" :href="a.link" class="access-link" :title="a.link" @click.stop>{{ a.name }}</a>
+                    <span v-else class="access-link disabled" title="No hostname/IP set">{{ a.name }}</span>
+                  </template>
+                  <span v-if="!(item.accessmethods || []).length">-</span>
                 </td>
                 <td>
-                  <span class="badge" :class="getStatusClass(item.statusname)">
+                  <span class="badge" :style="colorStyle(item.statuscolor)">
                     {{ item.statusname || 'Unknown' }}
                   </span>
                 </td>
@@ -86,6 +88,7 @@
 import { ref, onMounted } from 'vue'
 import { computersApi } from '../../api'
 import PaginationBar from '../../components/PaginationBar.vue'
+import { colorStyle } from '@/utils/colorStyle'
 
 const computers = ref([])
 const loading = ref(true)
@@ -138,17 +141,30 @@ function changePerPage(newPerPage) {
   loadComputers()
 }
 
-function getStatusClass(status) {
-  if (!status) return 'badge-info'
-  const s = status.toLowerCase()
-  if (s === 'in use' || s === 'active') return 'badge-success'
-  if (s === 'in repair') return 'badge-warning'
-  if (s === 'retired') return 'badge-danger'
-  return 'badge-info'
-}
 </script>
 
 <style scoped>
+.access-link {
+  display: inline-block;
+  padding: 2px 10px;
+  margin: 0 4px 3px 0;
+  border-radius: 12px;
+  background: var(--primary);
+  color: #fff;
+  font-size: 0.78rem;
+  font-weight: 600;
+  text-decoration: none;
+}
+.access-link:hover {
+  background: var(--primary-dark);
+  text-decoration: none;
+}
+.access-link.disabled {
+  background: var(--secondary);
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
 .mono {
   font-family: 'SF Mono', 'Monaco', 'Consolas', monospace;
 }