feat(audit-ui): 审计页 UI 重构 —— 干净模块下拉、变更摘要、抽屉详情、触发来源

后端：GET /audit/modules 与 /logs 的 modules 改为下发最终选项 [{value,label}]
  · 历史命名（入库管理/采购入库/成品入库/库存管理）折叠进「入库」一项且
    **不再单独列出**，下拉里看不到历史包袱。展开仍只由后端 expand_modules
    负责 —— 前端若自己再拼一份成员表，将来后端加成员会静默失效（本项目
    已经踩过两次这种漂移）。
  · 英文历史 module（image_embeddings 2719 条 / purchase_request 75 条 /
    sys_element 6 条）在这里翻成中文 label，value 保留英文原值否则筛选
    匹配不上。映射表 MODULE_LABELS 从**前端** AuditLog.vue 的 moduleMap
    收进 audit_labels.py —— 那份硬编副本历史上已经漂移过一次。
  · /audit/labels 新增 moduleDisplay {原始值 → 展示名}，同时覆盖聚合成员与
    英文历史值：只覆盖后者会出现「下拉显示『入库』、表格显示『库存管理』」，
    用户会以为筛选没生效。

后端：新增「触发来源」
  · 摘要追加 （来源：/outbound/request） 形式的 URL 尾段（去掉 /api/vN 前缀）。
    解决一个具体误解：业务方看到「入库/库存管理」里有大量非库管人员的
    UPDATE，以为越权改库存，实际是出库/借还/盘点等单据流转触发的自动扣减。
    实测该类 UPDATE 的来源：outbound 1582、outbound/request 424、
    borrow/dispatch 102、stocktake/update-quantity 95 —— 光看"谁改的"永远
    解释不清，必须能看出"哪个流程触发的"。
  · 来源拼在**截断之后**，保证这条关键信息永远不会被截掉。
  · 列表与导出共用 changes_summary，故 Excel 台账同样带来源。

后端：其余
  · 新增 target_keyword（ilike 同时匹配 target_id / target_name），
    放进共用的 _build_audit_query，导出自动支持。
  · action 在响应里归一化为 CREATE/UPDATE/DELETE（复用 audit_labels
    .canon_action，覆盖批量删除/分配/归还等全部历史别名）。库里还有 1573 条
    中文 action，归一后前端不必再为每种历史写法兜底。
  · 新增 summary 字段。不算在模型 @property 上：摘要要把 user_id/base_id
    翻成人名/物料名，需要查库，模型属性里发查询就是 N+1；改为整页一次
    load_ref_maps 批量解析。
  · 过滤对象 repr 脏值（<MaterialBase 3030>）。快照收集早期漏跳关系属性，
    库里留了 1529 条这种值 —— 不是业务数据，真正的值在对应 _id 字段里。
    判据收窄到「<类名 空格 内容>」，避免误伤备注里的「<急件>」。

前端 AuditLog.vue
  · 模块下拉改平铺 [{value,label}]，删除硬编的 moduleMap
  · 新增「操作对象」模糊搜索
  · 合并「操作人」「姓名」两列（判据 username==='system' —— 响应里没有
    operator_type 字段，那是请求参数名，照搬会永远不显示系统标签）
  · 新增「变更摘要」列；操作对象显示为「名称 #id」
  · 操作时间改为恒显示北京时间，不再按浏览器时区换算，与数据库/日报/导出一致
  · 详情弹窗改 el-drawer，按 action 分支渲染：UPDATE 出对比表，
    CREATE/DELETE 出快照属性表，并跳过对象 repr
  · 抽屉顶部高亮展示触发来源（METHOD + URL 告警条）

验证：后端 18 + 22 + 10 项断言全过（模块选项无历史名且「入库」=四值之和、
英文 value 仍可筛选、url_source 边界、来源不被截断、导出口径与列表一致、
权限 401/403/200 矩阵）；vue-tsc --noEmit 与 vite build 均 exit=0。
日报回归：三天附件 490.5K/193.5K/10.3K，6 列结构与改动前一致。

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

@@ -18,34 +18,29 @@
           </el-radio-group>
         </el-form-item>
         <el-form-item label="操作人">
-          <el-input v-model="queryParams.username" placeholder="请输入操作人账号" clearable @keyup.enter="handleQuery" style="width: 150px" />
+          <el-input
+              v-model="queryParams.username"
+              placeholder="输入姓名或账号"
+              clearable
+              style="width: 150px"
+              @keyup.enter="handleQuery"
+          />
         </el-form-item>
         <el-form-item label="模块">
           <!--
