Skip to content

phsl / admin

Go to a project
Commit 12b60da9 by YunaiV
Options

Vue3 重构：REVIEW API 日志

parent 3575e6ad
Showing with 18 additions and 18 deletions
src/api/infra/apiAccessLog/index.ts
...@@ -18,6 +18,7 @@ export interface ApiAccessLogVO { ...@@ -18,6 +18,7 @@ export interface ApiAccessLogVO {
resultMsg: string resultMsg: string
createTime: Date createTime: Date
} }
// 查询列表API 访问日志 // 查询列表API 访问日志
export const getApiAccessLogPage = (params: PageParam) => { export const getApiAccessLogPage = (params: PageParam) => {
return request.get({ url: '/infra/api-access-log/page', params }) return request.get({ url: '/infra/api-access-log/page', params })
......
src/views/infra/apiAccessLog/ApiAccessLogDetail.vue
<template> <template>
<Dialog <Dialog title="详情" v-model="modelVisible" :scroll="true" :max-height="500" width="800">
title="API 访问日志详细"
v-model="modelVisible"
:scroll="true"
:max-height="500"
width="800"
>
<el-descriptions border :column="1"> <el-descriptions border :column="1">
<el-descriptions-item label="日志主键" min-width="120"> <el-descriptions-item label="日志主键" min-width="120">
{{ detailData.id }} {{ detailData.id }}
...@@ -17,20 +11,26 @@ ...@@ -17,20 +11,26 @@
{{ detailData.applicationName }} {{ detailData.applicationName }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label="用户信息"> <el-descriptions-item label="用户信息">
{{ detailData.userId }} | {{ detailData.userId }}
<dict-tag :type="DICT_TYPE.USER_TYPE" :value="detailData.userType" /> <dict-tag :type="DICT_TYPE.USER_TYPE" :value="detailData.userType" />
| {{ detailData.userIp }} | {{ detailData.userAgent }} </el-descriptions-item>
<el-descriptions-item label="用户 IP">
{{ detailData.userIp }}
</el-descriptions-item>
<el-descriptions-item label="用户 UA">
{{ detailData.userAgent }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label="请求信息"> <el-descriptions-item label="请求信息">
{{ detailData.requestMethod }} | {{ detailData.requestUrl }} {{ detailData.requestMethod }} {{ detailData.requestUrl }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label="请求参数"> <el-descriptions-item label="请求参数">
{{ detailData.requestParams }} {{ detailData.requestParams }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label="开始时间"> <el-descriptions-item label="请求时间">
{{ formatDate(detailData.beginTime, 'YYYY-MM-DD HH:mm:ss') }} ~ {{ formatDate(detailData.beginTime, 'YYYY-MM-DD HH:mm:ss') }} ~
{{ formatDate(detailData.endTime, 'YYYY-MM-DD HH:mm:ss') }} | {{ detailData.duration }} ms {{ formatDate(detailData.endTime, 'YYYY-MM-DD HH:mm:ss') }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label="请求耗时">{{ detailData.duration }} ms</el-descriptions-item>
<el-descriptions-item label="操作结果"> <el-descriptions-item label="操作结果">
<div v-if="detailData.resultCode === 0">正常</div> <div v-if="detailData.resultCode === 0">正常</div>
<div v-else-if="detailData.resultCode > 0" <div v-else-if="detailData.resultCode > 0"
...@@ -51,7 +51,7 @@ const detailLoading = ref(false) // 表单地加载中 ...@@ -51,7 +51,7 @@ const detailLoading = ref(false) // 表单地加载中
const detailData = ref() // 详情数据 const detailData = ref() // 详情数据
/** 打开弹窗 */ /** 打开弹窗 */
const openModal = async (data: ApiAccessLog.ApiAccessLogVO) => { const open = async (data: ApiAccessLog.ApiAccessLogVO) => {
modelVisible.value = true modelVisible.value = true
// 设置数据 // 设置数据
detailLoading.value = true detailLoading.value = true
...@@ -62,5 +62,5 @@ const openModal = async (data: ApiAccessLog.ApiAccessLogVO) => { ...@@ -62,5 +62,5 @@ const openModal = async (data: ApiAccessLog.ApiAccessLogVO) => {
} }
} }
defineExpose({ openModal }) // 提供 openModal 方法，用于打开弹窗 defineExpose({ open }) // 提供 open 方法，用于打开弹窗
</script> </script>
src/views/infra/apiAccessLog/index.vue
...@@ -85,6 +85,7 @@ ...@@ -85,6 +85,7 @@
</el-form-item> </el-form-item>
</el-form> </el-form>
</content-wrap> </content-wrap>
<!-- 列表 --> <!-- 列表 -->
<content-wrap> <content-wrap>
<el-table v-loading="loading" :data="list"> <el-table v-loading="loading" :data="list">
...@@ -96,7 +97,7 @@ ...@@ -96,7 +97,7 @@
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="应用名" align="center" prop="applicationName" /> <el-table-column label="应用名" align="center" prop="applicationName" />
<el-table-column label="请求方法名" align="center" prop="requestMethod" /> <el-table-column label="请求方法" align="center" prop="requestMethod" width="80" />
<el-table-column label="请求地址" align="center" prop="requestUrl" width="250" /> <el-table-column label="请求地址" align="center" prop="requestUrl" width="250" />
<el-table-column label="请求时间" align="center" prop="beginTime" width="180"> <el-table-column label="请求时间" align="center" prop="beginTime" width="180">
<template #default="scope"> <template #default="scope">
...@@ -128,7 +129,6 @@ ...@@ -128,7 +129,6 @@
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<!-- 分页组件 --> <!-- 分页组件 -->
<Pagination <Pagination
:total="total" :total="total"
...@@ -154,7 +154,6 @@ const message = useMessage() // 消息弹窗 ...@@ -154,7 +154,6 @@ const message = useMessage() // 消息弹窗
const loading = ref(true) // 列表的加载中 const loading = ref(true) // 列表的加载中
const total = ref(0) // 列表的总页数 const total = ref(0) // 列表的总页数
const list = ref([]) // 列表的数据 const list = ref([]) // 列表的数据
const queryParams = reactive({ const queryParams = reactive({
pageNo: 1, pageNo: 1,
pageSize: 10, pageSize: 10,
...@@ -169,7 +168,7 @@ const queryParams = reactive({ ...@@ -169,7 +168,7 @@ const queryParams = reactive({
const queryFormRef = ref() // 搜索的表单 const queryFormRef = ref() // 搜索的表单
const exportLoading = ref(false) // 导出的加载中 const exportLoading = ref(false) // 导出的加载中
/** 查询参数列表 */ /** 查询列表 */
const getList = async () => { const getList = async () => {
loading.value = true loading.value = true
try { try {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment