diff --git a/src/api/infra/apiAccessLog/index.ts b/src/api/infra/apiAccessLog/index.ts
index b76d00d8c..d62ea6e79 100644
--- a/src/api/infra/apiAccessLog/index.ts
+++ b/src/api/infra/apiAccessLog/index.ts
@@ -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')
diff --git a/src/views/infra/apiAccessLog/ApiAccessLog.data.ts b/src/views/infra/apiAccessLog/ApiAccessLog.data.ts
new file mode 100644
index 000000000..eab6e3c60
--- /dev/null
+++ b/src/views/infra/apiAccessLog/ApiAccessLog.data.ts
@@ -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'
+		}
+]
diff --git a/src/views/infra/apiAccessLog/ApiAccessLogModel.vue b/src/views/infra/apiAccessLog/ApiAccessLogModel.vue
new file mode 100644
index 000000000..f9d4e441b
--- /dev/null
+++ b/src/views/infra/apiAccessLog/ApiAccessLogModel.vue
@@ -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>
diff --git a/src/views/infra/apiAccessLog/index.vue b/src/views/infra/apiAccessLog/index.vue
index 3b64cfc4f..7813f5fd7 100644
--- a/src/views/infra/apiAccessLog/index.vue
+++ b/src/views/infra/apiAccessLog/index.vue
@@ -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>