-            ★ 分两组：上面是业务聚合项，下面是具体的 module 值。
-              聚合项是必须的 —— 审计的 module 在 2026-09-10 换过一次口径
-              （旧的「入库管理」→ 新的「库存管理」），只按单个 module 值筛
-              「入库」会正好在那天断掉。聚合项由后端展开成全部成员值
-              （见后端 audit_labels.MODULE_GROUPS），前端不需要知道成员是谁。
+            ★ 平铺列表，选项由后端下发 [{value,label}]。
+              历史命名（入库管理/采购入库/成品入库/库存管理）已被后端折叠进
+              「入库」这一项且不再单独出现 —— 分组规则是后端 module_options()
+              的事，前端不硬编，否则将来后端加成员会**静默失效**。
+              详见后端 audit_labels.MODULE_GROUPS 的说明。
           -->
-          <el-select v-model="queryParams.module" placeholder="请选择模块" clearable style="width: 200px">
-            <el-option-group v-if="moduleGroupKeys.length" label="业务聚合">
-              <el-option
-                  v-for="g in moduleGroupKeys"
-                  :key="g"
-                  :label="g"
-                  :value="g"
-              />
-            </el-option-group>
-            <el-option-group label="具体模块">
-              <!-- ★ label 走中文映射，value 保留原始值以保证筛选命中 -->
-              <el-option
-                  v-for="item in moduleOptions"
-                  :key="item"
-                  :label="moduleLabel(item)"
-                  :value="item"
-              />
-            </el-option-group>
+          <el-select v-model="queryParams.module" placeholder="全部模块" clearable style="width: 170px">
+            <el-option
+                v-for="o in moduleOptions"
+                :key="o.value"
+                :label="o.label"
+                :value="o.value"
+            />
           </el-select>
         </el-form-item>
         <el-form-item label="操作类型">
@@ -59,7 +54,6 @@
               clearable
               style="width: 190px"
           >
-            <!-- ★ 下拉只列规范值，显示为中文；后端会把历史别名一并匹配 -->
             <el-option
                 v-for="item in actionOptions"
                 :key="item"
@@ -68,6 +62,16 @@
             />
           </el-select>
         </el-form-item>
+        <el-form-item label="操作对象">
+          <!-- 同时模糊匹配单号/编码/名称（后端 target_keyword 走 target_id + target_name） -->
+          <el-input
+              v-model="queryParams.target_keyword"
+              placeholder="输入单号、编码或名称"
+              clearable
+              style="width: 180px"
+              @keyup.enter="handleQuery"
+          />
+        </el-form-item>
         <el-form-item label="时间范围">
           <el-date-picker
               v-model="dateRange"
@@ -100,44 +104,71 @@
 
       <!-- 表格 -->
       <el-table v-loading="tableLoading" :data="tableData" border stripe>
-        <el-table-column prop="id" label="ID" width="70" />
-        <el-table-column prop="username" label="操作人" width="140">
-          <template #default="scope">
-            <!-- ★ 系统日志加灰色标签，便于在"全部"视图下快速识别 -->
-            <el-tag v-if="scope.row.username === 'system'" type="info" size="small">系统</el-tag>
-            <span v-else>{{ scope.row.username }}</span>
+        <el-table-column prop="id" label="ID" width="80" />
+
+        <!-- ★ 合并原「操作人」+「姓名」两列：它们本来就是同一个人 -->
+        <el-table-column label="操作人" width="170">
+          <template #default="{ row }">
+            <!-- ★ 判据必须是 username === 'system'。
+                 后端响应里**没有** operator_type 字段 —— 那是请求参数名，
+                 写成 row.operator_type === 'system' 会永远为假、标签永不显示。 -->
+            <template v-if="row.username === 'system'">
+              <el-tag type="info" size="small">系统</el-tag>
+            </template>
+            <template v-else>
+              {{ row.display_name || row.username }}
+              <span v-if="row.display_name && row.username" class="muted">({{ row.username }})</span>
+            </template>
           </template>
         </el-table-column>
-        <el-table-column prop="display_name" label="姓名" width="100" />
+
         <el-table-column prop="module" label="模块" width="120">
-          <template #default="scope">
-            <el-tag>{{ moduleLabel(scope.row.module) }}</el-tag>
+          <template #default="{ row }">
+            <el-tag>{{ moduleLabel(row.module) }}</el-tag>
           </template>
         </el-table-column>
+
         <el-table-column prop="action" label="操作类型" width="100">
-          <template #default="scope">
-            <el-tag :type="getActionType(scope.row.action)">{{ actionMap[scope.row.action] || scope.row.action }}</el-tag>
+          <template #default="{ row }">
+            <el-tag :type="getActionType(row.action)">{{ actionLabel(row.action) }}</el-tag>
           </template>
         </el-table-column>
