Let somebody retire an asset without an API call

Five of the seven asset types had no way to take a record out of ShopDB from
the interface. Network devices and 3D printed parts had a button; machines,
PCs, printers and measuring tools did not, so a scrapped tool stayed in every
list and report until somebody went to the API.

The endpoints were already there and already correct. Every one of these
DELETEs sets asset.isactive = False and nothing more, so the record leaves the
lists while its calibration history, backups and relationships stay exactly
where they were.

Called "Retire" rather than "Delete" for that reason: the two existing buttons
say Delete, which reads as destruction of a record that is in fact kept and can
be restored by setting isactive back. The confirm says so too, because the
question somebody needs answered before clicking is whether the history goes
with it.

The button is guarded on the record having loaded, on the two pages whose
action row renders before the fetch resolves - measuring tools showed Retire
beside a hidden Edit while the tool was still loading, which would have called
delete with an undefined id.

printersApi had no delete method at all; added.

USB is deliberately left out. It retires through a status column in the
external CMMC database rather than isactive, has its own /retire endpoint, and
needs its own decision about what retiring means there.

plugins/computers/frontend/views/PCDetail.vue

@@ -5,6 +5,7 @@
       <div class="header-actions">
         <router-link :to="`/print/asset-label/computer/${$route.params.id}`" class="btn btn-secondary" target="_blank">Print Label</router-link>
         <router-link :to="`/pcs/${$route.params.id}/edit`" class="btn btn-primary">Edit</router-link>
+        <button @click="confirmRetire" class="btn btn-danger">Retire</button>
         <router-link to="/pcs" class="btn btn-secondary">Back to List</router-link>
       </div>
     </div>
@@ -254,7 +255,7 @@
 <script setup>
 import { ref, onMounted } from 'vue'
 import { colorStyle } from "@/utils/colorStyle"
-import { useRoute } from 'vue-router'
+import { useRoute, useRouter } from 'vue-router'
 import { computersApi, applicationsApi } from '@/api'
 import { withBase } from '@/utils/basePath'
 import { useWarrantyBadge } from '@/composables/warrantyBadge'
@@ -264,8 +265,12 @@ import PluginAssetPanels from '@/components/PluginAssetPanels.vue'
 import AssetRelationships from '@/components/AssetRelationships.vue'
 import { useIdentifierFlags } from '@/composables/identifierSettings'
 import { setRecordTitle } from '@/composables/pageTitle'
+import { useToast } from '@/composables/toast'
+import { apiError } from '@/utils/apiError'
 
 const route = useRoute()
+const router = useRouter()
+const toast = useToast()
 const { isEnabled } = useIdentifierFlags()
 
 const loading = ref(true)
@@ -310,6 +315,23 @@ function formatDate(dateStr) {
   if (!dateStr) return '-'
   return new Date(dateStr).toLocaleString()
 }
+
+// Retire, not delete: the server deactivates the asset, so the PC
+// leaves every list and report while its history and relationships stay put.
+// Reversible by an admin setting isactive back to true.
+async function confirmRetire() {
+  const label = computer.value?.assetnumber || computer.value?.name || 'this PC'
+  if (!confirm(`Retire ${label}?\n\nIt will no longer appear in ShopDB. `
+               + `History and relationships are kept, and it can be restored.`)) return
+  try {
+    await computersApi.delete(route.params.id)
+    toast.success(`Retired ${label}`)
+    router.push('/pcs')
+  } catch (error) {
+    console.error('Error retiring PC:', error)
+    toast.error(apiError(error, 'Failed to retire PC'))
+  }
+}
 </script>
 
 <style scoped>

plugins/machines/frontend/views/MachineDetail.vue

@@ -12,6 +12,7 @@
         <router-link :to="`/machines/${machine?.machine?.machineid}/edit`" class="btn btn-primary" v-if="machine">
           Edit
         </router-link>
+        <button @click="confirmRetire" class="btn btn-danger" v-if="machine">Retire</button>
         <router-link to="/machines" class="btn btn-secondary">Back to List</router-link>
       </div>
     </div>
@@ -248,7 +249,7 @@
 
 <script setup>
 import { ref, onMounted } from 'vue'
-import { useRoute } from 'vue-router'
+import { useRoute, useRouter } from 'vue-router'
 import { machinesApi } from '@/api'
 import { withBase } from '@/utils/basePath'
 import LocationMapTooltip from '@/components/LocationMapTooltip.vue'
@@ -258,8 +259,12 @@ import AssetRelationships from '@/components/AssetRelationships.vue'
 import { useWarrantyBadge } from '@/composables/warrantyBadge'
 import { useIdentifierFlags } from '@/composables/identifierSettings'
 import { setRecordTitle } from '@/composables/pageTitle'
+import { useToast } from '@/composables/toast'
+import { apiError } from '@/utils/apiError'
 
 const route = useRoute()
+const router = useRouter()
+const toast = useToast()
 const { isEnabled } = useIdentifierFlags()
 
 const loading = ref(true)
@@ -293,6 +298,23 @@ function formatDate(dateStr) {
   if (!dateStr) return '-'
   return new Date(dateStr).toLocaleString()
 }
+
+// Retire, not delete: the server deactivates the asset, so the machine
+// leaves every list and report while its history and relationships stay put.
+// Reversible by an admin setting isactive back to true.
+async function confirmRetire() {
+  const label = machine.value?.assetnumber || machine.value?.name || 'this machine'
+  if (!confirm(`Retire ${label}?\n\nIt will no longer appear in ShopDB. `
+               + `History and relationships are kept, and it can be restored.`)) return
+  try {
+    await machinesApi.delete(machine.value?.machine?.machineid)
+    toast.success(`Retired ${label}`)
+    router.push('/machines')
+  } catch (error) {
+    console.error('Error retiring machine:', error)
+    toast.error(apiError(error, 'Failed to retire machine'))
+  }
+}
 </script>
 
 <style scoped>

plugins/measuringtools/frontend/views/MeasuringToolDetail.vue

@@ -9,6 +9,7 @@
         <router-link :to="`/measuringtools/${tool?.measuringtool?.measuringtoolid}/edit`" class="btn btn-primary" v-if="tool">
           Edit
         </router-link>
+        <button @click="confirmRetire" class="btn btn-danger" v-if="tool">Retire</button>
         <router-link to="/measuringtools" class="btn btn-secondary">Back to List</router-link>
       </div>
     </div>
@@ -165,7 +166,7 @@
 
 <script setup>
 import { ref, onMounted } from 'vue'
-import { useRoute } from 'vue-router'
+import { useRoute, useRouter } from 'vue-router'
 import { colorStyle } from '@/utils/colorStyle'
 import { measuringtoolsApi } from '@/api'
 import CustomFieldsSection from '@/components/CustomFieldsSection.vue'
@@ -173,8 +174,12 @@ import PluginAssetPanels from '@/components/PluginAssetPanels.vue'
 import AssetRelationships from '@/components/AssetRelationships.vue'
 import { useIdentifierFlags } from '@/composables/identifierSettings'
 import { setRecordTitle } from '@/composables/pageTitle'
+import { useToast } from '@/composables/toast'
+import { apiError } from '@/utils/apiError'
 
 const route = useRoute()
+const router = useRouter()
+const toast = useToast()
 
 const { isEnabled } = useIdentifierFlags()
 
@@ -201,6 +206,23 @@ onMounted(async () => {
     loading.value = false
   }
 })
+
+// Retire, not delete: the server deactivates the asset, so the measuring tool
+// leaves every list and report while its history and relationships stay put.
+// Reversible by an admin setting isactive back to true.
+async function confirmRetire() {
+  const label = tool.value?.assetnumber || tool.value?.name || 'this measuring tool'
+  if (!confirm(`Retire ${label}?\n\nIt will no longer appear in ShopDB. `
+               + `History and relationships are kept, and it can be restored.`)) return
+  try {
+    await measuringtoolsApi.remove(tool.value?.measuringtool?.measuringtoolid)
+    toast.success(`Retired ${label}`)
+    router.push('/measuringtools')
+  } catch (error) {
+    console.error('Error retiring measuring tool:', error)
+    toast.error(apiError(error, 'Failed to retire measuring tool'))
+  }
+}
 </script>
 
 <style scoped>

plugins/printers/frontend/views/PrinterDetail.vue

@@ -10,6 +10,7 @@
           Print Label
         </router-link>
         <router-link :to="`/printers/${$route.params.id}/edit`" class="btn btn-primary">Edit</router-link>
+        <button @click="confirmRetire" class="btn btn-danger">Retire</button>
         <router-link to="/printers" class="btn btn-secondary">Back to List</router-link>
       </div>
     </div>
@@ -296,7 +297,7 @@
 
 <script setup>
 import { ref, onMounted, computed } from 'vue'
-import { useRoute } from 'vue-router'
+import { useRoute, useRouter } from 'vue-router'
 import { printersApi } from '@/api'
 import { withBase } from '@/utils/basePath'
 import LocationMapTooltip from '@/components/LocationMapTooltip.vue'
@@ -306,8 +307,12 @@ import AssetRelationships from '@/components/AssetRelationships.vue'
 import { useWarrantyBadge } from '@/composables/warrantyBadge'
 import { useIdentifierFlags } from '@/composables/identifierSettings'
 import { setRecordTitle } from '@/composables/pageTitle'
+import { useToast } from '@/composables/toast'
+import { apiError } from '@/utils/apiError'
 
 const route = useRoute()
+const router = useRouter()
+const toast = useToast()
 const { isEnabled } = useIdentifierFlags()
 
 const loading = ref(true)
@@ -386,6 +391,23 @@ function formatDate(dateStr) {
   if (!dateStr) return '-'
   return new Date(dateStr).toLocaleString()
 }
+
+// Retire, not delete: the server deactivates the asset, so the printer
+// leaves every list and report while its history and relationships stay put.
+// Reversible by an admin setting isactive back to true.
+async function confirmRetire() {
+  const label = displayTitle.value || 'this printer'
+  if (!confirm(`Retire ${label}?\n\nIt will no longer appear in ShopDB. `
+               + `History and relationships are kept, and it can be restored.`)) return
+  try {
+    await printersApi.remove(route.params.id)
+    toast.success(`Retired ${label}`)
+    router.push('/printers')
+  } catch (error) {
+    console.error('Error retiring printer:', error)
+    toast.error(apiError(error, 'Failed to retire printer'))
+  }
+}
 </script>
 
 <style scoped>