Normalize the asset detail card layout across all five pages

One canonical card order applied to machines, PCs, printers, network,
and measuring tools: Identity -> type-specific -> status -> Location &
Organization -> domain -> Custom Fields -> Warranty -> Relationships ->
Notes -> audit footer, with a documenting comment on each page so they
stop drifting. The location card is Location & Organization everywhere;
the network detail page is rebuilt into the family (Asset Information
folded into Identity, Record Info retired for the standard audit
footer, a Location & Organization card added). Fixed two latent bugs
found in the process: printer detail had no audit footer, and the
network Record Info read datecreated/datemodified (not in the payload)
so its timestamps rendered blank - the footer now uses the correct
fields.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

frontend/src/views/network/NetworkDeviceDetail.vue

@@ -59,56 +59,12 @@
       </div>
     </div>
 
+    <!-- Canonical card order: Identity -> type-specific -> status -> Location & Organization -> domain -> Custom Fields -> Warranty -> Relationships -> Notes -> audit footer -->
     <div class="content-grid">
       <div class="content-column">
-        <!-- Network Info -->
+        <!-- Identity -->
         <div class="section-card">
-          <h3 class="section-title">Network Information</h3>
-          <div class="info-list">
-            <div class="info-row">
-              <span class="info-label">Hostname</span>
-              <span class="info-value mono">{{ device.networkdevice?.hostname || '-' }}</span>
-            </div>
-            <div class="info-row">
-              <span class="info-label">Firmware Version</span>
-              <span class="info-value">{{ device.networkdevice?.firmwareversion || '-' }}</span>
-            </div>
-            <div class="info-row">
-              <span class="info-label">Port Count</span>
-              <span class="info-value">{{ device.networkdevice?.portcount || '-' }}</span>
-            </div>
-            <div class="info-row">
-              <span class="info-label">Rack Unit</span>
-              <span class="info-value">{{ device.networkdevice?.rackunit || '-' }}</span>
-            </div>
-            <div class="info-row">
-              <span class="info-label">PoE Capable</span>
-              <span class="info-value">{{ device.networkdevice?.ispoe ? 'Yes' : 'No' }}</span>
-            </div>
-            <div class="info-row">
-              <span class="info-label">Managed Device</span>
-              <span class="info-value">{{ device.networkdevice?.ismanaged ? 'Yes' : 'No' }}</span>
-            </div>
-          </div>
-        </div>
-
-        <!-- Custom Fields -->
-        <CustomFieldsSection :assetid="device.assetid" />
-
-        <!-- Warranty -->
-        <WarrantyPanel :assetid="device.assetid" :items="warranties" />
-
-        <!-- Notes -->
-        <div class="section-card" v-if="device.notes">
-          <h3 class="section-title">Notes</h3>
-          <div class="notes-content">{{ device.notes }}</div>
-        </div>
-      </div>
-
-      <div class="content-column">
-        <!-- Asset Info -->
-        <div class="section-card">
-          <h3 class="section-title">Asset Information</h3>
+          <h3 class="section-title">Identity</h3>
           <div class="info-list">
             <div class="info-row">
               <span class="info-label">Asset Number</span>
@@ -138,16 +94,62 @@
               <span class="info-label">Device Type</span>
               <span class="info-value">{{ device.networkdevice?.networkdevicetypename || '-' }}</span>
             </div>
+          </div>
+        </div>
+
+        <!-- Network Information (type-specific) -->
+        <div class="section-card">
+          <h3 class="section-title">Network Information</h3>
+          <div class="info-list">
             <div class="info-row">
-              <span class="info-label">Status</span>
-              <span class="info-value">
-                <span class="badge" :style="colorStyle(device.statuscolor)">
-                  {{ device.statusname || 'Unknown' }}
-                </span>
-              </span>
+              <span class="info-label">Hostname</span>
+              <span class="info-value mono">{{ device.networkdevice?.hostname || '-' }}</span>
+            </div>
+            <div class="info-row">
+              <span class="info-label">Firmware Version</span>
+              <span class="info-value">{{ device.networkdevice?.firmwareversion || '-' }}</span>
+            </div>
+            <div class="info-row">
+              <span class="info-label">Port Count</span>
+              <span class="info-value">{{ device.networkdevice?.portcount || '-' }}</span>
+            </div>
+            <div class="info-row">
+              <span class="info-label">Rack Unit</span>
+              <span class="info-value">{{ device.networkdevice?.rackunit || '-' }}</span>
+            </div>
+            <div class="info-row">
+              <span class="info-label">PoE Capable</span>
+              <span class="info-value">{{ device.networkdevice?.ispoe ? 'Yes' : 'No' }}</span>
+            </div>
+            <div class="info-row">
+              <span class="info-label">Managed Device</span>
+              <span class="info-value">{{ device.networkdevice?.ismanaged ? 'Yes' : 'No' }}</span>
             </div>
           </div>
         </div>
+      </div>
+
+      <div class="content-column">
+        <!-- Location & Organization -->
+        <div class="section-card">
+          <h3 class="section-title">Location & Organization</h3>
+          <div class="info-list">
+            <div class="info-row">
+              <span class="info-label">Location</span>
+              <span class="info-value">{{ device.locationname || '-' }}</span>
+            </div>
+            <div class="info-row">
+              <span class="info-label">Business Unit</span>
+              <span class="info-value">{{ device.businessunitname || '-' }}</span>
+            </div>
+          </div>
+        </div>
+
+        <!-- Custom Fields -->
+        <CustomFieldsSection :assetid="device.assetid" />
+
+        <!-- Warranty -->
+        <WarrantyPanel :assetid="device.assetid" :items="warranties" />
 
         <!-- Relationships -->
         <AssetRelationships
@@ -155,19 +157,10 @@
           :assetId="device.assetid"
         />
 
-        <!-- Audit Info -->
-        <div class="section-card audit-card">
-          <h3 class="section-title">Record Info</h3>
-          <div class="info-list">
-            <div class="info-row" v-if="device.datecreated">
-              <span class="info-label">Created</span>
-              <span class="info-value">{{ formatDate(device.datecreated) }}</span>
-            </div>
-            <div class="info-row" v-if="device.datemodified">
-              <span class="info-label">Last Modified</span>
-              <span class="info-value">{{ formatDate(device.datemodified) }}</span>
-            </div>
-          </div>
+        <!-- Notes -->
+        <div class="section-card" v-if="device.notes">
+          <h3 class="section-title">Notes</h3>
+          <div class="notes-content">{{ device.notes }}</div>
         </div>
       </div>
     </div>
@@ -184,6 +177,12 @@
         Delete Device
       </button>
     </div>
+
+    <!-- Audit Footer -->
+    <div class="audit-footer">
+      <span>Created {{ formatDate(device.createddate) }}<template v-if="device.createdby"> by {{ device.createdby }}</template></span>
+      <span>Modified {{ formatDate(device.modifieddate) }}<template v-if="device.modifiedby"> by {{ device.modifiedby }}</template></span>
+    </div>
   </div>
 
   <div v-else-if="loading" class="loading-container">