-        <el-table-column prop="target_name" label="操作对象" min-width="150" show-overflow-tooltip />
+
+        <!-- 强化操作对象：名称 + 主键，便于按 ID 追单条记录 -->
+        <el-table-column label="操作对象" min-width="180" show-overflow-tooltip>
+          <template #default="{ row }">
+            <span>{{ row.target_name || '-' }}</span>
+            <span v-if="row.target_id" class="muted">#{{ row.target_id }}</span>
+          </template>
+        </el-table-column>
+
+        <!-- ★ 摘要由后端生成（含值翻译：状态 待审批→已通过、ID→人名）。
+             前端不要自己解析 details 树：那会让列表页加载庞大的 JSON，
+             且翻译规则会与后端/导出各存一份。 -->
+        <el-table-column prop="summary" label="变更摘要" min-width="220" show-overflow-tooltip>
+          <template #default="{ row }">
+            <span class="summary-text">{{ row.summary || '—' }}</span>
+          </template>
+        </el-table-column>
+
         <el-table-column prop="ip_address" label="IP地址" width="130" />
-        <el-table-column prop="created_at" label="操作时间" width="170">
-          <template #default="scope">
-            {{ formatLocalTime(scope.row.created_at) }}
-          </template>
-        </el-table-column>
-        <el-table-column label="操作" width="120" fixed="right">
-          <template #default="scope">
+
+        <!-- ★ 直接显示后端的北京时间字符串，不做时区换算：
+             与数据库、日报、导出保持同一口径，换台电脑看也是同一时刻 -->
+        <el-table-column prop="created_at" label="操作时间" width="170" />
+
+        <el-table-column label="操作" width="90" fixed="right" align="center">
+          <template #default="{ row }">
             <el-button
-              v-if="hasDetailContent(scope.row.details)"
-              link
-              type="primary"
-              size="small"
-              @click="handleViewDetails(scope.row)"
+                v-if="hasDetailContent(row.details)"
+                link
+                type="primary"
+                size="small"
+                @click="openDetail(row)"
             >
               查看详情
             </el-button>
-            <span v-else style="color: #909399; font-size: 12px;">无变更明细</span>
+            <span v-else class="muted">无明细</span>
           </template>
         </el-table-column>
       </el-table>
@@ -155,109 +186,116 @@
       />
     </el-card>
 
-    <!-- ★ 重写的详情弹窗：支持三种高级结构 ★ -->
-    <el-dialog v-model="detailDialogVisible" title="操作详情" width="750px" destroy-on-close :close-on-click-modal="false">
-      <!-- 基本信息 -->
-      <el-descriptions :column="2" border class="base-info">
-        <el-descriptions-item label="ID">{{ currentLog.id }}</el-descriptions-item>
-        <el-descriptions-item label="操作人">{{ currentLog.username }} ({{ currentLog.display_name }})</el-descriptions-item>
-        <el-descriptions-item label="模块">
-          <el-tag>{{ moduleLabel(currentLog.module) }}</el-tag>
-        </el-descriptions-item>
-        <el-descriptions-item label="操作类型">
-          <el-tag :type="getActionType(currentLog.action)">{{ actionMap[currentLog.action] || currentLog.action }}</el-tag>
-        </el-descriptions-item>
-        <el-descriptions-item label="操作对象" :span="2">{{ currentLog.target_name || '-' }}</el-descriptions-item>
-        <el-descriptions-item label="IP地址">{{ currentLog.ip_address }}</el-descriptions-item>
-        <el-descriptions-item label="请求方式">{{ currentLog.method }}</el-descriptions-item>
-        <el-descriptions-item label="操作时间" :span="2">{{ formatLocalTime(currentLog.created_at) }}</el-descriptions-item>
-      </el-descriptions>
+    <!-- 详情抽屉：比弹窗宽，字段对比更好读 -->
+    <el-drawer v-model="detailVisible" title="操作详情" size="46%" destroy-on-close>
+      <template v-if="currentDetail.id">
+        <!--
+          ★ 触发来源置顶高亮。
+            业务方看到「入库/库存管理」里出现大量非库管人员的 UPDATE，
+            会误以为"越权修改库存" —— 实际多数是出库、借还、盘点等**单据流转**
+            触发的自动扣减，操作人只是执行那笔单据的人。
+            光看"谁改的"永远解释不清，必须把"哪个接口触发的"摆到最显眼处。
+        -->
+        <el-alert
+            v-if="currentDetail.url"
+            type="info"
+            :closable="false"
+            show-icon
+            class="source-alert"
+        >
+          <template #title>
+            <span class="source-method">{{ currentDetail.method || '—' }}</span>
+            <span class="source-url">{{ currentDetail.url }}</span>
+          </template>
+          <template #default>
+            <span class="source-hint">
+              触发来源（该记录由这个接口产生）。若是出库/借还/盘点等单据流转，
+              操作人是执行单据的人，并非直接在库存上改数。
+            </span>
+          </template>
+        </el-alert>
 
-      <!-- ★ 变更明细区域（支持同时展示多种结构）★ -->
-      <div class="details-section">
+        <el-descriptions :column="2" border size="small" class="base-info">
+          <el-descriptions-item label="操作人">
+            {{ currentDetail.display_name || currentDetail.username }}
+            <span v-if="currentDetail.username" class="muted">({{ currentDetail.username }})</span>
+          </el-descriptions-item>
+          <el-descriptions-item label="模块">{{ moduleLabel(currentDetail.module) }}</el-descriptions-item>
+          <el-descriptions-item label="操作类型">
+            <el-tag :type="getActionType(currentDetail.action)">{{ actionLabel(currentDetail.action) }}</el-tag>
+          </el-descriptions-item>
+          <el-descriptions-item label="操作对象">
+            {{ currentDetail.target_name || '-' }}
+            <span v-if="currentDetail.target_id" class="muted">#{{ currentDetail.target_id }}</span>
+          </el-descriptions-item>
+          <el-descriptions-item label="操作时间" :span="2">{{ currentDetail.created_at }}</el-descriptions-item>
+          <el-descriptions-item label="IP地址">{{ currentDetail.ip_address || '-' }}</el-descriptions-item>
+          <el-descriptions-item label="请求方式">{{ currentDetail.method || '-' }}</el-descriptions-item>
+          <!-- 请求地址移到顶部 alert 里高亮展示（见上），此处不再重复 -->
+          <el-descriptions-item label="变更摘要" :span="2">
+            <span class="summary-text">{{ currentDetail.summary || '—' }}</span>
+          </el-descriptions-item>
+        </el-descriptions>
 
-        <!-- 情况1：UPDATE - 变更对比表 -->
-        <div v-if="hasChanges" class="changes-box">
+        <!-- 情况1：UPDATE —— 新旧值对比表 -->
+        <div v-if="diffRows.length" class="details-section">
           <div class="section-title">
             <el-icon><EditPen /></el-icon>
-            字段变更详情（共 {{ changesList.length }} 处变更）
+            字段变更（共 {{ diffRows.length }} 处）
           </div>
-          <el-table :data="changesList" border stripe size="small" max-height="350">
-            <el-table-column label="字段名" width="150">
+          <el-table :data="diffRows" border stripe size="small">
+            <el-table-column label="变更字段" width="150">
               <template #default="{ row }">
-                <span class="field-name">{{ fieldLabel(row.field) }}</span>
+                <span class="field-name">{{ fieldLabel(row.key) }}</span>
               </template>
             </el-table-column>
-            <el-table-column label="修改前" min-width="200">
+            <el-table-column label="修改前">
               <template #default="{ row }">
-                <span class="old-value">{{ valueLabel(row.field, row.old) }}</span>
+                <span class="old-value">{{ formatValue(row.old, row.key) }}</span>
               </template>
             </el-table-column>
-            <el-table-column label="修改后" min-width="200">
+            <el-table-column label="修改后">
               <template #default="{ row }">
-                <span class="new-value">{{ valueLabel(row.field, row.new) }}</span>
+                <span class="new-value">{{ formatValue(row.new, row.key) }}</span>
               </template>
             </el-table-column>
           </el-table>
         </div>
 
-        <!-- 情况2：DELETE - 删除快照 -->
-        <div v-if="hasDeletedSnapshot" class="snapshot-box">
+        <!-- 情况2/3：CREATE / DELETE —— 快照属性列表 -->
+        <div v-else-if="snapshotRows.length" class="details-section">
           <div class="section-title">
-            <el-icon><Delete /></el-icon>
-            删除前的数据快照
+            <el-icon><Document /></el-icon>
+            {{ isDelete ? '删除前数据快照' : '新增数据快照' }}
           </div>
-          <el-descriptions :column="2" border size="small">
+          <el-descriptions :column="1" border size="small">
             <el-descriptions-item
-                v-for="(value, key) in deletedSnapshot"
-                :key="String(key)"
-                :label="fieldLabel(key)"
-                :span="isLongValue(value) ? 2 : 1"
+                v-for="item in snapshotRows"
+                :key="String(item.key)"
+                :label="fieldLabel(item.key)"
             >
-              <span class="snapshot-value">{{ formatValue(value, String(key)) }}</span>
+              <span class="snapshot-value">{{ formatValue(item.value, String(item.key)) }}</span>
             </el-descriptions-item>
           </el-descriptions>
         </div>
 
