Pre Merge pull request !1 from yanchangshan/master

pull/1/MERGE
yanchangshan 2023-03-22 15:23:29 +00:00 committed by Gitee
commit bde64cc1fd
No known key found for this signature in database
GPG Key ID: 173E9B9CA92EEF8F
4 changed files with 509 additions and 1 deletions

View File

@ -44,6 +44,11 @@ export function getApiAccessLogPage(params: ApiAccessLogPageReqVO) {
return defHttp.get({ url: '/infra/api-access-log/page', params })
}
// 删除APIACCESSLOG
export const deleteApiAccessLogApi = (id: number) => {
return defHttp.delete({ url: '/infra/api-access-log/delete?id=' + id })
}
// 导出API 访问日志
export function exportApiAccessLog(params: ApiAccessLogExportReqVO) {
return defHttp.download({ url: '/infra/api-access-log/export-excel', params }, '访问日志.xls')

View File

@ -0,0 +1,349 @@
import { BasicColumn, FormSchema, useRender } from '@/components/Table'
import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
export const columns: BasicColumn[] = [
{
title: '日志主键',
dataIndex: 'id',
width: 100
},
{
title: '链路追踪编号',
dataIndex: 'traceId',
width: 100
},
{
title: '用户编号',
dataIndex: 'userId',
width: 100
},
{
title: '用户类型',
dataIndex: 'userType',
width: 180,
customRender: ({ text }) => {
return useRender.renderDict(text, DICT_TYPE.USER_TYPE)
}
},
{
title: '应用名',
dataIndex: 'applicationName',
width: 100
},
{
title: '请求方法名',
dataIndex: 'requestMethod',
width: 100
},
{
title: '请求地址',
dataIndex: 'requestUrl',
width: 100
},
{
title: '请求参数',
dataIndex: 'requestParams',
width: 100
},
{
title: '用户 IP',
dataIndex: 'userIp',
width: 100
},
{
title: '浏览器 UA',
dataIndex: 'userAgent',
width: 100
},
{
title: '开始请求时间',
dataIndex: 'beginTime',
width: 180,
customRender: ({ text }) => {
return useRender.renderDate(text)
}
},
{
title: '结束请求时间',
dataIndex: 'endTime',
width: 180,
customRender: ({ text }) => {
return useRender.renderDate(text)
}
},
{
title: '执行时长',
dataIndex: 'duration',
width: 100
},
{
title: '结果码',
dataIndex: 'resultCode',
width: 100
},
{
title: '结果提示',
dataIndex: 'resultMsg',
width: 100
},
{
title: '创建者',
dataIndex: 'creator',
width: 100
},
{
title: '创建时间',
dataIndex: 'createTime',
width: 180,
customRender: ({ text }) => {
return useRender.renderDate(text)
}
},
{
title: '更新者',
dataIndex: 'updater',
width: 100
},
{
title: '更新时间',
dataIndex: 'updateTime',
width: 180,
customRender: ({ text }) => {
return useRender.renderDate(text)
}
},
{
title: '租户编号',
dataIndex: 'tenantId',
width: 100
}
]
export const searchFormSchema: FormSchema[] = [
{
label: '日志主键',
field: 'id',
component: 'Input',
colProps: { span: 8 }
},
{
label: '链路追踪编号',
field: 'traceId',
component: 'Input',
colProps: { span: 8 }
},
{
label: '用户编号',
field: 'userId',
component: 'Input',
colProps: { span: 8 }
},
{
label: '用户类型',
field: 'userType',
component: 'Select',
componentProps: {
options: getIntDictOptions(DICT_TYPE.USER_TYPE)
},
colProps: { span: 8 }
},
{
label: '应用名',
field: 'applicationName',
component: 'Input',
colProps: { span: 8 }
},
{
label: '请求方法名',
field: 'requestMethod',
component: 'Input',
colProps: { span: 8 }
},
{
label: '请求地址',
field: 'requestUrl',
component: 'Input',
colProps: { span: 8 }
},
{
label: '请求参数',
field: 'requestParams',
component: 'Input',
colProps: { span: 8 }
},
{
label: '用户 IP',
field: 'userIp',
component: 'Input',
colProps: { span: 8 }
},
{
label: '浏览器 UA',
field: 'userAgent',
component: 'Input',
colProps: { span: 8 }
},
{
label: '开始请求时间',
field: 'beginTime',
component: 'RangePicker',
colProps: { span: 8 }
},
{
label: '结束请求时间',
field: 'endTime',
component: 'RangePicker',
colProps: { span: 8 }
},
{
label: '执行时长',
field: 'duration',
component: 'Input',
colProps: { span: 8 }
},
{
label: '结果码',
field: 'resultCode',
component: 'Input',
colProps: { span: 8 }
},
{
label: '结果提示',
field: 'resultMsg',
component: 'Input',
colProps: { span: 8 }
},
{
label: '创建者',
field: 'creator',
component: 'Input',
colProps: { span: 8 }
},
{
label: '创建时间',
field: 'createTime',
component: 'RangePicker',
colProps: { span: 8 }
},
{
label: '更新者',
field: 'updater',
component: 'Input',
colProps: { span: 8 }
},
{
label: '更新时间',
field: 'updateTime',
component: 'RangePicker',
colProps: { span: 8 }
},
{
label: '租户编号',
field: 'tenantId',
component: 'Input',
colProps: { span: 8 }
}
]
export const formSchema: FormSchema[] = [
{
label: '编号',
field: 'id',
show: false,
component: 'Input'
},
{
label: '链路追踪编号',
field: 'traceId',
required: true,
component: 'Input'
},
{
label: '用户编号',
field: 'userId',
required: true,
component: 'InputNumber'
},
{
label: '用户类型',
field: 'userType',
component: 'Select',
defaultValue: 0,
componentProps: {
options: getIntDictOptions(DICT_TYPE.USER_TYPE)
}
},
{
label: '应用名',
field: 'applicationName',
required: true,
component: 'Input'
},
{
label: '请求方法名',
field: 'requestMethod',
required: true,
component: 'Input'
},
{
label: '请求地址',
field: 'requestUrl',
required: true,
component: 'Input'
},
{
label: '请求参数',
field: 'requestParams',
required: true,
component: 'Input'
},
{
label: '用户 IP',
field: 'userIp',
required: true,
component: 'Input'
},
{
label: '浏览器 UA',
field: 'userAgent',
required: true,
component: 'Input'
},
{
label: '执行时长',
field: 'duration',
required: true,
component: 'InputNumber'
},
{
label: '结果码',
field: 'resultCode',
required: true,
component: 'InputNumber'
},
{
label: '结果提示',
field: 'resultMsg',
required: true,
component: 'Input'
},
{
label: '创建者',
field: 'creator',
required: true,
component: 'Input'
},
{
label: '更新者',
field: 'updater',
required: true,
component: 'Input'
},
{
label: '租户编号',
field: 'tenantId',
required: true,
component: 'InputNumber'
}
]

View File

@ -0,0 +1,60 @@
<template>
<BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit">
<BasicForm @register="registerForm" />
</BasicModal>
</template>
<script lang="ts" setup name="ApiAccessLogModal"></script>
import { ref, computed, unref } from 'vue'
import { BasicModal, useModalInner } from '@/components/Modal'
import { BasicForm, useForm } from '@/components/Form'
import { formSchema } from './ApiAccessLog.data'
import { createApiAccessLogApi, getApiAccessLogApi, updatePostApi } from '@/api/infra/apiAccessLog'
const emit = defineEmits(['success', 'register'])
const isUpdate = ref(true)
const rowId = ref()
const [registerForm, { setFieldsValue, resetFields, validate }] = useForm({
labelWidth: 100,
baseColProps: { span: 24 },
schemas: formSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23
}
})
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
resetFields()
setModalProps({ confirmLoading: false })
isUpdate.value = !!data?.isUpdate
if (unref(isUpdate)) {
const res = await getApiAccessLogApi(data.record.id)
rowId.value = res.id
setFieldsValue({
...res
})
}
})
const getTitle = computed(() => (!unref(isUpdate) ? '新增API访问日志表' : '编辑API访问日志表'))
async function handleSubmit() {
try {
const values = await validate()
setModalProps({ confirmLoading: true })
if (unref(isUpdate)) {
await updateApiAccessLogApi(values)
} else {
await createApiAccessLogApi(values)
}
closeModal()
emit('success')
} finally {
setModalProps({ confirmLoading: false })
}
}
</script>

