fix(audit): 完善前端审计日志详情展示，支持同时渲染changes/deleted_snapshot/created结构

inventory-web/src/views/system/AuditLog.vue

@@ -63,7 +63,13 @@
         <el-table-column prop="created_at" label="操作时间" width="170" />
         <el-table-column label="操作" width="120" fixed="right">
           <template #default="scope">
-            <el-button v-if="scope.row.details && Object.keys(scope.row.details).length > 0" link type="primary" size="small" @click="handleViewDetails(scope.row)">
+            <el-button
+              v-if="hasDetailContent(scope.row.details)"
+              link
+              type="primary"
+              size="small"
+              @click="handleViewDetails(scope.row)"
+            >
               查看详情
             </el-button>
             <span v-else style="color: #909399; font-size: 12px;">无变更明细</span>
@@ -102,11 +108,11 @@
         <el-descriptions-item label="操作时间" :span="2">{{ currentLog.created_at }}</el-descriptions-item>
       </el-descriptions>
 
-      <!-- ★ 变更明细区域 ★ -->
+      <!-- ★ 变更明细区域（支持同时展示多种结构）★ -->
       <div class="details-section">
 
         <!-- 情况1：UPDATE - 变更对比表 -->
-        <div v-if="detailType === 'changes'" class="changes-box">
+        <div v-if="hasChanges" class="changes-box">
           <div class="section-title">
             <el-icon><EditPen /></el-icon>
             字段变更详情（共 {{ changesList.length }} 处变更）
@@ -131,10 +137,10 @@
         </div>
 
         <!-- 情况2：DELETE - 删除快照 -->
-        <div v-else-if="detailType === 'deleted_snapshot'" class="snapshot-box">
+        <div v-if="hasDeletedSnapshot" class="snapshot-box">
           <div class="section-title">
             <el-icon><Delete /></el-icon>
-            数据删除快照
+            删除前的数据快照
           </div>
           <el-descriptions :column="2" border size="small">
             <el-descriptions-item
@@ -149,10 +155,10 @@
         </div>
 
         <!-- 情况3：CREATE - 新增详情 -->
-        <div v-else-if="detailType === 'created'" class="snapshot-box">
+        <div v-if="hasCreated" class="snapshot-box">
           <div class="section-title">
             <el-icon><Plus /></el-icon>
-            新增数据详情
+            新增的数据详情
           </div>
           <el-descriptions :column="2" border size="small">
             <el-descriptions-item
@@ -166,8 +172,8 @@
           </el-descriptions>
         </div>
 
-        <!-- 兜底：原始 JSON -->
+        <!-- 兜底：原始 JSON（仅在没有任何高级结构时显示） -->
-        <div v-else class="raw-json-box">
+        <div v-if="showRawJson" class="raw-json-box">
           <div class="section-title">
             <el-icon><Document /></el-icon>
             原始数据
@@ -220,16 +226,36 @@ const currentLog = ref<any>({})
 // 详情解析逻辑
 // ============================================================
 
-// 解析 detail type
+// 辅助函数：判断 details 是否有可显示内容
-const detailType = computed(() => {
+const hasDetailContent = (details: any): boolean => {
+  if (!details || typeof details !== 'object') return false
+  if (Object.keys(details).length === 0) return false
+  return !!(
+    details.changes ||
+    details.deleted_snapshot ||
+    details.created ||
+    details.payload
+  )
+}
+
+// 判断是否存在各高级结构
+const hasChanges = computed(() => {
   const details = currentLog.value.details
-  if (!details) return 'raw'
+  return !!(details?.changes && typeof details.changes === 'object')
+})
 
-  if (details.changes && typeof details.changes === 'object') return 'changes'
+const hasDeletedSnapshot = computed(() => {
-  if (details.deleted_snapshot && typeof details.deleted_snapshot === 'object') return 'deleted_snapshot'
+  const details = currentLog.value.details
-  if (details.created && typeof details.created === 'object') return 'created'
+  return !!(details?.deleted_snapshot && typeof details.deleted_snapshot === 'object')
+})
 
-  return 'raw'
+const hasCreated = computed(() => {
+  const details = currentLog.value.details
+  return !!(details?.created && typeof details.created === 'object')
+})
+
+const showRawJson = computed(() => {
+  return !hasChanges.value && !hasDeletedSnapshot.value && !hasCreated.value
 })
 
 // 解析 changes 为表格数据