-        <!-- 情况3：CREATE - 新增详情 -->
-        <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
-                v-for="(value, key) in createdData"
-                :key="String(key)"
-                :label="fieldLabel(key)"
-                :span="isLongValue(value) ? 2 : 1"
-            >
-              <span class="snapshot-value">{{ formatValue(value, String(key)) }}</span>
-            </el-descriptions-item>
-          </el-descriptions>
-        </div>
-
-        <!-- 兜底：原始 JSON（仅在没有任何高级结构时显示） -->
-        <div v-if="showRawJson" class="raw-json-box">
+        <!-- 兜底：没有可识别的结构时显示原始 JSON -->
+        <div v-else class="details-section">
           <div class="section-title">
             <el-icon><Document /></el-icon>
             原始数据
           </div>
           <pre class="raw-json">{{ rawJson }}</pre>
         </div>
-      </div>
-
-      <template #footer>
-        <el-button @click="detailDialogVisible = false">关闭</el-button>
       </template>
-    </el-dialog>
+    </el-drawer>
   </div>
 </template>
 
 <script setup lang="ts">
 import { ref, reactive, onMounted, computed } from 'vue'
 import { ElMessage } from 'element-plus'
-import { Search, Refresh, Download, EditPen, Delete, Plus, Document } from '@element-plus/icons-vue'
+import { Search, Refresh, Download, EditPen, Document } from '@element-plus/icons-vue'
 import { getAuditLogs, getAuditModules, getAuditLabels, exportAuditLogs } from '@/api/audit'
 
 // 表格数据
@@ -279,17 +317,17 @@ const queryParams = reactive({
   module: '',
   // ★ 多选，提交时 join(',')（后端 split(',') 接收）
   action: [] as string[],
-  target_id: '',
+  target_keyword: '',
 })
 
 // 日期范围
 const dateRange = ref<[string, string] | null>(null)
 
 // 选项数据
-const moduleOptions = ref<string[]>([])
-const actionOptions = ref<string[]>(['create', 'update', 'delete', 'export', 'import'])
-// 业务聚合项（如「入库(全部)」）—— 由后端 /audit/labels 下发，前端不硬编
-const moduleGroupKeys = ref<string[]>([])
+// ★ moduleOptions 是 [{value,label}] 而不是裸字符串 —— 历史命名的折叠规则
+//   在后端，前端只负责渲染。见模板里模块下拉的说明。
+const moduleOptions = ref<Array<{ value: string; label: string }>>([])
+const actionOptions = ref<string[]>(['CREATE', 'UPDATE', 'DELETE'])
 
 // ============================================================
 // 中文化映射 —— ★ 后端为唯一来源，前端不再自带副本
@@ -299,12 +337,10 @@ const moduleGroupKeys = ref<string[]>([])
 // 页面上就会冒出英文列名、或出现对不上的中文 —— 这是已经踩过的坑。
 //
 // 现在统一由 GET /audit/labels 下发（后端 app/utils/audit_labels.py 是唯一来源）。
-// 拉取失败时两个 map 为空，fieldLabel() / actionMap 对未命中项**原样返回**，
+// 拉取失败时两个 map 为空，fieldLabel() / actionLabel() 对未命中项**原样返回**，
 // 页面退化成显示原始字段名，功能不受影响 —— 可控降级，不是崩溃。
 // ============================================================
 const actionMap = ref<Record<string, string>>({})
-
-// 字段名中文化映射 —— 与 actionMap 同源，同样由后端下发
 const fieldMap = ref<Record<string, string>>({})
 
 // 码值中文化映射。
@@ -315,6 +351,7 @@ const statusMapByModule = ref<Record<string, Record<string, string>>>({})
 const defaultStatusMap = ref<Record<string, string>>({})
 const enumFields = ref<string[]>(['status'])
 const booleanFields = ref<string[]>([])