View File

@ -1,3 +1,97 @@
<template>
<div>开发中</div>
<div>
<BasicTable @register="registerTable">
<template #toolbar>
<a-button type="primary" @click="handleCreate"> </a-button>
<a-button type="warning" @click="handleExport"> </a-button>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction
:actions="[
{
icon: 'clarity:note-edit-line',
label: '修改',
onClick: handleEdit.bind(null, record)
},
{
icon: 'ant-design:delete-outlined',
color: 'error',
label: '删除',
popConfirm: {
title: '是否确认删除',
placement: 'left',
confirm: handleDelete.bind(null, record)
}
}
]"
/>
</template>
</template>
</BasicTable>
<ApiAccessLogModel @register="registerModal" @success="reload()" />
</div>
</template>
<script lang="ts" setup name="ApiAccessLog">
import { BasicTable, useTable, TableAction } from '@/components/Table'
import { ApiAccessLogExportReqVO, exportApiAccessLogApi, getApiAccessLogPageApi,deleteApiAccessLogApi} from '@/api/infra/apiAccessLog'
import { useModal } from '@/components/Modal'
import ApiAccessLogModel from './ApiAccessLogModel.vue'
import { columns, searchFormSchema } from './ApiAccessLog.data'
import { useI18n } from '@/hooks/web/useI18n'
import { useMessage } from '@/hooks/web/useMessage'
const { t } = useI18n()
const { createConfirm, createMessage } = useMessage()
const [registerModal, { openModal }] = useModal()
const [registerTable, { getForm, reload }] = useTable({
title: 'API 访问日志表列表',
api: getApiAccessLogPageApi,
columns,
formConfig: {
labelWidth: 120,
schemas: searchFormSchema
},
useSearchForm: true,
showTableSetting: true,
showIndexColumn: false,
actionColumn: {
width: 160,
title: '操作',
dataIndex: 'action',
fixed: 'right'
}
})
function handleCreate() {
openModal(true, {
isUpdate: false
})
}
function handleEdit(record: Recordable) {
openModal(true, {
record,
isUpdate: true
})
}
async function handleExport() {
createConfirm({
title: '导出',
iconType: 'warning',
content: '是否要导出数据?',
async onOk() {
await exportApiAccessLogApi(getForm().getFieldsValue() as ApiAccessLogExportReqVO)
createMessage.success(t('common.exportSuccessText'))
}
})
}
async function handleDelete(record: Recordable) {
await deleteApiAccessLogApi(record.id)
createMessage.success(t('common.delSuccessText'))
reload()
}
</script>