工业互联网平台脚手架前端代码
houzhongjian
2024-09-18 23db5e5c6bfcbd7030a4003cd4ea18fbb920024f
提交 | 用户 | 时间
23db5e 1 <template>
H 2   <Dialog v-model="dialogVisible" :max-height="500" :scroll="true" title="详情" width="800">
3     <el-descriptions :column="1" border>
4       <el-descriptions-item label="日志主键" min-width="120">
5         {{ detailData.id }}
6       </el-descriptions-item>
7       <el-descriptions-item label="链路追踪" v-if="detailData.traceId">
8         {{ detailData.traceId }}
9       </el-descriptions-item>
10       <el-descriptions-item label="操作人编号">
11         {{ detailData.userId }}
12       </el-descriptions-item>
13       <el-descriptions-item label="操作人名字">
14         {{ detailData.userName }}
15       </el-descriptions-item>
16       <el-descriptions-item label="操作人 IP">
17         {{ detailData.userIp }}
18       </el-descriptions-item>
19       <el-descriptions-item label="操作人 UA">
20         {{ detailData.userAgent }}
21       </el-descriptions-item>
22       <el-descriptions-item label="操作模块">
23         {{ detailData.type }}
24       </el-descriptions-item>
25       <el-descriptions-item label="操作名">
26         {{ detailData.subType }}
27       </el-descriptions-item>
28       <el-descriptions-item label="操作内容">
29         {{ detailData.action }}
30       </el-descriptions-item>
31       <el-descriptions-item v-if="detailData.extra" label="操作拓展参数">
32         {{ detailData.extra }}
33       </el-descriptions-item>
34       <el-descriptions-item label="请求 URL">
35         {{ detailData.requestMethod }} {{ detailData.requestUrl }}
36       </el-descriptions-item>
37       <el-descriptions-item label="操作时间">
38         {{ formatDate(detailData.createTime) }}
39       </el-descriptions-item>
40       <el-descriptions-item label="业务编号">
41         {{ detailData.bizId }}
42       </el-descriptions-item>
43     </el-descriptions>
44   </Dialog>
45 </template>
46 <script lang="ts" setup>
47 import { formatDate } from '@/utils/formatTime'
48 import * as OperateLogApi from '@/api/system/operatelog'
49
50 defineOptions({ name: 'SystemOperateLogDetail' })
51
52 const dialogVisible = ref(false) // 弹窗的是否展示
53 const detailLoading = ref(false) // 表单的加载中
54 const detailData = ref({} as OperateLogApi.OperateLogVO) // 详情数据
55
56 /** 打开弹窗 */
57 const open = async (data: OperateLogApi.OperateLogVO) => {
58   dialogVisible.value = true
59   // 设置数据
60   detailLoading.value = true
61   try {
62     detailData.value = data
63   } finally {
64     detailLoading.value = false
65   }
66 }
67 defineExpose({ open }) // 提供 open 方法,用于打开弹窗
68 </script>