+// 模块展示映射 {原始值: 展示名} 定义在下方「模块名展示」一节（后端下发）
 
 // 字段中文名解析：命中映射取中文，否则原样返回
 const fieldLabel = (key: string | number): string => {
@@ -322,6 +359,13 @@ const fieldLabel = (key: string | number): string => {
   return fieldMap.value[k] || k
 }
 
+// 操作类型中文名。★ 后端已把历史别名（CREATE/create/新增）归一成规范值，
+// 这里直接查表即可，不需要再兜底历史写法。
+const actionLabel = (action: string): string => {
+  const k = String(action || '')
+  return actionMap.value[k] || k
+}
+
 // 变更值中文化：布尔 → 是/否；枚举（status）→ 按模块查表；其余原样返回。
 // 查不到就显示原值 —— 宁可看到裸数字，也不要显示一个可能错的中文。
 const valueLabel = (field: string, value: any): string => {
@@ -331,7 +375,7 @@ const valueLabel = (field: string, value: any): string => {
   if (booleanFields.value.includes(field)) return value ? '是' : '否'
 
   if (enumFields.value.includes(field)) {
-    const mod = String(currentLog.value?.module || '')
+    const mod = String(currentDetail.value?.module || '')
     const map = statusMapByModule.value[mod] || defaultStatusMap.value || {}
     const hit = map[String(value)]
     if (hit) return hit
@@ -350,9 +394,7 @@ const loadLabels = async () => {
       defaultStatusMap.value = res.data.defaultStatus || {}
       enumFields.value = res.data.enumFields || ['status']
       booleanFields.value = res.data.booleanFields || []
-      // 聚合项只取**键**（如「入库(全部)」）—— 它展开成哪些 module 值是
-      // 后端的事，前端原样回传即可，不复制一份成员表过来。
-      moduleGroupKeys.value = Object.keys(res.data.moduleGroups || {})
+      moduleDisplay.value = res.data.moduleDisplay || {}
     }
   } catch (e) {
     console.warn('[AuditLog] 审计中文映射拉取失败，字段名与码值将原样显示', e)
@@ -360,76 +402,37 @@ const loadLabels = async () => {
 }
 
 // ============================================================
-// 模块名中文化
+// 模块名展示
 //
-// 现行监听器写出的 module 已是中文（出库管理/BOM管理…），但历史数据里残留了
-// 一批英文模块名 —— 它们来自早期全局监听器：那时无白名单，系统表、草稿表、
-// 向量表都会被审计，而 _infer_module_name 对未登记的类名直接回退成表名。
-// 下拉框取 DISTINCT module，于是这些英文值就混了进来。
+// ★ 映射表**在后端**（audit_labels.module_display_map），前端只查表。
 //
-// 处理：仅在前端做展示翻译，value 仍用原始字符串，筛选行为完全不变。
+//   这里原本硬编着一份 moduleMap（英文表名 → 中文），历史上已经漂移过一次：
+//   前端加了表名后端不知道、后端加了前端不显示，界面就会裸露英文。
+//   现在由 GET /audit/labels 的 moduleDisplay 下发，与字段名/状态码同源。
+//
+//   映射同时覆盖两类：
+//     · 聚合成员（入库管理/采购入库/成品入库/库存管理 →「入库」）
+//     · 英文历史值（image_embeddings →「图像特征(历史)」）
+//   缺了前者会出现「下拉显示『入库』、表格显示『库存管理』」，用户会以为
+//   筛选没生效 —— 所以两者必须都在同一张表里。
+//
+//   拉不到映射时退化为显示原始值（可控降级，不是崩溃）。
 // ============================================================
-const moduleMap: Record<string, string> = {
-  'image_embeddings': '图像特征(历史)',
-  'purchase_request': '采购申请',
-  'sys_element': '系统元素',
-  'sys_menu': '系统菜单',
-  'sys_user': '系统用户',
-  'sys_role': '系统角色',
-  'sys_role_permission': '角色权限',
-  'sys_warehouse_location': '库位设置',
-  'material_base': '物料主数据',
-  'material_warning_settings': '物料预警设置',
-  'stock_buy': '采购库存',
-  'stock_semi': '半成品库存',
-  'stock_product': '成品库存',
-  'stock_adjustment': '库存调整',
-  'trans_outbound': '出库流水',
-  'trans_borrow': '借还流水',
-  'trans_scrap': '报废流水',
-  'trans_repair': '维修单',
-  'bom_table': 'BOM配方',
-  'bom_draft_table': 'BOM草稿',
-  'stocktake_draft': '盘点草稿',
-}
+const moduleDisplay = ref<Record<string, string>>({})
 
-// 模块名解析：命中映射取中文，否则原样返回
 const moduleLabel = (m: string | number): string => {
   const k = String(m)
-  return moduleMap[k] || k
+  return moduleDisplay.value[k] || k
 }
 
-// 时间格式化
-//
-// ★ 改造说明：后端 audit_listener 现在显式写入**北京时间**（beijing_time），
-//   返回的字符串已经是 UTC+8 的钟面值。此处**不能**再补 'Z' 当 UTC 解析，
-//   否则会被浏览器二次加 8 小时（原实现即存在该问题）。
-//   策略：把后端字符串按原样格式化输出；仅当浏览器不在 UTC+8 时，
-//        才需要按「字符串即北京时间」做等值换算。
-const formatLocalTime = (timeStr: string) => {
-  if (!timeStr) return '-'
-  const iso = timeStr.replace(' ', 'T')
-  // 按北京时间(UTC+8)理解该字符串，转为本地时间展示
-  const date = new Date(iso + '+08:00')
-  if (isNaN(date.getTime())) return timeStr
-
-  const y = date.getFullYear()
-  const m = String(date.getMonth() + 1).padStart(2, '0')
-  const d = String(date.getDate()).padStart(2, '0')
-  const h = String(date.getHours()).padStart(2, '0')
-  const min = String(date.getMinutes()).padStart(2, '0')
-  const s = String(date.getSeconds()).padStart(2, '0')
-  return `${y}-${m}-${d} ${h}:${min}:${s}`
-}
-
-// 详情弹窗
-const detailDialogVisible = ref(false)
-const currentLog = ref<any>({})
-
 // ============================================================
-// 详情解析逻辑
+// 详情解析
 // ============================================================
 
+const detailVisible = ref(false)
+const currentDetail = ref<any>({})
+const isDelete = computed(() => String(currentDetail.value?.action || '').toUpperCase() === 'DELETE')
+
 // 辅助函数：判断 details 是否有可显示内容
 const hasDetailContent = (details: any): boolean => {
   if (!details || typeof details !== 'object') return false
@@ -442,87 +445,68 @@ const hasDetailContent = (details: any): boolean => {
   )
 }
 
-// 判断是否存在各高级结构
-const hasChanges = computed(() => {
-  const details = currentLog.value.details
-  return !!(details?.changes && typeof details.changes === 'object')
-})
+// ★ 对象 repr 的识别 —— 形如 '<MaterialBase 3030>'。
+//
+// 来源：快照收集时本该跳过 ORM 关系属性，早期版本漏过去了，库里留了 1500+ 条
+// 这种「被 str() 的对象」。它不是业务数据（真正有用的值在对应的 xxx_id 字段里），
+// 原样显示只会让人以为数据坏了。
+//
+// 判据要**窄**：只认「<类名 空格 内容>」，不能见 '<'/'>' 就滤，
+// 否则会把正常业务值误伤（备注里写「<急件>」是很正常的）。
+// 后端的 audit_export_service.is_object_repr 是同一个规则（用于 Excel 导出）。
+const OBJECT_REPR_RE = /^<[A-Za-z_][\w.]*(\s+[^<>]*)?>$/
+const isObjectRepr = (v: any): boolean =>
+  typeof v === 'string' && OBJECT_REPR_RE.test(v.trim())
 
-const hasDeletedSnapshot = computed(() => {
-  const details = currentLog.value.details
-  return !!(details?.deleted_snapshot && typeof details.deleted_snapshot === 'object')
-})
-
-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 为表格数据
-const changesList = computed(() => {
-  const details = currentLog.value.details
-  if (!details?.changes) return []
-
-  return Object.entries(details.changes).map(([field, values]: [string, any]) => ({
-    field,
-    old: values?.old,
-    new: values?.new
+// UPDATE：字段对比行
+const diffRows = computed(() => {
+  const changes = currentDetail.value?.details?.changes
+  if (!changes || typeof changes !== 'object') return []
+  return Object.entries(changes).map(([key, v]: [string, any]) => ({
+    key,
+    old: v?.old,
+    new: v?.new,
   }))
 })
 
-// 解析 deleted_snapshot
-const deletedSnapshot = computed(() => {
-  const details = currentLog.value.details
-  return details?.deleted_snapshot || {}
+// CREATE / DELETE：快照属性行（跳过对象 repr 脏值）
+const snapshotRows = computed(() => {
+  const d = currentDetail.value?.details || {}
+  const snap = d.deleted_snapshot || d.created
+  if (!snap || typeof snap !== 'object') return []
+  return Object.entries(snap)
+    .filter(([, v]) => !isObjectRepr(v))
+    .map(([key, value]) => ({ key, value }))
 })
 
-// 解析 created
-const createdData = computed(() => {
-  const details = currentLog.value.details
-  return details?.created || {}
-})
-
-// 原始 JSON
 const rawJson = computed(() => {
-  const details = currentLog.value.details
-  if (!details) return ''
-  return JSON.stringify(details, null, 2)
+  const d = currentDetail.value?.details
+  return d ? JSON.stringify(d, null, 2) : ''
 })
 
 // 辅助函数：格式化值
 // field 传入时走码值中文化（快照里的 status 同样是裸码值）
 const formatValue = (value: any, field?: string): string => {
-  if (value === null || value === undefined) return '-'
+  if (value === null || value === undefined || value === '') return '-'
+  if (isObjectRepr(value)) return '（对象引用）'
   if (typeof value === 'object') return JSON.stringify(value)
   return field ? valueLabel(field, value) : String(value)
 }
 
-// 辅助函数：判断是否是长值
-const isLongValue = (value: any): boolean => {
-  if (value === null || value === undefined) return false
-  const str = typeof value === 'object' ? JSON.stringify(value) : String(value)
-  return str.length > 50
-}
-
 // ============================================================
 // 其他方法
 // ============================================================
 
+// ★ 后端已归一化 action（canon_action），这里只需按规范值给颜色
 const getActionType = (action: string) => {
   const typeMap: Record<string, string> = {
-    'create': 'success',
-    'add': 'success',
-    'update': 'warning',
-    'edit': 'warning',
-    'delete': 'danger',
-    'export': 'info',
-    'import': 'info'
+    'CREATE': 'success',
+    'UPDATE': 'warning',
+    'DELETE': 'danger',
+    'EXPORT': 'info',
+    'IMPORT': 'info',
   }
-  return typeMap[action?.toLowerCase()] || 'info'
+  return typeMap[String(action || '').toUpperCase()] || 'info'
 }
 
 // 组装请求参数（列表与导出**共用同一份**）
@@ -533,10 +517,12 @@ const buildFilterParams = () => {
   const params: any = {
     operator_type: queryParams.operator_type,
     username: queryParams.username,
+    // ★ 原样回传，不做任何展开 —— 聚合项（如「入库」）由后端
+    //   expand_modules() 展开成成员值。前端硬编成员表 = 第二份副本 = 会漂移。
     module: queryParams.module,
     // ★ 多选数组 → 逗号串（仓库惯例，后端 split(',') 接收）
     action: (queryParams.action || []).join(','),
-    target_id: queryParams.target_id,
+    target_keyword: queryParams.target_keyword,
     start_date: '',
     end_date: '',
   }
@@ -584,11 +570,16 @@ const handleReset = () => {
   queryParams.username = ''
   queryParams.module = ''
   queryParams.action = []
-  queryParams.target_id = ''
+  queryParams.target_keyword = ''
   dateRange.value = null
   getList()
 }
 
+const openDetail = (row: any) => {
+  currentDetail.value = row || {}
+  detailVisible.value = true
+}
+
 // ---- 导出 Excel ----
 // 与列表**同一套筛选条件**（buildFilterParams），但导的是全部匹配结果 ——
 // 后端忽略分页参数。下载是浏览器的静默行为，页面不跳转，所以要给一条
@@ -623,14 +614,11 @@ const handleExport = async () => {
   }
 }
 
-const handleViewDetails = (row: any) => {
-  currentLog.value = row
-  detailDialogVisible.value = true
-}
-
 onMounted(() => {
   getList()
   loadLabels()
+  // 模块选项：优先用 /audit/modules（不依赖列表结果），
+  // 列表接口也会顺带返回一份，两者结构一致
   getAuditModules().then(res => {
     if (res.code === 200 && res.data) {
       moduleOptions.value = res.data
@@ -654,6 +642,49 @@ onMounted(() => {
   margin-bottom: 16px;
 }
 
+/* 次要信息（账号、主键、URL）统一弱化，让主体内容更突出 */
+.muted {
+  color: #909399;
+  font-size: 12px;
+  margin-left: 4px;
+}
+
+.summary-text {
+  color: #606266;
+  font-size: 12px;
+  line-height: 1.5;
+}
+
+/* 触发来源告警条 —— 抽屉里的第一眼信息 */
+.source-alert {
+  margin-bottom: 16px;
+}
+
+.source-method {
+  display: inline-block;
+  min-width: 52px;
+  margin-right: 8px;
+  padding: 0 6px;
+  border-radius: 3px;
+  background: #1f4e79;
+  color: #fff;
+  font-size: 12px;
+  font-weight: 600;
+  text-align: center;
+}
+
+.source-url {
+  font-family: Consolas, Monaco, monospace;
+  font-size: 13px;
+  word-break: break-all;
+}
+
+.source-hint {
+  color: #909399;
+  font-size: 12px;
+  line-height: 1.6;
+}
+
 .details-section {
   margin-top: 10px;
 }
@@ -670,14 +701,6 @@ onMounted(() => {
   border-bottom: 1px solid #ebeef5;
 }
 
-/* 变更表格样式 */
-.changes-box {
-  background: #fef0f0;
-  padding: 12px;
-  border-radius: 6px;
-  border: 1px solid #fbc4c4;
-}
-
 .field-name {
   font-weight: 600;
   color: #303133;
@@ -693,25 +716,10 @@ onMounted(() => {
   font-weight: 500;
 }
 
-/* 快照样式 */
-.snapshot-box {
-  background: #f5f7fa;
-  padding: 12px;
-  border-radius: 6px;
-  border: 1px solid #e4e7ed;
-}
-
 .snapshot-value {
   word-break: break-all;
 }
 
-/* 原始 JSON */
-.raw-json-box {
-  background: #f5f7fa;
-  padding: 12px;
-  border-radius: 6px;
-}
-
 .raw-json {
   background: #2d2d2d;
   color: #67c23a;
@@ -719,10 +727,10 @@ onMounted(() => {
   border-radius: 4px;
   font-size: 12px;
   line-height: 1.5;
-  max-height: 300px;
+  max-height: 400px;
   overflow: auto;
   margin: 0;
   white-space: pre-wrap;
   word-break: break-all;
 }
-</style>
+</style>